@graupl/graupl 1.0.0-beta.44 → 1.0.0-beta.46

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (70) hide show
  1. package/dist/css/component/breadcrumb.css +1 -1
  2. package/dist/css/component/breadcrumb.css.map +1 -1
  3. package/dist/css/component/tabs.css +1 -1
  4. package/dist/css/component/tabs.css.map +1 -1
  5. package/dist/css/component/tooltip.css +2 -0
  6. package/dist/css/component/tooltip.css.map +1 -0
  7. package/dist/css/component.css +1 -1
  8. package/dist/css/component.css.map +1 -1
  9. package/dist/css/graupl.css +1 -1
  10. package/dist/css/graupl.css.map +1 -1
  11. package/dist/js/breadcrumb.js +2 -2
  12. package/dist/js/breadcrumb.js.map +1 -1
  13. package/dist/js/carousel.js +2 -2
  14. package/dist/js/carousel.js.map +1 -1
  15. package/dist/js/component/breadcrumb.cjs.js +2 -2
  16. package/dist/js/component/breadcrumb.cjs.js.map +1 -1
  17. package/dist/js/component/breadcrumb.es.js +2 -2
  18. package/dist/js/component/breadcrumb.es.js.map +1 -1
  19. package/dist/js/component/breadcrumb.iife.js +2 -2
  20. package/dist/js/component/breadcrumb.iife.js.map +1 -1
  21. package/dist/js/component/carousel.cjs.js +2 -2
  22. package/dist/js/component/carousel.cjs.js.map +1 -1
  23. package/dist/js/component/carousel.es.js +2 -2
  24. package/dist/js/component/carousel.es.js.map +1 -1
  25. package/dist/js/component/carousel.iife.js +2 -2
  26. package/dist/js/component/carousel.iife.js.map +1 -1
  27. package/dist/js/component/disclosure.cjs.js +2 -2
  28. package/dist/js/component/disclosure.cjs.js.map +1 -1
  29. package/dist/js/component/disclosure.es.js +2 -2
  30. package/dist/js/component/disclosure.es.js.map +1 -1
  31. package/dist/js/component/disclosure.iife.js +2 -2
  32. package/dist/js/component/disclosure.iife.js.map +1 -1
  33. package/dist/js/component/tooltip.cjs.js +5 -0
  34. package/dist/js/component/tooltip.cjs.js.map +1 -0
  35. package/dist/js/component/tooltip.es.js +5 -0
  36. package/dist/js/component/tooltip.es.js.map +1 -0
  37. package/dist/js/component/tooltip.iife.js +5 -0
  38. package/dist/js/component/tooltip.iife.js.map +1 -0
  39. package/dist/js/disclosure.js +2 -2
  40. package/dist/js/disclosure.js.map +1 -1
  41. package/dist/js/generator/breadcrumb.cjs.js +2 -2
  42. package/dist/js/generator/breadcrumb.cjs.js.map +1 -1
  43. package/dist/js/generator/breadcrumb.es.js +2 -2
  44. package/dist/js/generator/breadcrumb.es.js.map +1 -1
  45. package/dist/js/generator/breadcrumb.iife.js +2 -2
  46. package/dist/js/generator/breadcrumb.iife.js.map +1 -1
  47. package/dist/js/generator/carousel.cjs.js +2 -2
  48. package/dist/js/generator/carousel.cjs.js.map +1 -1
  49. package/dist/js/generator/carousel.es.js +2 -2
  50. package/dist/js/generator/carousel.es.js.map +1 -1
  51. package/dist/js/generator/carousel.iife.js +2 -2
  52. package/dist/js/generator/carousel.iife.js.map +1 -1
  53. package/dist/js/generator/disclosure.cjs.js +2 -2
  54. package/dist/js/generator/disclosure.cjs.js.map +1 -1
  55. package/dist/js/generator/disclosure.es.js +2 -2
  56. package/dist/js/generator/disclosure.es.js.map +1 -1
  57. package/dist/js/generator/disclosure.iife.js +2 -2
  58. package/dist/js/generator/disclosure.iife.js.map +1 -1
  59. package/dist/js/generator/tooltip.cjs.js +5 -0
  60. package/dist/js/generator/tooltip.cjs.js.map +1 -0
  61. package/dist/js/generator/tooltip.es.js +5 -0
  62. package/dist/js/generator/tooltip.es.js.map +1 -0
  63. package/dist/js/generator/tooltip.iife.js +5 -0
  64. package/dist/js/generator/tooltip.iife.js.map +1 -0
  65. package/dist/js/graupl.js +2 -2
  66. package/dist/js/graupl.js.map +1 -1
  67. package/dist/js/tooltip.js +5 -0
  68. package/dist/js/tooltip.js.map +1 -0
  69. package/package.json +1 -1
  70. package/scss/component/tooltip.scss +3 -0
package/dist/css/component/breadcrumb.css.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sourceRoot":null,"mappings":"ACSI,wBCkSF,09DAcI,uKAWA,uKAME,yMAYF,uSAiBJ,26DAUE,kHAKA,sJASF,u9CAQA,2kEIxWI,ogBAAA,ggBAAA,kWAAA,shBAAA,g2ECpBJ,uCL4XA,0LAAA,8qED9XE,oBC0YF,+pBAuBA,0xBAOA,24BAOA,geIzZI,2pBAAA,qpBAAA,miBAAA,krBAAA,8hFJyZJ","sources":["dist/css/component/breadcrumb.css","Users/nickdjm/Development/contrib/graupl/graupl/node_modules/@graupl/core/src/scss/mixins/_layer.scss","Users/nickdjm/Development/contrib/graupl/graupl/node_modules/@graupl/core/src/scss/component/breadcrumb/_index.scss","Users/nickdjm/Development/contrib/graupl/graupl/node_modules/@graupl/core/src/scss/component/breadcrumb/_variables.scss","Users/nickdjm/Development/contrib/graupl/graupl/node_modules/@graupl/core/src/scss/base/link/_mixins.scss","Users/nickdjm/Development/contrib/graupl/graupl/node_modules/@graupl/core/src/scss/base/link/_variables.scss","Users/nickdjm/Development/contrib/graupl/graupl/node_modules/@graupl/core/src/scss/mixins/_state.scss","Users/nickdjm/Development/contrib/graupl/graupl/node_modules/@graupl/core/src/scss/mixins/_animation.scss"],"sourcesContent":["@layer graupl.component {\n .breadcrumb {\n display: flex;\n position: relative;\n margin: var(--graupl-breadcrumb-margin, var(--graupl-breadcrumb-margin-y, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))) var(--graupl-breadcrumb-margin-x, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))));\n padding: var(--graupl-breadcrumb-padding, var(--graupl-breadcrumb-padding-y, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))) var(--graupl-breadcrumb-padding-x, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))));\n border-width: var(--graupl-breadcrumb-border-width, var(--graupl-breadcrumb-border-top-width, 0) var(--graupl-breadcrumb-border-right-width, 0) var(--graupl-breadcrumb-border-bottom-width, 0) var(--graupl-breadcrumb-border-left-width, 0));\n border-style: var(--graupl-breadcrumb-border-style, var(--graupl-breadcrumb-border-top-style, var(--graupl-border-top-style, var(--graupl-border-style, solid))) var(--graupl-breadcrumb-border-right-style, var(--graupl-border-right-style, var(--graupl-border-style, solid))) var(--graupl-breadcrumb-border-bottom-style, var(--graupl-border-bottom-style, var(--graupl-border-style, solid))) var(--graupl-breadcrumb-border-left-style, var(--graupl-border-left-style, var(--graupl-border-style, solid))));\n border-radius: var(--graupl-breadcrumb-border-radius, var(--graupl-breadcrumb-border-top-left-radius, var(--graupl-border-top-left-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-breadcrumb-border-top-right-radius, var(--graupl-border-top-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-breadcrumb-border-bottom-right-radius, var(--graupl-border-bottom-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-breadcrumb-border-bottom-left-radius, var(--graupl-border-bottom-left-radius, var(--graupl-border-radius, 0.125rem))));\n list-style: none;\n gap: var(--graupl-breadcrumb-gap, var(--graupl-breadcrumb-column-gap, var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem)))) var(--graupl-breadcrumb-row-gap, var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem)))));\n }\n .breadcrumb.show .breadcrumb-item:has(.breadcrumb-toggle) {\n display: var(--graupl-breadcrumb-item-hide-display, none);\n opacity: var(--graupl-breadcrumb-item-hide-opacity, 0);\n }\n .breadcrumb.hide .breadcrumb-item:has(.breadcrumb-toggle) {\n display: var(--graupl-breadcrumb-item-show-display, flex);\n opacity: var(--graupl-breadcrumb-item-show-opacity, 1);\n }\n .breadcrumb.hide .breadcrumb-item:has(.breadcrumb-toggle) ~ .breadcrumb-item:not(:last-child) {\n display: var(--graupl-breadcrumb-item-hide-display, none);\n opacity: var(--graupl-breadcrumb-item-hide-opacity, 0);\n }\n .breadcrumb.transitioning .breadcrumb-item:has(.breadcrumb-toggle) {\n display: var(--graupl-breadcrumb-item-transitioning-display, flex);\n opacity: var(--graupl-breadcrumb-item-transitioning-opacity, 0);\n }\n .breadcrumb.transitioning .breadcrumb-item:has(.breadcrumb-toggle) ~ .breadcrumb-item:not(:last-child) {\n display: var(--graupl-breadcrumb-item-transitioning-display, flex);\n opacity: var(--graupl-breadcrumb-item-transitioning-opacity, 0);\n }\n .breadcrumb-item {\n display: var(--graupl-breadcrumb-item-display, flex);\n position: relative;\n padding: var(--graupl-breadcrumb-item-padding, var(--graupl-breadcrumb-item-padding-y, 0) var(--graupl-breadcrumb-item-padding-x, 0));\n border-width: var(--graupl-breadcrumb-item-border-width, var(--graupl-breadcrumb-item-border-top-width, 0) var(--graupl-breadcrumb-item-border-right-width, 0) var(--graupl-breadcrumb-item-border-bottom-width, 0) var(--graupl-breadcrumb-item-border-left-width, 0));\n border-style: var(--graupl-breadcrumb-item-border-style, var(--graupl-breadcrumb-item-border-top-style, var(--graupl-border-top-style, var(--graupl-border-style, solid))) var(--graupl-breadcrumb-item-border-right-style, var(--graupl-border-right-style, var(--graupl-border-style, solid))) var(--graupl-breadcrumb-item-border-bottom-style, var(--graupl-border-bottom-style, var(--graupl-border-style, solid))) var(--graupl-breadcrumb-item-border-left-style, var(--graupl-border-left-style, var(--graupl-border-style, solid))));\n border-radius: var(--graupl-breadcrumb-item-border-radius, var(--graupl-breadcrumb-item-border-top-left-radius, var(--graupl-border-top-left-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-breadcrumb-item-border-top-right-radius, var(--graupl-border-top-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-breadcrumb-item-border-bottom-right-radius, var(--graupl-border-bottom-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-breadcrumb-item-border-bottom-left-radius, var(--graupl-border-bottom-left-radius, var(--graupl-border-radius, 0.125rem))));\n opacity: var(--graupl-breadcrumb-item-opacity, var(--graupl-breadcrumb-item-show-opacity, 1));\n gap: var(--graupl-breadcrumb-item-gap, var(--graupl-breadcrumb-item-column-gap, var(--graupl-breadcrumb-column-gap, var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem))))) var(--graupl-breadcrumb-item-row-gap, var(--graupl-breadcrumb-row-gap, var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem))))));\n }\n .breadcrumb-item:not(:last-child)::after {\n content: var(--graupl-breadcrumb-item-separator-content, '/');\n display: block;\n }\n .breadcrumb-item:has(.breadcrumb-toggle) {\n display: var(--graupl-breadcrumb-item-hide-display, none);\n opacity: var(--graupl-breadcrumb-item-hide-opacity, 0);\n }\n .breadcrumb-link {\n padding: var(--graupl-breadcrumb-link-padding, var(--graupl-breadcrumb-link-padding-y, 0) var(--graupl-breadcrumb-link-padding-x, 0));\n border-width: var(--graupl-breadcrumb-link-border-width, var(--graupl-breadcrumb-link-border-top-width, 0) var(--graupl-breadcrumb-link-border-right-width, 0) var(--graupl-breadcrumb-link-border-bottom-width, 0) var(--graupl-breadcrumb-link-border-left-width, 0));\n border-style: var(--graupl-breadcrumb-link-border-style, var(--graupl-breadcrumb-link-border-top-style, var(--graupl-border-top-style, var(--graupl-border-style, solid))) var(--graupl-breadcrumb-link-border-right-style, var(--graupl-border-right-style, var(--graupl-border-style, solid))) var(--graupl-breadcrumb-link-border-bottom-style, var(--graupl-border-bottom-style, var(--graupl-border-style, solid))) var(--graupl-breadcrumb-link-border-left-style, var(--graupl-border-left-style, var(--graupl-border-style, solid))));\n border-radius: var(--graupl-breadcrumb-link-border-radius, var(--graupl-breadcrumb-link-border-top-left-radius, var(--graupl-border-top-left-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-breadcrumb-link-border-top-right-radius, var(--graupl-border-top-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-breadcrumb-link-border-bottom-right-radius, var(--graupl-border-bottom-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-breadcrumb-link-border-bottom-left-radius, var(--graupl-border-bottom-left-radius, var(--graupl-border-radius, 0.125rem))));\n }\n .breadcrumb-toggle {\n min-width: var(--graupl-link-min-width, auto);\n min-height: var(--graupl-link-min-height, auto);\n padding: var(--graupl-link-padding, var(--graupl-link-padding-y, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))) var(--graupl-link-padding-x, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))));\n transform: var(--graupl-link-transform, none);\n transition: var(--graupl-link-transition, background var(--graupl-transition-duration-fast, 150ms) var(--graupl-transition-timing-function, ease), color var(--graupl-transition-duration-fast, 150ms) var(--graupl-transition-timing-function, ease), transform var(--graupl-transition-duration-fast, 150ms) var(--graupl-transition-timing-function, ease));\n border-width: var(--graupl-link-border-width, var(--graupl-link-border-top-width, 0) var(--graupl-link-border-right-width, 0) var(--graupl-link-border-bottom-width, 0) var(--graupl-link-border-left-width, 0));\n border-style: var(--graupl-link-border-style, var(--graupl-link-border-top-style, var(--graupl-border-top-style, var(--graupl-border-style, solid))) var(--graupl-link-border-right-style, var(--graupl-border-right-style, var(--graupl-border-style, solid))) var(--graupl-link-border-bottom-style, var(--graupl-border-bottom-style, var(--graupl-border-style, solid))) var(--graupl-link-border-left-style, var(--graupl-border-left-style, var(--graupl-border-style, solid))));\n border-radius: var(--graupl-link-border-radius, var(--graupl-link-border-top-left-radius, var(--graupl-border-top-left-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-link-border-top-right-radius, var(--graupl-border-top-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-link-border-bottom-right-radius, var(--graupl-border-bottom-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-link-border-bottom-left-radius, var(--graupl-border-bottom-left-radius, var(--graupl-border-radius, 0.125rem))));\n text-decoration: var(--graupl-link-text-decoration, underline);\n text-decoration-style: var(--graupl-link-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle:visited {\n transform: var(--graupl-link-visited-transform, var(--graupl-link-transform, none));\n text-decoration: var(--graupl-link-visited-text-decoration, var(--graupl-link-text-decoration, underline));\n text-decoration-style: var(--graupl-link-visited-text-decoration-style, var(--graupl-link-text-decoration-style, solid));\n text-decoration-thickness: var(--graupl-link-visited-text-decoration-thickness, var(--graupl-link-text-decoration-thickness, var(--graupl-border-width, 0.125rem)));\n }\n .breadcrumb-toggle.visited {\n transform: var(--graupl-link-visited-transform, var(--graupl-link-transform, none));\n text-decoration: var(--graupl-link-visited-text-decoration, var(--graupl-link-text-decoration, underline));\n text-decoration-style: var(--graupl-link-visited-text-decoration-style, var(--graupl-link-text-decoration-style, solid));\n text-decoration-thickness: var(--graupl-link-visited-text-decoration-thickness, var(--graupl-link-text-decoration-thickness, var(--graupl-border-width, 0.125rem)));\n }\n .breadcrumb-toggle:focus-visible {\n transform: var(--graupl-link-focus-transform, var(--graupl-link-transform, none));\n text-decoration: var(--graupl-link-focus-text-decoration, var(--graupl-link-text-decoration, underline));\n text-decoration-style: var(--graupl-link-focus-text-decoration-style, var(--graupl-link-text-decoration-style, solid));\n text-decoration-thickness: var(--graupl-link-focus-text-decoration-thickness, var(--graupl-link-text-decoration-thickness, var(--graupl-border-width, 0.125rem)));\n }\n .breadcrumb-toggle.focus {\n transform: var(--graupl-link-focus-transform, var(--graupl-link-transform, none));\n text-decoration: var(--graupl-link-focus-text-decoration, var(--graupl-link-text-decoration, underline));\n text-decoration-style: var(--graupl-link-focus-text-decoration-style, var(--graupl-link-text-decoration-style, solid));\n text-decoration-thickness: var(--graupl-link-focus-text-decoration-thickness, var(--graupl-link-text-decoration-thickness, var(--graupl-border-width, 0.125rem)));\n }\n .breadcrumb-toggle:hover {\n transform: var(--graupl-link-hover-transform, none);\n text-decoration: var(--graupl-link-hover-text-decoration, underline);\n text-decoration-style: var(--graupl-link-hover-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-hover-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle.hover {\n transform: var(--graupl-link-hover-transform, none);\n text-decoration: var(--graupl-link-hover-text-decoration, underline);\n text-decoration-style: var(--graupl-link-hover-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-hover-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle:active {\n transform: var(--graupl-link-active-transform, var(--graupl-link-hover-transform, none));\n text-decoration: var(--graupl-link-active-text-decoration, var(--graupl-link-hover-text-decoration, underline));\n text-decoration-style: var(--graupl-link-active-text-decoration-style, var(--graupl-link-hover-text-decoration-style, solid));\n text-decoration-thickness: var(--graupl-link-active-text-decoration-thickness, var(--graupl-link-hover-text-decoration-thickness, var(--graupl-border-width, 0.125rem)));\n }\n .breadcrumb-toggle.active {\n transform: var(--graupl-link-active-transform, var(--graupl-link-hover-transform, none));\n text-decoration: var(--graupl-link-active-text-decoration, var(--graupl-link-hover-text-decoration, underline));\n text-decoration-style: var(--graupl-link-active-text-decoration-style, var(--graupl-link-hover-text-decoration-style, solid));\n text-decoration-thickness: var(--graupl-link-active-text-decoration-thickness, var(--graupl-link-hover-text-decoration-thickness, var(--graupl-border-width, 0.125rem)));\n }\n .breadcrumb-toggle:disabled {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle:disabled:visited {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle:disabled.visited {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle:disabled:focus-visible {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle:disabled.focus {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle:disabled:hover {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle:disabled.hover {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle:disabled:active {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle:disabled.active {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle:disabled[aria-selected=true] {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle:disabled.selected {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle:disabled[aria-current=true] {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle:disabled.current {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[disabled] {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[disabled]:visited {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[disabled].visited {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[disabled]:focus-visible {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[disabled].focus {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[disabled]:hover {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[disabled].hover {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[disabled]:active {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[disabled].active {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[disabled][aria-selected=true] {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[disabled].selected {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[disabled][aria-current=true] {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[disabled].current {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[aria-disabled=true] {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[aria-disabled=true]:visited {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[aria-disabled=true].visited {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[aria-disabled=true]:focus-visible {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[aria-disabled=true].focus {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[aria-disabled=true]:hover {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[aria-disabled=true].hover {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[aria-disabled=true]:active {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[aria-disabled=true].active {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[aria-disabled=true][aria-selected=true] {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[aria-disabled=true].selected {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[aria-disabled=true][aria-current=true] {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[aria-disabled=true].current {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle.disabled {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle.disabled:visited {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle.disabled.visited {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle.disabled:focus-visible {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle.disabled.focus {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle.disabled:hover {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle.disabled.hover {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle.disabled:active {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle.disabled.active {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle.disabled[aria-selected=true] {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle.disabled.selected {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle.disabled[aria-current=true] {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle.disabled.current {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n @media (prefers-reduced-motion: reduce) {\n .breadcrumb-toggle {\n transition: var(--graupl-link-transition-reduced-motion, background var(--graupl-transition-timing-function, ease), color var(--graupl-transition-timing-function, ease));\n }\n }\n .breadcrumb-toggle {\n padding: var(--graupl-breadcrumb-toggle-padding, var(--graupl-breadcrumb-toggle-padding-y, var(--graupl-breadcrumb-link-padding-y, 0)) var(--graupl-breadcrumb-toggle-padding-x, var(--graupl-breadcrumb-link-padding-x, 0)));\n border-width: var(--graupl-breadcrumb-toggle-border-width, var(--graupl-breadcrumb-toggle-border-top-width, var(--graupl-breadcrumb-link-border-top-width, 0)) var(--graupl-breadcrumb-toggle-border-right-width, var(--graupl-breadcrumb-link-border-right-width, 0)) var(--graupl-breadcrumb-toggle-border-bottom-width, var(--graupl-breadcrumb-link-border-bottom-width, 0)) var(--graupl-breadcrumb-toggle-border-left-width, var(--graupl-breadcrumb-link-border-left-width, 0)));\n border-style: var(--graupl-breadcrumb-toggle-border-style, var(--graupl-breadcrumb-toggle-border-top-style, var(--graupl-breadcrumb-link-border-top-style, var(--graupl-border-top-style, var(--graupl-border-style, solid)))) var(--graupl-breadcrumb-toggle-border-right-style, var(--graupl-breadcrumb-link-border-right-style, var(--graupl-border-right-style, var(--graupl-border-style, solid)))) var(--graupl-breadcrumb-toggle-border-bottom-style, var(--graupl-breadcrumb-link-border-bottom-style, var(--graupl-border-bottom-style, var(--graupl-border-style, solid)))) var(--graupl-breadcrumb-toggle-border-left-style, var(--graupl-breadcrumb-link-border-left-style, var(--graupl-border-left-style, var(--graupl-border-style, solid)))));\n border-radius: var(--graupl-breadcrumb-toggle-border-radius, var(--graupl-breadcrumb-toggle-border-top-left-radius, var(--graupl-breadcrumb-link-border-top-left-radius, var(--graupl-border-top-left-radius, var(--graupl-border-radius, 0.125rem)))) var(--graupl-breadcrumb-toggle-border-top-right-radius, var(--graupl-breadcrumb-link-border-top-right-radius, var(--graupl-border-top-right-radius, var(--graupl-border-radius, 0.125rem)))) var(--graupl-breadcrumb-toggle-border-bottom-right-radius, var(--graupl-breadcrumb-link-border-bottom-right-radius, var(--graupl-border-bottom-right-radius, var(--graupl-border-radius, 0.125rem)))) var(--graupl-breadcrumb-toggle-border-bottom-left-radius, var(--graupl-breadcrumb-link-border-bottom-left-radius, var(--graupl-border-bottom-left-radius, var(--graupl-border-radius, 0.125rem)))));\n }\n}\n@layer graupl.theme {\n .breadcrumb {\n border-color: var(--graupl-breadcrumb-border-color, var(--graupl-breadcrumb-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n background: var(--graupl-breadcrumb-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n color: var(--graupl-breadcrumb-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))));\n }\n .breadcrumb-item {\n border-color: var(--graupl-breadcrumb-item-border-color, var(--graupl-breadcrumb-item-color, var(--graupl-breadcrumb-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n background: var(--graupl-breadcrumb-item-background, var(--graupl-breadcrumb-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n color: var(--graupl-breadcrumb-item-color, var(--graupl-breadcrumb-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n }\n .breadcrumb-link {\n border-color: var(--graupl-breadcrumb-link-border-color, var(--graupl-breadcrumb-link-color, var(--graupl-breadcrumb-item-color, var(--graupl-breadcrumb-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n background: var(--graupl-breadcrumb-link-background, var(--graupl-breadcrumb-item-background, var(--graupl-breadcrumb-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n color: var(--graupl-breadcrumb-link-color, var(--graupl-breadcrumb-item-color, var(--graupl-breadcrumb-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n }\n .breadcrumb-toggle {\n border-color: var(--graupl-link-border-color, transparent);\n background: var(--graupl-link-background, transparent);\n color: var(--graupl-link-color, var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%)))));\n text-decoration-color: var(--graupl-link-text-decoration-color, var(--graupl-link-color, var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%))))));\n }\n .breadcrumb-toggle:visited {\n border-color: var(--graupl-link-visited-border-color, var(--graupl-link-border-color, transparent));\n background: var(--graupl-link-visited-background, var(--graupl-link-background, transparent));\n color: var(--graupl-link-visited-color, var(--graupl-link-color, var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%))))));\n text-decoration-color: var(--graupl-link-visited-text-decoration-color, var(--graupl-link-visited-color, var(--graupl-link-color, var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%)))))));\n }\n .breadcrumb-toggle.visited {\n border-color: var(--graupl-link-visited-border-color, var(--graupl-link-border-color, transparent));\n background: var(--graupl-link-visited-background, var(--graupl-link-background, transparent));\n color: var(--graupl-link-visited-color, var(--graupl-link-color, var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%))))));\n text-decoration-color: var(--graupl-link-visited-text-decoration-color, var(--graupl-link-visited-color, var(--graupl-link-color, var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%)))))));\n }\n .breadcrumb-toggle:focus-visible {\n border-color: var(--graupl-link-focus-border-color, var(--graupl-link-border-color, transparent));\n background: var(--graupl-link-focus-background, var(--graupl-link-background, transparent));\n color: var(--graupl-link-focus-color, var(--graupl-link-color, var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%))))));\n text-decoration-color: var(--graupl-link-focus-text-decoration-color, var(--graupl-link-focus-color, var(--graupl-link-color, var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%)))))));\n }\n .breadcrumb-toggle.focus {\n border-color: var(--graupl-link-focus-border-color, var(--graupl-link-border-color, transparent));\n background: var(--graupl-link-focus-background, var(--graupl-link-background, transparent));\n color: var(--graupl-link-focus-color, var(--graupl-link-color, var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%))))));\n text-decoration-color: var(--graupl-link-focus-text-decoration-color, var(--graupl-link-focus-color, var(--graupl-link-color, var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%)))))));\n }\n .breadcrumb-toggle:hover {\n border-color: var(--graupl-link-hover-border-color, transparent);\n background: var(--graupl-link-hover-background, transparent);\n color: var(--graupl-link-hover-color, var(--graupl-theme-active--tertiary--700, var(--graupl-theme-light--tertiary--700, var(--graupl-tertiary--700, hsl(340, 65%, 35%)))));\n text-decoration-color: var(--graupl-link-hover-text-decoration-color, var(--graupl-link-hover-color, var(--graupl-theme-active--tertiary--700, var(--graupl-theme-light--tertiary--700, var(--graupl-tertiary--700, hsl(340, 65%, 35%))))));\n }\n .breadcrumb-toggle.hover {\n border-color: var(--graupl-link-hover-border-color, transparent);\n background: var(--graupl-link-hover-background, transparent);\n color: var(--graupl-link-hover-color, var(--graupl-theme-active--tertiary--700, var(--graupl-theme-light--tertiary--700, var(--graupl-tertiary--700, hsl(340, 65%, 35%)))));\n text-decoration-color: var(--graupl-link-hover-text-decoration-color, var(--graupl-link-hover-color, var(--graupl-theme-active--tertiary--700, var(--graupl-theme-light--tertiary--700, var(--graupl-tertiary--700, hsl(340, 65%, 35%))))));\n }\n .breadcrumb-toggle:active {\n border-color: var(--graupl-link-active-border-color, var(--graupl-link-hover-border-color, transparent));\n background: var(--graupl-link-active-background, var(--graupl-link-hover-background, transparent));\n color: var(--graupl-link-active-color, var(--graupl-link-hover-color, var(--graupl-theme-active--tertiary--700, var(--graupl-theme-light--tertiary--700, var(--graupl-tertiary--700, hsl(340, 65%, 35%))))));\n text-decoration-color: var(--graupl-link-active-text-decoration-color, var(--graupl-link-active-color, var(--graupl-link-hover-color, var(--graupl-theme-active--tertiary--700, var(--graupl-theme-light--tertiary--700, var(--graupl-tertiary--700, hsl(340, 65%, 35%)))))));\n }\n .breadcrumb-toggle.active {\n border-color: var(--graupl-link-active-border-color, var(--graupl-link-hover-border-color, transparent));\n background: var(--graupl-link-active-background, var(--graupl-link-hover-background, transparent));\n color: var(--graupl-link-active-color, var(--graupl-link-hover-color, var(--graupl-theme-active--tertiary--700, var(--graupl-theme-light--tertiary--700, var(--graupl-tertiary--700, hsl(340, 65%, 35%))))));\n text-decoration-color: var(--graupl-link-active-text-decoration-color, var(--graupl-link-active-color, var(--graupl-link-hover-color, var(--graupl-theme-active--tertiary--700, var(--graupl-theme-light--tertiary--700, var(--graupl-tertiary--700, hsl(340, 65%, 35%)))))));\n }\n .breadcrumb-toggle:disabled {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle:disabled:visited {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle:disabled.visited {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle:disabled:focus-visible {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle:disabled.focus {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle:disabled:hover {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle:disabled.hover {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle:disabled:active {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle:disabled.active {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle:disabled[aria-selected=true] {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle:disabled.selected {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle:disabled[aria-current=true] {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle:disabled.current {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[disabled] {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[disabled]:visited {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[disabled].visited {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[disabled]:focus-visible {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[disabled].focus {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[disabled]:hover {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[disabled].hover {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[disabled]:active {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[disabled].active {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[disabled][aria-selected=true] {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[disabled].selected {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[disabled][aria-current=true] {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[disabled].current {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[aria-disabled=true] {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[aria-disabled=true]:visited {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[aria-disabled=true].visited {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[aria-disabled=true]:focus-visible {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[aria-disabled=true].focus {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[aria-disabled=true]:hover {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[aria-disabled=true].hover {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[aria-disabled=true]:active {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[aria-disabled=true].active {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[aria-disabled=true][aria-selected=true] {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[aria-disabled=true].selected {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[aria-disabled=true][aria-current=true] {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[aria-disabled=true].current {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle.disabled {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle.disabled:visited {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle.disabled.visited {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle.disabled:focus-visible {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle.disabled.focus {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle.disabled:hover {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle.disabled.hover {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle.disabled:active {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle.disabled.active {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle.disabled[aria-selected=true] {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle.disabled.selected {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle.disabled[aria-current=true] {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle.disabled.current {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle {\n border-color: var(--graupl-breadcrumb-toggle-border-color, var(--graupl-breadcrumb-toggle-color, var(--graupl-breadcrumb-link-color, var(--graupl-breadcrumb-item-color, var(--graupl-breadcrumb-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))))));\n background: var(--graupl-breadcrumb-toggle-background, var(--graupl-breadcrumb-link-background, var(--graupl-breadcrumb-item-background, var(--graupl-breadcrumb-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))))));\n color: var(--graupl-breadcrumb-toggle-color, var(--graupl-breadcrumb-link-color, var(--graupl-breadcrumb-item-color, var(--graupl-breadcrumb-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n }\n}","// @graupl/core layer mixins.\n//\n// These should be used to define the layers of your components to ensure that\n// they are output in the correct order in the final compiled CSS.\n\n@use \"../defaults\" as root-defaults;\n\n@mixin layer($layer) {\n @if root-defaults.$use-layers {\n @layer #{root-defaults.$id}.#{$layer} {\n @content;\n }\n } @else {\n @content;\n }\n}\n","// @graupl/core breadcrumb component styles.\n//\n// This module provides the breadcrumb component styles.\n//\n// The following selectors are generated by default:\n// - `.breadcrumb`: The breadcrumb container.\n// - `.breadcrumb-item`: The breadcrumb item.\n//\n// The following custom properties can be used to customize the breadcrumb component:\n// For the complete property set and defaults, see `_variables.scss`.\n// | Property | Description | Default Value |\n// | ------------------------------------------------------- | ------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |\n// | `--graupl-breadcrumb-padding-x` | Horizontal padding for the breadcrumb container. | `var(--graupl-spacer-0)` |\n// | `--graupl-breadcrumb-padding-y` | Vertical padding for the breadcrumb container. | `var(--graupl-spacer-0)` |\n// | `--graupl-breadcrumb-padding` | Padding for the breadcrumb container. | `var(--graupl-breadcrumb-padding-y) var(--graupl-breadcrumb-padding-x)` |\n// | `--graupl-breadcrumb-margin-x` | Horizontal margin for the breadcrumb container. | `var(--graupl-spacer-0)` |\n// | `--graupl-breadcrumb-margin-y` | Vertical margin for the breadcrumb container. | `var(--graupl-spacer-0)` |\n// | `--graupl-breadcrumb-margin` | Margin for the breadcrumb container. | `var(--graupl-breadcrumb-margin-y) var(--graupl-breadcrumb-margin-x)` |\n// | `--graupl-breadcrumb-column-gap` | Horizontal gap for the breadcrumb container. | `var(--graupl-spacer-2)` |\n// | `--graupl-breadcrumb-row-gap` | Vertical gap for the breadcrumb container. | `var(--graupl-spacer-2)` |\n// | `--graupl-breadcrumb-gap` | Gap for the breadcrumb container. | `var(--graupl-breadcrumb-column-gap) var(--graupl-breadcrumb-row-gap)` |\n// | `--graupl-breadcrumb-background` | Background for the breadcrumb container. | `var(--graupl-background)` |\n// | `--graupl-breadcrumb-color` | Text color for the breadcrumb container. | `var(--graupl-color)` |\n// | `--graupl-breadcrumb-border-color` | Border color for the breadcrumb container. | `var(--graupl-breadcrumb-color)` |\n// | `--graupl-breadcrumb-border-top-left-radius` | Top-left border radius for the breadcrumb container. | `var(--graupl-border-top-left-radius)` |\n// | `--graupl-breadcrumb-border-top-right-radius` | Top-right border radius for the breadcrumb container. | `var(--graupl-border-top-right-radius)` |\n// | `--graupl-breadcrumb-border-bottom-left-radius` | Bottom-left border radius for the breadcrumb container. | `var(--graupl-border-bottom-left-radius)` |\n// | `--graupl-breadcrumb-border-bottom-right-radius` | Bottom-right border radius for the breadcrumb container. | `var(--graupl-border-bottom-right-radius)` |\n// | `--graupl-breadcrumb-border-radius` | Border radius for the breadcrumb container. | `var(--graupl-breadcrumb-border-top-left-radius) var(--graupl-breadcrumb-border-top-right-radius) var(--graupl-breadcrumb-border-bottom-right-radius) var(--graupl-breadcrumb-border-bottom-left-radius)` |\n// | `--graupl-breadcrumb-border-top-width` | Top border width for the breadcrumb container. | `0` |\n// | `--graupl-breadcrumb-border-right-width` | Right border width for the breadcrumb container. | `0` |\n// | `--graupl-breadcrumb-border-bottom-width` | Bottom border width for the breadcrumb container. | `0` |\n// | `--graupl-breadcrumb-border-left-width` | Left border width for the breadcrumb container. | `0` |\n// | `--graupl-breadcrumb-border-width` | Border width for the breadcrumb container. | `var(--graupl-breadcrumb-border-top-width) var(--graupl-breadcrumb-border-right-width) var(--graupl-breadcrumb-border-bottom-width) var(--graupl-breadcrumb-border-left-width)` |\n// | `--graupl-breadcrumb-border-top-style` | Top border style for the breadcrumb container. | `var(--graupl-border-top-style)` |\n// | `--graupl-breadcrumb-border-right-style` | Right border style for the breadcrumb container. | `var(--graupl-border-right-style)` |\n// | `--graupl-breadcrumb-border-bottom-style` | Bottom border style for the breadcrumb container. | `var(--graupl-border-bottom-style)` |\n// | `--graupl-breadcrumb-border-left-style` | Left border style for the breadcrumb container. | `var(--graupl-border-left-style)` |\n// | `--graupl-breadcrumb-border-style` | Border style for the breadcrumb container. | `var(--graupl-breadcrumb-border-top-style) var(--graupl-breadcrumb-border-right-style) var(--graupl-breadcrumb-border-bottom-style) var(--graupl-breadcrumb-border-left-style)` |\n// | `--graupl-breadcrumb-item-show-display` | Display for the breadcrumb item in the shown state. | `flex` |\n// | `--graupl-breadcrumb-item-hide-display` | Display for the breadcrumb item in the hidden state. | `none` |\n// | `--graupl-breadcrumb-item-transitioning-display` | Display for the breadcrumb item in the transitioning state. | `flex` |\n// | `--graupl-breadcrumb-item-display` | Display value for the breadcrumb item. | `flex` |\n// | `--graupl-breadcrumb-item-show-opacity` | Opacity for the breadcrumb item in the shown state. | `1` |\n// | `--graupl-breadcrumb-item-hide-opacity` | Opacity for the breadcrumb item in the hidden state. | `0` |\n// | `--graupl-breadcrumb-item-transitioning-opacity` | Opacity for the breadcrumb item in the transitioning state. | `0` |\n// | `--graupl-breadcrumb-item-opacity` | Opacity for the breadcrumb item. | `var(--graupl-breadcrumb-item-show-opacity)` |\n// | `--graupl-breadcrumb-item-transition-duration` | Transition duration for the breadcrumb item. | `var(--graupl-transition-duration-fast)` |\n// | `--graupl-breadcrumb-item-transition-timing-function` | Transition timing function for the breadcrumb item. | `var(--graupl-transition-timing-function)` |\n// | `--graupl-breadcrumb-item-transition` | Transition applied to the breadcrumb item. | `opacity var(--graupl-breadcrumb-item-transition-duration) var(--graupl-breadcrumb-item-transition-timing-function)` |\n// | `--graupl-breadcrumb-item-transition-reduced-motion` | Transition used for the breadcrumb item when reduced motion is enabled. | `none` |\n// | `--graupl-breadcrumb-item-padding-x` | Horizontal padding for the breadcrumb item. | `0` |\n// | `--graupl-breadcrumb-item-padding-y` | Vertical padding for the breadcrumb item. | `0` |\n// | `--graupl-breadcrumb-item-padding` | Padding for the breadcrumb item. | `var(--graupl-breadcrumb-item-padding-y) var(--graupl-breadcrumb-item-padding-x)` |\n// | `--graupl-breadcrumb-item-column-gap` | Horizontal gap for the breadcrumb item. | `var(--graupl-breadcrumb-column-gap)` |\n// | `--graupl-breadcrumb-item-row-gap` | Vertical gap for the breadcrumb item. | `var(--graupl-breadcrumb-row-gap)` |\n// | `--graupl-breadcrumb-item-gap` | Gap for the breadcrumb item. | `var(--graupl-breadcrumb-item-column-gap) var(--graupl-breadcrumb-item-row-gap)` |\n// | `--graupl-breadcrumb-item-color` | Text color for the breadcrumb item. | `var(--graupl-breadcrumb-color)` |\n// | `--graupl-breadcrumb-item-background` | Background for the breadcrumb item. | `var(--graupl-breadcrumb-background)` |\n// | `--graupl-breadcrumb-item-visited-color` | Text color for the breadcrumb item in the visited state. | `var(--graupl-breadcrumb-item-color)` |\n// | `--graupl-breadcrumb-item-focus-color` | Text color for the breadcrumb item in the focus state. | `var(--graupl-breadcrumb-item-color)` |\n// | `--graupl-breadcrumb-item-hover-color` | Text color for the breadcrumb item in the hover state. | `var(--graupl-breadcrumb-item-background)` |\n// | `--graupl-breadcrumb-item-active-color` | Text color for the breadcrumb item in the active state. | `var(--graupl-breadcrumb-item-hover-color)` |\n// | `--graupl-breadcrumb-item-disabled-color` | Text color for the breadcrumb item in the disabled state. | `var(--graupl-theme-active--primary--200)` |\n// | `--graupl-breadcrumb-item-visited-background` | Background for the breadcrumb item in the visited state. | `var(--graupl-breadcrumb-item-background)` |\n// | `--graupl-breadcrumb-item-focus-background` | Background for the breadcrumb item in the focus state. | `var(--graupl-breadcrumb-item-background)` |\n// | `--graupl-breadcrumb-item-hover-background` | Background for the breadcrumb item in the hover state. | `var(--graupl-breadcrumb-item-color)` |\n// | `--graupl-breadcrumb-item-active-background` | Background for the breadcrumb item in the active state. | `var(--graupl-breadcrumb-item-hover-background)` |\n// | `--graupl-breadcrumb-item-disabled-background` | Background for the breadcrumb item in the disabled state. | `var(--graupl-theme-active--primary--200)` |\n// | `--graupl-breadcrumb-item-border-color` | Border color for the breadcrumb item. | `var(--graupl-breadcrumb-item-color)` |\n// | `--graupl-breadcrumb-item-border-top-left-radius` | Top-left border radius for the breadcrumb item. | `var(--graupl-border-top-left-radius)` |\n// | `--graupl-breadcrumb-item-border-top-right-radius` | Top-right border radius for the breadcrumb item. | `var(--graupl-border-top-right-radius)` |\n// | `--graupl-breadcrumb-item-border-bottom-left-radius` | Bottom-left border radius for the breadcrumb item. | `var(--graupl-border-bottom-left-radius)` |\n// | `--graupl-breadcrumb-item-border-bottom-right-radius` | Bottom-right border radius for the breadcrumb item. | `var(--graupl-border-bottom-right-radius)` |\n// | `--graupl-breadcrumb-item-border-radius` | Border radius for the breadcrumb item. | `var(--graupl-breadcrumb-item-border-top-left-radius) var(--graupl-breadcrumb-item-border-top-right-radius) var(--graupl-breadcrumb-item-border-bottom-right-radius) var(--graupl-breadcrumb-item-border-bottom-left-radius)` |\n// | `--graupl-breadcrumb-item-border-top-width` | Top border width for the breadcrumb item. | `0` |\n// | `--graupl-breadcrumb-item-border-right-width` | Right border width for the breadcrumb item. | `0` |\n// | `--graupl-breadcrumb-item-border-bottom-width` | Bottom border width for the breadcrumb item. | `0` |\n// | `--graupl-breadcrumb-item-border-left-width` | Left border width for the breadcrumb item. | `0` |\n// | `--graupl-breadcrumb-item-border-width` | Border width for the breadcrumb item. | `var(--graupl-breadcrumb-item-border-top-width) var(--graupl-breadcrumb-item-border-right-width) var(--graupl-breadcrumb-item-border-bottom-width) var(--graupl-breadcrumb-item-border-left-width)` |\n// | `--graupl-breadcrumb-item-border-top-style` | Top border style for the breadcrumb item. | `var(--graupl-border-top-style)` |\n// | `--graupl-breadcrumb-item-border-right-style` | Right border style for the breadcrumb item. | `var(--graupl-border-right-style)` |\n// | `--graupl-breadcrumb-item-border-bottom-style` | Bottom border style for the breadcrumb item. | `var(--graupl-border-bottom-style)` |\n// | `--graupl-breadcrumb-item-border-left-style` | Left border style for the breadcrumb item. | `var(--graupl-border-left-style)` |\n// | `--graupl-breadcrumb-item-border-style` | Border style for the breadcrumb item. | `var(--graupl-breadcrumb-item-border-top-style) var(--graupl-breadcrumb-item-border-right-style) var(--graupl-breadcrumb-item-border-bottom-style) var(--graupl-breadcrumb-item-border-left-style)` |\n// | `--graupl-breadcrumb-link-padding-x` | Horizontal padding for the breadcrumb link. | `0` |\n// | `--graupl-breadcrumb-link-padding-y` | Vertical padding for the breadcrumb link. | `0` |\n// | `--graupl-breadcrumb-link-padding` | Padding for the breadcrumb link. | `var(--graupl-breadcrumb-link-padding-y) var(--graupl-breadcrumb-link-padding-x)` |\n// | `--graupl-breadcrumb-link-transition-duration` | Transition duration for the breadcrumb link. | `var(--graupl-transition-duration-fast)` |\n// | `--graupl-breadcrumb-link-transition-timing-function` | Transition timing function for the breadcrumb link. | `var(--graupl-transition-timing-function)` |\n// | `--graupl-breadcrumb-link-transition` | Transition applied to the breadcrumb link. | `transform var(--graupl-breadcrumb-link-transition-duration) var(--graupl-breadcrumb-link-transition-timing-function)` |\n// | `--graupl-breadcrumb-link-transition-reduced-motion` | Transition used for the breadcrumb link when reduced motion is enabled. | `none` |\n// | `--graupl-breadcrumb-link-transform` | Transform for the breadcrumb link. | `none` |\n// | `--graupl-breadcrumb-link-visited-transform` | Transform for the breadcrumb link in the visited state. | `var(--graupl-breadcrumb-link-transform)` |\n// | `--graupl-breadcrumb-link-focus-transform` | Transform for the breadcrumb link in the focus state. | `var(--graupl-breadcrumb-link-transform)` |\n// | `--graupl-breadcrumb-link-hover-transform` | Transform for the breadcrumb link in the hover state. | `var(--graupl-breadcrumb-link-transform)` |\n// | `--graupl-breadcrumb-link-active-transform` | Transform for the breadcrumb link in the active state. | `none` |\n// | `--graupl-breadcrumb-link-disabled-transform` | Transform for the breadcrumb link in the disabled state. | `none` |\n// | `--graupl-breadcrumb-link-color` | Text color for the breadcrumb link. | `var(--graupl-breadcrumb-item-color)` |\n// | `--graupl-breadcrumb-link-background` | Background for the breadcrumb link. | `var(--graupl-breadcrumb-item-background)` |\n// | `--graupl-breadcrumb-link-visited-color` | Text color for the breadcrumb link in the visited state. | `var(--graupl-breadcrumb-link-color)` |\n// | `--graupl-breadcrumb-link-focus-color` | Text color for the breadcrumb link in the focus state. | `var(--graupl-breadcrumb-link-color)` |\n// | `--graupl-breadcrumb-link-hover-color` | Text color for the breadcrumb link in the hover state. | `var(--graupl-breadcrumb-link-background)` |\n// | `--graupl-breadcrumb-link-active-color` | Text color for the breadcrumb link in the active state. | `var(--graupl-breadcrumb-link-hover-color)` |\n// | `--graupl-breadcrumb-link-disabled-color` | Text color for the breadcrumb link in the disabled state. | `var(--graupl-theme-active--primary--200)` |\n// | `--graupl-breadcrumb-link-visited-background` | Background for the breadcrumb link in the visited state. | `var(--graupl-breadcrumb-link-background)` |\n// | `--graupl-breadcrumb-link-focus-background` | Background for the breadcrumb link in the focus state. | `var(--graupl-breadcrumb-link-background)` |\n// | `--graupl-breadcrumb-link-hover-background` | Background for the breadcrumb link in the hover state. | `var(--graupl-breadcrumb-link-color)` |\n// | `--graupl-breadcrumb-link-active-background` | Background for the breadcrumb link in the active state. | `var(--graupl-breadcrumb-link-hover-background)` |\n// | `--graupl-breadcrumb-link-disabled-background` | Background for the breadcrumb link in the disabled state. | `var(--graupl-theme-active--primary--200)` |\n// | `--graupl-breadcrumb-link-border-color` | Border color for the breadcrumb link. | `var(--graupl-breadcrumb-link-color)` |\n// | `--graupl-breadcrumb-link-border-top-left-radius` | Top-left border radius for the breadcrumb link. | `var(--graupl-border-top-left-radius)` |\n// | `--graupl-breadcrumb-link-border-top-right-radius` | Top-right border radius for the breadcrumb link. | `var(--graupl-border-top-right-radius)` |\n// | `--graupl-breadcrumb-link-border-bottom-left-radius` | Bottom-left border radius for the breadcrumb link. | `var(--graupl-border-bottom-left-radius)` |\n// | `--graupl-breadcrumb-link-border-bottom-right-radius` | Bottom-right border radius for the breadcrumb link. | `var(--graupl-border-bottom-right-radius)` |\n// | `--graupl-breadcrumb-link-border-radius` | Border radius for the breadcrumb link. | `var(--graupl-breadcrumb-link-border-top-left-radius) var(--graupl-breadcrumb-link-border-top-right-radius) var(--graupl-breadcrumb-link-border-bottom-right-radius) var(--graupl-breadcrumb-link-border-bottom-left-radius)` |\n// | `--graupl-breadcrumb-link-border-top-width` | Top border width for the breadcrumb link. | `0` |\n// | `--graupl-breadcrumb-link-border-right-width` | Right border width for the breadcrumb link. | `0` |\n// | `--graupl-breadcrumb-link-border-bottom-width` | Bottom border width for the breadcrumb link. | `0` |\n// | `--graupl-breadcrumb-link-border-left-width` | Left border width for the breadcrumb link. | `0` |\n// | `--graupl-breadcrumb-link-border-width` | Border width for the breadcrumb link. | `var(--graupl-breadcrumb-link-border-top-width) var(--graupl-breadcrumb-link-border-right-width) var(--graupl-breadcrumb-link-border-bottom-width) var(--graupl-breadcrumb-link-border-left-width)` |\n// | `--graupl-breadcrumb-link-border-top-style` | Top border style for the breadcrumb link. | `var(--graupl-border-top-style)` |\n// | `--graupl-breadcrumb-link-border-right-style` | Right border style for the breadcrumb link. | `var(--graupl-border-right-style)` |\n// | `--graupl-breadcrumb-link-border-bottom-style` | Bottom border style for the breadcrumb link. | `var(--graupl-border-bottom-style)` |\n// | `--graupl-breadcrumb-link-border-left-style` | Left border style for the breadcrumb link. | `var(--graupl-border-left-style)` |\n// | `--graupl-breadcrumb-link-border-style` | Border style for the breadcrumb link. | `var(--graupl-breadcrumb-link-border-top-style) var(--graupl-breadcrumb-link-border-right-style) var(--graupl-breadcrumb-link-border-bottom-style) var(--graupl-breadcrumb-link-border-left-style)` |\n// | `--graupl-breadcrumb-toggle-padding-x` | Horizontal padding for the breadcrumb toggle. | `var(--graupl-breadcrumb-link-padding-x)` |\n// | `--graupl-breadcrumb-toggle-padding-y` | Vertical padding for the breadcrumb toggle. | `var(--graupl-breadcrumb-link-padding-y)` |\n// | `--graupl-breadcrumb-toggle-padding` | Padding for the breadcrumb toggle. | `var(--graupl-breadcrumb-toggle-padding-y) var(--graupl-breadcrumb-toggle-padding-x)` |\n// | `--graupl-breadcrumb-toggle-transition-duration` | Transition duration for the breadcrumb toggle. | `var(--graupl-breadcrumb-link-transition-duration)` |\n// | `--graupl-breadcrumb-toggle-transition-timing-function` | Transition timing function for the breadcrumb toggle. | `var(--graupl-breadcrumb-link-transition-timing-function)` |\n// | `--graupl-breadcrumb-toggle-transition` | Transition applied to the breadcrumb toggle. | `transform var(--graupl-breadcrumb-toggle-transition-duration) var(--graupl-breadcrumb-toggle-transition-timing-function)` |\n// | `--graupl-breadcrumb-toggle-transition-reduced-motion` | Transition used for the breadcrumb toggle when reduced motion is enabled. | `var(--graupl-breadcrumb-link-transition-reduced-motion)` |\n// | `--graupl-breadcrumb-toggle-transform` | Transform for the breadcrumb toggle. | `var(--graupl-breadcrumb-link-transform)` |\n// | `--graupl-breadcrumb-toggle-visited-transform` | Transform for the breadcrumb toggle in the visited state. | `var(--graupl-breadcrumb-toggle-transform)` |\n// | `--graupl-breadcrumb-toggle-focus-transform` | Transform for the breadcrumb toggle in the focus state. | `var(--graupl-breadcrumb-toggle-transform)` |\n// | `--graupl-breadcrumb-toggle-hover-transform` | Transform for the breadcrumb toggle in the hover state. | `var(--graupl-breadcrumb-toggle-transform)` |\n// | `--graupl-breadcrumb-toggle-active-transform` | Transform for the breadcrumb toggle in the active state. | `var(--graupl-breadcrumb-link-active-transform)` |\n// | `--graupl-breadcrumb-toggle-disabled-transform` | Transform for the breadcrumb toggle in the disabled state. | `var(--graupl-breadcrumb-link-disabled-transform)` |\n// | `--graupl-breadcrumb-toggle-color` | Text color for the breadcrumb toggle. | `var(--graupl-breadcrumb-link-color)` |\n// | `--graupl-breadcrumb-toggle-background` | Background for the breadcrumb toggle. | `var(--graupl-breadcrumb-link-background)` |\n// | `--graupl-breadcrumb-toggle-visited-color` | Text color for the breadcrumb toggle in the visited state. | `var(--graupl-breadcrumb-toggle-color)` |\n// | `--graupl-breadcrumb-toggle-focus-color` | Text color for the breadcrumb toggle in the focus state. | `var(--graupl-breadcrumb-toggle-color)` |\n// | `--graupl-breadcrumb-toggle-hover-color` | Text color for the breadcrumb toggle in the hover state. | `var(--graupl-breadcrumb-toggle-background)` |\n// | `--graupl-breadcrumb-toggle-active-color` | Text color for the breadcrumb toggle in the active state. | `var(--graupl-breadcrumb-toggle-hover-color)` |\n// | `--graupl-breadcrumb-toggle-disabled-color` | Text color for the breadcrumb toggle in the disabled state. | `var(--graupl-theme-active--primary--200)` |\n// | `--graupl-breadcrumb-toggle-visited-background` | Background for the breadcrumb toggle in the visited state. | `var(--graupl-breadcrumb-toggle-background)` |\n// | `--graupl-breadcrumb-toggle-focus-background` | Background for the breadcrumb toggle in the focus state. | `var(--graupl-breadcrumb-toggle-background)` |\n// | `--graupl-breadcrumb-toggle-hover-background` | Background for the breadcrumb toggle in the hover state. | `var(--graupl-breadcrumb-toggle-color)` |\n// | `--graupl-breadcrumb-toggle-active-background` | Background for the breadcrumb toggle in the active state. | `var(--graupl-breadcrumb-toggle-hover-background)` |\n// | `--graupl-breadcrumb-toggle-disabled-background` | Background for the breadcrumb toggle in the disabled state. | `var(--graupl-theme-active--primary--200)` |\n// | `--graupl-breadcrumb-toggle-border-color` | Border color for the breadcrumb toggle. | `var(--graupl-breadcrumb-toggle-color)` |\n// | `--graupl-breadcrumb-toggle-border-top-left-radius` | Top-left border radius for the breadcrumb toggle. | `var(--graupl-breadcrumb-link-border-top-left-radius)` |\n// | `--graupl-breadcrumb-toggle-border-top-right-radius` | Top-right border radius for the breadcrumb toggle. | `var(--graupl-breadcrumb-link-border-top-right-radius)` |\n// | `--graupl-breadcrumb-toggle-border-bottom-left-radius` | Bottom-left border radius for the breadcrumb toggle. | `var(--graupl-breadcrumb-link-border-bottom-left-radius)` |\n// | `--graupl-breadcrumb-toggle-border-bottom-right-radius` | Bottom-right border radius for the breadcrumb toggle. | `var(--graupl-breadcrumb-link-border-bottom-right-radius)` |\n// | `--graupl-breadcrumb-toggle-border-radius` | Border radius for the breadcrumb toggle. | `var(--graupl-breadcrumb-toggle-border-top-left-radius) var(--graupl-breadcrumb-toggle-border-top-right-radius) var(--graupl-breadcrumb-toggle-border-bottom-right-radius) var(--graupl-breadcrumb-toggle-border-bottom-left-radius)` |\n// | `--graupl-breadcrumb-toggle-border-top-width` | Top border width for the breadcrumb toggle. | `var(--graupl-breadcrumb-link-border-top-width)` |\n// | `--graupl-breadcrumb-toggle-border-right-width` | Right border width for the breadcrumb toggle. | `var(--graupl-breadcrumb-link-border-right-width)` |\n// | `--graupl-breadcrumb-toggle-border-bottom-width` | Bottom border width for the breadcrumb toggle. | `var(--graupl-breadcrumb-link-border-bottom-width)` |\n// | `--graupl-breadcrumb-toggle-border-left-width` | Left border width for the breadcrumb toggle. | `var(--graupl-breadcrumb-link-border-left-width)` |\n// | `--graupl-breadcrumb-toggle-border-width` | Border width for the breadcrumb toggle. | `var(--graupl-breadcrumb-toggle-border-top-width) var(--graupl-breadcrumb-toggle-border-right-width) var(--graupl-breadcrumb-toggle-border-bottom-width) var(--graupl-breadcrumb-toggle-border-left-width)` |\n// | `--graupl-breadcrumb-toggle-border-top-style` | Top border style for the breadcrumb toggle. | `var(--graupl-breadcrumb-link-border-top-style)` |\n// | `--graupl-breadcrumb-toggle-border-right-style` | Right border style for the breadcrumb toggle. | `var(--graupl-breadcrumb-link-border-right-style)` |\n// | `--graupl-breadcrumb-toggle-border-bottom-style` | Bottom border style for the breadcrumb toggle. | `var(--graupl-breadcrumb-link-border-bottom-style)` |\n// | `--graupl-breadcrumb-toggle-border-left-style` | Left border style for the breadcrumb toggle. | `var(--graupl-breadcrumb-link-border-left-style)` |\n// | `--graupl-breadcrumb-toggle-border-style` | Border style for the breadcrumb toggle. | `var(--graupl-breadcrumb-toggle-border-top-style) var(--graupl-breadcrumb-toggle-border-right-style) var(--graupl-breadcrumb-toggle-border-bottom-style) var(--graupl-breadcrumb-toggle-border-left-style)` |\n// | `--graupl-breadcrumb-item-separator` | Separator content rendered between breadcrumb items. | `\"'/'\"` |\n//\n// The following sass variables can be used to customize the generation of the breadcrumb component:\n// | Variable | Description | Default Value |\n// | -------------------------------------------- | ------------------------------------------------- | ------------------------- |\n// | `$selector-base` | Selector base for the component. | `\".\"` |\n// | `$modifier-selector-base` | Selector base for component modifiers. | `\".\"` |\n// | `$generate-base-theme-map` | Flag to generate the base theme map. | `true` |\n// | `$themeable` | Flag to generate theme modifiers. | `false` |\n// | `$breadcrumb-selector-base` | Selector base for the breadcrumb container. | `\".\"` |\n// | `$breadcrumb-selector` | Selector for the breadcrumb container. | `\"breadcrumb\"` |\n// | `$breadcrumb-theme-selector-base` | Selector base for theme modifiers. | `\".\"` |\n// | `$breadcrumb-theme-selector-prefix` | Selector prefix for theme modifiers. | `\"\"` |\n// | `$breadcrumb-item-selector-base` | Selector base for breadcrumb items. | `\".\"` |\n// | `$breadcrumb-item-selector` | Selector for breadcrumb items. | `\"breadcrumb-item\"` |\n// | `$breadcrumb-item-separator-pseudo-selector` | Pseudo selector for breadcrumb separators. | `\"after\"` |\n// | `$breadcrumb-item-separator` | Content used as the breadcrumb separator. | `\"'/'\"` |\n// | `$breadcrumb-toggle-selector-base` | Selector base for breadcrumb toggles. | `\".\"` |\n// | `$breadcrumb-toggle-selector` | Selector for breadcrumb toggles. | `\"breadcrumb-toggle\"` |\n// | `$breadcrumb-link-selector-base` | Selector base for breadcrumb links. | `\".\"` |\n// | `$breadcrumb-link-selector` | Selector for breadcrumb links. | `\"breadcrumb-link\"` |\n// | `$breadcrumb-open-selector-base` | Selector base for the open breadcrumb modifier. | `\".\"` |\n// | `$breadcrumb-open-selector` | Selector for the open breadcrumb modifier. | `\"show\"` |\n// | `$breadcrumb-close-selector-base` | Selector base for the closed breadcrumb modifier. | `\".\"` |\n// | `$breadcrumb-close-selector` | Selector for the closed breadcrumb modifier. | `\"hide\"` |\n// | `$breadcrumb-transition-selector-base` | Selector base for the transitioning modifier. | `\".\"` |\n// | `$breadcrumb-transition-selector` | Selector for the transitioning modifier. | `\"transitioning\"` |\n// | `$breadcrumb-link-initial-transform` | Initial transform for breadcrumb links. | `none` |\n// | `$breadcrumb-link-final-transform` | Final transform for breadcrumb links. | `none` |\n// | `$breadcrumb-link-disabled-transform` | Disabled transform for breadcrumb links. | `none` |\n// | `$breadcrumb-item-show-display` | Display for shown breadcrumb items. | `flex` |\n// | `$breadcrumb-item-hide-display` | Display for hidden breadcrumb items. | `none` |\n// | `$breadcrumb-item-transitioning-display` | Display for transitioning breadcrumb items. | `flex` |\n// | `$breadcrumb-item-show-opacity` | Opacity for shown breadcrumb items. | `1` |\n// | `$breadcrumb-item-hide-opacity` | Opacity for hidden breadcrumb items. | `0` |\n// | `$breadcrumb-item-transitioning-opacity` | Opacity for transitioning breadcrumb items. | `0` |\n// | `$breadcrumb-item-transform` | Base transform for breadcrumb items. | `none` |\n// | `$breadcrumb-item-hover-transform` | Hover transform for breadcrumb items. | `none` |\n// | `$breadcrumb-theme-mappings` | Map of properties/shades for breadcrumb themes. | `()` |\n// | `$breadcrumb-theme-map` | Expanded map of properties/colors/shades. | `()` |\n//\n// ## Using `$breadcrumb-theme-mappings`\n//\n// `$breadcrumb-theme-mappings` is a 1-level map of properties and shade values.\n//\n// e.g.\n// ```scss\n// $breadcrumb-theme-mappings: (\n// color: 900,\n// border-color: 700,\n// )\n// ```\n//\n// This directly[1] maps to all breadcrumb variants, telling them what shade to use for the base colour slots.\n// All breadcrumb variants will use the following based on the example above:\n// - Primary breadcrumbs will have their `--graupl-breadcrumb-color` property set to `--graupl-theme-active--primary--900` and `--graupl-breadcrumb-border-color` to `--graupl-theme-active--primary--700`,\n// - Secondary breadcrumbs will use the same shades for the secondary palette, and\n// - Tertiary breadcrumbs will use the same shades for the tertiary palette.\n//\n// You can use this to customize _all_ breadcrumb variants in the same way.\n//\n// For example, if you use the following map:\n// ```scss\n// $breadcrumb-theme-mappings: (\n// color: 500,\n// item-color: 500,\n// )\n// ```\n//\n// All breadcrumb variants will use the following:\n// - Primary breadcrumbs will have their `--graupl-breadcrumb-color` and `--graupl-breadcrumb-item-color` properties set to `--graupl-theme-active--primary--500`,\n// - Secondary breadcrumbs will have theirs set to `--graupl-theme-active--secondary--500`, and\n// - Tertiary breadcrumbs will have theirs set to `--graupl-theme-active--tertiary--500`.\n//\n// [1] `$breadcrumb-theme-mappings` gets parsed into a larger, more explicit map: `$breadcrumb-theme-map`.\n//\n// Using `$breadcrumb-theme-map`\n//\n// `$breadcrumb-theme-map` is a multi-level map of properties, colors, and shade values.\n//\n// e.g.\n// ```scss\n// $breadcrumb-theme-map: (\n// primary: (\n// item-border-color: (\n// color: secondary,\n// shade: 700\n// ),\n// ),\n// secondary: (\n// item-border-color: (\n// color: secondary,\n// shade: 500\n// ),\n// ),\n// tertiary: (\n// item-border-color: (\n// color: tertiary,\n// shade: 300\n// ),\n// ),\n// )\n// ```\n//\n// This directly maps to all breadcrumb variants, telling them what shade to use for said property.\n// You can use this to customize breadcrumb variants individually.\n//\n// @example\n// <ul class=\"breadcrumb\">\n// <li class=\"breadcrumb-item\">First item</li>\n// <li class=\"breadcrumb-item\">Second item</li>\n// <li class=\"breadcrumb-item\">Third item</li>\n// </ul>\n//\n// @example\n// <ol class=\"breadcrumb\">\n// <li class=\"breadcrumb-item\">Numbered item one</li>\n// <li class=\"breadcrumb-item\">Numbered item two</li>\n// <li class=\"breadcrumb-item\">Numbered item three</li>\n// </ol>\n\n@use \"../../defaults\" as root-defaults;\n@use \"../../mixins/animation\";\n@use \"../../mixins/layer\" as *;\n@use \"../../mixins/theme\" as theme;\n@use \"../../base/link/mixins\" as link-mixins;\n@use \"defaults\";\n@use \"sass:map\";\n@use \"variables\" as *;\n\n@include layer(component) {\n // .breadcrumb\n #{defaults.$breadcrumb-selector-base}#{defaults.$breadcrumb-selector} {\n display: flex;\n position: relative;\n margin: $breadcrumb-margin;\n padding: $breadcrumb-padding;\n border-width: $breadcrumb-border-width;\n border-style: $breadcrumb-border-style;\n border-radius: $breadcrumb-border-radius;\n list-style: none;\n gap: $breadcrumb-gap;\n\n // &.show\n &#{defaults.$breadcrumb-open-selector-base}#{defaults.$breadcrumb-open-selector} {\n // .breadcrumb-item:has(.breadcrumb-toggle)\n #{defaults.$breadcrumb-item-selector-base}#{defaults.$breadcrumb-item-selector}:has(\n .breadcrumb-toggle\n ) {\n display: $breadcrumb-item-hide-display;\n opacity: $breadcrumb-item-hide-opacity;\n }\n }\n\n // &.hide\n &#{defaults.$breadcrumb-close-selector-base}#{defaults.$breadcrumb-close-selector} {\n // .breadcrumb-item\n #{defaults.$breadcrumb-item-selector-base}#{defaults.$breadcrumb-item-selector}:has(\n #{defaults.$breadcrumb-toggle-selector-base}#{defaults.$breadcrumb-toggle-selector}\n ) {\n display: $breadcrumb-item-show-display;\n opacity: $breadcrumb-item-show-opacity;\n\n ~ #{defaults.$breadcrumb-item-selector-base}#{defaults.$breadcrumb-item-selector}:not(\n :last-child\n ) {\n display: $breadcrumb-item-hide-display;\n opacity: $breadcrumb-item-hide-opacity;\n }\n }\n }\n\n // &.transitioning\n &#{defaults.$breadcrumb-transition-selector-base}#{defaults.$breadcrumb-transition-selector} {\n // .breadcrumb-item:has(.breadcrumb-toggle)\n #{defaults.$breadcrumb-item-selector-base}#{defaults.$breadcrumb-item-selector}:has(\n #{defaults.$breadcrumb-toggle-selector-base}#{defaults.$breadcrumb-toggle-selector}\n ) {\n display: $breadcrumb-item-transitioning-display;\n opacity: $breadcrumb-item-transitioning-opacity;\n\n ~ #{defaults.$breadcrumb-item-selector-base}#{defaults.$breadcrumb-item-selector}:not(\n :last-child\n ) {\n display: $breadcrumb-item-transitioning-display;\n opacity: $breadcrumb-item-transitioning-opacity;\n }\n }\n }\n }\n\n // .breadcrumb-item\n #{defaults.$breadcrumb-item-selector-base}#{defaults.$breadcrumb-item-selector} {\n display: $breadcrumb-item-display;\n position: relative;\n padding: $breadcrumb-item-padding;\n border-width: $breadcrumb-item-border-width;\n border-style: $breadcrumb-item-border-style;\n border-radius: $breadcrumb-item-border-radius;\n opacity: $breadcrumb-item-opacity;\n gap: $breadcrumb-item-gap;\n\n &:not(:last-child)::#{defaults.$breadcrumb-item-separator-pseudo-selector} {\n content: $breadcrumb-item-separator;\n display: block;\n }\n\n &:has(\n #{defaults.$breadcrumb-toggle-selector-base}#{defaults.$breadcrumb-toggle-selector}\n ) {\n display: $breadcrumb-item-hide-display;\n opacity: $breadcrumb-item-hide-opacity;\n }\n }\n\n // .breadcrumb-link\n #{defaults.$breadcrumb-link-selector-base}#{defaults.$breadcrumb-link-selector} {\n padding: $breadcrumb-link-padding;\n border-width: $breadcrumb-link-border-width;\n border-style: $breadcrumb-link-border-style;\n border-radius: $breadcrumb-link-border-radius;\n }\n\n // .breadcrumb-toggle\n #{defaults.$breadcrumb-toggle-selector-base}#{defaults.$breadcrumb-toggle-selector} {\n @include link-mixins.apply-base;\n\n padding: $breadcrumb-toggle-padding;\n border-width: $breadcrumb-toggle-border-width;\n border-style: $breadcrumb-toggle-border-style;\n border-radius: $breadcrumb-toggle-border-radius;\n }\n}\n\n@include layer(theme) {\n // .breadcrumb\n #{defaults.$breadcrumb-selector-base}#{defaults.$breadcrumb-selector} {\n border-color: $breadcrumb-border-color;\n background: $breadcrumb-background;\n color: $breadcrumb-color;\n\n @if root-defaults.$themeable-components and defaults.$themeable {\n @include theme.generate-modifiers(\n defaults.$breadcrumb-theme-map,\n defaults.$breadcrumb-theme-selector-base,\n defaults.$breadcrumb-theme-selector-prefix,\n \"breadcrumb-\"\n );\n @include theme.generate-modifiers(\n defaults.$breadcrumb-theme-map,\n defaults.$breadcrumb-theme-selector-base,\n defaults.$breadcrumb-theme-selector-prefix,\n \"breadcrumb-\",\n \"\"\n );\n }\n }\n\n // .breadcrumb-item\n #{defaults.$breadcrumb-item-selector-base}#{defaults.$breadcrumb-item-selector} {\n border-color: $breadcrumb-item-border-color;\n background: $breadcrumb-item-background;\n color: $breadcrumb-item-color;\n }\n\n // .breadcrumb-link\n #{defaults.$breadcrumb-link-selector-base}#{defaults.$breadcrumb-link-selector} {\n border-color: $breadcrumb-link-border-color;\n background: $breadcrumb-link-background;\n color: $breadcrumb-link-color;\n }\n\n // .breadcrumb-toggle\n #{defaults.$breadcrumb-toggle-selector-base}#{defaults.$breadcrumb-toggle-selector} {\n @include link-mixins.apply-theme;\n\n border-color: $breadcrumb-toggle-border-color;\n background: $breadcrumb-toggle-background;\n color: $breadcrumb-toggle-color;\n }\n}\n","// @graupl/core breadcrumb component variables.\n//\n// These values are to be used to directly style components and provide a\n// cleaner way to reference custom properties.\n\n// Custom property defaults:\n// | Custom property | Default |\n// | ----------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |\n// | --graupl-breadcrumb-padding-x | var(--graupl-spacer-0) |\n// | --graupl-breadcrumb-padding-y | var(--graupl-spacer-0) |\n// | --graupl-breadcrumb-padding | var(--graupl-breadcrumb-padding-y) var(--graupl-breadcrumb-padding-x) |\n// | --graupl-breadcrumb-margin-x | var(--graupl-spacer-0) |\n// | --graupl-breadcrumb-margin-y | var(--graupl-spacer-0) |\n// | --graupl-breadcrumb-margin | var(--graupl-breadcrumb-margin-y) var(--graupl-breadcrumb-margin-x) |\n// | --graupl-breadcrumb-column-gap | var(--graupl-spacer-2) |\n// | --graupl-breadcrumb-row-gap | var(--graupl-spacer-2) |\n// | --graupl-breadcrumb-gap | var(--graupl-breadcrumb-column-gap) var(--graupl-breadcrumb-row-gap) |\n// | --graupl-breadcrumb-background | var(--graupl-background) |\n// | --graupl-breadcrumb-color | var(--graupl-color) |\n// | --graupl-breadcrumb-border-color | var(--graupl-breadcrumb-color) |\n// | --graupl-breadcrumb-border-top-left-radius | var(--graupl-border-top-left-radius) |\n// | --graupl-breadcrumb-border-top-right-radius | var(--graupl-border-top-right-radius) |\n// | --graupl-breadcrumb-border-bottom-left-radius | var(--graupl-border-bottom-left-radius) |\n// | --graupl-breadcrumb-border-bottom-right-radius | var(--graupl-border-bottom-right-radius) |\n// | --graupl-breadcrumb-border-radius | var(--graupl-breadcrumb-border-top-left-radius) var(--graupl-breadcrumb-border-top-right-radius) var(--graupl-breadcrumb-border-bottom-right-radius) var(--graupl-breadcrumb-border-bottom-left-radius) |\n// | --graupl-breadcrumb-border-top-width | 0 |\n// | --graupl-breadcrumb-border-right-width | 0 |\n// | --graupl-breadcrumb-border-bottom-width | 0 |\n// | --graupl-breadcrumb-border-left-width | 0 |\n// | --graupl-breadcrumb-border-width | var(--graupl-breadcrumb-border-top-width) var(--graupl-breadcrumb-border-right-width) var(--graupl-breadcrumb-border-bottom-width) var(--graupl-breadcrumb-border-left-width) |\n// | --graupl-breadcrumb-border-top-style | var(--graupl-border-top-style) |\n// | --graupl-breadcrumb-border-right-style | var(--graupl-border-right-style) |\n// | --graupl-breadcrumb-border-bottom-style | var(--graupl-border-bottom-style) |\n// | --graupl-breadcrumb-border-left-style | var(--graupl-border-left-style) |\n// | --graupl-breadcrumb-border-style | var(--graupl-breadcrumb-border-top-style) var(--graupl-breadcrumb-border-right-style) var(--graupl-breadcrumb-border-bottom-style) var(--graupl-breadcrumb-border-left-style) |\n// | --graupl-breadcrumb-item-show-display | flex |\n// | --graupl-breadcrumb-item-hide-display | none |\n// | --graupl-breadcrumb-item-transitioning-display | flex |\n// | --graupl-breadcrumb-item-display | flex |\n// | --graupl-breadcrumb-item-show-opacity | 1 |\n// | --graupl-breadcrumb-item-hide-opacity | 0 |\n// | --graupl-breadcrumb-item-transitioning-opacity | 0 |\n// | --graupl-breadcrumb-item-opacity | var(--graupl-breadcrumb-item-show-opacity) |\n// | --graupl-breadcrumb-item-transition-duration | var(--graupl-transition-duration-fast) |\n// | --graupl-breadcrumb-item-transition-timing-function | var(--graupl-transition-timing-function) |\n// | --graupl-breadcrumb-item-transition | opacity var(--graupl-breadcrumb-item-transition-duration) var(--graupl-breadcrumb-item-transition-timing-function) |\n// | --graupl-breadcrumb-item-transition-reduced-motion | none |\n// | --graupl-breadcrumb-item-padding-x | 0 |\n// | --graupl-breadcrumb-item-padding-y | 0 |\n// | --graupl-breadcrumb-item-padding | var(--graupl-breadcrumb-item-padding-y) var(--graupl-breadcrumb-item-padding-x) |\n// | --graupl-breadcrumb-item-column-gap | var(--graupl-breadcrumb-column-gap) |\n// | --graupl-breadcrumb-item-row-gap | var(--graupl-breadcrumb-row-gap) |\n// | --graupl-breadcrumb-item-gap | var(--graupl-breadcrumb-item-column-gap) var(--graupl-breadcrumb-item-row-gap) |\n// | --graupl-breadcrumb-item-color | var(--graupl-breadcrumb-color) |\n// | --graupl-breadcrumb-item-background | var(--graupl-breadcrumb-background) |\n// | --graupl-breadcrumb-item-visited-color | var(--graupl-breadcrumb-item-color) |\n// | --graupl-breadcrumb-item-focus-color | var(--graupl-breadcrumb-item-color) |\n// | --graupl-breadcrumb-item-hover-color | var(--graupl-breadcrumb-item-background) |\n// | --graupl-breadcrumb-item-active-color | var(--graupl-breadcrumb-item-hover-color) |\n// | --graupl-breadcrumb-item-disabled-color | var(--graupl-theme-active--primary--200) |\n// | --graupl-breadcrumb-item-visited-background | var(--graupl-breadcrumb-item-background) |\n// | --graupl-breadcrumb-item-focus-background | var(--graupl-breadcrumb-item-background) |\n// | --graupl-breadcrumb-item-hover-background | var(--graupl-breadcrumb-item-color) |\n// | --graupl-breadcrumb-item-active-background | var(--graupl-breadcrumb-item-hover-background) |\n// | --graupl-breadcrumb-item-disabled-background | var(--graupl-theme-active--primary--200) |\n// | --graupl-breadcrumb-item-border-color | var(--graupl-breadcrumb-item-color) |\n// | --graupl-breadcrumb-item-border-top-left-radius | var(--graupl-border-top-left-radius) |\n// | --graupl-breadcrumb-item-border-top-right-radius | var(--graupl-border-top-right-radius) |\n// | --graupl-breadcrumb-item-border-bottom-left-radius | var(--graupl-border-bottom-left-radius) |\n// | --graupl-breadcrumb-item-border-bottom-right-radius | var(--graupl-border-bottom-right-radius) |\n// | --graupl-breadcrumb-item-border-radius | var(--graupl-breadcrumb-item-border-top-left-radius) var(--graupl-breadcrumb-item-border-top-right-radius) var(--graupl-breadcrumb-item-border-bottom-right-radius) var(--graupl-breadcrumb-item-border-bottom-left-radius) |\n// | --graupl-breadcrumb-item-border-top-width | 0 |\n// | --graupl-breadcrumb-item-border-right-width | 0 |\n// | --graupl-breadcrumb-item-border-bottom-width | 0 |\n// | --graupl-breadcrumb-item-border-left-width | 0 |\n// | --graupl-breadcrumb-item-border-width | var(--graupl-breadcrumb-item-border-top-width) var(--graupl-breadcrumb-item-border-right-width) var(--graupl-breadcrumb-item-border-bottom-width) var(--graupl-breadcrumb-item-border-left-width) |\n// | --graupl-breadcrumb-item-border-top-style | var(--graupl-border-top-style) |\n// | --graupl-breadcrumb-item-border-right-style | var(--graupl-border-right-style) |\n// | --graupl-breadcrumb-item-border-bottom-style | var(--graupl-border-bottom-style) |\n// | --graupl-breadcrumb-item-border-left-style | var(--graupl-border-left-style) |\n// | --graupl-breadcrumb-item-border-style | var(--graupl-breadcrumb-item-border-top-style) var(--graupl-breadcrumb-item-border-right-style) var(--graupl-breadcrumb-item-border-bottom-style) var(--graupl-breadcrumb-item-border-left-style) |\n// | --graupl-breadcrumb-link-padding-x | 0 |\n// | --graupl-breadcrumb-link-padding-y | 0 |\n// | --graupl-breadcrumb-link-padding | var(--graupl-breadcrumb-link-padding-y) var(--graupl-breadcrumb-link-padding-x) |\n// | --graupl-breadcrumb-link-transition-duration | var(--graupl-transition-duration-fast) |\n// | --graupl-breadcrumb-link-transition-timing-function | var(--graupl-transition-timing-function) |\n// | --graupl-breadcrumb-link-transition | transform var(--graupl-breadcrumb-link-transition-duration) var(--graupl-breadcrumb-link-transition-timing-function) |\n// | --graupl-breadcrumb-link-transition-reduced-motion | none |\n// | --graupl-breadcrumb-link-transform | none |\n// | --graupl-breadcrumb-link-visited-transform | var(--graupl-breadcrumb-link-transform) |\n// | --graupl-breadcrumb-link-focus-transform | var(--graupl-breadcrumb-link-transform) |\n// | --graupl-breadcrumb-link-hover-transform | var(--graupl-breadcrumb-link-transform) |\n// | --graupl-breadcrumb-link-active-transform | none |\n// | --graupl-breadcrumb-link-disabled-transform | none |\n// | --graupl-breadcrumb-link-color | var(--graupl-breadcrumb-item-color) |\n// | --graupl-breadcrumb-link-background | var(--graupl-breadcrumb-item-background) |\n// | --graupl-breadcrumb-link-visited-color | var(--graupl-breadcrumb-link-color) |\n// | --graupl-breadcrumb-link-focus-color | var(--graupl-breadcrumb-link-color) |\n// | --graupl-breadcrumb-link-hover-color | var(--graupl-breadcrumb-link-background) |\n// | --graupl-breadcrumb-link-active-color | var(--graupl-breadcrumb-link-hover-color) |\n// | --graupl-breadcrumb-link-disabled-color | var(--graupl-theme-active--primary--200) |\n// | --graupl-breadcrumb-link-visited-background | var(--graupl-breadcrumb-link-background) |\n// | --graupl-breadcrumb-link-focus-background | var(--graupl-breadcrumb-link-background) |\n// | --graupl-breadcrumb-link-hover-background | var(--graupl-breadcrumb-link-color) |\n// | --graupl-breadcrumb-link-active-background | var(--graupl-breadcrumb-link-hover-background) |\n// | --graupl-breadcrumb-link-disabled-background | var(--graupl-theme-active--primary--200) |\n// | --graupl-breadcrumb-link-border-color | var(--graupl-breadcrumb-link-color) |\n// | --graupl-breadcrumb-link-border-top-left-radius | var(--graupl-border-top-left-radius) |\n// | --graupl-breadcrumb-link-border-top-right-radius | var(--graupl-border-top-right-radius) |\n// | --graupl-breadcrumb-link-border-bottom-left-radius | var(--graupl-border-bottom-left-radius) |\n// | --graupl-breadcrumb-link-border-bottom-right-radius | var(--graupl-border-bottom-right-radius) |\n// | --graupl-breadcrumb-link-border-radius | var(--graupl-breadcrumb-link-border-top-left-radius) var(--graupl-breadcrumb-link-border-top-right-radius) var(--graupl-breadcrumb-link-border-bottom-right-radius) var(--graupl-breadcrumb-link-border-bottom-left-radius) |\n// | --graupl-breadcrumb-link-border-top-width | 0 |\n// | --graupl-breadcrumb-link-border-right-width | 0 |\n// | --graupl-breadcrumb-link-border-bottom-width | 0 |\n// | --graupl-breadcrumb-link-border-left-width | 0 |\n// | --graupl-breadcrumb-link-border-width | var(--graupl-breadcrumb-link-border-top-width) var(--graupl-breadcrumb-link-border-right-width) var(--graupl-breadcrumb-link-border-bottom-width) var(--graupl-breadcrumb-link-border-left-width) |\n// | --graupl-breadcrumb-link-border-top-style | var(--graupl-border-top-style) |\n// | --graupl-breadcrumb-link-border-right-style | var(--graupl-border-right-style) |\n// | --graupl-breadcrumb-link-border-bottom-style | var(--graupl-border-bottom-style) |\n// | --graupl-breadcrumb-link-border-left-style | var(--graupl-border-left-style) |\n// | --graupl-breadcrumb-link-border-style | var(--graupl-breadcrumb-link-border-top-style) var(--graupl-breadcrumb-link-border-right-style) var(--graupl-breadcrumb-link-border-bottom-style) var(--graupl-breadcrumb-link-border-left-style) |\n// | --graupl-breadcrumb-toggle-padding-x | var(--graupl-breadcrumb-link-padding-x) |\n// | --graupl-breadcrumb-toggle-padding-y | var(--graupl-breadcrumb-link-padding-y) |\n// | --graupl-breadcrumb-toggle-padding | var(--graupl-breadcrumb-toggle-padding-y) var(--graupl-breadcrumb-toggle-padding-x) |\n// | --graupl-breadcrumb-toggle-transition-duration | var(--graupl-breadcrumb-link-transition-duration) |\n// | --graupl-breadcrumb-toggle-transition-timing-function | var(--graupl-breadcrumb-link-transition-timing-function) |\n// | --graupl-breadcrumb-toggle-transition | transform var(--graupl-breadcrumb-toggle-transition-duration) var(--graupl-breadcrumb-toggle-transition-timing-function) |\n// | --graupl-breadcrumb-toggle-transition-reduced-motion | var(--graupl-breadcrumb-link-transition-reduced-motion) |\n// | --graupl-breadcrumb-toggle-transform | var(--graupl-breadcrumb-link-transform) |\n// | --graupl-breadcrumb-toggle-visited-transform | var(--graupl-breadcrumb-toggle-transform) |\n// | --graupl-breadcrumb-toggle-focus-transform | var(--graupl-breadcrumb-toggle-transform) |\n// | --graupl-breadcrumb-toggle-hover-transform | var(--graupl-breadcrumb-toggle-transform) |\n// | --graupl-breadcrumb-toggle-active-transform | var(--graupl-breadcrumb-link-active-transform) |\n// | --graupl-breadcrumb-toggle-disabled-transform | var(--graupl-breadcrumb-link-disabled-transform) |\n// | --graupl-breadcrumb-toggle-color | var(--graupl-breadcrumb-link-color) |\n// | --graupl-breadcrumb-toggle-background | var(--graupl-breadcrumb-link-background) |\n// | --graupl-breadcrumb-toggle-visited-color | var(--graupl-breadcrumb-toggle-color) |\n// | --graupl-breadcrumb-toggle-focus-color | var(--graupl-breadcrumb-toggle-color) |\n// | --graupl-breadcrumb-toggle-hover-color | var(--graupl-breadcrumb-toggle-background) |\n// | --graupl-breadcrumb-toggle-active-color | var(--graupl-breadcrumb-toggle-hover-color) |\n// | --graupl-breadcrumb-toggle-disabled-color | var(--graupl-theme-active--primary--200) |\n// | --graupl-breadcrumb-toggle-visited-background | var(--graupl-breadcrumb-toggle-background) |\n// | --graupl-breadcrumb-toggle-focus-background | var(--graupl-breadcrumb-toggle-background) |\n// | --graupl-breadcrumb-toggle-hover-background | var(--graupl-breadcrumb-toggle-color) |\n// | --graupl-breadcrumb-toggle-active-background | var(--graupl-breadcrumb-toggle-hover-background) |\n// | --graupl-breadcrumb-toggle-disabled-background | var(--graupl-theme-active--primary--200) |\n// | --graupl-breadcrumb-toggle-border-color | var(--graupl-breadcrumb-toggle-color) |\n// | --graupl-breadcrumb-toggle-border-top-left-radius | var(--graupl-breadcrumb-link-border-top-left-radius) |\n// | --graupl-breadcrumb-toggle-border-top-right-radius | var(--graupl-breadcrumb-link-border-top-right-radius) |\n// | --graupl-breadcrumb-toggle-border-bottom-left-radius | var(--graupl-breadcrumb-link-border-bottom-left-radius) |\n// | --graupl-breadcrumb-toggle-border-bottom-right-radius | var(--graupl-breadcrumb-link-border-bottom-right-radius) |\n// | --graupl-breadcrumb-toggle-border-radius | var(--graupl-breadcrumb-toggle-border-top-left-radius) var(--graupl-breadcrumb-toggle-border-top-right-radius) var(--graupl-breadcrumb-toggle-border-bottom-right-radius) var(--graupl-breadcrumb-toggle-border-bottom-left-radius) |\n// | --graupl-breadcrumb-toggle-border-top-width | var(--graupl-breadcrumb-link-border-top-width) |\n// | --graupl-breadcrumb-toggle-border-right-width | var(--graupl-breadcrumb-link-border-right-width) |\n// | --graupl-breadcrumb-toggle-border-bottom-width | var(--graupl-breadcrumb-link-border-bottom-width) |\n// | --graupl-breadcrumb-toggle-border-left-width | var(--graupl-breadcrumb-link-border-left-width) |\n// | --graupl-breadcrumb-toggle-border-width | var(--graupl-breadcrumb-toggle-border-top-width) var(--graupl-breadcrumb-toggle-border-right-width) var(--graupl-breadcrumb-toggle-border-bottom-width) var(--graupl-breadcrumb-toggle-border-left-width) |\n// | --graupl-breadcrumb-toggle-border-top-style | var(--graupl-breadcrumb-link-border-top-style) |\n// | --graupl-breadcrumb-toggle-border-right-style | var(--graupl-breadcrumb-link-border-right-style) |\n// | --graupl-breadcrumb-toggle-border-bottom-style | var(--graupl-breadcrumb-link-border-bottom-style) |\n// | --graupl-breadcrumb-toggle-border-left-style | var(--graupl-breadcrumb-link-border-left-style) |\n// | --graupl-breadcrumb-toggle-border-style | var(--graupl-breadcrumb-toggle-border-top-style) var(--graupl-breadcrumb-toggle-border-right-style) var(--graupl-breadcrumb-toggle-border-bottom-style) var(--graupl-breadcrumb-toggle-border-left-style) |\n// | --graupl-breadcrumb-item-separator | \"'/'\" |\n\n@use \"../../defaults\" as root-defaults;\n@use \"../../theme/color/variables\" as color;\n@use \"../../functions/theme\";\n@use \"../../variables\" as root-variables;\n@use \"defaults\";\n@use \"sass:map\";\n\n// Breadcrumb properties.\n// --graupl-breadcrumb-padding-x\n$breadcrumb-padding-x: var(\n --#{root-defaults.$prefix}breadcrumb-padding-x,\n #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-breadcrumb-padding-y\n$breadcrumb-padding-y: var(\n --#{root-defaults.$prefix}breadcrumb-padding-y,\n #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-breadcrumb-padding\n$breadcrumb-padding: var(\n --#{root-defaults.$prefix}breadcrumb-padding,\n #{$breadcrumb-padding-y} #{$breadcrumb-padding-x}\n);\n\n// --graupl-breadcrumb-margin-x\n$breadcrumb-margin-x: var(\n --#{root-defaults.$prefix}breadcrumb-margin-x,\n #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-breadcrumb-margin-y\n$breadcrumb-margin-y: var(\n --#{root-defaults.$prefix}breadcrumb-margin-y,\n #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-breadcrumb-margin\n$breadcrumb-margin: var(\n --#{root-defaults.$prefix}breadcrumb-margin,\n #{$breadcrumb-margin-y} #{$breadcrumb-margin-x}\n);\n\n// Breadcrumb gap properties.\n// --graupl-breadcrumb-column-gap\n$breadcrumb-column-gap: var(\n --#{root-defaults.$prefix}breadcrumb-column-gap,\n #{map.get(root-variables.$spacers, 2)}\n);\n\n// --graupl-breadcrumb-row-gap\n$breadcrumb-row-gap: var(\n --#{root-defaults.$prefix}breadcrumb-row-gap,\n #{map.get(root-variables.$spacers, 2)}\n);\n\n// --graupl-breadcrumb-gap\n$breadcrumb-gap: var(\n --#{root-defaults.$prefix}breadcrumb-gap,\n #{$breadcrumb-column-gap} #{$breadcrumb-row-gap}\n);\n\n// Breadcrumb color properties.\n// --graupl-breadcrumb-background\n$breadcrumb-background: var(\n --#{root-defaults.$prefix}breadcrumb-background,\n #{color.$background}\n);\n\n// --graupl-breadcrumb-color\n$breadcrumb-color: var(\n --#{root-defaults.$prefix}breadcrumb-color,\n #{color.$color}\n);\n\n// Breadcrumb border properties.\n// --graupl-breadcrumb-border-color\n$breadcrumb-border-color: var(\n --#{root-defaults.$prefix}breadcrumb-border-color,\n #{$breadcrumb-color}\n);\n\n// --graupl-breadcrumb-border-top-left-radius\n$breadcrumb-border-top-left-radius: var(\n --#{root-defaults.$prefix}breadcrumb-border-top-left-radius,\n #{root-variables.$border-top-left-radius}\n);\n\n// --graupl-breadcrumb-border-top-right-radius\n$breadcrumb-border-top-right-radius: var(\n --#{root-defaults.$prefix}breadcrumb-border-top-right-radius,\n #{root-variables.$border-top-right-radius}\n);\n\n// --graupl-breadcrumb-border-bottom-left-radius\n$breadcrumb-border-bottom-left-radius: var(\n --#{root-defaults.$prefix}breadcrumb-border-bottom-left-radius,\n #{root-variables.$border-bottom-left-radius}\n);\n\n// --graupl-breadcrumb-border-bottom-right-radius\n$breadcrumb-border-bottom-right-radius: var(\n --#{root-defaults.$prefix}breadcrumb-border-bottom-right-radius,\n #{root-variables.$border-bottom-right-radius}\n);\n\n// --graupl-breadcrumb-border-radius\n$breadcrumb-border-radius: var(\n --#{root-defaults.$prefix}breadcrumb-border-radius,\n #{$breadcrumb-border-top-left-radius} #{$breadcrumb-border-top-right-radius}\n #{$breadcrumb-border-bottom-right-radius}\n #{$breadcrumb-border-bottom-left-radius}\n);\n\n// --graupl-breadcrumb-border-top-width\n$breadcrumb-border-top-width: var(\n --#{root-defaults.$prefix}breadcrumb-border-top-width,\n 0\n);\n\n// --graupl-breadcrumb-border-right-width\n$breadcrumb-border-right-width: var(\n --#{root-defaults.$prefix}breadcrumb-border-right-width,\n 0\n);\n\n// --graupl-breadcrumb-border-bottom-width\n$breadcrumb-border-bottom-width: var(\n --#{root-defaults.$prefix}breadcrumb-border-bottom-width,\n 0\n);\n\n// --graupl-breadcrumb-border-left-width\n$breadcrumb-border-left-width: var(\n --#{root-defaults.$prefix}breadcrumb-border-left-width,\n 0\n);\n\n// --graupl-breadcrumb-border-width\n$breadcrumb-border-width: var(\n --#{root-defaults.$prefix}breadcrumb-border-width,\n #{$breadcrumb-border-top-width} #{$breadcrumb-border-right-width}\n #{$breadcrumb-border-bottom-width} #{$breadcrumb-border-left-width}\n);\n\n// --graupl-breadcrumb-border-top-style\n$breadcrumb-border-top-style: var(\n --#{root-defaults.$prefix}breadcrumb-border-top-style,\n #{root-variables.$border-top-style}\n);\n\n// --graupl-breadcrumb-border-right-style\n$breadcrumb-border-right-style: var(\n --#{root-defaults.$prefix}breadcrumb-border-right-style,\n #{root-variables.$border-right-style}\n);\n\n// --graupl-breadcrumb-border-bottom-style\n$breadcrumb-border-bottom-style: var(\n --#{root-defaults.$prefix}breadcrumb-border-bottom-style,\n #{root-variables.$border-bottom-style}\n);\n\n// --graupl-breadcrumb-border-left-style\n$breadcrumb-border-left-style: var(\n --#{root-defaults.$prefix}breadcrumb-border-left-style,\n #{root-variables.$border-left-style}\n);\n\n// --graupl-breadcrumb-border-style\n$breadcrumb-border-style: var(\n --#{root-defaults.$prefix}breadcrumb-border-style,\n #{$breadcrumb-border-top-style} #{$breadcrumb-border-right-style}\n #{$breadcrumb-border-bottom-style} #{$breadcrumb-border-left-style}\n);\n\n// --graupl-breadcrumb-item-show-display\n$breadcrumb-item-show-display: var(\n --#{root-defaults.$prefix}breadcrumb-item-show-display,\n #{defaults.$breadcrumb-item-show-display}\n);\n\n// --graupl-breadcrumb-item-hide-display\n$breadcrumb-item-hide-display: var(\n --#{root-defaults.$prefix}breadcrumb-item-hide-display,\n #{defaults.$breadcrumb-item-hide-display}\n);\n\n// --graupl-breadcrumb-item-transitioning-display\n$breadcrumb-item-transitioning-display: var(\n --#{root-defaults.$prefix}breadcrumb-item-transitioning-display,\n #{defaults.$breadcrumb-item-transitioning-display}\n);\n\n// --graupl-breadcrumb-item-display\n$breadcrumb-item-display: var(\n --#{root-defaults.$prefix}breadcrumb-item-display,\n #{defaults.$breadcrumb-item-show-display}\n);\n\n// --graupl-breadcrumb-item-show-opacity\n$breadcrumb-item-show-opacity: var(\n --#{root-defaults.$prefix}breadcrumb-item-show-opacity,\n #{defaults.$breadcrumb-item-show-opacity}\n);\n\n// --graupl-breadcrumb-item-hide-opacity\n$breadcrumb-item-hide-opacity: var(\n --#{root-defaults.$prefix}breadcrumb-item-hide-opacity,\n #{defaults.$breadcrumb-item-hide-opacity}\n);\n\n// --graupl-breadcrumb-item-transitioning-opacity\n$breadcrumb-item-transitioning-opacity: var(\n --#{root-defaults.$prefix}breadcrumb-item-transitioning-opacity,\n #{defaults.$breadcrumb-item-transitioning-opacity}\n);\n\n// --graupl-breadcrumb-item-opacity\n$breadcrumb-item-opacity: var(\n --#{root-defaults.$prefix}breadcrumb-item-opacity,\n #{$breadcrumb-item-show-opacity}\n);\n\n// --graupl-breadcrumb-item-transition-duration\n$breadcrumb-item-transition-duration: var(\n --#{root-defaults.$prefix}breadcrumb-item-transition-duration,\n #{map.get(root-variables.$transition-durations, fast)}\n);\n\n// --graupl-breadcrumb-item-transition-timing-function\n$breadcrumb-item-transition-timing-function: var(\n --#{root-defaults.$prefix}breadcrumb-item-transition-timing-function,\n #{root-variables.$transition-timing-function}\n);\n\n// --graupl-breadcrumb-item-transition\n$breadcrumb-item-transition: var(\n --#{root-defaults.$prefix}breadcrumb-item-transition,\n opacity #{$breadcrumb-item-transition-duration}\n #{$breadcrumb-item-transition-timing-function}\n);\n\n// --graupl-breadcrumb-item-transition-reduced-motion\n$breadcrumb-item-transition-reduced-motion: var(\n --#{root-defaults.$prefix}breadcrumb-item-transition-reduced-motion,\n none\n);\n\n// --graupl-breadcrumb-item-padding-x\n$breadcrumb-item-padding-x: var(\n --#{root-defaults.$prefix}breadcrumb-item-padding-x,\n 0\n);\n\n// --graupl-breadcrumb-item-padding-y\n$breadcrumb-item-padding-y: var(\n --#{root-defaults.$prefix}breadcrumb-item-padding-y,\n 0\n);\n\n// --graupl-breadcrumb-item-padding\n$breadcrumb-item-padding: var(\n --#{root-defaults.$prefix}breadcrumb-item-padding,\n #{$breadcrumb-item-padding-y} #{$breadcrumb-item-padding-x}\n);\n\n// --graupl-breadcrumb-item-column-gap\n$breadcrumb-item-column-gap: var(\n --#{root-defaults.$prefix}breadcrumb-item-column-gap,\n #{$breadcrumb-column-gap}\n);\n\n// --graupl-breadcrumb-item-row-gap\n$breadcrumb-item-row-gap: var(\n --#{root-defaults.$prefix}breadcrumb-item-row-gap,\n #{$breadcrumb-row-gap}\n);\n\n// --graupl-breadcrumb-item-gap\n$breadcrumb-item-gap: var(\n --#{root-defaults.$prefix}breadcrumb-item-gap,\n #{$breadcrumb-item-column-gap} #{$breadcrumb-item-row-gap}\n);\n\n// --graupl-breadcrumb-item-color\n$breadcrumb-item-color: var(\n --#{root-defaults.$prefix}breadcrumb-item-color,\n #{$breadcrumb-color}\n);\n\n// --graupl-breadcrumb-item-background\n$breadcrumb-item-background: var(\n --#{root-defaults.$prefix}breadcrumb-item-background,\n #{$breadcrumb-background}\n);\n\n// --graupl-breadcrumb-item-visited-color\n$breadcrumb-item-visited-color: var(\n --#{root-defaults.$prefix}breadcrumb-item-visited-color,\n #{$breadcrumb-item-color}\n);\n\n// --graupl-breadcrumb-item-focus-color\n$breadcrumb-item-focus-color: var(\n --#{root-defaults.$prefix}breadcrumb-item-focus-color,\n #{$breadcrumb-item-color}\n);\n\n// --graupl-breadcrumb-item-hover-color\n$breadcrumb-item-hover-color: var(\n --#{root-defaults.$prefix}breadcrumb-item-hover-color,\n #{$breadcrumb-item-background}\n);\n\n// --graupl-breadcrumb-item-active-color\n$breadcrumb-item-active-color: var(\n --#{root-defaults.$prefix}breadcrumb-item-active-color,\n #{$breadcrumb-item-hover-color}\n);\n\n// --graupl-breadcrumb-item-disabled-color\n$breadcrumb-item-disabled-color: var(\n --#{root-defaults.$prefix}breadcrumb-item-disabled-color,\n #{theme.get(primary, 200)}\n);\n$breadcrumb-item-color-states: (\n default: $breadcrumb-item-color,\n visited: $breadcrumb-item-visited-color,\n focus: $breadcrumb-item-focus-color,\n hover: $breadcrumb-item-hover-color,\n active: $breadcrumb-item-active-color,\n disabled: $breadcrumb-item-disabled-color,\n);\n\n// --graupl-breadcrumb-item-visited-background\n$breadcrumb-item-visited-background: var(\n --#{root-defaults.$prefix}breadcrumb-item-visited-background,\n #{$breadcrumb-item-background}\n);\n\n// --graupl-breadcrumb-item-focus-background\n$breadcrumb-item-focus-background: var(\n --#{root-defaults.$prefix}breadcrumb-item-focus-background,\n #{$breadcrumb-item-background}\n);\n\n// --graupl-breadcrumb-item-hover-background\n$breadcrumb-item-hover-background: var(\n --#{root-defaults.$prefix}breadcrumb-item-hover-background,\n #{$breadcrumb-item-color}\n);\n\n// --graupl-breadcrumb-item-active-background\n$breadcrumb-item-active-background: var(\n --#{root-defaults.$prefix}breadcrumb-item-active-background,\n #{$breadcrumb-item-hover-background}\n);\n\n// --graupl-breadcrumb-item-disabled-background\n$breadcrumb-item-disabled-background: var(\n --#{root-defaults.$prefix}breadcrumb-item-disabled-background,\n #{theme.get(primary, 200)}\n);\n$breadcrumb-item-background-states: (\n default: $breadcrumb-item-background,\n visited: $breadcrumb-item-visited-background,\n focus: $breadcrumb-item-focus-background,\n hover: $breadcrumb-item-hover-background,\n active: $breadcrumb-item-active-background,\n disabled: $breadcrumb-item-disabled-background,\n);\n\n// Breadcrumb item border properties.\n// --graupl-breadcrumb-item-border-color\n$breadcrumb-item-border-color: var(\n --#{root-defaults.$prefix}breadcrumb-item-border-color,\n #{$breadcrumb-item-color}\n);\n\n// --graupl-breadcrumb-item-border-top-left-radius\n$breadcrumb-item-border-top-left-radius: var(\n --#{root-defaults.$prefix}breadcrumb-item-border-top-left-radius,\n #{root-variables.$border-top-left-radius}\n);\n\n// --graupl-breadcrumb-item-border-top-right-radius\n$breadcrumb-item-border-top-right-radius: var(\n --#{root-defaults.$prefix}breadcrumb-item-border-top-right-radius,\n #{root-variables.$border-top-right-radius}\n);\n\n// --graupl-breadcrumb-item-border-bottom-left-radius\n$breadcrumb-item-border-bottom-left-radius: var(\n --#{root-defaults.$prefix}breadcrumb-item-border-bottom-left-radius,\n #{root-variables.$border-bottom-left-radius}\n);\n\n// --graupl-breadcrumb-item-border-bottom-right-radius\n$breadcrumb-item-border-bottom-right-radius: var(\n --#{root-defaults.$prefix}breadcrumb-item-border-bottom-right-radius,\n #{root-variables.$border-bottom-right-radius}\n);\n\n// --graupl-breadcrumb-item-border-radius\n$breadcrumb-item-border-radius: var(\n --#{root-defaults.$prefix}breadcrumb-item-border-radius,\n #{$breadcrumb-item-border-top-left-radius}\n #{$breadcrumb-item-border-top-right-radius}\n #{$breadcrumb-item-border-bottom-right-radius}\n #{$breadcrumb-item-border-bottom-left-radius}\n);\n\n// --graupl-breadcrumb-item-border-top-width\n$breadcrumb-item-border-top-width: var(\n --#{root-defaults.$prefix}breadcrumb-item-border-top-width,\n 0\n);\n\n// --graupl-breadcrumb-item-border-right-width\n$breadcrumb-item-border-right-width: var(\n --#{root-defaults.$prefix}breadcrumb-item-border-right-width,\n 0\n);\n\n// --graupl-breadcrumb-item-border-bottom-width\n$breadcrumb-item-border-bottom-width: var(\n --#{root-defaults.$prefix}breadcrumb-item-border-bottom-width,\n 0\n);\n\n// --graupl-breadcrumb-item-border-left-width\n$breadcrumb-item-border-left-width: var(\n --#{root-defaults.$prefix}breadcrumb-item-border-left-width,\n 0\n);\n\n// --graupl-breadcrumb-item-border-width\n$breadcrumb-item-border-width: var(\n --#{root-defaults.$prefix}breadcrumb-item-border-width,\n #{$breadcrumb-item-border-top-width} #{$breadcrumb-item-border-right-width}\n #{$breadcrumb-item-border-bottom-width}\n #{$breadcrumb-item-border-left-width}\n);\n\n// --graupl-breadcrumb-item-border-top-style\n$breadcrumb-item-border-top-style: var(\n --#{root-defaults.$prefix}breadcrumb-item-border-top-style,\n #{root-variables.$border-top-style}\n);\n\n// --graupl-breadcrumb-item-border-right-style\n$breadcrumb-item-border-right-style: var(\n --#{root-defaults.$prefix}breadcrumb-item-border-right-style,\n #{root-variables.$border-right-style}\n);\n\n// --graupl-breadcrumb-item-border-bottom-style\n$breadcrumb-item-border-bottom-style: var(\n --#{root-defaults.$prefix}breadcrumb-item-border-bottom-style,\n #{root-variables.$border-bottom-style}\n);\n\n// --graupl-breadcrumb-item-border-left-style\n$breadcrumb-item-border-left-style: var(\n --#{root-defaults.$prefix}breadcrumb-item-border-left-style,\n #{root-variables.$border-left-style}\n);\n\n// --graupl-breadcrumb-item-border-style\n$breadcrumb-item-border-style: var(\n --#{root-defaults.$prefix}breadcrumb-item-border-style,\n #{$breadcrumb-item-border-top-style} #{$breadcrumb-item-border-right-style}\n #{$breadcrumb-item-border-bottom-style}\n #{$breadcrumb-item-border-left-style}\n);\n\n// --graupl-breadcrumb-link-padding-x\n$breadcrumb-link-padding-x: var(\n --#{root-defaults.$prefix}breadcrumb-link-padding-x,\n 0\n);\n\n// --graupl-breadcrumb-link-padding-y\n$breadcrumb-link-padding-y: var(\n --#{root-defaults.$prefix}breadcrumb-link-padding-y,\n 0\n);\n\n// --graupl-breadcrumb-link-padding\n$breadcrumb-link-padding: var(\n --#{root-defaults.$prefix}breadcrumb-link-padding,\n #{$breadcrumb-link-padding-y} #{$breadcrumb-link-padding-x}\n);\n\n// --graupl-breadcrumb-link-transition-duration\n$breadcrumb-link-transition-duration: var(\n --#{root-defaults.$prefix}breadcrumb-link-transition-duration,\n #{map.get(root-variables.$transition-durations, fast)}\n);\n\n// --graupl-breadcrumb-link-transition-timing-function\n$breadcrumb-link-transition-timing-function: var(\n --#{root-defaults.$prefix}breadcrumb-link-transition-timing-function,\n #{root-variables.$transition-timing-function}\n);\n\n// --graupl-breadcrumb-link-transition\n$breadcrumb-link-transition: var(\n --#{root-defaults.$prefix}breadcrumb-link-transition,\n transform #{$breadcrumb-link-transition-duration}\n #{$breadcrumb-link-transition-timing-function}\n);\n\n// --graupl-breadcrumb-link-transition-reduced-motion\n$breadcrumb-link-transition-reduced-motion: var(\n --#{root-defaults.$prefix}breadcrumb-link-transition-reduced-motion,\n none\n);\n\n// --graupl-breadcrumb-link-transform\n$breadcrumb-link-transform: var(\n --#{root-defaults.$prefix}breadcrumb-link-transform,\n #{defaults.$breadcrumb-link-initial-transform}\n);\n\n// --graupl-breadcrumb-link-visited-transform\n$breadcrumb-link-visited-transform: var(\n --#{root-defaults.$prefix}breadcrumb-link-visited-transform,\n #{$breadcrumb-link-transform}\n);\n\n// --graupl-breadcrumb-link-focus-transform\n$breadcrumb-link-focus-transform: var(\n --#{root-defaults.$prefix}breadcrumb-link-focus-transform,\n #{$breadcrumb-link-transform}\n);\n\n// --graupl-breadcrumb-link-hover-transform\n$breadcrumb-link-hover-transform: var(\n --#{root-defaults.$prefix}breadcrumb-link-hover-transform,\n #{$breadcrumb-link-transform}\n);\n\n// --graupl-breadcrumb-link-active-transform\n$breadcrumb-link-active-transform: var(\n --#{root-defaults.$prefix}breadcrumb-link-active-transform,\n #{defaults.$breadcrumb-link-final-transform}\n);\n\n// --graupl-breadcrumb-link-disabled-transform\n$breadcrumb-link-disabled-transform: var(\n --#{root-defaults.$prefix}breadcrumb-link-disabled-transform,\n #{defaults.$breadcrumb-link-disabled-transform}\n);\n$breadcrumb-link-transform-states: (\n _default: $breadcrumb-link-transform,\n visited: $breadcrumb-link-visited-transform,\n focus: $breadcrumb-link-focus-transform,\n hover: $breadcrumb-link-hover-transform,\n active: $breadcrumb-link-active-transform,\n disabled: $breadcrumb-link-disabled-transform,\n);\n\n// --graupl-breadcrumb-link-color\n$breadcrumb-link-color: var(\n --#{root-defaults.$prefix}breadcrumb-link-color,\n #{$breadcrumb-item-color}\n);\n\n// --graupl-breadcrumb-link-background\n$breadcrumb-link-background: var(\n --#{root-defaults.$prefix}breadcrumb-link-background,\n #{$breadcrumb-item-background}\n);\n\n// --graupl-breadcrumb-link-visited-color\n$breadcrumb-link-visited-color: var(\n --#{root-defaults.$prefix}breadcrumb-link-visited-color,\n #{$breadcrumb-link-color}\n);\n\n// --graupl-breadcrumb-link-focus-color\n$breadcrumb-link-focus-color: var(\n --#{root-defaults.$prefix}breadcrumb-link-focus-color,\n #{$breadcrumb-link-color}\n);\n\n// --graupl-breadcrumb-link-hover-color\n$breadcrumb-link-hover-color: var(\n --#{root-defaults.$prefix}breadcrumb-link-hover-color,\n #{$breadcrumb-link-background}\n);\n\n// --graupl-breadcrumb-link-active-color\n$breadcrumb-link-active-color: var(\n --#{root-defaults.$prefix}breadcrumb-link-active-color,\n #{$breadcrumb-link-hover-color}\n);\n\n// --graupl-breadcrumb-link-disabled-color\n$breadcrumb-link-disabled-color: var(\n --#{root-defaults.$prefix}breadcrumb-link-disabled-color,\n #{theme.get(primary, 200)}\n);\n$breadcrumb-link-color-states: (\n default: $breadcrumb-link-color,\n visited: $breadcrumb-link-visited-color,\n focus: $breadcrumb-link-focus-color,\n hover: $breadcrumb-link-hover-color,\n active: $breadcrumb-link-active-color,\n disabled: $breadcrumb-link-disabled-color,\n);\n\n// --graupl-breadcrumb-link-visited-background\n$breadcrumb-link-visited-background: var(\n --#{root-defaults.$prefix}breadcrumb-link-visited-background,\n #{$breadcrumb-link-background}\n);\n\n// --graupl-breadcrumb-link-focus-background\n$breadcrumb-link-focus-background: var(\n --#{root-defaults.$prefix}breadcrumb-link-focus-background,\n #{$breadcrumb-link-background}\n);\n\n// --graupl-breadcrumb-link-hover-background\n$breadcrumb-link-hover-background: var(\n --#{root-defaults.$prefix}breadcrumb-link-hover-background,\n #{$breadcrumb-link-color}\n);\n\n// --graupl-breadcrumb-link-active-background\n$breadcrumb-link-active-background: var(\n --#{root-defaults.$prefix}breadcrumb-link-active-background,\n #{$breadcrumb-link-hover-background}\n);\n\n// --graupl-breadcrumb-link-disabled-background\n$breadcrumb-link-disabled-background: var(\n --#{root-defaults.$prefix}breadcrumb-link-disabled-background,\n #{theme.get(primary, 200)}\n);\n$breadcrumb-link-background-states: (\n default: $breadcrumb-link-background,\n visited: $breadcrumb-link-visited-background,\n focus: $breadcrumb-link-focus-background,\n hover: $breadcrumb-link-hover-background,\n active: $breadcrumb-link-active-background,\n disabled: $breadcrumb-link-disabled-background,\n);\n\n// --graupl-breadcrumb-link-border-color\n$breadcrumb-link-border-color: var(\n --#{root-defaults.$prefix}breadcrumb-link-border-color,\n #{$breadcrumb-link-color}\n);\n\n// --graupl-breadcrumb-link-border-top-left-radius\n$breadcrumb-link-border-top-left-radius: var(\n --#{root-defaults.$prefix}breadcrumb-link-border-top-left-radius,\n #{root-variables.$border-top-left-radius}\n);\n\n// --graupl-breadcrumb-link-border-top-right-radius\n$breadcrumb-link-border-top-right-radius: var(\n --#{root-defaults.$prefix}breadcrumb-link-border-top-right-radius,\n #{root-variables.$border-top-right-radius}\n);\n\n// --graupl-breadcrumb-link-border-bottom-left-radius\n$breadcrumb-link-border-bottom-left-radius: var(\n --#{root-defaults.$prefix}breadcrumb-link-border-bottom-left-radius,\n #{root-variables.$border-bottom-left-radius}\n);\n\n// --graupl-breadcrumb-link-border-bottom-right-radius\n$breadcrumb-link-border-bottom-right-radius: var(\n --#{root-defaults.$prefix}breadcrumb-link-border-bottom-right-radius,\n #{root-variables.$border-bottom-right-radius}\n);\n\n// --graupl-breadcrumb-link-border-radius\n$breadcrumb-link-border-radius: var(\n --#{root-defaults.$prefix}breadcrumb-link-border-radius,\n #{$breadcrumb-link-border-top-left-radius}\n #{$breadcrumb-link-border-top-right-radius}\n #{$breadcrumb-link-border-bottom-right-radius}\n #{$breadcrumb-link-border-bottom-left-radius}\n);\n\n// --graupl-breadcrumb-link-border-top-width\n$breadcrumb-link-border-top-width: var(\n --#{root-defaults.$prefix}breadcrumb-link-border-top-width,\n 0\n);\n\n// --graupl-breadcrumb-link-border-right-width\n$breadcrumb-link-border-right-width: var(\n --#{root-defaults.$prefix}breadcrumb-link-border-right-width,\n 0\n);\n\n// --graupl-breadcrumb-link-border-bottom-width\n$breadcrumb-link-border-bottom-width: var(\n --#{root-defaults.$prefix}breadcrumb-link-border-bottom-width,\n 0\n);\n\n// --graupl-breadcrumb-link-border-left-width\n$breadcrumb-link-border-left-width: var(\n --#{root-defaults.$prefix}breadcrumb-link-border-left-width,\n 0\n);\n\n// --graupl-breadcrumb-link-border-width\n$breadcrumb-link-border-width: var(\n --#{root-defaults.$prefix}breadcrumb-link-border-width,\n #{$breadcrumb-link-border-top-width} #{$breadcrumb-link-border-right-width}\n #{$breadcrumb-link-border-bottom-width}\n #{$breadcrumb-link-border-left-width}\n);\n\n// --graupl-breadcrumb-link-border-top-style\n$breadcrumb-link-border-top-style: var(\n --#{root-defaults.$prefix}breadcrumb-link-border-top-style,\n #{root-variables.$border-top-style}\n);\n\n// --graupl-breadcrumb-link-border-right-style\n$breadcrumb-link-border-right-style: var(\n --#{root-defaults.$prefix}breadcrumb-link-border-right-style,\n #{root-variables.$border-right-style}\n);\n\n// --graupl-breadcrumb-link-border-bottom-style\n$breadcrumb-link-border-bottom-style: var(\n --#{root-defaults.$prefix}breadcrumb-link-border-bottom-style,\n #{root-variables.$border-bottom-style}\n);\n\n// --graupl-breadcrumb-link-border-left-style\n$breadcrumb-link-border-left-style: var(\n --#{root-defaults.$prefix}breadcrumb-link-border-left-style,\n #{root-variables.$border-left-style}\n);\n\n// --graupl-breadcrumb-link-border-style\n$breadcrumb-link-border-style: var(\n --#{root-defaults.$prefix}breadcrumb-link-border-style,\n #{$breadcrumb-link-border-top-style} #{$breadcrumb-link-border-right-style}\n #{$breadcrumb-link-border-bottom-style}\n #{$breadcrumb-link-border-left-style}\n);\n\n// --graupl-breadcrumb-toggle-padding-x\n$breadcrumb-toggle-padding-x: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-padding-x,\n #{$breadcrumb-link-padding-x}\n);\n\n// --graupl-breadcrumb-toggle-padding-y\n$breadcrumb-toggle-padding-y: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-padding-y,\n #{$breadcrumb-link-padding-y}\n);\n\n// --graupl-breadcrumb-toggle-padding\n$breadcrumb-toggle-padding: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-padding,\n #{$breadcrumb-toggle-padding-y} #{$breadcrumb-toggle-padding-x}\n);\n\n// --graupl-breadcrumb-toggle-transition-duration\n$breadcrumb-toggle-transition-duration: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-transition-duration,\n #{$breadcrumb-link-transition-duration}\n);\n\n// --graupl-breadcrumb-toggle-transition-timing-function\n$breadcrumb-toggle-transition-timing-function: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-transition-timing-function,\n #{$breadcrumb-link-transition-timing-function}\n);\n\n// --graupl-breadcrumb-toggle-transition\n$breadcrumb-toggle-transition: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-transition,\n transform #{$breadcrumb-toggle-transition-duration}\n #{$breadcrumb-toggle-transition-timing-function}\n);\n\n// --graupl-breadcrumb-toggle-transition-reduced-motion\n$breadcrumb-toggle-transition-reduced-motion: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-transition-reduced-motion,\n #{$breadcrumb-link-transition-reduced-motion}\n);\n\n// --graupl-breadcrumb-toggle-transform\n$breadcrumb-toggle-transform: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-transform,\n #{$breadcrumb-link-transform}\n);\n\n// --graupl-breadcrumb-toggle-visited-transform\n$breadcrumb-toggle-visited-transform: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-visited-transform,\n #{$breadcrumb-toggle-transform}\n);\n\n// --graupl-breadcrumb-toggle-focus-transform\n$breadcrumb-toggle-focus-transform: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-focus-transform,\n #{$breadcrumb-toggle-transform}\n);\n\n// --graupl-breadcrumb-toggle-hover-transform\n$breadcrumb-toggle-hover-transform: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-hover-transform,\n #{$breadcrumb-toggle-transform}\n);\n\n// --graupl-breadcrumb-toggle-active-transform\n$breadcrumb-toggle-active-transform: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-active-transform,\n #{$breadcrumb-link-active-transform}\n);\n\n// --graupl-breadcrumb-toggle-disabled-transform\n$breadcrumb-toggle-disabled-transform: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-disabled-transform,\n #{$breadcrumb-link-disabled-transform}\n);\n$breadcrumb-toggle-transform-states: (\n _default: $breadcrumb-toggle-transform,\n visited: $breadcrumb-toggle-visited-transform,\n focus: $breadcrumb-toggle-focus-transform,\n hover: $breadcrumb-toggle-hover-transform,\n active: $breadcrumb-toggle-active-transform,\n disabled: $breadcrumb-toggle-disabled-transform,\n);\n\n// --graupl-breadcrumb-toggle-color\n$breadcrumb-toggle-color: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-color,\n #{$breadcrumb-link-color}\n);\n\n// --graupl-breadcrumb-toggle-background\n$breadcrumb-toggle-background: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-background,\n #{$breadcrumb-link-background}\n);\n\n// --graupl-breadcrumb-toggle-visited-color\n$breadcrumb-toggle-visited-color: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-visited-color,\n #{$breadcrumb-toggle-color}\n);\n\n// --graupl-breadcrumb-toggle-focus-color\n$breadcrumb-toggle-focus-color: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-focus-color,\n #{$breadcrumb-toggle-color}\n);\n\n// --graupl-breadcrumb-toggle-hover-color\n$breadcrumb-toggle-hover-color: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-hover-color,\n #{$breadcrumb-toggle-background}\n);\n\n// --graupl-breadcrumb-toggle-active-color\n$breadcrumb-toggle-active-color: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-active-color,\n #{$breadcrumb-toggle-hover-color}\n);\n\n// --graupl-breadcrumb-toggle-disabled-color\n$breadcrumb-toggle-disabled-color: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-disabled-color,\n #{theme.get(primary, 200)}\n);\n$breadcrumb-toggle-color-states: (\n default: $breadcrumb-toggle-color,\n visited: $breadcrumb-toggle-visited-color,\n focus: $breadcrumb-toggle-focus-color,\n hover: $breadcrumb-toggle-hover-color,\n active: $breadcrumb-toggle-active-color,\n disabled: $breadcrumb-toggle-disabled-color,\n);\n\n// --graupl-breadcrumb-toggle-visited-background\n$breadcrumb-toggle-visited-background: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-visited-background,\n #{$breadcrumb-toggle-background}\n);\n\n// --graupl-breadcrumb-toggle-focus-background\n$breadcrumb-toggle-focus-background: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-focus-background,\n #{$breadcrumb-toggle-background}\n);\n\n// --graupl-breadcrumb-toggle-hover-background\n$breadcrumb-toggle-hover-background: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-hover-background,\n #{$breadcrumb-toggle-color}\n);\n\n// --graupl-breadcrumb-toggle-active-background\n$breadcrumb-toggle-active-background: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-active-background,\n #{$breadcrumb-toggle-hover-background}\n);\n\n// --graupl-breadcrumb-toggle-disabled-background\n$breadcrumb-toggle-disabled-background: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-disabled-background,\n #{theme.get(primary, 200)}\n);\n$breadcrumb-toggle-background-states: (\n default: $breadcrumb-toggle-background,\n visited: $breadcrumb-toggle-visited-background,\n focus: $breadcrumb-toggle-focus-background,\n hover: $breadcrumb-toggle-hover-background,\n active: $breadcrumb-toggle-active-background,\n disabled: $breadcrumb-toggle-disabled-background,\n);\n\n// --graupl-breadcrumb-toggle-border-color\n$breadcrumb-toggle-border-color: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-border-color,\n #{$breadcrumb-toggle-color}\n);\n\n// --graupl-breadcrumb-toggle-border-top-left-radius\n$breadcrumb-toggle-border-top-left-radius: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-border-top-left-radius,\n #{$breadcrumb-link-border-top-left-radius}\n);\n\n// --graupl-breadcrumb-toggle-border-top-right-radius\n$breadcrumb-toggle-border-top-right-radius: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-border-top-right-radius,\n #{$breadcrumb-link-border-top-right-radius}\n);\n\n// --graupl-breadcrumb-toggle-border-bottom-left-radius\n$breadcrumb-toggle-border-bottom-left-radius: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-border-bottom-left-radius,\n #{$breadcrumb-link-border-bottom-left-radius}\n);\n\n// --graupl-breadcrumb-toggle-border-bottom-right-radius\n$breadcrumb-toggle-border-bottom-right-radius: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-border-bottom-right-radius,\n #{$breadcrumb-link-border-bottom-right-radius}\n);\n\n// --graupl-breadcrumb-toggle-border-radius\n$breadcrumb-toggle-border-radius: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-border-radius,\n #{$breadcrumb-toggle-border-top-left-radius}\n #{$breadcrumb-toggle-border-top-right-radius}\n #{$breadcrumb-toggle-border-bottom-right-radius}\n #{$breadcrumb-toggle-border-bottom-left-radius}\n);\n\n// --graupl-breadcrumb-toggle-border-top-width\n$breadcrumb-toggle-border-top-width: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-border-top-width,\n #{$breadcrumb-link-border-top-width}\n);\n\n// --graupl-breadcrumb-toggle-border-right-width\n$breadcrumb-toggle-border-right-width: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-border-right-width,\n #{$breadcrumb-link-border-right-width}\n);\n\n// --graupl-breadcrumb-toggle-border-bottom-width\n$breadcrumb-toggle-border-bottom-width: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-border-bottom-width,\n #{$breadcrumb-link-border-bottom-width}\n);\n\n// --graupl-breadcrumb-toggle-border-left-width\n$breadcrumb-toggle-border-left-width: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-border-left-width,\n #{$breadcrumb-link-border-left-width}\n);\n\n// --graupl-breadcrumb-toggle-border-width\n$breadcrumb-toggle-border-width: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-border-width,\n #{$breadcrumb-toggle-border-top-width}\n #{$breadcrumb-toggle-border-right-width}\n #{$breadcrumb-toggle-border-bottom-width}\n #{$breadcrumb-toggle-border-left-width}\n);\n\n// --graupl-breadcrumb-toggle-border-top-style\n$breadcrumb-toggle-border-top-style: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-border-top-style,\n #{$breadcrumb-link-border-top-style}\n);\n\n// --graupl-breadcrumb-toggle-border-right-style\n$breadcrumb-toggle-border-right-style: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-border-right-style,\n #{$breadcrumb-link-border-right-style}\n);\n\n// --graupl-breadcrumb-toggle-border-bottom-style\n$breadcrumb-toggle-border-bottom-style: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-border-bottom-style,\n #{$breadcrumb-link-border-bottom-style}\n);\n\n// --graupl-breadcrumb-toggle-border-left-style\n$breadcrumb-toggle-border-left-style: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-border-left-style,\n #{$breadcrumb-link-border-left-style}\n);\n\n// --graupl-breadcrumb-toggle-border-style\n$breadcrumb-toggle-border-style: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-border-style,\n #{$breadcrumb-toggle-border-top-style}\n #{$breadcrumb-toggle-border-right-style}\n #{$breadcrumb-toggle-border-bottom-style}\n #{$breadcrumb-toggle-border-left-style}\n);\n\n// --graupl-breadcrumb-item-separator\n$breadcrumb-item-separator: var(\n --#{root-defaults.$prefix}breadcrumb-item-separator-content,\n #{defaults.$breadcrumb-item-separator}\n);\n","// @graupl/core link base mixins.\n\n@use \"../../defaults\" as root-defaults;\n@use \"../../mixins/animation\";\n@use \"../../mixins/state\";\n@use \"../../mixins/theme\";\n@use \"defaults\";\n@use \"variables\" as *;\n\n/// Mixin to apply base styles for links.\n@mixin apply-base() {\n min-width: $link-min-width;\n min-height: $link-min-height;\n padding: $link-padding;\n transform: $link-transform;\n transition: $link-transition;\n border-width: $link-border-width;\n border-style: $link-border-style;\n border-radius: $link-border-radius;\n text-decoration: $link-text-decoration;\n text-decoration-style: $link-text-decoration-style;\n text-decoration-thickness: $link-text-decoration-thickness;\n\n @include state.generate-modifiers(\n (\n transform: $link-transform-states,\n text-decoration: $link-text-decoration-states,\n text-decoration-style: $link-text-decoration-style-states,\n text-decoration-thickness: $link-text-decoration-thickness-states,\n )\n );\n\n @include animation.off {\n transition: #{$link-transition-reduced-motion};\n }\n}\n\n/// Mixin to apply theme styles for links.\n@mixin apply-theme() {\n border-color: $link-border-color;\n background: $link-background;\n color: $link-color;\n text-decoration-color: $link-text-decoration-color;\n\n @if root-defaults.$themeable-components and defaults.$themeable {\n @include theme.generate-modifiers(\n defaults.$link-theme-map,\n defaults.$link-theme-prefix-selector-base,\n defaults.$link-theme-prefix-selector,\n \"link-\"\n );\n }\n\n @include state.generate-modifiers(\n (\n border-color: $link-border-color-states,\n background: $link-background-states,\n color: $link-color-states,\n text-decoration-color: $link-text-decoration-color-states,\n )\n );\n}\n\n/// Mixin to apply stretched link styles.\n@mixin apply-stretched() {\n isolation: isolate;\n\n // &::after\n &::#{defaults.$stretched-link-pseudo-selector} {\n content: \"\";\n position: absolute;\n inset: 0;\n z-index: $stretched-link-z-index;\n }\n}\n\n/// Mixin to apply all link styles.\n@mixin apply() {\n @include apply-base;\n @include apply-theme;\n}\n","// @graupl/core link base variables.\n//\n// These values are to be used to directly style bases and provide a\n// cleaner way to reference custom properties.\n\n// Custom property defaults:\n// | Custom property | Default |\n// | ------------------------------------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |\n// | --graupl-link-text-decoration | underline |\n// | --graupl-link-visited-text-decoration | var(--graupl-link-text-decoration) |\n// | --graupl-link-focus-text-decoration | var(--graupl-link-text-decoration) |\n// | --graupl-link-hover-text-decoration | underline |\n// | --graupl-link-active-text-decoration | var(--graupl-link-hover-text-decoration) |\n// | --graupl-link-disabled-text-decoration | underline |\n// | --graupl-link-text-decoration-thickness | var(--graupl-border-width) |\n// | --graupl-link-visited-text-decoration-thickness | var(--graupl-link-text-decoration-thickness) |\n// | --graupl-link-focus-text-decoration-thickness | var(--graupl-link-text-decoration-thickness) |\n// | --graupl-link-hover-text-decoration-thickness | var(--graupl-border-width) |\n// | --graupl-link-active-text-decoration-thickness | var(--graupl-link-hover-text-decoration-thickness) |\n// | --graupl-link-disabled-text-decoration-thickness | var(--graupl-border-width) |\n// | --graupl-link-text-decoration-style | solid |\n// | --graupl-link-visited-text-decoration-style | var(--graupl-link-text-decoration-style) |\n// | --graupl-link-focus-text-decoration-style | var(--graupl-link-text-decoration-style) |\n// | --graupl-link-hover-text-decoration-style | solid |\n// | --graupl-link-active-text-decoration-style | var(--graupl-link-hover-text-decoration-style) |\n// | --graupl-link-disabled-text-decoration-style | solid |\n// | --graupl-link-color | var(--graupl-theme-active--primary--700) |\n// | --graupl-link-visited-color | var(--graupl-link-color) |\n// | --graupl-link-focus-color | var(--graupl-link-color) |\n// | --graupl-link-hover-color | theme.get(tertiary, 700) |\n// | --graupl-link-active-color | var(--graupl-link-hover-color) |\n// | --graupl-link-disabled-color | var(--graupl-theme-active--primary--200) |\n// | --graupl-link-text-decoration-color | var(--graupl-link-color) |\n// | --graupl-link-visited-text-decoration-color | var(--graupl-link-visited-color) |\n// | --graupl-link-focus-text-decoration-color | var(--graupl-link-focus-color) |\n// | --graupl-link-hover-text-decoration-color | var(--graupl-link-hover-color) |\n// | --graupl-link-active-text-decoration-color | var(--graupl-link-active-color) |\n// | --graupl-link-disabled-text-decoration-color | var(--graupl-link-disabled-color) |\n// | --graupl-link-background | theme.get(transparent) |\n// | --graupl-link-visited-background | var(--graupl-link-background) |\n// | --graupl-link-focus-background | var(--graupl-link-background) |\n// | --graupl-link-hover-background | theme.get(transparent) |\n// | --graupl-link-active-background | var(--graupl-link-hover-background) |\n// | --graupl-link-disabled-background | theme.get(transparent) |\n// | --graupl-link-padding-x | var(--graupl-spacer-0) |\n// | --graupl-link-padding-y | var(--graupl-spacer-0) |\n// | --graupl-link-padding | var(--graupl-link-padding-y) var(--graupl-link-padding-x) |\n// | --graupl-link-transition | background var(--graupl-transition-duration-fast) var(--graupl-transition-timing-function), color var(--graupl-transition-duration-fast) var(--graupl-transition-timing-function), transform var(--graupl-transition-duration-fast) var(--graupl-transition-timing-function) |\n// | --graupl-link-transition-reduced-motion | background var(--graupl-transition-duration-none) var(--graupl-transition-timing-function), color var(--graupl-transition-duration-none) var(--graupl-transition-timing-function) |\n// | --graupl-link-transform | var(--graupl-link-initial-transform) |\n// | --graupl-link-visited-transform | var(--graupl-link-transform) |\n// | --graupl-link-focus-transform | var(--graupl-link-transform) |\n// | --graupl-link-hover-transform | var(--graupl-link-final-transform) |\n// | --graupl-link-active-transform | var(--graupl-link-hover-transform) |\n// | --graupl-link-disabled-transform | var(--graupl-link-disabled-transform) |\n// | --graupl-link-border-top-width | 0 |\n// | --graupl-link-border-right-width | 0 |\n// | --graupl-link-border-bottom-width | 0 |\n// | --graupl-link-border-left-width | 0 |\n// | --graupl-link-border-width | var(--graupl-link-border-top-width) var(--graupl-link-border-right-width) var(--graupl-link-border-bottom-width) var(--graupl-link-border-left-width) |\n// | --graupl-link-border-top-style | var(--graupl-border-top-style) |\n// | --graupl-link-border-right-style | var(--graupl-border-right-style) |\n// | --graupl-link-border-bottom-style | var(--graupl-border-bottom-style) |\n// | --graupl-link-border-left-style | var(--graupl-border-left-style) |\n// | --graupl-link-border-style | var(--graupl-link-border-top-style) var(--graupl-link-border-right-style) var(--graupl-link-border-bottom-style) var(--graupl-link-border-left-style) |\n// | --graupl-link-border-top-left-radius | var(--graupl-border-top-left-radius) |\n// | --graupl-link-border-top-right-radius | var(--graupl-border-top-right-radius) |\n// | --graupl-link-border-bottom-right-radius | var(--graupl-border-bottom-right-radius) |\n// | --graupl-link-border-bottom-left-radius | var(--graupl-border-bottom-left-radius) |\n// | --graupl-link-border-radius | var(--graupl-link-border-top-left-radius) var(--graupl-link-border-top-right-radius) var(--graupl-link-border-bottom-right-radius) var(--graupl-link-border-bottom-left-radius) |\n// | --graupl-link-border-color | theme.get(transparent) |\n// | --graupl-link-visited-border-color | var(--graupl-link-border-color) |\n// | --graupl-link-focus-border-color | var(--graupl-link-border-color) |\n// | --graupl-link-hover-border-color | theme.get(transparent) |\n// | --graupl-link-active-border-color | var(--graupl-link-hover-border-color) |\n// | --graupl-link-disabled-border-color | theme.get(transparent) |\n// | --graupl-link-min-width | var(--graupl-link-min-width) |\n// | --graupl-link-min-height | var(--graupl-link-min-height) |\n// | --graupl-stretched-link-z-index | var(--graupl-stretched-link-z-index) |\n\n@use \"defaults\";\n@use \"../../variables\" as root-variables;\n@use \"../../defaults\" as root-defaults;\n@use \"../../functions/theme\";\n@use \"sass:map\";\n\n// Link properties.\n// --graupl-link-text-decoration\n$link-text-decoration: var(\n --#{root-defaults.$prefix}link-text-decoration,\n #{defaults.$link-initial-text-decoration}\n);\n\n// --graupl-link-visited-text-decoration\n$link-visited-text-decoration: var(\n --#{root-defaults.$prefix}link-visited-text-decoration,\n #{$link-text-decoration}\n);\n\n// --graupl-link-focus-text-decoration\n$link-focus-text-decoration: var(\n --#{root-defaults.$prefix}link-focus-text-decoration,\n #{$link-text-decoration}\n);\n\n// --graupl-link-hover-text-decoration\n$link-hover-text-decoration: var(\n --#{root-defaults.$prefix}link-hover-text-decoration,\n #{defaults.$link-final-text-decoration}\n);\n\n// --graupl-link-active-text-decoration\n$link-active-text-decoration: var(\n --#{root-defaults.$prefix}link-active-text-decoration,\n #{$link-hover-text-decoration}\n);\n\n// --graupl-link-disabled-text-decoration\n$link-disabled-text-decoration: var(\n --#{root-defaults.$prefix}link-disabled-text-decoration,\n #{defaults.$link-disabled-text-decoration}\n);\n$link-text-decoration-states: (\n default: $link-text-decoration,\n visited: $link-visited-text-decoration,\n focus: $link-focus-text-decoration,\n hover: $link-hover-text-decoration,\n active: $link-active-text-decoration,\n disabled: $link-disabled-text-decoration,\n);\n\n// --graupl-link-text-decoration-thickness\n$link-text-decoration-thickness: var(\n --#{root-defaults.$prefix}link-text-decoration-thickness,\n #{root-variables.$border-width}\n);\n\n// --graupl-link-visited-text-decoration-thickness\n$link-visited-text-decoration-thickness: var(\n --#{root-defaults.$prefix}link-visited-text-decoration-thickness,\n #{$link-text-decoration-thickness}\n);\n\n// --graupl-link-focus-text-decoration-thickness\n$link-focus-text-decoration-thickness: var(\n --#{root-defaults.$prefix}link-focus-text-decoration-thickness,\n #{$link-text-decoration-thickness}\n);\n\n// --graupl-link-hover-text-decoration-thickness\n$link-hover-text-decoration-thickness: var(\n --#{root-defaults.$prefix}link-hover-text-decoration-thickness,\n #{root-variables.$border-width}\n);\n\n// --graupl-link-active-text-decoration-thickness\n$link-active-text-decoration-thickness: var(\n --#{root-defaults.$prefix}link-active-text-decoration-thickness,\n #{$link-hover-text-decoration-thickness}\n);\n\n// --graupl-link-disabled-text-decoration-thickness\n$link-disabled-text-decoration-thickness: var(\n --#{root-defaults.$prefix}link-disabled-text-decoration-thickness,\n #{root-variables.$border-width}\n);\n$link-text-decoration-thickness-states: (\n default: $link-text-decoration-thickness,\n visited: $link-visited-text-decoration-thickness,\n focus: $link-focus-text-decoration-thickness,\n hover: $link-hover-text-decoration-thickness,\n active: $link-active-text-decoration-thickness,\n disabled: $link-disabled-text-decoration-thickness,\n);\n\n// --graupl-link-text-decoration-style\n$link-text-decoration-style: var(\n --#{root-defaults.$prefix}link-text-decoration-style,\n #{defaults.$link-initial-text-decoration-style}\n);\n\n// --graupl-link-visited-text-decoration-style\n$link-visited-text-decoration-style: var(\n --#{root-defaults.$prefix}link-visited-text-decoration-style,\n #{$link-text-decoration-style}\n);\n\n// --graupl-link-focus-text-decoration-style\n$link-focus-text-decoration-style: var(\n --#{root-defaults.$prefix}link-focus-text-decoration-style,\n #{$link-text-decoration-style}\n);\n\n// --graupl-link-hover-text-decoration-style\n$link-hover-text-decoration-style: var(\n --#{root-defaults.$prefix}link-hover-text-decoration-style,\n #{defaults.$link-final-text-decoration-style}\n);\n\n// --graupl-link-active-text-decoration-style\n$link-active-text-decoration-style: var(\n --#{root-defaults.$prefix}link-active-text-decoration-style,\n #{$link-hover-text-decoration-style}\n);\n\n// --graupl-link-disabled-text-decoration-style\n$link-disabled-text-decoration-style: var(\n --#{root-defaults.$prefix}link-disabled-text-decoration-style,\n #{defaults.$link-disabled-text-decoration-style}\n);\n$link-text-decoration-style-states: (\n default: $link-text-decoration-style,\n visited: $link-visited-text-decoration-style,\n focus: $link-focus-text-decoration-style,\n hover: $link-hover-text-decoration-style,\n active: $link-active-text-decoration-style,\n disabled: $link-disabled-text-decoration-style,\n);\n\n// --graupl-link-color\n$link-color: var(\n --#{root-defaults.$prefix}link-color,\n #{theme.get(primary, 700)}\n);\n\n// --graupl-link-visited-color\n$link-visited-color: var(\n --#{root-defaults.$prefix}link-visited-color,\n #{$link-color}\n);\n\n// --graupl-link-focus-color\n$link-focus-color: var(\n --#{root-defaults.$prefix}link-focus-color,\n #{$link-color}\n);\n\n// --graupl-link-hover-color\n$link-hover-color: var(\n --#{root-defaults.$prefix}link-hover-color,\n #{theme.get(tertiary, 700)}\n);\n\n// --graupl-link-active-color\n$link-active-color: var(\n --#{root-defaults.$prefix}link-active-color,\n #{$link-hover-color}\n);\n\n// --graupl-link-disabled-color\n$link-disabled-color: var(\n --#{root-defaults.$prefix}link-disabled-color,\n #{theme.get(primary, 200)}\n);\n$link-color-states: (\n default: $link-color,\n visited: $link-visited-color,\n focus: $link-focus-color,\n hover: $link-hover-color,\n active: $link-active-color,\n disabled: $link-disabled-color,\n);\n\n// --graupl-link-text-decoration-color\n$link-text-decoration-color: var(\n --#{root-defaults.$prefix}link-text-decoration-color,\n #{$link-color}\n);\n\n// --graupl-link-visited-text-decoration-color\n$link-visited-text-decoration-color: var(\n --#{root-defaults.$prefix}link-visited-text-decoration-color,\n #{$link-visited-color}\n);\n\n// --graupl-link-focus-text-decoration-color\n$link-focus-text-decoration-color: var(\n --#{root-defaults.$prefix}link-focus-text-decoration-color,\n #{$link-focus-color}\n);\n\n// --graupl-link-hover-text-decoration-color\n$link-hover-text-decoration-color: var(\n --#{root-defaults.$prefix}link-hover-text-decoration-color,\n #{$link-hover-color}\n);\n\n// --graupl-link-active-text-decoration-color\n$link-active-text-decoration-color: var(\n --#{root-defaults.$prefix}link-active-text-decoration-color,\n #{$link-active-color}\n);\n\n// --graupl-link-disabled-text-decoration-color\n$link-disabled-text-decoration-color: var(\n --#{root-defaults.$prefix}link-disabled-text-decoration-color,\n #{$link-disabled-color}\n);\n$link-text-decoration-color-states: (\n default: $link-text-decoration-color,\n visited: $link-visited-text-decoration-color,\n focus: $link-focus-text-decoration-color,\n hover: $link-hover-text-decoration-color,\n active: $link-active-text-decoration-color,\n disabled: $link-disabled-text-decoration-color,\n);\n\n// --graupl-link-background\n$link-background: var(\n --#{root-defaults.$prefix}link-background,\n #{theme.get(transparent)}\n);\n\n// --graupl-link-visited-background\n$link-visited-background: var(\n --#{root-defaults.$prefix}link-visited-background,\n #{$link-background}\n);\n\n// --graupl-link-focus-background\n$link-focus-background: var(\n --#{root-defaults.$prefix}link-focus-background,\n #{$link-background}\n);\n\n// --graupl-link-hover-background\n$link-hover-background: var(\n --#{root-defaults.$prefix}link-hover-background,\n #{theme.get(transparent)}\n);\n\n// --graupl-link-active-background\n$link-active-background: var(\n --#{root-defaults.$prefix}link-active-background,\n #{$link-hover-background}\n);\n\n// --graupl-link-disabled-background\n$link-disabled-background: var(\n --#{root-defaults.$prefix}link-disabled-background,\n #{theme.get(transparent)}\n);\n$link-background-states: (\n default: $link-background,\n visited: $link-visited-background,\n focus: $link-focus-background,\n hover: $link-hover-background,\n active: $link-active-background,\n disabled: $link-disabled-background,\n);\n\n// --graupl-link-padding-x\n$link-padding-x: var(\n --#{root-defaults.$prefix}link-padding-x,\n #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-link-padding-y\n$link-padding-y: var(\n --#{root-defaults.$prefix}link-padding-y,\n #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-link-padding\n$link-padding: var(\n --#{root-defaults.$prefix}link-padding,\n #{$link-padding-y} #{$link-padding-x}\n);\n\n// --graupl-link-transition\n$link-transition: var(\n --#{root-defaults.$prefix}link-transition,\n background #{map.get(root-variables.$transition-durations, fast)}\n #{root-variables.$transition-timing-function},\n color #{map.get(root-variables.$transition-durations, fast)}\n #{root-variables.$transition-timing-function},\n transform #{map.get(root-variables.$transition-durations, fast)}\n #{root-variables.$transition-timing-function}\n);\n\n// --graupl-link-transition-reduced-motion\n$link-transition-reduced-motion: var(\n --#{root-defaults.$prefix}link-transition-reduced-motion,\n background #{map.get(root-variables.$transition-durations, none)}\n #{root-variables.$transition-timing-function},\n color #{map.get(root-variables.$transition-durations, none)}\n #{root-variables.$transition-timing-function}\n);\n\n// --graupl-link-transform\n$link-transform: var(\n --#{root-defaults.$prefix}link-transform,\n #{defaults.$link-initial-transform}\n);\n\n// --graupl-link-visited-transform\n$link-visited-transform: var(\n --#{root-defaults.$prefix}link-visited-transform,\n #{$link-transform}\n);\n\n// --graupl-link-focus-transform\n$link-focus-transform: var(\n --#{root-defaults.$prefix}link-focus-transform,\n #{$link-transform}\n);\n\n// --graupl-link-hover-transform\n$link-hover-transform: var(\n --#{root-defaults.$prefix}link-hover-transform,\n #{defaults.$link-final-transform}\n);\n\n// --graupl-link-active-transform\n$link-active-transform: var(\n --#{root-defaults.$prefix}link-active-transform,\n #{$link-hover-transform}\n);\n\n// --graupl-link-disabled-transform\n$link-disabled-transform: var(\n --#{root-defaults.$prefix}link-disabled-transform,\n #{defaults.$link-disabled-transform}\n);\n$link-transform-states: (\n default: $link-transform,\n visited: $link-visited-transform,\n focus: $link-focus-transform,\n hover: $link-hover-transform,\n active: $link-active-transform,\n disabled: $link-disabled-transform,\n);\n\n// --graupl-link-border-top-width\n$link-border-top-width: var(--#{root-defaults.$prefix}link-border-top-width, 0);\n\n// --graupl-link-border-right-width\n$link-border-right-width: var(\n --#{root-defaults.$prefix}link-border-right-width,\n 0\n);\n\n// --graupl-link-border-bottom-width\n$link-border-bottom-width: var(\n --#{root-defaults.$prefix}link-border-bottom-width,\n 0\n);\n\n// --graupl-link-border-left-width\n$link-border-left-width: var(\n --#{root-defaults.$prefix}link-border-left-width,\n 0\n);\n\n// --graupl-link-border-width\n$link-border-width: var(\n --#{root-defaults.$prefix}link-border-width,\n #{$link-border-top-width} #{$link-border-right-width}\n #{$link-border-bottom-width} #{$link-border-left-width}\n);\n\n// --graupl-link-border-top-style\n$link-border-top-style: var(\n --#{root-defaults.$prefix}link-border-top-style,\n #{root-variables.$border-top-style}\n);\n\n// --graupl-link-border-right-style\n$link-border-right-style: var(\n --#{root-defaults.$prefix}link-border-right-style,\n #{root-variables.$border-right-style}\n);\n\n// --graupl-link-border-bottom-style\n$link-border-bottom-style: var(\n --#{root-defaults.$prefix}link-border-bottom-style,\n #{root-variables.$border-bottom-style}\n);\n\n// --graupl-link-border-left-style\n$link-border-left-style: var(\n --#{root-defaults.$prefix}link-border-left-style,\n #{root-variables.$border-left-style}\n);\n\n// --graupl-link-border-style\n$link-border-style: var(\n --#{root-defaults.$prefix}link-border-style,\n #{$link-border-top-style} #{$link-border-right-style}\n #{$link-border-bottom-style} #{$link-border-left-style}\n);\n\n// --graupl-link-border-top-left-radius\n$link-border-top-left-radius: var(\n --#{root-defaults.$prefix}link-border-top-left-radius,\n #{root-variables.$border-top-left-radius}\n);\n\n// --graupl-link-border-top-right-radius\n$link-border-top-right-radius: var(\n --#{root-defaults.$prefix}link-border-top-right-radius,\n #{root-variables.$border-top-right-radius}\n);\n\n// --graupl-link-border-bottom-right-radius\n$link-border-bottom-right-radius: var(\n --#{root-defaults.$prefix}link-border-bottom-right-radius,\n #{root-variables.$border-bottom-right-radius}\n);\n\n// --graupl-link-border-bottom-left-radius\n$link-border-bottom-left-radius: var(\n --#{root-defaults.$prefix}link-border-bottom-left-radius,\n #{root-variables.$border-bottom-left-radius}\n);\n\n// --graupl-link-border-radius\n$link-border-radius: var(\n --#{root-defaults.$prefix}link-border-radius,\n #{$link-border-top-left-radius} #{$link-border-top-right-radius}\n #{$link-border-bottom-right-radius} #{$link-border-bottom-left-radius}\n);\n\n// --graupl-link-border-color\n$link-border-color: var(\n --#{root-defaults.$prefix}link-border-color,\n #{theme.get(transparent)}\n);\n\n// --graupl-link-visited-border-color\n$link-visited-border-color: var(\n --#{root-defaults.$prefix}link-visited-border-color,\n #{$link-border-color}\n);\n\n// --graupl-link-focus-border-color\n$link-focus-border-color: var(\n --#{root-defaults.$prefix}link-focus-border-color,\n #{$link-border-color}\n);\n\n// --graupl-link-hover-border-color\n$link-hover-border-color: var(\n --#{root-defaults.$prefix}link-hover-border-color,\n #{theme.get(transparent)}\n);\n\n// --graupl-link-active-border-color\n$link-active-border-color: var(\n --#{root-defaults.$prefix}link-active-border-color,\n #{$link-hover-border-color}\n);\n\n// --graupl-link-disabled-border-color\n$link-disabled-border-color: var(\n --#{root-defaults.$prefix}link-disabled-border-color,\n #{theme.get(transparent)}\n);\n$link-border-color-states: (\n default: $link-border-color,\n visited: $link-visited-border-color,\n focus: $link-focus-border-color,\n hover: $link-hover-border-color,\n active: $link-active-border-color,\n disabled: $link-disabled-border-color,\n);\n\n// --graupl-link-min-width\n$link-min-width: var(\n --#{root-defaults.$prefix}link-min-width,\n defaults.$link-min-width\n);\n\n// --graupl-link-min-height\n$link-min-height: var(\n --#{root-defaults.$prefix}link-min-height,\n defaults.$link-min-height\n);\n\n// Stretched link properties.\n// --graupl-stretched-link-z-index\n$stretched-link-z-index: var(\n --#{root-defaults.$prefix}stretched-link-z-index,\n #{defaults.$stretched-link-z-index}\n);\n","// @graupl/core state mixins.\n//\n// A series of mixins to tie styles to a state.\n\n@use \"../defaults\" as root-defaults;\n@use \"sass:map\";\n\n/// Applies styles to a specific state.\n///\n/// @param {string} $state\n/// The name of the state to apply the styles to.\n@mixin state($state) {\n @each $selector in map.get(root-defaults.$state-selectors, $state) {\n &#{$selector} {\n @content;\n }\n }\n}\n\n/// Generates state modifiers with properties.\n///\n/// @param {map} $state-map\n/// The map of props and states.\n/// @param {string} $selector-base\n/// The selector base for the state modifier.\n/// @param {string} $selector-prefix\n/// The selector prefix for the state modifer.\n@mixin generate-modifiers($state-map) {\n @each $state, $selectors in root-defaults.$state-selectors {\n @each $selector in $selectors {\n // e.g &:visited, &:focus-visible, &:hover, &:active, &:disabled\n &#{$selector} {\n @each $prop, $map in $state-map {\n #{$prop}: map.get($map, $state);\n }\n\n // If the state is disabled, we want that to supersede all other states.\n @if $state == \"disabled\" {\n @each $sub-state, $sub-selectors in root-defaults.$state-selectors {\n @if $sub-state != $state {\n @each $sub-selector in $sub-selectors {\n // e.g &:visited, &:focus-visible, &:hover, &:active\n &#{$sub-selector} {\n @each $prop, $map in $state-map {\n #{$prop}: map.get($map, $state);\n }\n }\n }\n }\n }\n }\n }\n }\n }\n}\n","// @graupl/core animation media query mixins.\n\n// A media query for targeting users who have not requested reduced motion.\n@mixin on {\n @media (prefers-reduced-motion: no-preference) {\n @content;\n }\n}\n\n// A media query for targeting users who have requested reduced motion.\n@mixin off {\n @media (prefers-reduced-motion: reduce) {\n @content;\n }\n}\n"],"names":[]}
1
+ {"version":3,"sourceRoot":null,"mappings":"ACSI,wBCkSF,y+DAeI,uKAWA,uKAME,yMAYF,uSAiBJ,26DAUE,kHAKA,sJASF,u9CAQA,2kEIzWI,ogBAAA,ggBAAA,kWAAA,shBAAA,g2ECpBJ,uCL6XA,0LAAA,8qED/XE,oBC2YF,+pBAuBA,0xBAOA,24BAOA,geI1ZI,2pBAAA,qpBAAA,miBAAA,krBAAA,8hFJ0ZJ","sources":["dist/css/component/breadcrumb.css","Users/nickdjm/Development/contrib/graupl/graupl/node_modules/@graupl/core/src/scss/mixins/_layer.scss","Users/nickdjm/Development/contrib/graupl/graupl/node_modules/@graupl/core/src/scss/component/breadcrumb/_index.scss","Users/nickdjm/Development/contrib/graupl/graupl/node_modules/@graupl/core/src/scss/component/breadcrumb/_variables.scss","Users/nickdjm/Development/contrib/graupl/graupl/node_modules/@graupl/core/src/scss/base/link/_mixins.scss","Users/nickdjm/Development/contrib/graupl/graupl/node_modules/@graupl/core/src/scss/base/link/_variables.scss","Users/nickdjm/Development/contrib/graupl/graupl/node_modules/@graupl/core/src/scss/mixins/_state.scss","Users/nickdjm/Development/contrib/graupl/graupl/node_modules/@graupl/core/src/scss/mixins/_animation.scss"],"sourcesContent":["@layer graupl.component {\n .breadcrumb {\n display: flex;\n position: relative;\n flex-wrap: wrap;\n margin: var(--graupl-breadcrumb-margin, var(--graupl-breadcrumb-margin-y, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))) var(--graupl-breadcrumb-margin-x, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))));\n padding: var(--graupl-breadcrumb-padding, var(--graupl-breadcrumb-padding-y, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))) var(--graupl-breadcrumb-padding-x, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))));\n border-width: var(--graupl-breadcrumb-border-width, var(--graupl-breadcrumb-border-top-width, 0) var(--graupl-breadcrumb-border-right-width, 0) var(--graupl-breadcrumb-border-bottom-width, 0) var(--graupl-breadcrumb-border-left-width, 0));\n border-style: var(--graupl-breadcrumb-border-style, var(--graupl-breadcrumb-border-top-style, var(--graupl-border-top-style, var(--graupl-border-style, solid))) var(--graupl-breadcrumb-border-right-style, var(--graupl-border-right-style, var(--graupl-border-style, solid))) var(--graupl-breadcrumb-border-bottom-style, var(--graupl-border-bottom-style, var(--graupl-border-style, solid))) var(--graupl-breadcrumb-border-left-style, var(--graupl-border-left-style, var(--graupl-border-style, solid))));\n border-radius: var(--graupl-breadcrumb-border-radius, var(--graupl-breadcrumb-border-top-left-radius, var(--graupl-border-top-left-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-breadcrumb-border-top-right-radius, var(--graupl-border-top-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-breadcrumb-border-bottom-right-radius, var(--graupl-border-bottom-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-breadcrumb-border-bottom-left-radius, var(--graupl-border-bottom-left-radius, var(--graupl-border-radius, 0.125rem))));\n list-style: none;\n gap: var(--graupl-breadcrumb-gap, var(--graupl-breadcrumb-column-gap, var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem)))) var(--graupl-breadcrumb-row-gap, var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem)))));\n }\n .breadcrumb.show .breadcrumb-item:has(.breadcrumb-toggle) {\n display: var(--graupl-breadcrumb-item-hide-display, none);\n opacity: var(--graupl-breadcrumb-item-hide-opacity, 0);\n }\n .breadcrumb.hide .breadcrumb-item:has(.breadcrumb-toggle) {\n display: var(--graupl-breadcrumb-item-show-display, flex);\n opacity: var(--graupl-breadcrumb-item-show-opacity, 1);\n }\n .breadcrumb.hide .breadcrumb-item:has(.breadcrumb-toggle) ~ .breadcrumb-item:not(:last-child) {\n display: var(--graupl-breadcrumb-item-hide-display, none);\n opacity: var(--graupl-breadcrumb-item-hide-opacity, 0);\n }\n .breadcrumb.transitioning .breadcrumb-item:has(.breadcrumb-toggle) {\n display: var(--graupl-breadcrumb-item-transitioning-display, flex);\n opacity: var(--graupl-breadcrumb-item-transitioning-opacity, 0);\n }\n .breadcrumb.transitioning .breadcrumb-item:has(.breadcrumb-toggle) ~ .breadcrumb-item:not(:last-child) {\n display: var(--graupl-breadcrumb-item-transitioning-display, flex);\n opacity: var(--graupl-breadcrumb-item-transitioning-opacity, 0);\n }\n .breadcrumb-item {\n display: var(--graupl-breadcrumb-item-display, flex);\n position: relative;\n padding: var(--graupl-breadcrumb-item-padding, var(--graupl-breadcrumb-item-padding-y, 0) var(--graupl-breadcrumb-item-padding-x, 0));\n border-width: var(--graupl-breadcrumb-item-border-width, var(--graupl-breadcrumb-item-border-top-width, 0) var(--graupl-breadcrumb-item-border-right-width, 0) var(--graupl-breadcrumb-item-border-bottom-width, 0) var(--graupl-breadcrumb-item-border-left-width, 0));\n border-style: var(--graupl-breadcrumb-item-border-style, var(--graupl-breadcrumb-item-border-top-style, var(--graupl-border-top-style, var(--graupl-border-style, solid))) var(--graupl-breadcrumb-item-border-right-style, var(--graupl-border-right-style, var(--graupl-border-style, solid))) var(--graupl-breadcrumb-item-border-bottom-style, var(--graupl-border-bottom-style, var(--graupl-border-style, solid))) var(--graupl-breadcrumb-item-border-left-style, var(--graupl-border-left-style, var(--graupl-border-style, solid))));\n border-radius: var(--graupl-breadcrumb-item-border-radius, var(--graupl-breadcrumb-item-border-top-left-radius, var(--graupl-border-top-left-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-breadcrumb-item-border-top-right-radius, var(--graupl-border-top-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-breadcrumb-item-border-bottom-right-radius, var(--graupl-border-bottom-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-breadcrumb-item-border-bottom-left-radius, var(--graupl-border-bottom-left-radius, var(--graupl-border-radius, 0.125rem))));\n opacity: var(--graupl-breadcrumb-item-opacity, var(--graupl-breadcrumb-item-show-opacity, 1));\n gap: var(--graupl-breadcrumb-item-gap, var(--graupl-breadcrumb-item-column-gap, var(--graupl-breadcrumb-column-gap, var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem))))) var(--graupl-breadcrumb-item-row-gap, var(--graupl-breadcrumb-row-gap, var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem))))));\n }\n .breadcrumb-item:not(:last-child)::after {\n content: var(--graupl-breadcrumb-item-separator-content, '/');\n display: block;\n }\n .breadcrumb-item:has(.breadcrumb-toggle) {\n display: var(--graupl-breadcrumb-item-hide-display, none);\n opacity: var(--graupl-breadcrumb-item-hide-opacity, 0);\n }\n .breadcrumb-link {\n padding: var(--graupl-breadcrumb-link-padding, var(--graupl-breadcrumb-link-padding-y, 0) var(--graupl-breadcrumb-link-padding-x, 0));\n border-width: var(--graupl-breadcrumb-link-border-width, var(--graupl-breadcrumb-link-border-top-width, 0) var(--graupl-breadcrumb-link-border-right-width, 0) var(--graupl-breadcrumb-link-border-bottom-width, 0) var(--graupl-breadcrumb-link-border-left-width, 0));\n border-style: var(--graupl-breadcrumb-link-border-style, var(--graupl-breadcrumb-link-border-top-style, var(--graupl-border-top-style, var(--graupl-border-style, solid))) var(--graupl-breadcrumb-link-border-right-style, var(--graupl-border-right-style, var(--graupl-border-style, solid))) var(--graupl-breadcrumb-link-border-bottom-style, var(--graupl-border-bottom-style, var(--graupl-border-style, solid))) var(--graupl-breadcrumb-link-border-left-style, var(--graupl-border-left-style, var(--graupl-border-style, solid))));\n border-radius: var(--graupl-breadcrumb-link-border-radius, var(--graupl-breadcrumb-link-border-top-left-radius, var(--graupl-border-top-left-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-breadcrumb-link-border-top-right-radius, var(--graupl-border-top-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-breadcrumb-link-border-bottom-right-radius, var(--graupl-border-bottom-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-breadcrumb-link-border-bottom-left-radius, var(--graupl-border-bottom-left-radius, var(--graupl-border-radius, 0.125rem))));\n }\n .breadcrumb-toggle {\n min-width: var(--graupl-link-min-width, auto);\n min-height: var(--graupl-link-min-height, auto);\n padding: var(--graupl-link-padding, var(--graupl-link-padding-y, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))) var(--graupl-link-padding-x, var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)))));\n transform: var(--graupl-link-transform, none);\n transition: var(--graupl-link-transition, background var(--graupl-transition-duration-fast, 150ms) var(--graupl-transition-timing-function, ease), color var(--graupl-transition-duration-fast, 150ms) var(--graupl-transition-timing-function, ease), transform var(--graupl-transition-duration-fast, 150ms) var(--graupl-transition-timing-function, ease));\n border-width: var(--graupl-link-border-width, var(--graupl-link-border-top-width, 0) var(--graupl-link-border-right-width, 0) var(--graupl-link-border-bottom-width, 0) var(--graupl-link-border-left-width, 0));\n border-style: var(--graupl-link-border-style, var(--graupl-link-border-top-style, var(--graupl-border-top-style, var(--graupl-border-style, solid))) var(--graupl-link-border-right-style, var(--graupl-border-right-style, var(--graupl-border-style, solid))) var(--graupl-link-border-bottom-style, var(--graupl-border-bottom-style, var(--graupl-border-style, solid))) var(--graupl-link-border-left-style, var(--graupl-border-left-style, var(--graupl-border-style, solid))));\n border-radius: var(--graupl-link-border-radius, var(--graupl-link-border-top-left-radius, var(--graupl-border-top-left-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-link-border-top-right-radius, var(--graupl-border-top-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-link-border-bottom-right-radius, var(--graupl-border-bottom-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-link-border-bottom-left-radius, var(--graupl-border-bottom-left-radius, var(--graupl-border-radius, 0.125rem))));\n text-decoration: var(--graupl-link-text-decoration, underline);\n text-decoration-style: var(--graupl-link-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle:visited {\n transform: var(--graupl-link-visited-transform, var(--graupl-link-transform, none));\n text-decoration: var(--graupl-link-visited-text-decoration, var(--graupl-link-text-decoration, underline));\n text-decoration-style: var(--graupl-link-visited-text-decoration-style, var(--graupl-link-text-decoration-style, solid));\n text-decoration-thickness: var(--graupl-link-visited-text-decoration-thickness, var(--graupl-link-text-decoration-thickness, var(--graupl-border-width, 0.125rem)));\n }\n .breadcrumb-toggle.visited {\n transform: var(--graupl-link-visited-transform, var(--graupl-link-transform, none));\n text-decoration: var(--graupl-link-visited-text-decoration, var(--graupl-link-text-decoration, underline));\n text-decoration-style: var(--graupl-link-visited-text-decoration-style, var(--graupl-link-text-decoration-style, solid));\n text-decoration-thickness: var(--graupl-link-visited-text-decoration-thickness, var(--graupl-link-text-decoration-thickness, var(--graupl-border-width, 0.125rem)));\n }\n .breadcrumb-toggle:focus-visible {\n transform: var(--graupl-link-focus-transform, var(--graupl-link-transform, none));\n text-decoration: var(--graupl-link-focus-text-decoration, var(--graupl-link-text-decoration, underline));\n text-decoration-style: var(--graupl-link-focus-text-decoration-style, var(--graupl-link-text-decoration-style, solid));\n text-decoration-thickness: var(--graupl-link-focus-text-decoration-thickness, var(--graupl-link-text-decoration-thickness, var(--graupl-border-width, 0.125rem)));\n }\n .breadcrumb-toggle.focus {\n transform: var(--graupl-link-focus-transform, var(--graupl-link-transform, none));\n text-decoration: var(--graupl-link-focus-text-decoration, var(--graupl-link-text-decoration, underline));\n text-decoration-style: var(--graupl-link-focus-text-decoration-style, var(--graupl-link-text-decoration-style, solid));\n text-decoration-thickness: var(--graupl-link-focus-text-decoration-thickness, var(--graupl-link-text-decoration-thickness, var(--graupl-border-width, 0.125rem)));\n }\n .breadcrumb-toggle:hover {\n transform: var(--graupl-link-hover-transform, none);\n text-decoration: var(--graupl-link-hover-text-decoration, underline);\n text-decoration-style: var(--graupl-link-hover-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-hover-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle.hover {\n transform: var(--graupl-link-hover-transform, none);\n text-decoration: var(--graupl-link-hover-text-decoration, underline);\n text-decoration-style: var(--graupl-link-hover-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-hover-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle:active {\n transform: var(--graupl-link-active-transform, var(--graupl-link-hover-transform, none));\n text-decoration: var(--graupl-link-active-text-decoration, var(--graupl-link-hover-text-decoration, underline));\n text-decoration-style: var(--graupl-link-active-text-decoration-style, var(--graupl-link-hover-text-decoration-style, solid));\n text-decoration-thickness: var(--graupl-link-active-text-decoration-thickness, var(--graupl-link-hover-text-decoration-thickness, var(--graupl-border-width, 0.125rem)));\n }\n .breadcrumb-toggle.active {\n transform: var(--graupl-link-active-transform, var(--graupl-link-hover-transform, none));\n text-decoration: var(--graupl-link-active-text-decoration, var(--graupl-link-hover-text-decoration, underline));\n text-decoration-style: var(--graupl-link-active-text-decoration-style, var(--graupl-link-hover-text-decoration-style, solid));\n text-decoration-thickness: var(--graupl-link-active-text-decoration-thickness, var(--graupl-link-hover-text-decoration-thickness, var(--graupl-border-width, 0.125rem)));\n }\n .breadcrumb-toggle:disabled {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle:disabled:visited {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle:disabled.visited {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle:disabled:focus-visible {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle:disabled.focus {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle:disabled:hover {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle:disabled.hover {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle:disabled:active {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle:disabled.active {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle:disabled[aria-selected=true] {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle:disabled.selected {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle:disabled[aria-current=true] {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle:disabled.current {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[disabled] {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[disabled]:visited {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[disabled].visited {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[disabled]:focus-visible {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[disabled].focus {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[disabled]:hover {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[disabled].hover {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[disabled]:active {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[disabled].active {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[disabled][aria-selected=true] {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[disabled].selected {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[disabled][aria-current=true] {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[disabled].current {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[aria-disabled=true] {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[aria-disabled=true]:visited {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[aria-disabled=true].visited {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[aria-disabled=true]:focus-visible {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[aria-disabled=true].focus {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[aria-disabled=true]:hover {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[aria-disabled=true].hover {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[aria-disabled=true]:active {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[aria-disabled=true].active {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[aria-disabled=true][aria-selected=true] {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[aria-disabled=true].selected {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[aria-disabled=true][aria-current=true] {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle[aria-disabled=true].current {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle.disabled {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle.disabled:visited {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle.disabled.visited {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle.disabled:focus-visible {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle.disabled.focus {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle.disabled:hover {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle.disabled.hover {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle.disabled:active {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle.disabled.active {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle.disabled[aria-selected=true] {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle.disabled.selected {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle.disabled[aria-current=true] {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n .breadcrumb-toggle.disabled.current {\n transform: var(--graupl-link-disabled-transform, none);\n text-decoration: var(--graupl-link-disabled-text-decoration, underline);\n text-decoration-style: var(--graupl-link-disabled-text-decoration-style, solid);\n text-decoration-thickness: var(--graupl-link-disabled-text-decoration-thickness, var(--graupl-border-width, 0.125rem));\n }\n @media (prefers-reduced-motion: reduce) {\n .breadcrumb-toggle {\n transition: var(--graupl-link-transition-reduced-motion, background var(--graupl-transition-timing-function, ease), color var(--graupl-transition-timing-function, ease));\n }\n }\n .breadcrumb-toggle {\n padding: var(--graupl-breadcrumb-toggle-padding, var(--graupl-breadcrumb-toggle-padding-y, var(--graupl-breadcrumb-link-padding-y, 0)) var(--graupl-breadcrumb-toggle-padding-x, var(--graupl-breadcrumb-link-padding-x, 0)));\n border-width: var(--graupl-breadcrumb-toggle-border-width, var(--graupl-breadcrumb-toggle-border-top-width, var(--graupl-breadcrumb-link-border-top-width, 0)) var(--graupl-breadcrumb-toggle-border-right-width, var(--graupl-breadcrumb-link-border-right-width, 0)) var(--graupl-breadcrumb-toggle-border-bottom-width, var(--graupl-breadcrumb-link-border-bottom-width, 0)) var(--graupl-breadcrumb-toggle-border-left-width, var(--graupl-breadcrumb-link-border-left-width, 0)));\n border-style: var(--graupl-breadcrumb-toggle-border-style, var(--graupl-breadcrumb-toggle-border-top-style, var(--graupl-breadcrumb-link-border-top-style, var(--graupl-border-top-style, var(--graupl-border-style, solid)))) var(--graupl-breadcrumb-toggle-border-right-style, var(--graupl-breadcrumb-link-border-right-style, var(--graupl-border-right-style, var(--graupl-border-style, solid)))) var(--graupl-breadcrumb-toggle-border-bottom-style, var(--graupl-breadcrumb-link-border-bottom-style, var(--graupl-border-bottom-style, var(--graupl-border-style, solid)))) var(--graupl-breadcrumb-toggle-border-left-style, var(--graupl-breadcrumb-link-border-left-style, var(--graupl-border-left-style, var(--graupl-border-style, solid)))));\n border-radius: var(--graupl-breadcrumb-toggle-border-radius, var(--graupl-breadcrumb-toggle-border-top-left-radius, var(--graupl-breadcrumb-link-border-top-left-radius, var(--graupl-border-top-left-radius, var(--graupl-border-radius, 0.125rem)))) var(--graupl-breadcrumb-toggle-border-top-right-radius, var(--graupl-breadcrumb-link-border-top-right-radius, var(--graupl-border-top-right-radius, var(--graupl-border-radius, 0.125rem)))) var(--graupl-breadcrumb-toggle-border-bottom-right-radius, var(--graupl-breadcrumb-link-border-bottom-right-radius, var(--graupl-border-bottom-right-radius, var(--graupl-border-radius, 0.125rem)))) var(--graupl-breadcrumb-toggle-border-bottom-left-radius, var(--graupl-breadcrumb-link-border-bottom-left-radius, var(--graupl-border-bottom-left-radius, var(--graupl-border-radius, 0.125rem)))));\n }\n}\n@layer graupl.theme {\n .breadcrumb {\n border-color: var(--graupl-breadcrumb-border-color, var(--graupl-breadcrumb-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n background: var(--graupl-breadcrumb-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n color: var(--graupl-breadcrumb-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))));\n }\n .breadcrumb-item {\n border-color: var(--graupl-breadcrumb-item-border-color, var(--graupl-breadcrumb-item-color, var(--graupl-breadcrumb-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n background: var(--graupl-breadcrumb-item-background, var(--graupl-breadcrumb-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n color: var(--graupl-breadcrumb-item-color, var(--graupl-breadcrumb-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n }\n .breadcrumb-link {\n border-color: var(--graupl-breadcrumb-link-border-color, var(--graupl-breadcrumb-link-color, var(--graupl-breadcrumb-item-color, var(--graupl-breadcrumb-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n background: var(--graupl-breadcrumb-link-background, var(--graupl-breadcrumb-item-background, var(--graupl-breadcrumb-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))))));\n color: var(--graupl-breadcrumb-link-color, var(--graupl-breadcrumb-item-color, var(--graupl-breadcrumb-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n }\n .breadcrumb-toggle {\n border-color: var(--graupl-link-border-color, transparent);\n background: var(--graupl-link-background, transparent);\n color: var(--graupl-link-color, var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%)))));\n text-decoration-color: var(--graupl-link-text-decoration-color, var(--graupl-link-color, var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%))))));\n }\n .breadcrumb-toggle:visited {\n border-color: var(--graupl-link-visited-border-color, var(--graupl-link-border-color, transparent));\n background: var(--graupl-link-visited-background, var(--graupl-link-background, transparent));\n color: var(--graupl-link-visited-color, var(--graupl-link-color, var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%))))));\n text-decoration-color: var(--graupl-link-visited-text-decoration-color, var(--graupl-link-visited-color, var(--graupl-link-color, var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%)))))));\n }\n .breadcrumb-toggle.visited {\n border-color: var(--graupl-link-visited-border-color, var(--graupl-link-border-color, transparent));\n background: var(--graupl-link-visited-background, var(--graupl-link-background, transparent));\n color: var(--graupl-link-visited-color, var(--graupl-link-color, var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%))))));\n text-decoration-color: var(--graupl-link-visited-text-decoration-color, var(--graupl-link-visited-color, var(--graupl-link-color, var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%)))))));\n }\n .breadcrumb-toggle:focus-visible {\n border-color: var(--graupl-link-focus-border-color, var(--graupl-link-border-color, transparent));\n background: var(--graupl-link-focus-background, var(--graupl-link-background, transparent));\n color: var(--graupl-link-focus-color, var(--graupl-link-color, var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%))))));\n text-decoration-color: var(--graupl-link-focus-text-decoration-color, var(--graupl-link-focus-color, var(--graupl-link-color, var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%)))))));\n }\n .breadcrumb-toggle.focus {\n border-color: var(--graupl-link-focus-border-color, var(--graupl-link-border-color, transparent));\n background: var(--graupl-link-focus-background, var(--graupl-link-background, transparent));\n color: var(--graupl-link-focus-color, var(--graupl-link-color, var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%))))));\n text-decoration-color: var(--graupl-link-focus-text-decoration-color, var(--graupl-link-focus-color, var(--graupl-link-color, var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%)))))));\n }\n .breadcrumb-toggle:hover {\n border-color: var(--graupl-link-hover-border-color, transparent);\n background: var(--graupl-link-hover-background, transparent);\n color: var(--graupl-link-hover-color, var(--graupl-theme-active--tertiary--700, var(--graupl-theme-light--tertiary--700, var(--graupl-tertiary--700, hsl(340, 65%, 35%)))));\n text-decoration-color: var(--graupl-link-hover-text-decoration-color, var(--graupl-link-hover-color, var(--graupl-theme-active--tertiary--700, var(--graupl-theme-light--tertiary--700, var(--graupl-tertiary--700, hsl(340, 65%, 35%))))));\n }\n .breadcrumb-toggle.hover {\n border-color: var(--graupl-link-hover-border-color, transparent);\n background: var(--graupl-link-hover-background, transparent);\n color: var(--graupl-link-hover-color, var(--graupl-theme-active--tertiary--700, var(--graupl-theme-light--tertiary--700, var(--graupl-tertiary--700, hsl(340, 65%, 35%)))));\n text-decoration-color: var(--graupl-link-hover-text-decoration-color, var(--graupl-link-hover-color, var(--graupl-theme-active--tertiary--700, var(--graupl-theme-light--tertiary--700, var(--graupl-tertiary--700, hsl(340, 65%, 35%))))));\n }\n .breadcrumb-toggle:active {\n border-color: var(--graupl-link-active-border-color, var(--graupl-link-hover-border-color, transparent));\n background: var(--graupl-link-active-background, var(--graupl-link-hover-background, transparent));\n color: var(--graupl-link-active-color, var(--graupl-link-hover-color, var(--graupl-theme-active--tertiary--700, var(--graupl-theme-light--tertiary--700, var(--graupl-tertiary--700, hsl(340, 65%, 35%))))));\n text-decoration-color: var(--graupl-link-active-text-decoration-color, var(--graupl-link-active-color, var(--graupl-link-hover-color, var(--graupl-theme-active--tertiary--700, var(--graupl-theme-light--tertiary--700, var(--graupl-tertiary--700, hsl(340, 65%, 35%)))))));\n }\n .breadcrumb-toggle.active {\n border-color: var(--graupl-link-active-border-color, var(--graupl-link-hover-border-color, transparent));\n background: var(--graupl-link-active-background, var(--graupl-link-hover-background, transparent));\n color: var(--graupl-link-active-color, var(--graupl-link-hover-color, var(--graupl-theme-active--tertiary--700, var(--graupl-theme-light--tertiary--700, var(--graupl-tertiary--700, hsl(340, 65%, 35%))))));\n text-decoration-color: var(--graupl-link-active-text-decoration-color, var(--graupl-link-active-color, var(--graupl-link-hover-color, var(--graupl-theme-active--tertiary--700, var(--graupl-theme-light--tertiary--700, var(--graupl-tertiary--700, hsl(340, 65%, 35%)))))));\n }\n .breadcrumb-toggle:disabled {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle:disabled:visited {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle:disabled.visited {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle:disabled:focus-visible {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle:disabled.focus {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle:disabled:hover {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle:disabled.hover {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle:disabled:active {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle:disabled.active {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle:disabled[aria-selected=true] {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle:disabled.selected {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle:disabled[aria-current=true] {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle:disabled.current {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[disabled] {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[disabled]:visited {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[disabled].visited {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[disabled]:focus-visible {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[disabled].focus {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[disabled]:hover {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[disabled].hover {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[disabled]:active {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[disabled].active {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[disabled][aria-selected=true] {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[disabled].selected {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[disabled][aria-current=true] {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[disabled].current {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[aria-disabled=true] {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[aria-disabled=true]:visited {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[aria-disabled=true].visited {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[aria-disabled=true]:focus-visible {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[aria-disabled=true].focus {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[aria-disabled=true]:hover {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[aria-disabled=true].hover {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[aria-disabled=true]:active {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[aria-disabled=true].active {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[aria-disabled=true][aria-selected=true] {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[aria-disabled=true].selected {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[aria-disabled=true][aria-current=true] {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle[aria-disabled=true].current {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle.disabled {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle.disabled:visited {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle.disabled.visited {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle.disabled:focus-visible {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle.disabled.focus {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle.disabled:hover {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle.disabled.hover {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle.disabled:active {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle.disabled.active {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle.disabled[aria-selected=true] {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle.disabled.selected {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle.disabled[aria-current=true] {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle.disabled.current {\n border-color: var(--graupl-link-disabled-border-color, transparent);\n background: var(--graupl-link-disabled-background, transparent);\n color: var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n text-decoration-color: var(--graupl-link-disabled-text-decoration-color, var(--graupl-link-disabled-color, var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))))));\n }\n .breadcrumb-toggle {\n border-color: var(--graupl-breadcrumb-toggle-border-color, var(--graupl-breadcrumb-toggle-color, var(--graupl-breadcrumb-link-color, var(--graupl-breadcrumb-item-color, var(--graupl-breadcrumb-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))))));\n background: var(--graupl-breadcrumb-toggle-background, var(--graupl-breadcrumb-link-background, var(--graupl-breadcrumb-item-background, var(--graupl-breadcrumb-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))))));\n color: var(--graupl-breadcrumb-toggle-color, var(--graupl-breadcrumb-link-color, var(--graupl-breadcrumb-item-color, var(--graupl-breadcrumb-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))))));\n }\n}","// @graupl/core layer mixins.\n//\n// These should be used to define the layers of your components to ensure that\n// they are output in the correct order in the final compiled CSS.\n\n@use \"../defaults\" as root-defaults;\n\n@mixin layer($layer) {\n @if root-defaults.$use-layers {\n @layer #{root-defaults.$id}.#{$layer} {\n @content;\n }\n } @else {\n @content;\n }\n}\n","// @graupl/core breadcrumb component styles.\n//\n// This module provides the breadcrumb component styles.\n//\n// The following selectors are generated by default:\n// - `.breadcrumb`: The breadcrumb container.\n// - `.breadcrumb-item`: The breadcrumb item.\n//\n// The following custom properties can be used to customize the breadcrumb component:\n// For the complete property set and defaults, see `_variables.scss`.\n// | Property | Description | Default Value |\n// | ------------------------------------------------------- | ------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |\n// | `--graupl-breadcrumb-padding-x` | Horizontal padding for the breadcrumb container. | `var(--graupl-spacer-0)` |\n// | `--graupl-breadcrumb-padding-y` | Vertical padding for the breadcrumb container. | `var(--graupl-spacer-0)` |\n// | `--graupl-breadcrumb-padding` | Padding for the breadcrumb container. | `var(--graupl-breadcrumb-padding-y) var(--graupl-breadcrumb-padding-x)` |\n// | `--graupl-breadcrumb-margin-x` | Horizontal margin for the breadcrumb container. | `var(--graupl-spacer-0)` |\n// | `--graupl-breadcrumb-margin-y` | Vertical margin for the breadcrumb container. | `var(--graupl-spacer-0)` |\n// | `--graupl-breadcrumb-margin` | Margin for the breadcrumb container. | `var(--graupl-breadcrumb-margin-y) var(--graupl-breadcrumb-margin-x)` |\n// | `--graupl-breadcrumb-column-gap` | Horizontal gap for the breadcrumb container. | `var(--graupl-spacer-2)` |\n// | `--graupl-breadcrumb-row-gap` | Vertical gap for the breadcrumb container. | `var(--graupl-spacer-2)` |\n// | `--graupl-breadcrumb-gap` | Gap for the breadcrumb container. | `var(--graupl-breadcrumb-column-gap) var(--graupl-breadcrumb-row-gap)` |\n// | `--graupl-breadcrumb-background` | Background for the breadcrumb container. | `var(--graupl-background)` |\n// | `--graupl-breadcrumb-color` | Text color for the breadcrumb container. | `var(--graupl-color)` |\n// | `--graupl-breadcrumb-border-color` | Border color for the breadcrumb container. | `var(--graupl-breadcrumb-color)` |\n// | `--graupl-breadcrumb-border-top-left-radius` | Top-left border radius for the breadcrumb container. | `var(--graupl-border-top-left-radius)` |\n// | `--graupl-breadcrumb-border-top-right-radius` | Top-right border radius for the breadcrumb container. | `var(--graupl-border-top-right-radius)` |\n// | `--graupl-breadcrumb-border-bottom-left-radius` | Bottom-left border radius for the breadcrumb container. | `var(--graupl-border-bottom-left-radius)` |\n// | `--graupl-breadcrumb-border-bottom-right-radius` | Bottom-right border radius for the breadcrumb container. | `var(--graupl-border-bottom-right-radius)` |\n// | `--graupl-breadcrumb-border-radius` | Border radius for the breadcrumb container. | `var(--graupl-breadcrumb-border-top-left-radius) var(--graupl-breadcrumb-border-top-right-radius) var(--graupl-breadcrumb-border-bottom-right-radius) var(--graupl-breadcrumb-border-bottom-left-radius)` |\n// | `--graupl-breadcrumb-border-top-width` | Top border width for the breadcrumb container. | `0` |\n// | `--graupl-breadcrumb-border-right-width` | Right border width for the breadcrumb container. | `0` |\n// | `--graupl-breadcrumb-border-bottom-width` | Bottom border width for the breadcrumb container. | `0` |\n// | `--graupl-breadcrumb-border-left-width` | Left border width for the breadcrumb container. | `0` |\n// | `--graupl-breadcrumb-border-width` | Border width for the breadcrumb container. | `var(--graupl-breadcrumb-border-top-width) var(--graupl-breadcrumb-border-right-width) var(--graupl-breadcrumb-border-bottom-width) var(--graupl-breadcrumb-border-left-width)` |\n// | `--graupl-breadcrumb-border-top-style` | Top border style for the breadcrumb container. | `var(--graupl-border-top-style)` |\n// | `--graupl-breadcrumb-border-right-style` | Right border style for the breadcrumb container. | `var(--graupl-border-right-style)` |\n// | `--graupl-breadcrumb-border-bottom-style` | Bottom border style for the breadcrumb container. | `var(--graupl-border-bottom-style)` |\n// | `--graupl-breadcrumb-border-left-style` | Left border style for the breadcrumb container. | `var(--graupl-border-left-style)` |\n// | `--graupl-breadcrumb-border-style` | Border style for the breadcrumb container. | `var(--graupl-breadcrumb-border-top-style) var(--graupl-breadcrumb-border-right-style) var(--graupl-breadcrumb-border-bottom-style) var(--graupl-breadcrumb-border-left-style)` |\n// | `--graupl-breadcrumb-item-show-display` | Display for the breadcrumb item in the shown state. | `flex` |\n// | `--graupl-breadcrumb-item-hide-display` | Display for the breadcrumb item in the hidden state. | `none` |\n// | `--graupl-breadcrumb-item-transitioning-display` | Display for the breadcrumb item in the transitioning state. | `flex` |\n// | `--graupl-breadcrumb-item-display` | Display value for the breadcrumb item. | `flex` |\n// | `--graupl-breadcrumb-item-show-opacity` | Opacity for the breadcrumb item in the shown state. | `1` |\n// | `--graupl-breadcrumb-item-hide-opacity` | Opacity for the breadcrumb item in the hidden state. | `0` |\n// | `--graupl-breadcrumb-item-transitioning-opacity` | Opacity for the breadcrumb item in the transitioning state. | `0` |\n// | `--graupl-breadcrumb-item-opacity` | Opacity for the breadcrumb item. | `var(--graupl-breadcrumb-item-show-opacity)` |\n// | `--graupl-breadcrumb-item-transition-duration` | Transition duration for the breadcrumb item. | `var(--graupl-transition-duration-fast)` |\n// | `--graupl-breadcrumb-item-transition-timing-function` | Transition timing function for the breadcrumb item. | `var(--graupl-transition-timing-function)` |\n// | `--graupl-breadcrumb-item-transition` | Transition applied to the breadcrumb item. | `opacity var(--graupl-breadcrumb-item-transition-duration) var(--graupl-breadcrumb-item-transition-timing-function)` |\n// | `--graupl-breadcrumb-item-transition-reduced-motion` | Transition used for the breadcrumb item when reduced motion is enabled. | `none` |\n// | `--graupl-breadcrumb-item-padding-x` | Horizontal padding for the breadcrumb item. | `0` |\n// | `--graupl-breadcrumb-item-padding-y` | Vertical padding for the breadcrumb item. | `0` |\n// | `--graupl-breadcrumb-item-padding` | Padding for the breadcrumb item. | `var(--graupl-breadcrumb-item-padding-y) var(--graupl-breadcrumb-item-padding-x)` |\n// | `--graupl-breadcrumb-item-column-gap` | Horizontal gap for the breadcrumb item. | `var(--graupl-breadcrumb-column-gap)` |\n// | `--graupl-breadcrumb-item-row-gap` | Vertical gap for the breadcrumb item. | `var(--graupl-breadcrumb-row-gap)` |\n// | `--graupl-breadcrumb-item-gap` | Gap for the breadcrumb item. | `var(--graupl-breadcrumb-item-column-gap) var(--graupl-breadcrumb-item-row-gap)` |\n// | `--graupl-breadcrumb-item-color` | Text color for the breadcrumb item. | `var(--graupl-breadcrumb-color)` |\n// | `--graupl-breadcrumb-item-background` | Background for the breadcrumb item. | `var(--graupl-breadcrumb-background)` |\n// | `--graupl-breadcrumb-item-visited-color` | Text color for the breadcrumb item in the visited state. | `var(--graupl-breadcrumb-item-color)` |\n// | `--graupl-breadcrumb-item-focus-color` | Text color for the breadcrumb item in the focus state. | `var(--graupl-breadcrumb-item-color)` |\n// | `--graupl-breadcrumb-item-hover-color` | Text color for the breadcrumb item in the hover state. | `var(--graupl-breadcrumb-item-background)` |\n// | `--graupl-breadcrumb-item-active-color` | Text color for the breadcrumb item in the active state. | `var(--graupl-breadcrumb-item-hover-color)` |\n// | `--graupl-breadcrumb-item-disabled-color` | Text color for the breadcrumb item in the disabled state. | `var(--graupl-theme-active--primary--200)` |\n// | `--graupl-breadcrumb-item-visited-background` | Background for the breadcrumb item in the visited state. | `var(--graupl-breadcrumb-item-background)` |\n// | `--graupl-breadcrumb-item-focus-background` | Background for the breadcrumb item in the focus state. | `var(--graupl-breadcrumb-item-background)` |\n// | `--graupl-breadcrumb-item-hover-background` | Background for the breadcrumb item in the hover state. | `var(--graupl-breadcrumb-item-color)` |\n// | `--graupl-breadcrumb-item-active-background` | Background for the breadcrumb item in the active state. | `var(--graupl-breadcrumb-item-hover-background)` |\n// | `--graupl-breadcrumb-item-disabled-background` | Background for the breadcrumb item in the disabled state. | `var(--graupl-theme-active--primary--200)` |\n// | `--graupl-breadcrumb-item-border-color` | Border color for the breadcrumb item. | `var(--graupl-breadcrumb-item-color)` |\n// | `--graupl-breadcrumb-item-border-top-left-radius` | Top-left border radius for the breadcrumb item. | `var(--graupl-border-top-left-radius)` |\n// | `--graupl-breadcrumb-item-border-top-right-radius` | Top-right border radius for the breadcrumb item. | `var(--graupl-border-top-right-radius)` |\n// | `--graupl-breadcrumb-item-border-bottom-left-radius` | Bottom-left border radius for the breadcrumb item. | `var(--graupl-border-bottom-left-radius)` |\n// | `--graupl-breadcrumb-item-border-bottom-right-radius` | Bottom-right border radius for the breadcrumb item. | `var(--graupl-border-bottom-right-radius)` |\n// | `--graupl-breadcrumb-item-border-radius` | Border radius for the breadcrumb item. | `var(--graupl-breadcrumb-item-border-top-left-radius) var(--graupl-breadcrumb-item-border-top-right-radius) var(--graupl-breadcrumb-item-border-bottom-right-radius) var(--graupl-breadcrumb-item-border-bottom-left-radius)` |\n// | `--graupl-breadcrumb-item-border-top-width` | Top border width for the breadcrumb item. | `0` |\n// | `--graupl-breadcrumb-item-border-right-width` | Right border width for the breadcrumb item. | `0` |\n// | `--graupl-breadcrumb-item-border-bottom-width` | Bottom border width for the breadcrumb item. | `0` |\n// | `--graupl-breadcrumb-item-border-left-width` | Left border width for the breadcrumb item. | `0` |\n// | `--graupl-breadcrumb-item-border-width` | Border width for the breadcrumb item. | `var(--graupl-breadcrumb-item-border-top-width) var(--graupl-breadcrumb-item-border-right-width) var(--graupl-breadcrumb-item-border-bottom-width) var(--graupl-breadcrumb-item-border-left-width)` |\n// | `--graupl-breadcrumb-item-border-top-style` | Top border style for the breadcrumb item. | `var(--graupl-border-top-style)` |\n// | `--graupl-breadcrumb-item-border-right-style` | Right border style for the breadcrumb item. | `var(--graupl-border-right-style)` |\n// | `--graupl-breadcrumb-item-border-bottom-style` | Bottom border style for the breadcrumb item. | `var(--graupl-border-bottom-style)` |\n// | `--graupl-breadcrumb-item-border-left-style` | Left border style for the breadcrumb item. | `var(--graupl-border-left-style)` |\n// | `--graupl-breadcrumb-item-border-style` | Border style for the breadcrumb item. | `var(--graupl-breadcrumb-item-border-top-style) var(--graupl-breadcrumb-item-border-right-style) var(--graupl-breadcrumb-item-border-bottom-style) var(--graupl-breadcrumb-item-border-left-style)` |\n// | `--graupl-breadcrumb-link-padding-x` | Horizontal padding for the breadcrumb link. | `0` |\n// | `--graupl-breadcrumb-link-padding-y` | Vertical padding for the breadcrumb link. | `0` |\n// | `--graupl-breadcrumb-link-padding` | Padding for the breadcrumb link. | `var(--graupl-breadcrumb-link-padding-y) var(--graupl-breadcrumb-link-padding-x)` |\n// | `--graupl-breadcrumb-link-transition-duration` | Transition duration for the breadcrumb link. | `var(--graupl-transition-duration-fast)` |\n// | `--graupl-breadcrumb-link-transition-timing-function` | Transition timing function for the breadcrumb link. | `var(--graupl-transition-timing-function)` |\n// | `--graupl-breadcrumb-link-transition` | Transition applied to the breadcrumb link. | `transform var(--graupl-breadcrumb-link-transition-duration) var(--graupl-breadcrumb-link-transition-timing-function)` |\n// | `--graupl-breadcrumb-link-transition-reduced-motion` | Transition used for the breadcrumb link when reduced motion is enabled. | `none` |\n// | `--graupl-breadcrumb-link-transform` | Transform for the breadcrumb link. | `none` |\n// | `--graupl-breadcrumb-link-visited-transform` | Transform for the breadcrumb link in the visited state. | `var(--graupl-breadcrumb-link-transform)` |\n// | `--graupl-breadcrumb-link-focus-transform` | Transform for the breadcrumb link in the focus state. | `var(--graupl-breadcrumb-link-transform)` |\n// | `--graupl-breadcrumb-link-hover-transform` | Transform for the breadcrumb link in the hover state. | `var(--graupl-breadcrumb-link-transform)` |\n// | `--graupl-breadcrumb-link-active-transform` | Transform for the breadcrumb link in the active state. | `none` |\n// | `--graupl-breadcrumb-link-disabled-transform` | Transform for the breadcrumb link in the disabled state. | `none` |\n// | `--graupl-breadcrumb-link-color` | Text color for the breadcrumb link. | `var(--graupl-breadcrumb-item-color)` |\n// | `--graupl-breadcrumb-link-background` | Background for the breadcrumb link. | `var(--graupl-breadcrumb-item-background)` |\n// | `--graupl-breadcrumb-link-visited-color` | Text color for the breadcrumb link in the visited state. | `var(--graupl-breadcrumb-link-color)` |\n// | `--graupl-breadcrumb-link-focus-color` | Text color for the breadcrumb link in the focus state. | `var(--graupl-breadcrumb-link-color)` |\n// | `--graupl-breadcrumb-link-hover-color` | Text color for the breadcrumb link in the hover state. | `var(--graupl-breadcrumb-link-background)` |\n// | `--graupl-breadcrumb-link-active-color` | Text color for the breadcrumb link in the active state. | `var(--graupl-breadcrumb-link-hover-color)` |\n// | `--graupl-breadcrumb-link-disabled-color` | Text color for the breadcrumb link in the disabled state. | `var(--graupl-theme-active--primary--200)` |\n// | `--graupl-breadcrumb-link-visited-background` | Background for the breadcrumb link in the visited state. | `var(--graupl-breadcrumb-link-background)` |\n// | `--graupl-breadcrumb-link-focus-background` | Background for the breadcrumb link in the focus state. | `var(--graupl-breadcrumb-link-background)` |\n// | `--graupl-breadcrumb-link-hover-background` | Background for the breadcrumb link in the hover state. | `var(--graupl-breadcrumb-link-color)` |\n// | `--graupl-breadcrumb-link-active-background` | Background for the breadcrumb link in the active state. | `var(--graupl-breadcrumb-link-hover-background)` |\n// | `--graupl-breadcrumb-link-disabled-background` | Background for the breadcrumb link in the disabled state. | `var(--graupl-theme-active--primary--200)` |\n// | `--graupl-breadcrumb-link-border-color` | Border color for the breadcrumb link. | `var(--graupl-breadcrumb-link-color)` |\n// | `--graupl-breadcrumb-link-border-top-left-radius` | Top-left border radius for the breadcrumb link. | `var(--graupl-border-top-left-radius)` |\n// | `--graupl-breadcrumb-link-border-top-right-radius` | Top-right border radius for the breadcrumb link. | `var(--graupl-border-top-right-radius)` |\n// | `--graupl-breadcrumb-link-border-bottom-left-radius` | Bottom-left border radius for the breadcrumb link. | `var(--graupl-border-bottom-left-radius)` |\n// | `--graupl-breadcrumb-link-border-bottom-right-radius` | Bottom-right border radius for the breadcrumb link. | `var(--graupl-border-bottom-right-radius)` |\n// | `--graupl-breadcrumb-link-border-radius` | Border radius for the breadcrumb link. | `var(--graupl-breadcrumb-link-border-top-left-radius) var(--graupl-breadcrumb-link-border-top-right-radius) var(--graupl-breadcrumb-link-border-bottom-right-radius) var(--graupl-breadcrumb-link-border-bottom-left-radius)` |\n// | `--graupl-breadcrumb-link-border-top-width` | Top border width for the breadcrumb link. | `0` |\n// | `--graupl-breadcrumb-link-border-right-width` | Right border width for the breadcrumb link. | `0` |\n// | `--graupl-breadcrumb-link-border-bottom-width` | Bottom border width for the breadcrumb link. | `0` |\n// | `--graupl-breadcrumb-link-border-left-width` | Left border width for the breadcrumb link. | `0` |\n// | `--graupl-breadcrumb-link-border-width` | Border width for the breadcrumb link. | `var(--graupl-breadcrumb-link-border-top-width) var(--graupl-breadcrumb-link-border-right-width) var(--graupl-breadcrumb-link-border-bottom-width) var(--graupl-breadcrumb-link-border-left-width)` |\n// | `--graupl-breadcrumb-link-border-top-style` | Top border style for the breadcrumb link. | `var(--graupl-border-top-style)` |\n// | `--graupl-breadcrumb-link-border-right-style` | Right border style for the breadcrumb link. | `var(--graupl-border-right-style)` |\n// | `--graupl-breadcrumb-link-border-bottom-style` | Bottom border style for the breadcrumb link. | `var(--graupl-border-bottom-style)` |\n// | `--graupl-breadcrumb-link-border-left-style` | Left border style for the breadcrumb link. | `var(--graupl-border-left-style)` |\n// | `--graupl-breadcrumb-link-border-style` | Border style for the breadcrumb link. | `var(--graupl-breadcrumb-link-border-top-style) var(--graupl-breadcrumb-link-border-right-style) var(--graupl-breadcrumb-link-border-bottom-style) var(--graupl-breadcrumb-link-border-left-style)` |\n// | `--graupl-breadcrumb-toggle-padding-x` | Horizontal padding for the breadcrumb toggle. | `var(--graupl-breadcrumb-link-padding-x)` |\n// | `--graupl-breadcrumb-toggle-padding-y` | Vertical padding for the breadcrumb toggle. | `var(--graupl-breadcrumb-link-padding-y)` |\n// | `--graupl-breadcrumb-toggle-padding` | Padding for the breadcrumb toggle. | `var(--graupl-breadcrumb-toggle-padding-y) var(--graupl-breadcrumb-toggle-padding-x)` |\n// | `--graupl-breadcrumb-toggle-transition-duration` | Transition duration for the breadcrumb toggle. | `var(--graupl-breadcrumb-link-transition-duration)` |\n// | `--graupl-breadcrumb-toggle-transition-timing-function` | Transition timing function for the breadcrumb toggle. | `var(--graupl-breadcrumb-link-transition-timing-function)` |\n// | `--graupl-breadcrumb-toggle-transition` | Transition applied to the breadcrumb toggle. | `transform var(--graupl-breadcrumb-toggle-transition-duration) var(--graupl-breadcrumb-toggle-transition-timing-function)` |\n// | `--graupl-breadcrumb-toggle-transition-reduced-motion` | Transition used for the breadcrumb toggle when reduced motion is enabled. | `var(--graupl-breadcrumb-link-transition-reduced-motion)` |\n// | `--graupl-breadcrumb-toggle-transform` | Transform for the breadcrumb toggle. | `var(--graupl-breadcrumb-link-transform)` |\n// | `--graupl-breadcrumb-toggle-visited-transform` | Transform for the breadcrumb toggle in the visited state. | `var(--graupl-breadcrumb-toggle-transform)` |\n// | `--graupl-breadcrumb-toggle-focus-transform` | Transform for the breadcrumb toggle in the focus state. | `var(--graupl-breadcrumb-toggle-transform)` |\n// | `--graupl-breadcrumb-toggle-hover-transform` | Transform for the breadcrumb toggle in the hover state. | `var(--graupl-breadcrumb-toggle-transform)` |\n// | `--graupl-breadcrumb-toggle-active-transform` | Transform for the breadcrumb toggle in the active state. | `var(--graupl-breadcrumb-link-active-transform)` |\n// | `--graupl-breadcrumb-toggle-disabled-transform` | Transform for the breadcrumb toggle in the disabled state. | `var(--graupl-breadcrumb-link-disabled-transform)` |\n// | `--graupl-breadcrumb-toggle-color` | Text color for the breadcrumb toggle. | `var(--graupl-breadcrumb-link-color)` |\n// | `--graupl-breadcrumb-toggle-background` | Background for the breadcrumb toggle. | `var(--graupl-breadcrumb-link-background)` |\n// | `--graupl-breadcrumb-toggle-visited-color` | Text color for the breadcrumb toggle in the visited state. | `var(--graupl-breadcrumb-toggle-color)` |\n// | `--graupl-breadcrumb-toggle-focus-color` | Text color for the breadcrumb toggle in the focus state. | `var(--graupl-breadcrumb-toggle-color)` |\n// | `--graupl-breadcrumb-toggle-hover-color` | Text color for the breadcrumb toggle in the hover state. | `var(--graupl-breadcrumb-toggle-background)` |\n// | `--graupl-breadcrumb-toggle-active-color` | Text color for the breadcrumb toggle in the active state. | `var(--graupl-breadcrumb-toggle-hover-color)` |\n// | `--graupl-breadcrumb-toggle-disabled-color` | Text color for the breadcrumb toggle in the disabled state. | `var(--graupl-theme-active--primary--200)` |\n// | `--graupl-breadcrumb-toggle-visited-background` | Background for the breadcrumb toggle in the visited state. | `var(--graupl-breadcrumb-toggle-background)` |\n// | `--graupl-breadcrumb-toggle-focus-background` | Background for the breadcrumb toggle in the focus state. | `var(--graupl-breadcrumb-toggle-background)` |\n// | `--graupl-breadcrumb-toggle-hover-background` | Background for the breadcrumb toggle in the hover state. | `var(--graupl-breadcrumb-toggle-color)` |\n// | `--graupl-breadcrumb-toggle-active-background` | Background for the breadcrumb toggle in the active state. | `var(--graupl-breadcrumb-toggle-hover-background)` |\n// | `--graupl-breadcrumb-toggle-disabled-background` | Background for the breadcrumb toggle in the disabled state. | `var(--graupl-theme-active--primary--200)` |\n// | `--graupl-breadcrumb-toggle-border-color` | Border color for the breadcrumb toggle. | `var(--graupl-breadcrumb-toggle-color)` |\n// | `--graupl-breadcrumb-toggle-border-top-left-radius` | Top-left border radius for the breadcrumb toggle. | `var(--graupl-breadcrumb-link-border-top-left-radius)` |\n// | `--graupl-breadcrumb-toggle-border-top-right-radius` | Top-right border radius for the breadcrumb toggle. | `var(--graupl-breadcrumb-link-border-top-right-radius)` |\n// | `--graupl-breadcrumb-toggle-border-bottom-left-radius` | Bottom-left border radius for the breadcrumb toggle. | `var(--graupl-breadcrumb-link-border-bottom-left-radius)` |\n// | `--graupl-breadcrumb-toggle-border-bottom-right-radius` | Bottom-right border radius for the breadcrumb toggle. | `var(--graupl-breadcrumb-link-border-bottom-right-radius)` |\n// | `--graupl-breadcrumb-toggle-border-radius` | Border radius for the breadcrumb toggle. | `var(--graupl-breadcrumb-toggle-border-top-left-radius) var(--graupl-breadcrumb-toggle-border-top-right-radius) var(--graupl-breadcrumb-toggle-border-bottom-right-radius) var(--graupl-breadcrumb-toggle-border-bottom-left-radius)` |\n// | `--graupl-breadcrumb-toggle-border-top-width` | Top border width for the breadcrumb toggle. | `var(--graupl-breadcrumb-link-border-top-width)` |\n// | `--graupl-breadcrumb-toggle-border-right-width` | Right border width for the breadcrumb toggle. | `var(--graupl-breadcrumb-link-border-right-width)` |\n// | `--graupl-breadcrumb-toggle-border-bottom-width` | Bottom border width for the breadcrumb toggle. | `var(--graupl-breadcrumb-link-border-bottom-width)` |\n// | `--graupl-breadcrumb-toggle-border-left-width` | Left border width for the breadcrumb toggle. | `var(--graupl-breadcrumb-link-border-left-width)` |\n// | `--graupl-breadcrumb-toggle-border-width` | Border width for the breadcrumb toggle. | `var(--graupl-breadcrumb-toggle-border-top-width) var(--graupl-breadcrumb-toggle-border-right-width) var(--graupl-breadcrumb-toggle-border-bottom-width) var(--graupl-breadcrumb-toggle-border-left-width)` |\n// | `--graupl-breadcrumb-toggle-border-top-style` | Top border style for the breadcrumb toggle. | `var(--graupl-breadcrumb-link-border-top-style)` |\n// | `--graupl-breadcrumb-toggle-border-right-style` | Right border style for the breadcrumb toggle. | `var(--graupl-breadcrumb-link-border-right-style)` |\n// | `--graupl-breadcrumb-toggle-border-bottom-style` | Bottom border style for the breadcrumb toggle. | `var(--graupl-breadcrumb-link-border-bottom-style)` |\n// | `--graupl-breadcrumb-toggle-border-left-style` | Left border style for the breadcrumb toggle. | `var(--graupl-breadcrumb-link-border-left-style)` |\n// | `--graupl-breadcrumb-toggle-border-style` | Border style for the breadcrumb toggle. | `var(--graupl-breadcrumb-toggle-border-top-style) var(--graupl-breadcrumb-toggle-border-right-style) var(--graupl-breadcrumb-toggle-border-bottom-style) var(--graupl-breadcrumb-toggle-border-left-style)` |\n// | `--graupl-breadcrumb-item-separator` | Separator content rendered between breadcrumb items. | `\"'/'\"` |\n//\n// The following sass variables can be used to customize the generation of the breadcrumb component:\n// | Variable | Description | Default Value |\n// | -------------------------------------------- | ------------------------------------------------- | ------------------------- |\n// | `$selector-base` | Selector base for the component. | `\".\"` |\n// | `$modifier-selector-base` | Selector base for component modifiers. | `\".\"` |\n// | `$generate-base-theme-map` | Flag to generate the base theme map. | `true` |\n// | `$themeable` | Flag to generate theme modifiers. | `false` |\n// | `$breadcrumb-selector-base` | Selector base for the breadcrumb container. | `\".\"` |\n// | `$breadcrumb-selector` | Selector for the breadcrumb container. | `\"breadcrumb\"` |\n// | `$breadcrumb-theme-selector-base` | Selector base for theme modifiers. | `\".\"` |\n// | `$breadcrumb-theme-selector-prefix` | Selector prefix for theme modifiers. | `\"\"` |\n// | `$breadcrumb-item-selector-base` | Selector base for breadcrumb items. | `\".\"` |\n// | `$breadcrumb-item-selector` | Selector for breadcrumb items. | `\"breadcrumb-item\"` |\n// | `$breadcrumb-item-separator-pseudo-selector` | Pseudo selector for breadcrumb separators. | `\"after\"` |\n// | `$breadcrumb-item-separator` | Content used as the breadcrumb separator. | `\"'/'\"` |\n// | `$breadcrumb-toggle-selector-base` | Selector base for breadcrumb toggles. | `\".\"` |\n// | `$breadcrumb-toggle-selector` | Selector for breadcrumb toggles. | `\"breadcrumb-toggle\"` |\n// | `$breadcrumb-link-selector-base` | Selector base for breadcrumb links. | `\".\"` |\n// | `$breadcrumb-link-selector` | Selector for breadcrumb links. | `\"breadcrumb-link\"` |\n// | `$breadcrumb-open-selector-base` | Selector base for the open breadcrumb modifier. | `\".\"` |\n// | `$breadcrumb-open-selector` | Selector for the open breadcrumb modifier. | `\"show\"` |\n// | `$breadcrumb-close-selector-base` | Selector base for the closed breadcrumb modifier. | `\".\"` |\n// | `$breadcrumb-close-selector` | Selector for the closed breadcrumb modifier. | `\"hide\"` |\n// | `$breadcrumb-transition-selector-base` | Selector base for the transitioning modifier. | `\".\"` |\n// | `$breadcrumb-transition-selector` | Selector for the transitioning modifier. | `\"transitioning\"` |\n// | `$breadcrumb-link-initial-transform` | Initial transform for breadcrumb links. | `none` |\n// | `$breadcrumb-link-final-transform` | Final transform for breadcrumb links. | `none` |\n// | `$breadcrumb-link-disabled-transform` | Disabled transform for breadcrumb links. | `none` |\n// | `$breadcrumb-item-show-display` | Display for shown breadcrumb items. | `flex` |\n// | `$breadcrumb-item-hide-display` | Display for hidden breadcrumb items. | `none` |\n// | `$breadcrumb-item-transitioning-display` | Display for transitioning breadcrumb items. | `flex` |\n// | `$breadcrumb-item-show-opacity` | Opacity for shown breadcrumb items. | `1` |\n// | `$breadcrumb-item-hide-opacity` | Opacity for hidden breadcrumb items. | `0` |\n// | `$breadcrumb-item-transitioning-opacity` | Opacity for transitioning breadcrumb items. | `0` |\n// | `$breadcrumb-item-transform` | Base transform for breadcrumb items. | `none` |\n// | `$breadcrumb-item-hover-transform` | Hover transform for breadcrumb items. | `none` |\n// | `$breadcrumb-theme-mappings` | Map of properties/shades for breadcrumb themes. | `()` |\n// | `$breadcrumb-theme-map` | Expanded map of properties/colors/shades. | `()` |\n//\n// ## Using `$breadcrumb-theme-mappings`\n//\n// `$breadcrumb-theme-mappings` is a 1-level map of properties and shade values.\n//\n// e.g.\n// ```scss\n// $breadcrumb-theme-mappings: (\n// color: 900,\n// border-color: 700,\n// )\n// ```\n//\n// This directly[1] maps to all breadcrumb variants, telling them what shade to use for the base colour slots.\n// All breadcrumb variants will use the following based on the example above:\n// - Primary breadcrumbs will have their `--graupl-breadcrumb-color` property set to `--graupl-theme-active--primary--900` and `--graupl-breadcrumb-border-color` to `--graupl-theme-active--primary--700`,\n// - Secondary breadcrumbs will use the same shades for the secondary palette, and\n// - Tertiary breadcrumbs will use the same shades for the tertiary palette.\n//\n// You can use this to customize _all_ breadcrumb variants in the same way.\n//\n// For example, if you use the following map:\n// ```scss\n// $breadcrumb-theme-mappings: (\n// color: 500,\n// item-color: 500,\n// )\n// ```\n//\n// All breadcrumb variants will use the following:\n// - Primary breadcrumbs will have their `--graupl-breadcrumb-color` and `--graupl-breadcrumb-item-color` properties set to `--graupl-theme-active--primary--500`,\n// - Secondary breadcrumbs will have theirs set to `--graupl-theme-active--secondary--500`, and\n// - Tertiary breadcrumbs will have theirs set to `--graupl-theme-active--tertiary--500`.\n//\n// [1] `$breadcrumb-theme-mappings` gets parsed into a larger, more explicit map: `$breadcrumb-theme-map`.\n//\n// Using `$breadcrumb-theme-map`\n//\n// `$breadcrumb-theme-map` is a multi-level map of properties, colors, and shade values.\n//\n// e.g.\n// ```scss\n// $breadcrumb-theme-map: (\n// primary: (\n// item-border-color: (\n// color: secondary,\n// shade: 700\n// ),\n// ),\n// secondary: (\n// item-border-color: (\n// color: secondary,\n// shade: 500\n// ),\n// ),\n// tertiary: (\n// item-border-color: (\n// color: tertiary,\n// shade: 300\n// ),\n// ),\n// )\n// ```\n//\n// This directly maps to all breadcrumb variants, telling them what shade to use for said property.\n// You can use this to customize breadcrumb variants individually.\n//\n// @example\n// <ul class=\"breadcrumb\">\n// <li class=\"breadcrumb-item\">First item</li>\n// <li class=\"breadcrumb-item\">Second item</li>\n// <li class=\"breadcrumb-item\">Third item</li>\n// </ul>\n//\n// @example\n// <ol class=\"breadcrumb\">\n// <li class=\"breadcrumb-item\">Numbered item one</li>\n// <li class=\"breadcrumb-item\">Numbered item two</li>\n// <li class=\"breadcrumb-item\">Numbered item three</li>\n// </ol>\n\n@use \"../../defaults\" as root-defaults;\n@use \"../../mixins/animation\";\n@use \"../../mixins/layer\" as *;\n@use \"../../mixins/theme\" as theme;\n@use \"../../base/link/mixins\" as link-mixins;\n@use \"defaults\";\n@use \"sass:map\";\n@use \"variables\" as *;\n\n@include layer(component) {\n // .breadcrumb\n #{defaults.$breadcrumb-selector-base}#{defaults.$breadcrumb-selector} {\n display: flex;\n position: relative;\n flex-wrap: wrap;\n margin: $breadcrumb-margin;\n padding: $breadcrumb-padding;\n border-width: $breadcrumb-border-width;\n border-style: $breadcrumb-border-style;\n border-radius: $breadcrumb-border-radius;\n list-style: none;\n gap: $breadcrumb-gap;\n\n // &.show\n &#{defaults.$breadcrumb-open-selector-base}#{defaults.$breadcrumb-open-selector} {\n // .breadcrumb-item:has(.breadcrumb-toggle)\n #{defaults.$breadcrumb-item-selector-base}#{defaults.$breadcrumb-item-selector}:has(\n .breadcrumb-toggle\n ) {\n display: $breadcrumb-item-hide-display;\n opacity: $breadcrumb-item-hide-opacity;\n }\n }\n\n // &.hide\n &#{defaults.$breadcrumb-close-selector-base}#{defaults.$breadcrumb-close-selector} {\n // .breadcrumb-item\n #{defaults.$breadcrumb-item-selector-base}#{defaults.$breadcrumb-item-selector}:has(\n #{defaults.$breadcrumb-toggle-selector-base}#{defaults.$breadcrumb-toggle-selector}\n ) {\n display: $breadcrumb-item-show-display;\n opacity: $breadcrumb-item-show-opacity;\n\n ~ #{defaults.$breadcrumb-item-selector-base}#{defaults.$breadcrumb-item-selector}:not(\n :last-child\n ) {\n display: $breadcrumb-item-hide-display;\n opacity: $breadcrumb-item-hide-opacity;\n }\n }\n }\n\n // &.transitioning\n &#{defaults.$breadcrumb-transition-selector-base}#{defaults.$breadcrumb-transition-selector} {\n // .breadcrumb-item:has(.breadcrumb-toggle)\n #{defaults.$breadcrumb-item-selector-base}#{defaults.$breadcrumb-item-selector}:has(\n #{defaults.$breadcrumb-toggle-selector-base}#{defaults.$breadcrumb-toggle-selector}\n ) {\n display: $breadcrumb-item-transitioning-display;\n opacity: $breadcrumb-item-transitioning-opacity;\n\n ~ #{defaults.$breadcrumb-item-selector-base}#{defaults.$breadcrumb-item-selector}:not(\n :last-child\n ) {\n display: $breadcrumb-item-transitioning-display;\n opacity: $breadcrumb-item-transitioning-opacity;\n }\n }\n }\n }\n\n // .breadcrumb-item\n #{defaults.$breadcrumb-item-selector-base}#{defaults.$breadcrumb-item-selector} {\n display: $breadcrumb-item-display;\n position: relative;\n padding: $breadcrumb-item-padding;\n border-width: $breadcrumb-item-border-width;\n border-style: $breadcrumb-item-border-style;\n border-radius: $breadcrumb-item-border-radius;\n opacity: $breadcrumb-item-opacity;\n gap: $breadcrumb-item-gap;\n\n &:not(:last-child)::#{defaults.$breadcrumb-item-separator-pseudo-selector} {\n content: $breadcrumb-item-separator;\n display: block;\n }\n\n &:has(\n #{defaults.$breadcrumb-toggle-selector-base}#{defaults.$breadcrumb-toggle-selector}\n ) {\n display: $breadcrumb-item-hide-display;\n opacity: $breadcrumb-item-hide-opacity;\n }\n }\n\n // .breadcrumb-link\n #{defaults.$breadcrumb-link-selector-base}#{defaults.$breadcrumb-link-selector} {\n padding: $breadcrumb-link-padding;\n border-width: $breadcrumb-link-border-width;\n border-style: $breadcrumb-link-border-style;\n border-radius: $breadcrumb-link-border-radius;\n }\n\n // .breadcrumb-toggle\n #{defaults.$breadcrumb-toggle-selector-base}#{defaults.$breadcrumb-toggle-selector} {\n @include link-mixins.apply-base;\n\n padding: $breadcrumb-toggle-padding;\n border-width: $breadcrumb-toggle-border-width;\n border-style: $breadcrumb-toggle-border-style;\n border-radius: $breadcrumb-toggle-border-radius;\n }\n}\n\n@include layer(theme) {\n // .breadcrumb\n #{defaults.$breadcrumb-selector-base}#{defaults.$breadcrumb-selector} {\n border-color: $breadcrumb-border-color;\n background: $breadcrumb-background;\n color: $breadcrumb-color;\n\n @if root-defaults.$themeable-components and defaults.$themeable {\n @include theme.generate-modifiers(\n defaults.$breadcrumb-theme-map,\n defaults.$breadcrumb-theme-selector-base,\n defaults.$breadcrumb-theme-selector-prefix,\n \"breadcrumb-\"\n );\n @include theme.generate-modifiers(\n defaults.$breadcrumb-theme-map,\n defaults.$breadcrumb-theme-selector-base,\n defaults.$breadcrumb-theme-selector-prefix,\n \"breadcrumb-\",\n \"\"\n );\n }\n }\n\n // .breadcrumb-item\n #{defaults.$breadcrumb-item-selector-base}#{defaults.$breadcrumb-item-selector} {\n border-color: $breadcrumb-item-border-color;\n background: $breadcrumb-item-background;\n color: $breadcrumb-item-color;\n }\n\n // .breadcrumb-link\n #{defaults.$breadcrumb-link-selector-base}#{defaults.$breadcrumb-link-selector} {\n border-color: $breadcrumb-link-border-color;\n background: $breadcrumb-link-background;\n color: $breadcrumb-link-color;\n }\n\n // .breadcrumb-toggle\n #{defaults.$breadcrumb-toggle-selector-base}#{defaults.$breadcrumb-toggle-selector} {\n @include link-mixins.apply-theme;\n\n border-color: $breadcrumb-toggle-border-color;\n background: $breadcrumb-toggle-background;\n color: $breadcrumb-toggle-color;\n }\n}\n","// @graupl/core breadcrumb component variables.\n//\n// These values are to be used to directly style components and provide a\n// cleaner way to reference custom properties.\n\n// Custom property defaults:\n// | Custom property | Default |\n// | ----------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |\n// | --graupl-breadcrumb-padding-x | var(--graupl-spacer-0) |\n// | --graupl-breadcrumb-padding-y | var(--graupl-spacer-0) |\n// | --graupl-breadcrumb-padding | var(--graupl-breadcrumb-padding-y) var(--graupl-breadcrumb-padding-x) |\n// | --graupl-breadcrumb-margin-x | var(--graupl-spacer-0) |\n// | --graupl-breadcrumb-margin-y | var(--graupl-spacer-0) |\n// | --graupl-breadcrumb-margin | var(--graupl-breadcrumb-margin-y) var(--graupl-breadcrumb-margin-x) |\n// | --graupl-breadcrumb-column-gap | var(--graupl-spacer-2) |\n// | --graupl-breadcrumb-row-gap | var(--graupl-spacer-2) |\n// | --graupl-breadcrumb-gap | var(--graupl-breadcrumb-column-gap) var(--graupl-breadcrumb-row-gap) |\n// | --graupl-breadcrumb-background | var(--graupl-background) |\n// | --graupl-breadcrumb-color | var(--graupl-color) |\n// | --graupl-breadcrumb-border-color | var(--graupl-breadcrumb-color) |\n// | --graupl-breadcrumb-border-top-left-radius | var(--graupl-border-top-left-radius) |\n// | --graupl-breadcrumb-border-top-right-radius | var(--graupl-border-top-right-radius) |\n// | --graupl-breadcrumb-border-bottom-left-radius | var(--graupl-border-bottom-left-radius) |\n// | --graupl-breadcrumb-border-bottom-right-radius | var(--graupl-border-bottom-right-radius) |\n// | --graupl-breadcrumb-border-radius | var(--graupl-breadcrumb-border-top-left-radius) var(--graupl-breadcrumb-border-top-right-radius) var(--graupl-breadcrumb-border-bottom-right-radius) var(--graupl-breadcrumb-border-bottom-left-radius) |\n// | --graupl-breadcrumb-border-top-width | 0 |\n// | --graupl-breadcrumb-border-right-width | 0 |\n// | --graupl-breadcrumb-border-bottom-width | 0 |\n// | --graupl-breadcrumb-border-left-width | 0 |\n// | --graupl-breadcrumb-border-width | var(--graupl-breadcrumb-border-top-width) var(--graupl-breadcrumb-border-right-width) var(--graupl-breadcrumb-border-bottom-width) var(--graupl-breadcrumb-border-left-width) |\n// | --graupl-breadcrumb-border-top-style | var(--graupl-border-top-style) |\n// | --graupl-breadcrumb-border-right-style | var(--graupl-border-right-style) |\n// | --graupl-breadcrumb-border-bottom-style | var(--graupl-border-bottom-style) |\n// | --graupl-breadcrumb-border-left-style | var(--graupl-border-left-style) |\n// | --graupl-breadcrumb-border-style | var(--graupl-breadcrumb-border-top-style) var(--graupl-breadcrumb-border-right-style) var(--graupl-breadcrumb-border-bottom-style) var(--graupl-breadcrumb-border-left-style) |\n// | --graupl-breadcrumb-item-show-display | flex |\n// | --graupl-breadcrumb-item-hide-display | none |\n// | --graupl-breadcrumb-item-transitioning-display | flex |\n// | --graupl-breadcrumb-item-display | flex |\n// | --graupl-breadcrumb-item-show-opacity | 1 |\n// | --graupl-breadcrumb-item-hide-opacity | 0 |\n// | --graupl-breadcrumb-item-transitioning-opacity | 0 |\n// | --graupl-breadcrumb-item-opacity | var(--graupl-breadcrumb-item-show-opacity) |\n// | --graupl-breadcrumb-item-transition-duration | var(--graupl-transition-duration-fast) |\n// | --graupl-breadcrumb-item-transition-timing-function | var(--graupl-transition-timing-function) |\n// | --graupl-breadcrumb-item-transition | opacity var(--graupl-breadcrumb-item-transition-duration) var(--graupl-breadcrumb-item-transition-timing-function) |\n// | --graupl-breadcrumb-item-transition-reduced-motion | none |\n// | --graupl-breadcrumb-item-padding-x | 0 |\n// | --graupl-breadcrumb-item-padding-y | 0 |\n// | --graupl-breadcrumb-item-padding | var(--graupl-breadcrumb-item-padding-y) var(--graupl-breadcrumb-item-padding-x) |\n// | --graupl-breadcrumb-item-column-gap | var(--graupl-breadcrumb-column-gap) |\n// | --graupl-breadcrumb-item-row-gap | var(--graupl-breadcrumb-row-gap) |\n// | --graupl-breadcrumb-item-gap | var(--graupl-breadcrumb-item-column-gap) var(--graupl-breadcrumb-item-row-gap) |\n// | --graupl-breadcrumb-item-color | var(--graupl-breadcrumb-color) |\n// | --graupl-breadcrumb-item-background | var(--graupl-breadcrumb-background) |\n// | --graupl-breadcrumb-item-visited-color | var(--graupl-breadcrumb-item-color) |\n// | --graupl-breadcrumb-item-focus-color | var(--graupl-breadcrumb-item-color) |\n// | --graupl-breadcrumb-item-hover-color | var(--graupl-breadcrumb-item-background) |\n// | --graupl-breadcrumb-item-active-color | var(--graupl-breadcrumb-item-hover-color) |\n// | --graupl-breadcrumb-item-disabled-color | var(--graupl-theme-active--primary--200) |\n// | --graupl-breadcrumb-item-visited-background | var(--graupl-breadcrumb-item-background) |\n// | --graupl-breadcrumb-item-focus-background | var(--graupl-breadcrumb-item-background) |\n// | --graupl-breadcrumb-item-hover-background | var(--graupl-breadcrumb-item-color) |\n// | --graupl-breadcrumb-item-active-background | var(--graupl-breadcrumb-item-hover-background) |\n// | --graupl-breadcrumb-item-disabled-background | var(--graupl-theme-active--primary--200) |\n// | --graupl-breadcrumb-item-border-color | var(--graupl-breadcrumb-item-color) |\n// | --graupl-breadcrumb-item-border-top-left-radius | var(--graupl-border-top-left-radius) |\n// | --graupl-breadcrumb-item-border-top-right-radius | var(--graupl-border-top-right-radius) |\n// | --graupl-breadcrumb-item-border-bottom-left-radius | var(--graupl-border-bottom-left-radius) |\n// | --graupl-breadcrumb-item-border-bottom-right-radius | var(--graupl-border-bottom-right-radius) |\n// | --graupl-breadcrumb-item-border-radius | var(--graupl-breadcrumb-item-border-top-left-radius) var(--graupl-breadcrumb-item-border-top-right-radius) var(--graupl-breadcrumb-item-border-bottom-right-radius) var(--graupl-breadcrumb-item-border-bottom-left-radius) |\n// | --graupl-breadcrumb-item-border-top-width | 0 |\n// | --graupl-breadcrumb-item-border-right-width | 0 |\n// | --graupl-breadcrumb-item-border-bottom-width | 0 |\n// | --graupl-breadcrumb-item-border-left-width | 0 |\n// | --graupl-breadcrumb-item-border-width | var(--graupl-breadcrumb-item-border-top-width) var(--graupl-breadcrumb-item-border-right-width) var(--graupl-breadcrumb-item-border-bottom-width) var(--graupl-breadcrumb-item-border-left-width) |\n// | --graupl-breadcrumb-item-border-top-style | var(--graupl-border-top-style) |\n// | --graupl-breadcrumb-item-border-right-style | var(--graupl-border-right-style) |\n// | --graupl-breadcrumb-item-border-bottom-style | var(--graupl-border-bottom-style) |\n// | --graupl-breadcrumb-item-border-left-style | var(--graupl-border-left-style) |\n// | --graupl-breadcrumb-item-border-style | var(--graupl-breadcrumb-item-border-top-style) var(--graupl-breadcrumb-item-border-right-style) var(--graupl-breadcrumb-item-border-bottom-style) var(--graupl-breadcrumb-item-border-left-style) |\n// | --graupl-breadcrumb-link-padding-x | 0 |\n// | --graupl-breadcrumb-link-padding-y | 0 |\n// | --graupl-breadcrumb-link-padding | var(--graupl-breadcrumb-link-padding-y) var(--graupl-breadcrumb-link-padding-x) |\n// | --graupl-breadcrumb-link-transition-duration | var(--graupl-transition-duration-fast) |\n// | --graupl-breadcrumb-link-transition-timing-function | var(--graupl-transition-timing-function) |\n// | --graupl-breadcrumb-link-transition | transform var(--graupl-breadcrumb-link-transition-duration) var(--graupl-breadcrumb-link-transition-timing-function) |\n// | --graupl-breadcrumb-link-transition-reduced-motion | none |\n// | --graupl-breadcrumb-link-transform | none |\n// | --graupl-breadcrumb-link-visited-transform | var(--graupl-breadcrumb-link-transform) |\n// | --graupl-breadcrumb-link-focus-transform | var(--graupl-breadcrumb-link-transform) |\n// | --graupl-breadcrumb-link-hover-transform | var(--graupl-breadcrumb-link-transform) |\n// | --graupl-breadcrumb-link-active-transform | none |\n// | --graupl-breadcrumb-link-disabled-transform | none |\n// | --graupl-breadcrumb-link-color | var(--graupl-breadcrumb-item-color) |\n// | --graupl-breadcrumb-link-background | var(--graupl-breadcrumb-item-background) |\n// | --graupl-breadcrumb-link-visited-color | var(--graupl-breadcrumb-link-color) |\n// | --graupl-breadcrumb-link-focus-color | var(--graupl-breadcrumb-link-color) |\n// | --graupl-breadcrumb-link-hover-color | var(--graupl-breadcrumb-link-background) |\n// | --graupl-breadcrumb-link-active-color | var(--graupl-breadcrumb-link-hover-color) |\n// | --graupl-breadcrumb-link-disabled-color | var(--graupl-theme-active--primary--200) |\n// | --graupl-breadcrumb-link-visited-background | var(--graupl-breadcrumb-link-background) |\n// | --graupl-breadcrumb-link-focus-background | var(--graupl-breadcrumb-link-background) |\n// | --graupl-breadcrumb-link-hover-background | var(--graupl-breadcrumb-link-color) |\n// | --graupl-breadcrumb-link-active-background | var(--graupl-breadcrumb-link-hover-background) |\n// | --graupl-breadcrumb-link-disabled-background | var(--graupl-theme-active--primary--200) |\n// | --graupl-breadcrumb-link-border-color | var(--graupl-breadcrumb-link-color) |\n// | --graupl-breadcrumb-link-border-top-left-radius | var(--graupl-border-top-left-radius) |\n// | --graupl-breadcrumb-link-border-top-right-radius | var(--graupl-border-top-right-radius) |\n// | --graupl-breadcrumb-link-border-bottom-left-radius | var(--graupl-border-bottom-left-radius) |\n// | --graupl-breadcrumb-link-border-bottom-right-radius | var(--graupl-border-bottom-right-radius) |\n// | --graupl-breadcrumb-link-border-radius | var(--graupl-breadcrumb-link-border-top-left-radius) var(--graupl-breadcrumb-link-border-top-right-radius) var(--graupl-breadcrumb-link-border-bottom-right-radius) var(--graupl-breadcrumb-link-border-bottom-left-radius) |\n// | --graupl-breadcrumb-link-border-top-width | 0 |\n// | --graupl-breadcrumb-link-border-right-width | 0 |\n// | --graupl-breadcrumb-link-border-bottom-width | 0 |\n// | --graupl-breadcrumb-link-border-left-width | 0 |\n// | --graupl-breadcrumb-link-border-width | var(--graupl-breadcrumb-link-border-top-width) var(--graupl-breadcrumb-link-border-right-width) var(--graupl-breadcrumb-link-border-bottom-width) var(--graupl-breadcrumb-link-border-left-width) |\n// | --graupl-breadcrumb-link-border-top-style | var(--graupl-border-top-style) |\n// | --graupl-breadcrumb-link-border-right-style | var(--graupl-border-right-style) |\n// | --graupl-breadcrumb-link-border-bottom-style | var(--graupl-border-bottom-style) |\n// | --graupl-breadcrumb-link-border-left-style | var(--graupl-border-left-style) |\n// | --graupl-breadcrumb-link-border-style | var(--graupl-breadcrumb-link-border-top-style) var(--graupl-breadcrumb-link-border-right-style) var(--graupl-breadcrumb-link-border-bottom-style) var(--graupl-breadcrumb-link-border-left-style) |\n// | --graupl-breadcrumb-toggle-padding-x | var(--graupl-breadcrumb-link-padding-x) |\n// | --graupl-breadcrumb-toggle-padding-y | var(--graupl-breadcrumb-link-padding-y) |\n// | --graupl-breadcrumb-toggle-padding | var(--graupl-breadcrumb-toggle-padding-y) var(--graupl-breadcrumb-toggle-padding-x) |\n// | --graupl-breadcrumb-toggle-transition-duration | var(--graupl-breadcrumb-link-transition-duration) |\n// | --graupl-breadcrumb-toggle-transition-timing-function | var(--graupl-breadcrumb-link-transition-timing-function) |\n// | --graupl-breadcrumb-toggle-transition | transform var(--graupl-breadcrumb-toggle-transition-duration) var(--graupl-breadcrumb-toggle-transition-timing-function) |\n// | --graupl-breadcrumb-toggle-transition-reduced-motion | var(--graupl-breadcrumb-link-transition-reduced-motion) |\n// | --graupl-breadcrumb-toggle-transform | var(--graupl-breadcrumb-link-transform) |\n// | --graupl-breadcrumb-toggle-visited-transform | var(--graupl-breadcrumb-toggle-transform) |\n// | --graupl-breadcrumb-toggle-focus-transform | var(--graupl-breadcrumb-toggle-transform) |\n// | --graupl-breadcrumb-toggle-hover-transform | var(--graupl-breadcrumb-toggle-transform) |\n// | --graupl-breadcrumb-toggle-active-transform | var(--graupl-breadcrumb-link-active-transform) |\n// | --graupl-breadcrumb-toggle-disabled-transform | var(--graupl-breadcrumb-link-disabled-transform) |\n// | --graupl-breadcrumb-toggle-color | var(--graupl-breadcrumb-link-color) |\n// | --graupl-breadcrumb-toggle-background | var(--graupl-breadcrumb-link-background) |\n// | --graupl-breadcrumb-toggle-visited-color | var(--graupl-breadcrumb-toggle-color) |\n// | --graupl-breadcrumb-toggle-focus-color | var(--graupl-breadcrumb-toggle-color) |\n// | --graupl-breadcrumb-toggle-hover-color | var(--graupl-breadcrumb-toggle-background) |\n// | --graupl-breadcrumb-toggle-active-color | var(--graupl-breadcrumb-toggle-hover-color) |\n// | --graupl-breadcrumb-toggle-disabled-color | var(--graupl-theme-active--primary--200) |\n// | --graupl-breadcrumb-toggle-visited-background | var(--graupl-breadcrumb-toggle-background) |\n// | --graupl-breadcrumb-toggle-focus-background | var(--graupl-breadcrumb-toggle-background) |\n// | --graupl-breadcrumb-toggle-hover-background | var(--graupl-breadcrumb-toggle-color) |\n// | --graupl-breadcrumb-toggle-active-background | var(--graupl-breadcrumb-toggle-hover-background) |\n// | --graupl-breadcrumb-toggle-disabled-background | var(--graupl-theme-active--primary--200) |\n// | --graupl-breadcrumb-toggle-border-color | var(--graupl-breadcrumb-toggle-color) |\n// | --graupl-breadcrumb-toggle-border-top-left-radius | var(--graupl-breadcrumb-link-border-top-left-radius) |\n// | --graupl-breadcrumb-toggle-border-top-right-radius | var(--graupl-breadcrumb-link-border-top-right-radius) |\n// | --graupl-breadcrumb-toggle-border-bottom-left-radius | var(--graupl-breadcrumb-link-border-bottom-left-radius) |\n// | --graupl-breadcrumb-toggle-border-bottom-right-radius | var(--graupl-breadcrumb-link-border-bottom-right-radius) |\n// | --graupl-breadcrumb-toggle-border-radius | var(--graupl-breadcrumb-toggle-border-top-left-radius) var(--graupl-breadcrumb-toggle-border-top-right-radius) var(--graupl-breadcrumb-toggle-border-bottom-right-radius) var(--graupl-breadcrumb-toggle-border-bottom-left-radius) |\n// | --graupl-breadcrumb-toggle-border-top-width | var(--graupl-breadcrumb-link-border-top-width) |\n// | --graupl-breadcrumb-toggle-border-right-width | var(--graupl-breadcrumb-link-border-right-width) |\n// | --graupl-breadcrumb-toggle-border-bottom-width | var(--graupl-breadcrumb-link-border-bottom-width) |\n// | --graupl-breadcrumb-toggle-border-left-width | var(--graupl-breadcrumb-link-border-left-width) |\n// | --graupl-breadcrumb-toggle-border-width | var(--graupl-breadcrumb-toggle-border-top-width) var(--graupl-breadcrumb-toggle-border-right-width) var(--graupl-breadcrumb-toggle-border-bottom-width) var(--graupl-breadcrumb-toggle-border-left-width) |\n// | --graupl-breadcrumb-toggle-border-top-style | var(--graupl-breadcrumb-link-border-top-style) |\n// | --graupl-breadcrumb-toggle-border-right-style | var(--graupl-breadcrumb-link-border-right-style) |\n// | --graupl-breadcrumb-toggle-border-bottom-style | var(--graupl-breadcrumb-link-border-bottom-style) |\n// | --graupl-breadcrumb-toggle-border-left-style | var(--graupl-breadcrumb-link-border-left-style) |\n// | --graupl-breadcrumb-toggle-border-style | var(--graupl-breadcrumb-toggle-border-top-style) var(--graupl-breadcrumb-toggle-border-right-style) var(--graupl-breadcrumb-toggle-border-bottom-style) var(--graupl-breadcrumb-toggle-border-left-style) |\n// | --graupl-breadcrumb-item-separator | \"'/'\" |\n\n@use \"../../defaults\" as root-defaults;\n@use \"../../theme/color/variables\" as color;\n@use \"../../functions/theme\";\n@use \"../../variables\" as root-variables;\n@use \"defaults\";\n@use \"sass:map\";\n\n// Breadcrumb properties.\n// --graupl-breadcrumb-padding-x\n$breadcrumb-padding-x: var(\n --#{root-defaults.$prefix}breadcrumb-padding-x,\n #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-breadcrumb-padding-y\n$breadcrumb-padding-y: var(\n --#{root-defaults.$prefix}breadcrumb-padding-y,\n #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-breadcrumb-padding\n$breadcrumb-padding: var(\n --#{root-defaults.$prefix}breadcrumb-padding,\n #{$breadcrumb-padding-y} #{$breadcrumb-padding-x}\n);\n\n// --graupl-breadcrumb-margin-x\n$breadcrumb-margin-x: var(\n --#{root-defaults.$prefix}breadcrumb-margin-x,\n #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-breadcrumb-margin-y\n$breadcrumb-margin-y: var(\n --#{root-defaults.$prefix}breadcrumb-margin-y,\n #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-breadcrumb-margin\n$breadcrumb-margin: var(\n --#{root-defaults.$prefix}breadcrumb-margin,\n #{$breadcrumb-margin-y} #{$breadcrumb-margin-x}\n);\n\n// Breadcrumb gap properties.\n// --graupl-breadcrumb-column-gap\n$breadcrumb-column-gap: var(\n --#{root-defaults.$prefix}breadcrumb-column-gap,\n #{map.get(root-variables.$spacers, 2)}\n);\n\n// --graupl-breadcrumb-row-gap\n$breadcrumb-row-gap: var(\n --#{root-defaults.$prefix}breadcrumb-row-gap,\n #{map.get(root-variables.$spacers, 2)}\n);\n\n// --graupl-breadcrumb-gap\n$breadcrumb-gap: var(\n --#{root-defaults.$prefix}breadcrumb-gap,\n #{$breadcrumb-column-gap} #{$breadcrumb-row-gap}\n);\n\n// Breadcrumb color properties.\n// --graupl-breadcrumb-background\n$breadcrumb-background: var(\n --#{root-defaults.$prefix}breadcrumb-background,\n #{color.$background}\n);\n\n// --graupl-breadcrumb-color\n$breadcrumb-color: var(\n --#{root-defaults.$prefix}breadcrumb-color,\n #{color.$color}\n);\n\n// Breadcrumb border properties.\n// --graupl-breadcrumb-border-color\n$breadcrumb-border-color: var(\n --#{root-defaults.$prefix}breadcrumb-border-color,\n #{$breadcrumb-color}\n);\n\n// --graupl-breadcrumb-border-top-left-radius\n$breadcrumb-border-top-left-radius: var(\n --#{root-defaults.$prefix}breadcrumb-border-top-left-radius,\n #{root-variables.$border-top-left-radius}\n);\n\n// --graupl-breadcrumb-border-top-right-radius\n$breadcrumb-border-top-right-radius: var(\n --#{root-defaults.$prefix}breadcrumb-border-top-right-radius,\n #{root-variables.$border-top-right-radius}\n);\n\n// --graupl-breadcrumb-border-bottom-left-radius\n$breadcrumb-border-bottom-left-radius: var(\n --#{root-defaults.$prefix}breadcrumb-border-bottom-left-radius,\n #{root-variables.$border-bottom-left-radius}\n);\n\n// --graupl-breadcrumb-border-bottom-right-radius\n$breadcrumb-border-bottom-right-radius: var(\n --#{root-defaults.$prefix}breadcrumb-border-bottom-right-radius,\n #{root-variables.$border-bottom-right-radius}\n);\n\n// --graupl-breadcrumb-border-radius\n$breadcrumb-border-radius: var(\n --#{root-defaults.$prefix}breadcrumb-border-radius,\n #{$breadcrumb-border-top-left-radius} #{$breadcrumb-border-top-right-radius}\n #{$breadcrumb-border-bottom-right-radius}\n #{$breadcrumb-border-bottom-left-radius}\n);\n\n// --graupl-breadcrumb-border-top-width\n$breadcrumb-border-top-width: var(\n --#{root-defaults.$prefix}breadcrumb-border-top-width,\n 0\n);\n\n// --graupl-breadcrumb-border-right-width\n$breadcrumb-border-right-width: var(\n --#{root-defaults.$prefix}breadcrumb-border-right-width,\n 0\n);\n\n// --graupl-breadcrumb-border-bottom-width\n$breadcrumb-border-bottom-width: var(\n --#{root-defaults.$prefix}breadcrumb-border-bottom-width,\n 0\n);\n\n// --graupl-breadcrumb-border-left-width\n$breadcrumb-border-left-width: var(\n --#{root-defaults.$prefix}breadcrumb-border-left-width,\n 0\n);\n\n// --graupl-breadcrumb-border-width\n$breadcrumb-border-width: var(\n --#{root-defaults.$prefix}breadcrumb-border-width,\n #{$breadcrumb-border-top-width} #{$breadcrumb-border-right-width}\n #{$breadcrumb-border-bottom-width} #{$breadcrumb-border-left-width}\n);\n\n// --graupl-breadcrumb-border-top-style\n$breadcrumb-border-top-style: var(\n --#{root-defaults.$prefix}breadcrumb-border-top-style,\n #{root-variables.$border-top-style}\n);\n\n// --graupl-breadcrumb-border-right-style\n$breadcrumb-border-right-style: var(\n --#{root-defaults.$prefix}breadcrumb-border-right-style,\n #{root-variables.$border-right-style}\n);\n\n// --graupl-breadcrumb-border-bottom-style\n$breadcrumb-border-bottom-style: var(\n --#{root-defaults.$prefix}breadcrumb-border-bottom-style,\n #{root-variables.$border-bottom-style}\n);\n\n// --graupl-breadcrumb-border-left-style\n$breadcrumb-border-left-style: var(\n --#{root-defaults.$prefix}breadcrumb-border-left-style,\n #{root-variables.$border-left-style}\n);\n\n// --graupl-breadcrumb-border-style\n$breadcrumb-border-style: var(\n --#{root-defaults.$prefix}breadcrumb-border-style,\n #{$breadcrumb-border-top-style} #{$breadcrumb-border-right-style}\n #{$breadcrumb-border-bottom-style} #{$breadcrumb-border-left-style}\n);\n\n// --graupl-breadcrumb-item-show-display\n$breadcrumb-item-show-display: var(\n --#{root-defaults.$prefix}breadcrumb-item-show-display,\n #{defaults.$breadcrumb-item-show-display}\n);\n\n// --graupl-breadcrumb-item-hide-display\n$breadcrumb-item-hide-display: var(\n --#{root-defaults.$prefix}breadcrumb-item-hide-display,\n #{defaults.$breadcrumb-item-hide-display}\n);\n\n// --graupl-breadcrumb-item-transitioning-display\n$breadcrumb-item-transitioning-display: var(\n --#{root-defaults.$prefix}breadcrumb-item-transitioning-display,\n #{defaults.$breadcrumb-item-transitioning-display}\n);\n\n// --graupl-breadcrumb-item-display\n$breadcrumb-item-display: var(\n --#{root-defaults.$prefix}breadcrumb-item-display,\n #{defaults.$breadcrumb-item-show-display}\n);\n\n// --graupl-breadcrumb-item-show-opacity\n$breadcrumb-item-show-opacity: var(\n --#{root-defaults.$prefix}breadcrumb-item-show-opacity,\n #{defaults.$breadcrumb-item-show-opacity}\n);\n\n// --graupl-breadcrumb-item-hide-opacity\n$breadcrumb-item-hide-opacity: var(\n --#{root-defaults.$prefix}breadcrumb-item-hide-opacity,\n #{defaults.$breadcrumb-item-hide-opacity}\n);\n\n// --graupl-breadcrumb-item-transitioning-opacity\n$breadcrumb-item-transitioning-opacity: var(\n --#{root-defaults.$prefix}breadcrumb-item-transitioning-opacity,\n #{defaults.$breadcrumb-item-transitioning-opacity}\n);\n\n// --graupl-breadcrumb-item-opacity\n$breadcrumb-item-opacity: var(\n --#{root-defaults.$prefix}breadcrumb-item-opacity,\n #{$breadcrumb-item-show-opacity}\n);\n\n// --graupl-breadcrumb-item-transition-duration\n$breadcrumb-item-transition-duration: var(\n --#{root-defaults.$prefix}breadcrumb-item-transition-duration,\n #{map.get(root-variables.$transition-durations, fast)}\n);\n\n// --graupl-breadcrumb-item-transition-timing-function\n$breadcrumb-item-transition-timing-function: var(\n --#{root-defaults.$prefix}breadcrumb-item-transition-timing-function,\n #{root-variables.$transition-timing-function}\n);\n\n// --graupl-breadcrumb-item-transition\n$breadcrumb-item-transition: var(\n --#{root-defaults.$prefix}breadcrumb-item-transition,\n opacity #{$breadcrumb-item-transition-duration}\n #{$breadcrumb-item-transition-timing-function}\n);\n\n// --graupl-breadcrumb-item-transition-reduced-motion\n$breadcrumb-item-transition-reduced-motion: var(\n --#{root-defaults.$prefix}breadcrumb-item-transition-reduced-motion,\n none\n);\n\n// --graupl-breadcrumb-item-padding-x\n$breadcrumb-item-padding-x: var(\n --#{root-defaults.$prefix}breadcrumb-item-padding-x,\n 0\n);\n\n// --graupl-breadcrumb-item-padding-y\n$breadcrumb-item-padding-y: var(\n --#{root-defaults.$prefix}breadcrumb-item-padding-y,\n 0\n);\n\n// --graupl-breadcrumb-item-padding\n$breadcrumb-item-padding: var(\n --#{root-defaults.$prefix}breadcrumb-item-padding,\n #{$breadcrumb-item-padding-y} #{$breadcrumb-item-padding-x}\n);\n\n// --graupl-breadcrumb-item-column-gap\n$breadcrumb-item-column-gap: var(\n --#{root-defaults.$prefix}breadcrumb-item-column-gap,\n #{$breadcrumb-column-gap}\n);\n\n// --graupl-breadcrumb-item-row-gap\n$breadcrumb-item-row-gap: var(\n --#{root-defaults.$prefix}breadcrumb-item-row-gap,\n #{$breadcrumb-row-gap}\n);\n\n// --graupl-breadcrumb-item-gap\n$breadcrumb-item-gap: var(\n --#{root-defaults.$prefix}breadcrumb-item-gap,\n #{$breadcrumb-item-column-gap} #{$breadcrumb-item-row-gap}\n);\n\n// --graupl-breadcrumb-item-color\n$breadcrumb-item-color: var(\n --#{root-defaults.$prefix}breadcrumb-item-color,\n #{$breadcrumb-color}\n);\n\n// --graupl-breadcrumb-item-background\n$breadcrumb-item-background: var(\n --#{root-defaults.$prefix}breadcrumb-item-background,\n #{$breadcrumb-background}\n);\n\n// --graupl-breadcrumb-item-visited-color\n$breadcrumb-item-visited-color: var(\n --#{root-defaults.$prefix}breadcrumb-item-visited-color,\n #{$breadcrumb-item-color}\n);\n\n// --graupl-breadcrumb-item-focus-color\n$breadcrumb-item-focus-color: var(\n --#{root-defaults.$prefix}breadcrumb-item-focus-color,\n #{$breadcrumb-item-color}\n);\n\n// --graupl-breadcrumb-item-hover-color\n$breadcrumb-item-hover-color: var(\n --#{root-defaults.$prefix}breadcrumb-item-hover-color,\n #{$breadcrumb-item-background}\n);\n\n// --graupl-breadcrumb-item-active-color\n$breadcrumb-item-active-color: var(\n --#{root-defaults.$prefix}breadcrumb-item-active-color,\n #{$breadcrumb-item-hover-color}\n);\n\n// --graupl-breadcrumb-item-disabled-color\n$breadcrumb-item-disabled-color: var(\n --#{root-defaults.$prefix}breadcrumb-item-disabled-color,\n #{theme.get(primary, 200)}\n);\n$breadcrumb-item-color-states: (\n default: $breadcrumb-item-color,\n visited: $breadcrumb-item-visited-color,\n focus: $breadcrumb-item-focus-color,\n hover: $breadcrumb-item-hover-color,\n active: $breadcrumb-item-active-color,\n disabled: $breadcrumb-item-disabled-color,\n);\n\n// --graupl-breadcrumb-item-visited-background\n$breadcrumb-item-visited-background: var(\n --#{root-defaults.$prefix}breadcrumb-item-visited-background,\n #{$breadcrumb-item-background}\n);\n\n// --graupl-breadcrumb-item-focus-background\n$breadcrumb-item-focus-background: var(\n --#{root-defaults.$prefix}breadcrumb-item-focus-background,\n #{$breadcrumb-item-background}\n);\n\n// --graupl-breadcrumb-item-hover-background\n$breadcrumb-item-hover-background: var(\n --#{root-defaults.$prefix}breadcrumb-item-hover-background,\n #{$breadcrumb-item-color}\n);\n\n// --graupl-breadcrumb-item-active-background\n$breadcrumb-item-active-background: var(\n --#{root-defaults.$prefix}breadcrumb-item-active-background,\n #{$breadcrumb-item-hover-background}\n);\n\n// --graupl-breadcrumb-item-disabled-background\n$breadcrumb-item-disabled-background: var(\n --#{root-defaults.$prefix}breadcrumb-item-disabled-background,\n #{theme.get(primary, 200)}\n);\n$breadcrumb-item-background-states: (\n default: $breadcrumb-item-background,\n visited: $breadcrumb-item-visited-background,\n focus: $breadcrumb-item-focus-background,\n hover: $breadcrumb-item-hover-background,\n active: $breadcrumb-item-active-background,\n disabled: $breadcrumb-item-disabled-background,\n);\n\n// Breadcrumb item border properties.\n// --graupl-breadcrumb-item-border-color\n$breadcrumb-item-border-color: var(\n --#{root-defaults.$prefix}breadcrumb-item-border-color,\n #{$breadcrumb-item-color}\n);\n\n// --graupl-breadcrumb-item-border-top-left-radius\n$breadcrumb-item-border-top-left-radius: var(\n --#{root-defaults.$prefix}breadcrumb-item-border-top-left-radius,\n #{root-variables.$border-top-left-radius}\n);\n\n// --graupl-breadcrumb-item-border-top-right-radius\n$breadcrumb-item-border-top-right-radius: var(\n --#{root-defaults.$prefix}breadcrumb-item-border-top-right-radius,\n #{root-variables.$border-top-right-radius}\n);\n\n// --graupl-breadcrumb-item-border-bottom-left-radius\n$breadcrumb-item-border-bottom-left-radius: var(\n --#{root-defaults.$prefix}breadcrumb-item-border-bottom-left-radius,\n #{root-variables.$border-bottom-left-radius}\n);\n\n// --graupl-breadcrumb-item-border-bottom-right-radius\n$breadcrumb-item-border-bottom-right-radius: var(\n --#{root-defaults.$prefix}breadcrumb-item-border-bottom-right-radius,\n #{root-variables.$border-bottom-right-radius}\n);\n\n// --graupl-breadcrumb-item-border-radius\n$breadcrumb-item-border-radius: var(\n --#{root-defaults.$prefix}breadcrumb-item-border-radius,\n #{$breadcrumb-item-border-top-left-radius}\n #{$breadcrumb-item-border-top-right-radius}\n #{$breadcrumb-item-border-bottom-right-radius}\n #{$breadcrumb-item-border-bottom-left-radius}\n);\n\n// --graupl-breadcrumb-item-border-top-width\n$breadcrumb-item-border-top-width: var(\n --#{root-defaults.$prefix}breadcrumb-item-border-top-width,\n 0\n);\n\n// --graupl-breadcrumb-item-border-right-width\n$breadcrumb-item-border-right-width: var(\n --#{root-defaults.$prefix}breadcrumb-item-border-right-width,\n 0\n);\n\n// --graupl-breadcrumb-item-border-bottom-width\n$breadcrumb-item-border-bottom-width: var(\n --#{root-defaults.$prefix}breadcrumb-item-border-bottom-width,\n 0\n);\n\n// --graupl-breadcrumb-item-border-left-width\n$breadcrumb-item-border-left-width: var(\n --#{root-defaults.$prefix}breadcrumb-item-border-left-width,\n 0\n);\n\n// --graupl-breadcrumb-item-border-width\n$breadcrumb-item-border-width: var(\n --#{root-defaults.$prefix}breadcrumb-item-border-width,\n #{$breadcrumb-item-border-top-width} #{$breadcrumb-item-border-right-width}\n #{$breadcrumb-item-border-bottom-width}\n #{$breadcrumb-item-border-left-width}\n);\n\n// --graupl-breadcrumb-item-border-top-style\n$breadcrumb-item-border-top-style: var(\n --#{root-defaults.$prefix}breadcrumb-item-border-top-style,\n #{root-variables.$border-top-style}\n);\n\n// --graupl-breadcrumb-item-border-right-style\n$breadcrumb-item-border-right-style: var(\n --#{root-defaults.$prefix}breadcrumb-item-border-right-style,\n #{root-variables.$border-right-style}\n);\n\n// --graupl-breadcrumb-item-border-bottom-style\n$breadcrumb-item-border-bottom-style: var(\n --#{root-defaults.$prefix}breadcrumb-item-border-bottom-style,\n #{root-variables.$border-bottom-style}\n);\n\n// --graupl-breadcrumb-item-border-left-style\n$breadcrumb-item-border-left-style: var(\n --#{root-defaults.$prefix}breadcrumb-item-border-left-style,\n #{root-variables.$border-left-style}\n);\n\n// --graupl-breadcrumb-item-border-style\n$breadcrumb-item-border-style: var(\n --#{root-defaults.$prefix}breadcrumb-item-border-style,\n #{$breadcrumb-item-border-top-style} #{$breadcrumb-item-border-right-style}\n #{$breadcrumb-item-border-bottom-style}\n #{$breadcrumb-item-border-left-style}\n);\n\n// --graupl-breadcrumb-link-padding-x\n$breadcrumb-link-padding-x: var(\n --#{root-defaults.$prefix}breadcrumb-link-padding-x,\n 0\n);\n\n// --graupl-breadcrumb-link-padding-y\n$breadcrumb-link-padding-y: var(\n --#{root-defaults.$prefix}breadcrumb-link-padding-y,\n 0\n);\n\n// --graupl-breadcrumb-link-padding\n$breadcrumb-link-padding: var(\n --#{root-defaults.$prefix}breadcrumb-link-padding,\n #{$breadcrumb-link-padding-y} #{$breadcrumb-link-padding-x}\n);\n\n// --graupl-breadcrumb-link-transition-duration\n$breadcrumb-link-transition-duration: var(\n --#{root-defaults.$prefix}breadcrumb-link-transition-duration,\n #{map.get(root-variables.$transition-durations, fast)}\n);\n\n// --graupl-breadcrumb-link-transition-timing-function\n$breadcrumb-link-transition-timing-function: var(\n --#{root-defaults.$prefix}breadcrumb-link-transition-timing-function,\n #{root-variables.$transition-timing-function}\n);\n\n// --graupl-breadcrumb-link-transition\n$breadcrumb-link-transition: var(\n --#{root-defaults.$prefix}breadcrumb-link-transition,\n transform #{$breadcrumb-link-transition-duration}\n #{$breadcrumb-link-transition-timing-function}\n);\n\n// --graupl-breadcrumb-link-transition-reduced-motion\n$breadcrumb-link-transition-reduced-motion: var(\n --#{root-defaults.$prefix}breadcrumb-link-transition-reduced-motion,\n none\n);\n\n// --graupl-breadcrumb-link-transform\n$breadcrumb-link-transform: var(\n --#{root-defaults.$prefix}breadcrumb-link-transform,\n #{defaults.$breadcrumb-link-initial-transform}\n);\n\n// --graupl-breadcrumb-link-visited-transform\n$breadcrumb-link-visited-transform: var(\n --#{root-defaults.$prefix}breadcrumb-link-visited-transform,\n #{$breadcrumb-link-transform}\n);\n\n// --graupl-breadcrumb-link-focus-transform\n$breadcrumb-link-focus-transform: var(\n --#{root-defaults.$prefix}breadcrumb-link-focus-transform,\n #{$breadcrumb-link-transform}\n);\n\n// --graupl-breadcrumb-link-hover-transform\n$breadcrumb-link-hover-transform: var(\n --#{root-defaults.$prefix}breadcrumb-link-hover-transform,\n #{$breadcrumb-link-transform}\n);\n\n// --graupl-breadcrumb-link-active-transform\n$breadcrumb-link-active-transform: var(\n --#{root-defaults.$prefix}breadcrumb-link-active-transform,\n #{defaults.$breadcrumb-link-final-transform}\n);\n\n// --graupl-breadcrumb-link-disabled-transform\n$breadcrumb-link-disabled-transform: var(\n --#{root-defaults.$prefix}breadcrumb-link-disabled-transform,\n #{defaults.$breadcrumb-link-disabled-transform}\n);\n$breadcrumb-link-transform-states: (\n _default: $breadcrumb-link-transform,\n visited: $breadcrumb-link-visited-transform,\n focus: $breadcrumb-link-focus-transform,\n hover: $breadcrumb-link-hover-transform,\n active: $breadcrumb-link-active-transform,\n disabled: $breadcrumb-link-disabled-transform,\n);\n\n// --graupl-breadcrumb-link-color\n$breadcrumb-link-color: var(\n --#{root-defaults.$prefix}breadcrumb-link-color,\n #{$breadcrumb-item-color}\n);\n\n// --graupl-breadcrumb-link-background\n$breadcrumb-link-background: var(\n --#{root-defaults.$prefix}breadcrumb-link-background,\n #{$breadcrumb-item-background}\n);\n\n// --graupl-breadcrumb-link-visited-color\n$breadcrumb-link-visited-color: var(\n --#{root-defaults.$prefix}breadcrumb-link-visited-color,\n #{$breadcrumb-link-color}\n);\n\n// --graupl-breadcrumb-link-focus-color\n$breadcrumb-link-focus-color: var(\n --#{root-defaults.$prefix}breadcrumb-link-focus-color,\n #{$breadcrumb-link-color}\n);\n\n// --graupl-breadcrumb-link-hover-color\n$breadcrumb-link-hover-color: var(\n --#{root-defaults.$prefix}breadcrumb-link-hover-color,\n #{$breadcrumb-link-background}\n);\n\n// --graupl-breadcrumb-link-active-color\n$breadcrumb-link-active-color: var(\n --#{root-defaults.$prefix}breadcrumb-link-active-color,\n #{$breadcrumb-link-hover-color}\n);\n\n// --graupl-breadcrumb-link-disabled-color\n$breadcrumb-link-disabled-color: var(\n --#{root-defaults.$prefix}breadcrumb-link-disabled-color,\n #{theme.get(primary, 200)}\n);\n$breadcrumb-link-color-states: (\n default: $breadcrumb-link-color,\n visited: $breadcrumb-link-visited-color,\n focus: $breadcrumb-link-focus-color,\n hover: $breadcrumb-link-hover-color,\n active: $breadcrumb-link-active-color,\n disabled: $breadcrumb-link-disabled-color,\n);\n\n// --graupl-breadcrumb-link-visited-background\n$breadcrumb-link-visited-background: var(\n --#{root-defaults.$prefix}breadcrumb-link-visited-background,\n #{$breadcrumb-link-background}\n);\n\n// --graupl-breadcrumb-link-focus-background\n$breadcrumb-link-focus-background: var(\n --#{root-defaults.$prefix}breadcrumb-link-focus-background,\n #{$breadcrumb-link-background}\n);\n\n// --graupl-breadcrumb-link-hover-background\n$breadcrumb-link-hover-background: var(\n --#{root-defaults.$prefix}breadcrumb-link-hover-background,\n #{$breadcrumb-link-color}\n);\n\n// --graupl-breadcrumb-link-active-background\n$breadcrumb-link-active-background: var(\n --#{root-defaults.$prefix}breadcrumb-link-active-background,\n #{$breadcrumb-link-hover-background}\n);\n\n// --graupl-breadcrumb-link-disabled-background\n$breadcrumb-link-disabled-background: var(\n --#{root-defaults.$prefix}breadcrumb-link-disabled-background,\n #{theme.get(primary, 200)}\n);\n$breadcrumb-link-background-states: (\n default: $breadcrumb-link-background,\n visited: $breadcrumb-link-visited-background,\n focus: $breadcrumb-link-focus-background,\n hover: $breadcrumb-link-hover-background,\n active: $breadcrumb-link-active-background,\n disabled: $breadcrumb-link-disabled-background,\n);\n\n// --graupl-breadcrumb-link-border-color\n$breadcrumb-link-border-color: var(\n --#{root-defaults.$prefix}breadcrumb-link-border-color,\n #{$breadcrumb-link-color}\n);\n\n// --graupl-breadcrumb-link-border-top-left-radius\n$breadcrumb-link-border-top-left-radius: var(\n --#{root-defaults.$prefix}breadcrumb-link-border-top-left-radius,\n #{root-variables.$border-top-left-radius}\n);\n\n// --graupl-breadcrumb-link-border-top-right-radius\n$breadcrumb-link-border-top-right-radius: var(\n --#{root-defaults.$prefix}breadcrumb-link-border-top-right-radius,\n #{root-variables.$border-top-right-radius}\n);\n\n// --graupl-breadcrumb-link-border-bottom-left-radius\n$breadcrumb-link-border-bottom-left-radius: var(\n --#{root-defaults.$prefix}breadcrumb-link-border-bottom-left-radius,\n #{root-variables.$border-bottom-left-radius}\n);\n\n// --graupl-breadcrumb-link-border-bottom-right-radius\n$breadcrumb-link-border-bottom-right-radius: var(\n --#{root-defaults.$prefix}breadcrumb-link-border-bottom-right-radius,\n #{root-variables.$border-bottom-right-radius}\n);\n\n// --graupl-breadcrumb-link-border-radius\n$breadcrumb-link-border-radius: var(\n --#{root-defaults.$prefix}breadcrumb-link-border-radius,\n #{$breadcrumb-link-border-top-left-radius}\n #{$breadcrumb-link-border-top-right-radius}\n #{$breadcrumb-link-border-bottom-right-radius}\n #{$breadcrumb-link-border-bottom-left-radius}\n);\n\n// --graupl-breadcrumb-link-border-top-width\n$breadcrumb-link-border-top-width: var(\n --#{root-defaults.$prefix}breadcrumb-link-border-top-width,\n 0\n);\n\n// --graupl-breadcrumb-link-border-right-width\n$breadcrumb-link-border-right-width: var(\n --#{root-defaults.$prefix}breadcrumb-link-border-right-width,\n 0\n);\n\n// --graupl-breadcrumb-link-border-bottom-width\n$breadcrumb-link-border-bottom-width: var(\n --#{root-defaults.$prefix}breadcrumb-link-border-bottom-width,\n 0\n);\n\n// --graupl-breadcrumb-link-border-left-width\n$breadcrumb-link-border-left-width: var(\n --#{root-defaults.$prefix}breadcrumb-link-border-left-width,\n 0\n);\n\n// --graupl-breadcrumb-link-border-width\n$breadcrumb-link-border-width: var(\n --#{root-defaults.$prefix}breadcrumb-link-border-width,\n #{$breadcrumb-link-border-top-width} #{$breadcrumb-link-border-right-width}\n #{$breadcrumb-link-border-bottom-width}\n #{$breadcrumb-link-border-left-width}\n);\n\n// --graupl-breadcrumb-link-border-top-style\n$breadcrumb-link-border-top-style: var(\n --#{root-defaults.$prefix}breadcrumb-link-border-top-style,\n #{root-variables.$border-top-style}\n);\n\n// --graupl-breadcrumb-link-border-right-style\n$breadcrumb-link-border-right-style: var(\n --#{root-defaults.$prefix}breadcrumb-link-border-right-style,\n #{root-variables.$border-right-style}\n);\n\n// --graupl-breadcrumb-link-border-bottom-style\n$breadcrumb-link-border-bottom-style: var(\n --#{root-defaults.$prefix}breadcrumb-link-border-bottom-style,\n #{root-variables.$border-bottom-style}\n);\n\n// --graupl-breadcrumb-link-border-left-style\n$breadcrumb-link-border-left-style: var(\n --#{root-defaults.$prefix}breadcrumb-link-border-left-style,\n #{root-variables.$border-left-style}\n);\n\n// --graupl-breadcrumb-link-border-style\n$breadcrumb-link-border-style: var(\n --#{root-defaults.$prefix}breadcrumb-link-border-style,\n #{$breadcrumb-link-border-top-style} #{$breadcrumb-link-border-right-style}\n #{$breadcrumb-link-border-bottom-style}\n #{$breadcrumb-link-border-left-style}\n);\n\n// --graupl-breadcrumb-toggle-padding-x\n$breadcrumb-toggle-padding-x: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-padding-x,\n #{$breadcrumb-link-padding-x}\n);\n\n// --graupl-breadcrumb-toggle-padding-y\n$breadcrumb-toggle-padding-y: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-padding-y,\n #{$breadcrumb-link-padding-y}\n);\n\n// --graupl-breadcrumb-toggle-padding\n$breadcrumb-toggle-padding: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-padding,\n #{$breadcrumb-toggle-padding-y} #{$breadcrumb-toggle-padding-x}\n);\n\n// --graupl-breadcrumb-toggle-transition-duration\n$breadcrumb-toggle-transition-duration: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-transition-duration,\n #{$breadcrumb-link-transition-duration}\n);\n\n// --graupl-breadcrumb-toggle-transition-timing-function\n$breadcrumb-toggle-transition-timing-function: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-transition-timing-function,\n #{$breadcrumb-link-transition-timing-function}\n);\n\n// --graupl-breadcrumb-toggle-transition\n$breadcrumb-toggle-transition: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-transition,\n transform #{$breadcrumb-toggle-transition-duration}\n #{$breadcrumb-toggle-transition-timing-function}\n);\n\n// --graupl-breadcrumb-toggle-transition-reduced-motion\n$breadcrumb-toggle-transition-reduced-motion: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-transition-reduced-motion,\n #{$breadcrumb-link-transition-reduced-motion}\n);\n\n// --graupl-breadcrumb-toggle-transform\n$breadcrumb-toggle-transform: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-transform,\n #{$breadcrumb-link-transform}\n);\n\n// --graupl-breadcrumb-toggle-visited-transform\n$breadcrumb-toggle-visited-transform: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-visited-transform,\n #{$breadcrumb-toggle-transform}\n);\n\n// --graupl-breadcrumb-toggle-focus-transform\n$breadcrumb-toggle-focus-transform: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-focus-transform,\n #{$breadcrumb-toggle-transform}\n);\n\n// --graupl-breadcrumb-toggle-hover-transform\n$breadcrumb-toggle-hover-transform: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-hover-transform,\n #{$breadcrumb-toggle-transform}\n);\n\n// --graupl-breadcrumb-toggle-active-transform\n$breadcrumb-toggle-active-transform: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-active-transform,\n #{$breadcrumb-link-active-transform}\n);\n\n// --graupl-breadcrumb-toggle-disabled-transform\n$breadcrumb-toggle-disabled-transform: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-disabled-transform,\n #{$breadcrumb-link-disabled-transform}\n);\n$breadcrumb-toggle-transform-states: (\n _default: $breadcrumb-toggle-transform,\n visited: $breadcrumb-toggle-visited-transform,\n focus: $breadcrumb-toggle-focus-transform,\n hover: $breadcrumb-toggle-hover-transform,\n active: $breadcrumb-toggle-active-transform,\n disabled: $breadcrumb-toggle-disabled-transform,\n);\n\n// --graupl-breadcrumb-toggle-color\n$breadcrumb-toggle-color: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-color,\n #{$breadcrumb-link-color}\n);\n\n// --graupl-breadcrumb-toggle-background\n$breadcrumb-toggle-background: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-background,\n #{$breadcrumb-link-background}\n);\n\n// --graupl-breadcrumb-toggle-visited-color\n$breadcrumb-toggle-visited-color: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-visited-color,\n #{$breadcrumb-toggle-color}\n);\n\n// --graupl-breadcrumb-toggle-focus-color\n$breadcrumb-toggle-focus-color: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-focus-color,\n #{$breadcrumb-toggle-color}\n);\n\n// --graupl-breadcrumb-toggle-hover-color\n$breadcrumb-toggle-hover-color: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-hover-color,\n #{$breadcrumb-toggle-background}\n);\n\n// --graupl-breadcrumb-toggle-active-color\n$breadcrumb-toggle-active-color: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-active-color,\n #{$breadcrumb-toggle-hover-color}\n);\n\n// --graupl-breadcrumb-toggle-disabled-color\n$breadcrumb-toggle-disabled-color: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-disabled-color,\n #{theme.get(primary, 200)}\n);\n$breadcrumb-toggle-color-states: (\n default: $breadcrumb-toggle-color,\n visited: $breadcrumb-toggle-visited-color,\n focus: $breadcrumb-toggle-focus-color,\n hover: $breadcrumb-toggle-hover-color,\n active: $breadcrumb-toggle-active-color,\n disabled: $breadcrumb-toggle-disabled-color,\n);\n\n// --graupl-breadcrumb-toggle-visited-background\n$breadcrumb-toggle-visited-background: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-visited-background,\n #{$breadcrumb-toggle-background}\n);\n\n// --graupl-breadcrumb-toggle-focus-background\n$breadcrumb-toggle-focus-background: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-focus-background,\n #{$breadcrumb-toggle-background}\n);\n\n// --graupl-breadcrumb-toggle-hover-background\n$breadcrumb-toggle-hover-background: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-hover-background,\n #{$breadcrumb-toggle-color}\n);\n\n// --graupl-breadcrumb-toggle-active-background\n$breadcrumb-toggle-active-background: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-active-background,\n #{$breadcrumb-toggle-hover-background}\n);\n\n// --graupl-breadcrumb-toggle-disabled-background\n$breadcrumb-toggle-disabled-background: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-disabled-background,\n #{theme.get(primary, 200)}\n);\n$breadcrumb-toggle-background-states: (\n default: $breadcrumb-toggle-background,\n visited: $breadcrumb-toggle-visited-background,\n focus: $breadcrumb-toggle-focus-background,\n hover: $breadcrumb-toggle-hover-background,\n active: $breadcrumb-toggle-active-background,\n disabled: $breadcrumb-toggle-disabled-background,\n);\n\n// --graupl-breadcrumb-toggle-border-color\n$breadcrumb-toggle-border-color: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-border-color,\n #{$breadcrumb-toggle-color}\n);\n\n// --graupl-breadcrumb-toggle-border-top-left-radius\n$breadcrumb-toggle-border-top-left-radius: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-border-top-left-radius,\n #{$breadcrumb-link-border-top-left-radius}\n);\n\n// --graupl-breadcrumb-toggle-border-top-right-radius\n$breadcrumb-toggle-border-top-right-radius: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-border-top-right-radius,\n #{$breadcrumb-link-border-top-right-radius}\n);\n\n// --graupl-breadcrumb-toggle-border-bottom-left-radius\n$breadcrumb-toggle-border-bottom-left-radius: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-border-bottom-left-radius,\n #{$breadcrumb-link-border-bottom-left-radius}\n);\n\n// --graupl-breadcrumb-toggle-border-bottom-right-radius\n$breadcrumb-toggle-border-bottom-right-radius: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-border-bottom-right-radius,\n #{$breadcrumb-link-border-bottom-right-radius}\n);\n\n// --graupl-breadcrumb-toggle-border-radius\n$breadcrumb-toggle-border-radius: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-border-radius,\n #{$breadcrumb-toggle-border-top-left-radius}\n #{$breadcrumb-toggle-border-top-right-radius}\n #{$breadcrumb-toggle-border-bottom-right-radius}\n #{$breadcrumb-toggle-border-bottom-left-radius}\n);\n\n// --graupl-breadcrumb-toggle-border-top-width\n$breadcrumb-toggle-border-top-width: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-border-top-width,\n #{$breadcrumb-link-border-top-width}\n);\n\n// --graupl-breadcrumb-toggle-border-right-width\n$breadcrumb-toggle-border-right-width: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-border-right-width,\n #{$breadcrumb-link-border-right-width}\n);\n\n// --graupl-breadcrumb-toggle-border-bottom-width\n$breadcrumb-toggle-border-bottom-width: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-border-bottom-width,\n #{$breadcrumb-link-border-bottom-width}\n);\n\n// --graupl-breadcrumb-toggle-border-left-width\n$breadcrumb-toggle-border-left-width: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-border-left-width,\n #{$breadcrumb-link-border-left-width}\n);\n\n// --graupl-breadcrumb-toggle-border-width\n$breadcrumb-toggle-border-width: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-border-width,\n #{$breadcrumb-toggle-border-top-width}\n #{$breadcrumb-toggle-border-right-width}\n #{$breadcrumb-toggle-border-bottom-width}\n #{$breadcrumb-toggle-border-left-width}\n);\n\n// --graupl-breadcrumb-toggle-border-top-style\n$breadcrumb-toggle-border-top-style: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-border-top-style,\n #{$breadcrumb-link-border-top-style}\n);\n\n// --graupl-breadcrumb-toggle-border-right-style\n$breadcrumb-toggle-border-right-style: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-border-right-style,\n #{$breadcrumb-link-border-right-style}\n);\n\n// --graupl-breadcrumb-toggle-border-bottom-style\n$breadcrumb-toggle-border-bottom-style: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-border-bottom-style,\n #{$breadcrumb-link-border-bottom-style}\n);\n\n// --graupl-breadcrumb-toggle-border-left-style\n$breadcrumb-toggle-border-left-style: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-border-left-style,\n #{$breadcrumb-link-border-left-style}\n);\n\n// --graupl-breadcrumb-toggle-border-style\n$breadcrumb-toggle-border-style: var(\n --#{root-defaults.$prefix}breadcrumb-toggle-border-style,\n #{$breadcrumb-toggle-border-top-style}\n #{$breadcrumb-toggle-border-right-style}\n #{$breadcrumb-toggle-border-bottom-style}\n #{$breadcrumb-toggle-border-left-style}\n);\n\n// --graupl-breadcrumb-item-separator\n$breadcrumb-item-separator: var(\n --#{root-defaults.$prefix}breadcrumb-item-separator-content,\n #{defaults.$breadcrumb-item-separator}\n);\n","// @graupl/core link base mixins.\n\n@use \"../../defaults\" as root-defaults;\n@use \"../../mixins/animation\";\n@use \"../../mixins/state\";\n@use \"../../mixins/theme\";\n@use \"defaults\";\n@use \"variables\" as *;\n\n/// Mixin to apply base styles for links.\n@mixin apply-base() {\n min-width: $link-min-width;\n min-height: $link-min-height;\n padding: $link-padding;\n transform: $link-transform;\n transition: $link-transition;\n border-width: $link-border-width;\n border-style: $link-border-style;\n border-radius: $link-border-radius;\n text-decoration: $link-text-decoration;\n text-decoration-style: $link-text-decoration-style;\n text-decoration-thickness: $link-text-decoration-thickness;\n\n @include state.generate-modifiers(\n (\n transform: $link-transform-states,\n text-decoration: $link-text-decoration-states,\n text-decoration-style: $link-text-decoration-style-states,\n text-decoration-thickness: $link-text-decoration-thickness-states,\n )\n );\n\n @include animation.off {\n transition: #{$link-transition-reduced-motion};\n }\n}\n\n/// Mixin to apply theme styles for links.\n@mixin apply-theme() {\n border-color: $link-border-color;\n background: $link-background;\n color: $link-color;\n text-decoration-color: $link-text-decoration-color;\n\n @if root-defaults.$themeable-components and defaults.$themeable {\n @include theme.generate-modifiers(\n defaults.$link-theme-map,\n defaults.$link-theme-prefix-selector-base,\n defaults.$link-theme-prefix-selector,\n \"link-\"\n );\n }\n\n @include state.generate-modifiers(\n (\n border-color: $link-border-color-states,\n background: $link-background-states,\n color: $link-color-states,\n text-decoration-color: $link-text-decoration-color-states,\n )\n );\n}\n\n/// Mixin to apply stretched link styles.\n@mixin apply-stretched() {\n isolation: isolate;\n\n // &::after\n &::#{defaults.$stretched-link-pseudo-selector} {\n content: \"\";\n position: absolute;\n inset: 0;\n z-index: $stretched-link-z-index;\n }\n}\n\n/// Mixin to apply all link styles.\n@mixin apply() {\n @include apply-base;\n @include apply-theme;\n}\n","// @graupl/core link base variables.\n//\n// These values are to be used to directly style bases and provide a\n// cleaner way to reference custom properties.\n\n// Custom property defaults:\n// | Custom property | Default |\n// | ------------------------------------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |\n// | --graupl-link-text-decoration | underline |\n// | --graupl-link-visited-text-decoration | var(--graupl-link-text-decoration) |\n// | --graupl-link-focus-text-decoration | var(--graupl-link-text-decoration) |\n// | --graupl-link-hover-text-decoration | underline |\n// | --graupl-link-active-text-decoration | var(--graupl-link-hover-text-decoration) |\n// | --graupl-link-disabled-text-decoration | underline |\n// | --graupl-link-text-decoration-thickness | var(--graupl-border-width) |\n// | --graupl-link-visited-text-decoration-thickness | var(--graupl-link-text-decoration-thickness) |\n// | --graupl-link-focus-text-decoration-thickness | var(--graupl-link-text-decoration-thickness) |\n// | --graupl-link-hover-text-decoration-thickness | var(--graupl-border-width) |\n// | --graupl-link-active-text-decoration-thickness | var(--graupl-link-hover-text-decoration-thickness) |\n// | --graupl-link-disabled-text-decoration-thickness | var(--graupl-border-width) |\n// | --graupl-link-text-decoration-style | solid |\n// | --graupl-link-visited-text-decoration-style | var(--graupl-link-text-decoration-style) |\n// | --graupl-link-focus-text-decoration-style | var(--graupl-link-text-decoration-style) |\n// | --graupl-link-hover-text-decoration-style | solid |\n// | --graupl-link-active-text-decoration-style | var(--graupl-link-hover-text-decoration-style) |\n// | --graupl-link-disabled-text-decoration-style | solid |\n// | --graupl-link-color | var(--graupl-theme-active--primary--700) |\n// | --graupl-link-visited-color | var(--graupl-link-color) |\n// | --graupl-link-focus-color | var(--graupl-link-color) |\n// | --graupl-link-hover-color | theme.get(tertiary, 700) |\n// | --graupl-link-active-color | var(--graupl-link-hover-color) |\n// | --graupl-link-disabled-color | var(--graupl-theme-active--primary--200) |\n// | --graupl-link-text-decoration-color | var(--graupl-link-color) |\n// | --graupl-link-visited-text-decoration-color | var(--graupl-link-visited-color) |\n// | --graupl-link-focus-text-decoration-color | var(--graupl-link-focus-color) |\n// | --graupl-link-hover-text-decoration-color | var(--graupl-link-hover-color) |\n// | --graupl-link-active-text-decoration-color | var(--graupl-link-active-color) |\n// | --graupl-link-disabled-text-decoration-color | var(--graupl-link-disabled-color) |\n// | --graupl-link-background | theme.get(transparent) |\n// | --graupl-link-visited-background | var(--graupl-link-background) |\n// | --graupl-link-focus-background | var(--graupl-link-background) |\n// | --graupl-link-hover-background | theme.get(transparent) |\n// | --graupl-link-active-background | var(--graupl-link-hover-background) |\n// | --graupl-link-disabled-background | theme.get(transparent) |\n// | --graupl-link-padding-x | var(--graupl-spacer-0) |\n// | --graupl-link-padding-y | var(--graupl-spacer-0) |\n// | --graupl-link-padding | var(--graupl-link-padding-y) var(--graupl-link-padding-x) |\n// | --graupl-link-transition | background var(--graupl-transition-duration-fast) var(--graupl-transition-timing-function), color var(--graupl-transition-duration-fast) var(--graupl-transition-timing-function), transform var(--graupl-transition-duration-fast) var(--graupl-transition-timing-function) |\n// | --graupl-link-transition-reduced-motion | background var(--graupl-transition-duration-none) var(--graupl-transition-timing-function), color var(--graupl-transition-duration-none) var(--graupl-transition-timing-function) |\n// | --graupl-link-transform | var(--graupl-link-initial-transform) |\n// | --graupl-link-visited-transform | var(--graupl-link-transform) |\n// | --graupl-link-focus-transform | var(--graupl-link-transform) |\n// | --graupl-link-hover-transform | var(--graupl-link-final-transform) |\n// | --graupl-link-active-transform | var(--graupl-link-hover-transform) |\n// | --graupl-link-disabled-transform | var(--graupl-link-disabled-transform) |\n// | --graupl-link-border-top-width | 0 |\n// | --graupl-link-border-right-width | 0 |\n// | --graupl-link-border-bottom-width | 0 |\n// | --graupl-link-border-left-width | 0 |\n// | --graupl-link-border-width | var(--graupl-link-border-top-width) var(--graupl-link-border-right-width) var(--graupl-link-border-bottom-width) var(--graupl-link-border-left-width) |\n// | --graupl-link-border-top-style | var(--graupl-border-top-style) |\n// | --graupl-link-border-right-style | var(--graupl-border-right-style) |\n// | --graupl-link-border-bottom-style | var(--graupl-border-bottom-style) |\n// | --graupl-link-border-left-style | var(--graupl-border-left-style) |\n// | --graupl-link-border-style | var(--graupl-link-border-top-style) var(--graupl-link-border-right-style) var(--graupl-link-border-bottom-style) var(--graupl-link-border-left-style) |\n// | --graupl-link-border-top-left-radius | var(--graupl-border-top-left-radius) |\n// | --graupl-link-border-top-right-radius | var(--graupl-border-top-right-radius) |\n// | --graupl-link-border-bottom-right-radius | var(--graupl-border-bottom-right-radius) |\n// | --graupl-link-border-bottom-left-radius | var(--graupl-border-bottom-left-radius) |\n// | --graupl-link-border-radius | var(--graupl-link-border-top-left-radius) var(--graupl-link-border-top-right-radius) var(--graupl-link-border-bottom-right-radius) var(--graupl-link-border-bottom-left-radius) |\n// | --graupl-link-border-color | theme.get(transparent) |\n// | --graupl-link-visited-border-color | var(--graupl-link-border-color) |\n// | --graupl-link-focus-border-color | var(--graupl-link-border-color) |\n// | --graupl-link-hover-border-color | theme.get(transparent) |\n// | --graupl-link-active-border-color | var(--graupl-link-hover-border-color) |\n// | --graupl-link-disabled-border-color | theme.get(transparent) |\n// | --graupl-link-min-width | var(--graupl-link-min-width) |\n// | --graupl-link-min-height | var(--graupl-link-min-height) |\n// | --graupl-stretched-link-z-index | var(--graupl-stretched-link-z-index) |\n\n@use \"defaults\";\n@use \"../../variables\" as root-variables;\n@use \"../../defaults\" as root-defaults;\n@use \"../../functions/theme\";\n@use \"sass:map\";\n\n// Link properties.\n// --graupl-link-text-decoration\n$link-text-decoration: var(\n --#{root-defaults.$prefix}link-text-decoration,\n #{defaults.$link-initial-text-decoration}\n);\n\n// --graupl-link-visited-text-decoration\n$link-visited-text-decoration: var(\n --#{root-defaults.$prefix}link-visited-text-decoration,\n #{$link-text-decoration}\n);\n\n// --graupl-link-focus-text-decoration\n$link-focus-text-decoration: var(\n --#{root-defaults.$prefix}link-focus-text-decoration,\n #{$link-text-decoration}\n);\n\n// --graupl-link-hover-text-decoration\n$link-hover-text-decoration: var(\n --#{root-defaults.$prefix}link-hover-text-decoration,\n #{defaults.$link-final-text-decoration}\n);\n\n// --graupl-link-active-text-decoration\n$link-active-text-decoration: var(\n --#{root-defaults.$prefix}link-active-text-decoration,\n #{$link-hover-text-decoration}\n);\n\n// --graupl-link-disabled-text-decoration\n$link-disabled-text-decoration: var(\n --#{root-defaults.$prefix}link-disabled-text-decoration,\n #{defaults.$link-disabled-text-decoration}\n);\n$link-text-decoration-states: (\n default: $link-text-decoration,\n visited: $link-visited-text-decoration,\n focus: $link-focus-text-decoration,\n hover: $link-hover-text-decoration,\n active: $link-active-text-decoration,\n disabled: $link-disabled-text-decoration,\n);\n\n// --graupl-link-text-decoration-thickness\n$link-text-decoration-thickness: var(\n --#{root-defaults.$prefix}link-text-decoration-thickness,\n #{root-variables.$border-width}\n);\n\n// --graupl-link-visited-text-decoration-thickness\n$link-visited-text-decoration-thickness: var(\n --#{root-defaults.$prefix}link-visited-text-decoration-thickness,\n #{$link-text-decoration-thickness}\n);\n\n// --graupl-link-focus-text-decoration-thickness\n$link-focus-text-decoration-thickness: var(\n --#{root-defaults.$prefix}link-focus-text-decoration-thickness,\n #{$link-text-decoration-thickness}\n);\n\n// --graupl-link-hover-text-decoration-thickness\n$link-hover-text-decoration-thickness: var(\n --#{root-defaults.$prefix}link-hover-text-decoration-thickness,\n #{root-variables.$border-width}\n);\n\n// --graupl-link-active-text-decoration-thickness\n$link-active-text-decoration-thickness: var(\n --#{root-defaults.$prefix}link-active-text-decoration-thickness,\n #{$link-hover-text-decoration-thickness}\n);\n\n// --graupl-link-disabled-text-decoration-thickness\n$link-disabled-text-decoration-thickness: var(\n --#{root-defaults.$prefix}link-disabled-text-decoration-thickness,\n #{root-variables.$border-width}\n);\n$link-text-decoration-thickness-states: (\n default: $link-text-decoration-thickness,\n visited: $link-visited-text-decoration-thickness,\n focus: $link-focus-text-decoration-thickness,\n hover: $link-hover-text-decoration-thickness,\n active: $link-active-text-decoration-thickness,\n disabled: $link-disabled-text-decoration-thickness,\n);\n\n// --graupl-link-text-decoration-style\n$link-text-decoration-style: var(\n --#{root-defaults.$prefix}link-text-decoration-style,\n #{defaults.$link-initial-text-decoration-style}\n);\n\n// --graupl-link-visited-text-decoration-style\n$link-visited-text-decoration-style: var(\n --#{root-defaults.$prefix}link-visited-text-decoration-style,\n #{$link-text-decoration-style}\n);\n\n// --graupl-link-focus-text-decoration-style\n$link-focus-text-decoration-style: var(\n --#{root-defaults.$prefix}link-focus-text-decoration-style,\n #{$link-text-decoration-style}\n);\n\n// --graupl-link-hover-text-decoration-style\n$link-hover-text-decoration-style: var(\n --#{root-defaults.$prefix}link-hover-text-decoration-style,\n #{defaults.$link-final-text-decoration-style}\n);\n\n// --graupl-link-active-text-decoration-style\n$link-active-text-decoration-style: var(\n --#{root-defaults.$prefix}link-active-text-decoration-style,\n #{$link-hover-text-decoration-style}\n);\n\n// --graupl-link-disabled-text-decoration-style\n$link-disabled-text-decoration-style: var(\n --#{root-defaults.$prefix}link-disabled-text-decoration-style,\n #{defaults.$link-disabled-text-decoration-style}\n);\n$link-text-decoration-style-states: (\n default: $link-text-decoration-style,\n visited: $link-visited-text-decoration-style,\n focus: $link-focus-text-decoration-style,\n hover: $link-hover-text-decoration-style,\n active: $link-active-text-decoration-style,\n disabled: $link-disabled-text-decoration-style,\n);\n\n// --graupl-link-color\n$link-color: var(\n --#{root-defaults.$prefix}link-color,\n #{theme.get(primary, 700)}\n);\n\n// --graupl-link-visited-color\n$link-visited-color: var(\n --#{root-defaults.$prefix}link-visited-color,\n #{$link-color}\n);\n\n// --graupl-link-focus-color\n$link-focus-color: var(\n --#{root-defaults.$prefix}link-focus-color,\n #{$link-color}\n);\n\n// --graupl-link-hover-color\n$link-hover-color: var(\n --#{root-defaults.$prefix}link-hover-color,\n #{theme.get(tertiary, 700)}\n);\n\n// --graupl-link-active-color\n$link-active-color: var(\n --#{root-defaults.$prefix}link-active-color,\n #{$link-hover-color}\n);\n\n// --graupl-link-disabled-color\n$link-disabled-color: var(\n --#{root-defaults.$prefix}link-disabled-color,\n #{theme.get(primary, 200)}\n);\n$link-color-states: (\n default: $link-color,\n visited: $link-visited-color,\n focus: $link-focus-color,\n hover: $link-hover-color,\n active: $link-active-color,\n disabled: $link-disabled-color,\n);\n\n// --graupl-link-text-decoration-color\n$link-text-decoration-color: var(\n --#{root-defaults.$prefix}link-text-decoration-color,\n #{$link-color}\n);\n\n// --graupl-link-visited-text-decoration-color\n$link-visited-text-decoration-color: var(\n --#{root-defaults.$prefix}link-visited-text-decoration-color,\n #{$link-visited-color}\n);\n\n// --graupl-link-focus-text-decoration-color\n$link-focus-text-decoration-color: var(\n --#{root-defaults.$prefix}link-focus-text-decoration-color,\n #{$link-focus-color}\n);\n\n// --graupl-link-hover-text-decoration-color\n$link-hover-text-decoration-color: var(\n --#{root-defaults.$prefix}link-hover-text-decoration-color,\n #{$link-hover-color}\n);\n\n// --graupl-link-active-text-decoration-color\n$link-active-text-decoration-color: var(\n --#{root-defaults.$prefix}link-active-text-decoration-color,\n #{$link-active-color}\n);\n\n// --graupl-link-disabled-text-decoration-color\n$link-disabled-text-decoration-color: var(\n --#{root-defaults.$prefix}link-disabled-text-decoration-color,\n #{$link-disabled-color}\n);\n$link-text-decoration-color-states: (\n default: $link-text-decoration-color,\n visited: $link-visited-text-decoration-color,\n focus: $link-focus-text-decoration-color,\n hover: $link-hover-text-decoration-color,\n active: $link-active-text-decoration-color,\n disabled: $link-disabled-text-decoration-color,\n);\n\n// --graupl-link-background\n$link-background: var(\n --#{root-defaults.$prefix}link-background,\n #{theme.get(transparent)}\n);\n\n// --graupl-link-visited-background\n$link-visited-background: var(\n --#{root-defaults.$prefix}link-visited-background,\n #{$link-background}\n);\n\n// --graupl-link-focus-background\n$link-focus-background: var(\n --#{root-defaults.$prefix}link-focus-background,\n #{$link-background}\n);\n\n// --graupl-link-hover-background\n$link-hover-background: var(\n --#{root-defaults.$prefix}link-hover-background,\n #{theme.get(transparent)}\n);\n\n// --graupl-link-active-background\n$link-active-background: var(\n --#{root-defaults.$prefix}link-active-background,\n #{$link-hover-background}\n);\n\n// --graupl-link-disabled-background\n$link-disabled-background: var(\n --#{root-defaults.$prefix}link-disabled-background,\n #{theme.get(transparent)}\n);\n$link-background-states: (\n default: $link-background,\n visited: $link-visited-background,\n focus: $link-focus-background,\n hover: $link-hover-background,\n active: $link-active-background,\n disabled: $link-disabled-background,\n);\n\n// --graupl-link-padding-x\n$link-padding-x: var(\n --#{root-defaults.$prefix}link-padding-x,\n #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-link-padding-y\n$link-padding-y: var(\n --#{root-defaults.$prefix}link-padding-y,\n #{map.get(root-variables.$spacers, 0)}\n);\n\n// --graupl-link-padding\n$link-padding: var(\n --#{root-defaults.$prefix}link-padding,\n #{$link-padding-y} #{$link-padding-x}\n);\n\n// --graupl-link-transition\n$link-transition: var(\n --#{root-defaults.$prefix}link-transition,\n background #{map.get(root-variables.$transition-durations, fast)}\n #{root-variables.$transition-timing-function},\n color #{map.get(root-variables.$transition-durations, fast)}\n #{root-variables.$transition-timing-function},\n transform #{map.get(root-variables.$transition-durations, fast)}\n #{root-variables.$transition-timing-function}\n);\n\n// --graupl-link-transition-reduced-motion\n$link-transition-reduced-motion: var(\n --#{root-defaults.$prefix}link-transition-reduced-motion,\n background #{map.get(root-variables.$transition-durations, none)}\n #{root-variables.$transition-timing-function},\n color #{map.get(root-variables.$transition-durations, none)}\n #{root-variables.$transition-timing-function}\n);\n\n// --graupl-link-transform\n$link-transform: var(\n --#{root-defaults.$prefix}link-transform,\n #{defaults.$link-initial-transform}\n);\n\n// --graupl-link-visited-transform\n$link-visited-transform: var(\n --#{root-defaults.$prefix}link-visited-transform,\n #{$link-transform}\n);\n\n// --graupl-link-focus-transform\n$link-focus-transform: var(\n --#{root-defaults.$prefix}link-focus-transform,\n #{$link-transform}\n);\n\n// --graupl-link-hover-transform\n$link-hover-transform: var(\n --#{root-defaults.$prefix}link-hover-transform,\n #{defaults.$link-final-transform}\n);\n\n// --graupl-link-active-transform\n$link-active-transform: var(\n --#{root-defaults.$prefix}link-active-transform,\n #{$link-hover-transform}\n);\n\n// --graupl-link-disabled-transform\n$link-disabled-transform: var(\n --#{root-defaults.$prefix}link-disabled-transform,\n #{defaults.$link-disabled-transform}\n);\n$link-transform-states: (\n default: $link-transform,\n visited: $link-visited-transform,\n focus: $link-focus-transform,\n hover: $link-hover-transform,\n active: $link-active-transform,\n disabled: $link-disabled-transform,\n);\n\n// --graupl-link-border-top-width\n$link-border-top-width: var(--#{root-defaults.$prefix}link-border-top-width, 0);\n\n// --graupl-link-border-right-width\n$link-border-right-width: var(\n --#{root-defaults.$prefix}link-border-right-width,\n 0\n);\n\n// --graupl-link-border-bottom-width\n$link-border-bottom-width: var(\n --#{root-defaults.$prefix}link-border-bottom-width,\n 0\n);\n\n// --graupl-link-border-left-width\n$link-border-left-width: var(\n --#{root-defaults.$prefix}link-border-left-width,\n 0\n);\n\n// --graupl-link-border-width\n$link-border-width: var(\n --#{root-defaults.$prefix}link-border-width,\n #{$link-border-top-width} #{$link-border-right-width}\n #{$link-border-bottom-width} #{$link-border-left-width}\n);\n\n// --graupl-link-border-top-style\n$link-border-top-style: var(\n --#{root-defaults.$prefix}link-border-top-style,\n #{root-variables.$border-top-style}\n);\n\n// --graupl-link-border-right-style\n$link-border-right-style: var(\n --#{root-defaults.$prefix}link-border-right-style,\n #{root-variables.$border-right-style}\n);\n\n// --graupl-link-border-bottom-style\n$link-border-bottom-style: var(\n --#{root-defaults.$prefix}link-border-bottom-style,\n #{root-variables.$border-bottom-style}\n);\n\n// --graupl-link-border-left-style\n$link-border-left-style: var(\n --#{root-defaults.$prefix}link-border-left-style,\n #{root-variables.$border-left-style}\n);\n\n// --graupl-link-border-style\n$link-border-style: var(\n --#{root-defaults.$prefix}link-border-style,\n #{$link-border-top-style} #{$link-border-right-style}\n #{$link-border-bottom-style} #{$link-border-left-style}\n);\n\n// --graupl-link-border-top-left-radius\n$link-border-top-left-radius: var(\n --#{root-defaults.$prefix}link-border-top-left-radius,\n #{root-variables.$border-top-left-radius}\n);\n\n// --graupl-link-border-top-right-radius\n$link-border-top-right-radius: var(\n --#{root-defaults.$prefix}link-border-top-right-radius,\n #{root-variables.$border-top-right-radius}\n);\n\n// --graupl-link-border-bottom-right-radius\n$link-border-bottom-right-radius: var(\n --#{root-defaults.$prefix}link-border-bottom-right-radius,\n #{root-variables.$border-bottom-right-radius}\n);\n\n// --graupl-link-border-bottom-left-radius\n$link-border-bottom-left-radius: var(\n --#{root-defaults.$prefix}link-border-bottom-left-radius,\n #{root-variables.$border-bottom-left-radius}\n);\n\n// --graupl-link-border-radius\n$link-border-radius: var(\n --#{root-defaults.$prefix}link-border-radius,\n #{$link-border-top-left-radius} #{$link-border-top-right-radius}\n #{$link-border-bottom-right-radius} #{$link-border-bottom-left-radius}\n);\n\n// --graupl-link-border-color\n$link-border-color: var(\n --#{root-defaults.$prefix}link-border-color,\n #{theme.get(transparent)}\n);\n\n// --graupl-link-visited-border-color\n$link-visited-border-color: var(\n --#{root-defaults.$prefix}link-visited-border-color,\n #{$link-border-color}\n);\n\n// --graupl-link-focus-border-color\n$link-focus-border-color: var(\n --#{root-defaults.$prefix}link-focus-border-color,\n #{$link-border-color}\n);\n\n// --graupl-link-hover-border-color\n$link-hover-border-color: var(\n --#{root-defaults.$prefix}link-hover-border-color,\n #{theme.get(transparent)}\n);\n\n// --graupl-link-active-border-color\n$link-active-border-color: var(\n --#{root-defaults.$prefix}link-active-border-color,\n #{$link-hover-border-color}\n);\n\n// --graupl-link-disabled-border-color\n$link-disabled-border-color: var(\n --#{root-defaults.$prefix}link-disabled-border-color,\n #{theme.get(transparent)}\n);\n$link-border-color-states: (\n default: $link-border-color,\n visited: $link-visited-border-color,\n focus: $link-focus-border-color,\n hover: $link-hover-border-color,\n active: $link-active-border-color,\n disabled: $link-disabled-border-color,\n);\n\n// --graupl-link-min-width\n$link-min-width: var(\n --#{root-defaults.$prefix}link-min-width,\n defaults.$link-min-width\n);\n\n// --graupl-link-min-height\n$link-min-height: var(\n --#{root-defaults.$prefix}link-min-height,\n defaults.$link-min-height\n);\n\n// Stretched link properties.\n// --graupl-stretched-link-z-index\n$stretched-link-z-index: var(\n --#{root-defaults.$prefix}stretched-link-z-index,\n #{defaults.$stretched-link-z-index}\n);\n","// @graupl/core state mixins.\n//\n// A series of mixins to tie styles to a state.\n\n@use \"../defaults\" as root-defaults;\n@use \"sass:map\";\n\n/// Applies styles to a specific state.\n///\n/// @param {string} $state\n/// The name of the state to apply the styles to.\n@mixin state($state) {\n @each $selector in map.get(root-defaults.$state-selectors, $state) {\n &#{$selector} {\n @content;\n }\n }\n}\n\n/// Generates state modifiers with properties.\n///\n/// @param {map} $state-map\n/// The map of props and states.\n/// @param {string} $selector-base\n/// The selector base for the state modifier.\n/// @param {string} $selector-prefix\n/// The selector prefix for the state modifer.\n@mixin generate-modifiers($state-map) {\n @each $state, $selectors in root-defaults.$state-selectors {\n @each $selector in $selectors {\n // e.g &:visited, &:focus-visible, &:hover, &:active, &:disabled\n &#{$selector} {\n @each $prop, $map in $state-map {\n #{$prop}: map.get($map, $state);\n }\n\n // If the state is disabled, we want that to supersede all other states.\n @if $state == \"disabled\" {\n @each $sub-state, $sub-selectors in root-defaults.$state-selectors {\n @if $sub-state != $state {\n @each $sub-selector in $sub-selectors {\n // e.g &:visited, &:focus-visible, &:hover, &:active\n &#{$sub-selector} {\n @each $prop, $map in $state-map {\n #{$prop}: map.get($map, $state);\n }\n }\n }\n }\n }\n }\n }\n }\n }\n}\n","// @graupl/core animation media query mixins.\n\n// A media query for targeting users who have not requested reduced motion.\n@mixin on {\n @media (prefers-reduced-motion: no-preference) {\n @content;\n }\n}\n\n// A media query for targeting users who have requested reduced motion.\n@mixin off {\n @media (prefers-reduced-motion: reduce) {\n @content;\n }\n}\n"],"names":[]}