@graupl/graupl 1.0.0-beta.54 → 1.0.0-beta.55

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 (33) hide show
  1. package/dist/css/graupl.css +1 -1
  2. package/dist/css/graupl.css.map +1 -1
  3. package/dist/css/utilities/border.css +1 -1
  4. package/dist/css/utilities/border.css.map +1 -1
  5. package/dist/css/utilities.css +1 -1
  6. package/dist/css/utilities.css.map +1 -1
  7. package/dist/js/accordion.js.map +1 -1
  8. package/dist/js/alert.js.map +1 -1
  9. package/dist/js/breadcrumb.js.map +1 -1
  10. package/dist/js/carousel.js.map +1 -1
  11. package/dist/js/component/accordion.iife.js.map +1 -1
  12. package/dist/js/component/alert.iife.js.map +1 -1
  13. package/dist/js/component/breadcrumb.iife.js.map +1 -1
  14. package/dist/js/component/carousel.iife.js.map +1 -1
  15. package/dist/js/component/disclosure.iife.js.map +1 -1
  16. package/dist/js/component/tabs.iife.js.map +1 -1
  17. package/dist/js/component/tooltip.iife.js.map +1 -1
  18. package/dist/js/disclosure.js.map +1 -1
  19. package/dist/js/generator/accordion.iife.js.map +1 -1
  20. package/dist/js/generator/alert.iife.js.map +1 -1
  21. package/dist/js/generator/breadcrumb.iife.js.map +1 -1
  22. package/dist/js/generator/carousel.iife.js.map +1 -1
  23. package/dist/js/generator/disclosure.iife.js.map +1 -1
  24. package/dist/js/generator/navigation.iife.js.map +1 -1
  25. package/dist/js/generator/tabs.iife.js.map +1 -1
  26. package/dist/js/generator/tooltip.iife.js.map +1 -1
  27. package/dist/js/graupl.js.map +1 -1
  28. package/dist/js/navigation.js.map +1 -1
  29. package/dist/js/storage/initializer.js.map +1 -1
  30. package/dist/js/storage/storage-manager.iife.js.map +1 -1
  31. package/dist/js/tabs.js.map +1 -1
  32. package/dist/js/tooltip.js.map +1 -1
  33. package/package.json +1 -1
package/dist/css/utilities/border.css.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sourceRoot":null,"mappings":"ACSI,wBCyKE,mFAAA,+VAAA,2YAAA,2YAAA,2YAAA,2YAAA,2YAAA,2YAAA,2YAAA,2YAAA,2YAAA,iXAAA,6ZAAA,6ZAAA,6ZAAA,6ZAAA,6ZAAA,6ZAAA,6ZAAA,6ZAAA,6ZAAA,4VAAA,oZAAA,oZAAA,oZAAA,oZAAA,wYAAA,oZAAA,oZAAA,oZAAA,oZAAA,qDAAA,iDAAA,oGAAA,uGAAA,sGAAA,qGAAA,sGAAA,oGAAA,sGAAA,oGAAA,oGAAA,oGAAA,uGAAA,2CAAA,6CAAA,6CAAA,6CAAA,6CAAA,2CAAA,2CAAA,6CAAA,yCAAA,2CAAA,yCAAA,6CAAA,yCAAA,4FAAA,+FAAA,8FAAA,6FAAA,8FAAA,4FAAA,8FAAA,4FAAA,4FAAA,4FAAA,+FAAA","sources":["dist/css/utilities/border.css","var/www/html/node_modules/@graupl/core/src/scss/mixins/_layer.scss","var/www/html/node_modules/@graupl/core/src/scss/mixins/_utility.scss"],"sourcesContent":["@layer graupl.utilities {\n .border-transparent {\n border-color: transparent !important;\n --graupl-border-color: transparent;\n }\n .border-primary {\n border-color: var(--graupl-theme-active--primary, var(--graupl-theme-default--primary, light-dark(var(--graupl-primary, hsl(219, 75%, 50%)), var(--graupl-primary, hsl(219, 75%, 50%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--primary, var(--graupl-theme-default--primary, light-dark(var(--graupl-primary, hsl(219, 75%, 50%)), var(--graupl-primary, hsl(219, 75%, 50%)))));\n }\n .border-primary-100 {\n border-color: var(--graupl-theme-active--primary--100, var(--graupl-theme-default--primary--100, light-dark(var(--graupl-primary--100, hsl(219, 100%, 95%)), var(--graupl-primary--900, hsl(219, 100%, 10%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--primary--100, var(--graupl-theme-default--primary--100, light-dark(var(--graupl-primary--100, hsl(219, 100%, 95%)), var(--graupl-primary--900, hsl(219, 100%, 10%)))));\n }\n .border-primary-200 {\n border-color: var(--graupl-theme-active--primary--200, var(--graupl-theme-default--primary--200, light-dark(var(--graupl-primary--200, hsl(219, 90%, 80%)), var(--graupl-primary--800, hsl(219, 90%, 20%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--primary--200, var(--graupl-theme-default--primary--200, light-dark(var(--graupl-primary--200, hsl(219, 90%, 80%)), var(--graupl-primary--800, hsl(219, 90%, 20%)))));\n }\n .border-primary-300 {\n border-color: var(--graupl-theme-active--primary--300, var(--graupl-theme-default--primary--300, light-dark(var(--graupl-primary--300, hsl(219, 80%, 65%)), var(--graupl-primary--700, hsl(219, 80%, 35%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--primary--300, var(--graupl-theme-default--primary--300, light-dark(var(--graupl-primary--300, hsl(219, 80%, 65%)), var(--graupl-primary--700, hsl(219, 80%, 35%)))));\n }\n .border-primary-400 {\n border-color: var(--graupl-theme-active--primary--400, var(--graupl-theme-default--primary--400, light-dark(var(--graupl-primary--400, hsl(219, 75%, 55%)), var(--graupl-primary--600, hsl(219, 75%, 45%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--primary--400, var(--graupl-theme-default--primary--400, light-dark(var(--graupl-primary--400, hsl(219, 75%, 55%)), var(--graupl-primary--600, hsl(219, 75%, 45%)))));\n }\n .border-primary-500 {\n border-color: var(--graupl-theme-active--primary--500, var(--graupl-theme-default--primary--500, light-dark(var(--graupl-primary--500, hsl(219, 75%, 50%)), var(--graupl-primary--500, hsl(219, 75%, 50%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--primary--500, var(--graupl-theme-default--primary--500, light-dark(var(--graupl-primary--500, hsl(219, 75%, 50%)), var(--graupl-primary--500, hsl(219, 75%, 50%)))));\n }\n .border-primary-600 {\n border-color: var(--graupl-theme-active--primary--600, var(--graupl-theme-default--primary--600, light-dark(var(--graupl-primary--600, hsl(219, 75%, 45%)), var(--graupl-primary--400, hsl(219, 75%, 55%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--primary--600, var(--graupl-theme-default--primary--600, light-dark(var(--graupl-primary--600, hsl(219, 75%, 45%)), var(--graupl-primary--400, hsl(219, 75%, 55%)))));\n }\n .border-primary-700 {\n border-color: var(--graupl-theme-active--primary--700, var(--graupl-theme-default--primary--700, light-dark(var(--graupl-primary--700, hsl(219, 80%, 35%)), var(--graupl-primary--300, hsl(219, 80%, 65%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--primary--700, var(--graupl-theme-default--primary--700, light-dark(var(--graupl-primary--700, hsl(219, 80%, 35%)), var(--graupl-primary--300, hsl(219, 80%, 65%)))));\n }\n .border-primary-800 {\n border-color: var(--graupl-theme-active--primary--800, var(--graupl-theme-default--primary--800, light-dark(var(--graupl-primary--800, hsl(219, 90%, 20%)), var(--graupl-primary--200, hsl(219, 90%, 80%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--primary--800, var(--graupl-theme-default--primary--800, light-dark(var(--graupl-primary--800, hsl(219, 90%, 20%)), var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n }\n .border-primary-900 {\n border-color: var(--graupl-theme-active--primary--900, var(--graupl-theme-default--primary--900, light-dark(var(--graupl-primary--900, hsl(219, 100%, 10%)), var(--graupl-primary--100, hsl(219, 100%, 95%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--primary--900, var(--graupl-theme-default--primary--900, light-dark(var(--graupl-primary--900, hsl(219, 100%, 10%)), var(--graupl-primary--100, hsl(219, 100%, 95%)))));\n }\n .border-secondary {\n border-color: var(--graupl-theme-active--secondary, var(--graupl-theme-default--secondary, light-dark(var(--graupl-secondary, hsl(235, 15%, 50%)), var(--graupl-secondary, hsl(235, 15%, 50%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--secondary, var(--graupl-theme-default--secondary, light-dark(var(--graupl-secondary, hsl(235, 15%, 50%)), var(--graupl-secondary, hsl(235, 15%, 50%)))));\n }\n .border-secondary-100 {\n border-color: var(--graupl-theme-active--secondary--100, var(--graupl-theme-default--secondary--100, light-dark(var(--graupl-secondary--100, hsl(235, 40%, 95%)), var(--graupl-secondary--900, hsl(235, 40%, 10%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--secondary--100, var(--graupl-theme-default--secondary--100, light-dark(var(--graupl-secondary--100, hsl(235, 40%, 95%)), var(--graupl-secondary--900, hsl(235, 40%, 10%)))));\n }\n .border-secondary-200 {\n border-color: var(--graupl-theme-active--secondary--200, var(--graupl-theme-default--secondary--200, light-dark(var(--graupl-secondary--200, hsl(235, 30%, 80%)), var(--graupl-secondary--800, hsl(235, 30%, 20%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--secondary--200, var(--graupl-theme-default--secondary--200, light-dark(var(--graupl-secondary--200, hsl(235, 30%, 80%)), var(--graupl-secondary--800, hsl(235, 30%, 20%)))));\n }\n .border-secondary-300 {\n border-color: var(--graupl-theme-active--secondary--300, var(--graupl-theme-default--secondary--300, light-dark(var(--graupl-secondary--300, hsl(235, 20%, 65%)), var(--graupl-secondary--700, hsl(235, 20%, 35%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--secondary--300, var(--graupl-theme-default--secondary--300, light-dark(var(--graupl-secondary--300, hsl(235, 20%, 65%)), var(--graupl-secondary--700, hsl(235, 20%, 35%)))));\n }\n .border-secondary-400 {\n border-color: var(--graupl-theme-active--secondary--400, var(--graupl-theme-default--secondary--400, light-dark(var(--graupl-secondary--400, hsl(235, 15%, 55%)), var(--graupl-secondary--600, hsl(235, 15%, 45%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--secondary--400, var(--graupl-theme-default--secondary--400, light-dark(var(--graupl-secondary--400, hsl(235, 15%, 55%)), var(--graupl-secondary--600, hsl(235, 15%, 45%)))));\n }\n .border-secondary-500 {\n border-color: var(--graupl-theme-active--secondary--500, var(--graupl-theme-default--secondary--500, light-dark(var(--graupl-secondary--500, hsl(235, 15%, 50%)), var(--graupl-secondary--500, hsl(235, 15%, 50%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--secondary--500, var(--graupl-theme-default--secondary--500, light-dark(var(--graupl-secondary--500, hsl(235, 15%, 50%)), var(--graupl-secondary--500, hsl(235, 15%, 50%)))));\n }\n .border-secondary-600 {\n border-color: var(--graupl-theme-active--secondary--600, var(--graupl-theme-default--secondary--600, light-dark(var(--graupl-secondary--600, hsl(235, 15%, 45%)), var(--graupl-secondary--400, hsl(235, 15%, 55%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--secondary--600, var(--graupl-theme-default--secondary--600, light-dark(var(--graupl-secondary--600, hsl(235, 15%, 45%)), var(--graupl-secondary--400, hsl(235, 15%, 55%)))));\n }\n .border-secondary-700 {\n border-color: var(--graupl-theme-active--secondary--700, var(--graupl-theme-default--secondary--700, light-dark(var(--graupl-secondary--700, hsl(235, 20%, 35%)), var(--graupl-secondary--300, hsl(235, 20%, 65%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--secondary--700, var(--graupl-theme-default--secondary--700, light-dark(var(--graupl-secondary--700, hsl(235, 20%, 35%)), var(--graupl-secondary--300, hsl(235, 20%, 65%)))));\n }\n .border-secondary-800 {\n border-color: var(--graupl-theme-active--secondary--800, var(--graupl-theme-default--secondary--800, light-dark(var(--graupl-secondary--800, hsl(235, 30%, 20%)), var(--graupl-secondary--200, hsl(235, 30%, 80%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--secondary--800, var(--graupl-theme-default--secondary--800, light-dark(var(--graupl-secondary--800, hsl(235, 30%, 20%)), var(--graupl-secondary--200, hsl(235, 30%, 80%)))));\n }\n .border-secondary-900 {\n border-color: var(--graupl-theme-active--secondary--900, var(--graupl-theme-default--secondary--900, light-dark(var(--graupl-secondary--900, hsl(235, 40%, 10%)), var(--graupl-secondary--100, hsl(235, 40%, 95%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--secondary--900, var(--graupl-theme-default--secondary--900, light-dark(var(--graupl-secondary--900, hsl(235, 40%, 10%)), var(--graupl-secondary--100, hsl(235, 40%, 95%)))));\n }\n .border-tertiary {\n border-color: var(--graupl-theme-active--tertiary, var(--graupl-theme-default--tertiary, light-dark(var(--graupl-tertiary, hsl(340, 60%, 50%)), var(--graupl-tertiary, hsl(340, 60%, 50%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--tertiary, var(--graupl-theme-default--tertiary, light-dark(var(--graupl-tertiary, hsl(340, 60%, 50%)), var(--graupl-tertiary, hsl(340, 60%, 50%)))));\n }\n .border-tertiary-100 {\n border-color: var(--graupl-theme-active--tertiary--100, var(--graupl-theme-default--tertiary--100, light-dark(var(--graupl-tertiary--100, hsl(340, 85%, 95%)), var(--graupl-tertiary--900, hsl(340, 85%, 10%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--tertiary--100, var(--graupl-theme-default--tertiary--100, light-dark(var(--graupl-tertiary--100, hsl(340, 85%, 95%)), var(--graupl-tertiary--900, hsl(340, 85%, 10%)))));\n }\n .border-tertiary-200 {\n border-color: var(--graupl-theme-active--tertiary--200, var(--graupl-theme-default--tertiary--200, light-dark(var(--graupl-tertiary--200, hsl(340, 75%, 80%)), var(--graupl-tertiary--800, hsl(340, 75%, 20%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--tertiary--200, var(--graupl-theme-default--tertiary--200, light-dark(var(--graupl-tertiary--200, hsl(340, 75%, 80%)), var(--graupl-tertiary--800, hsl(340, 75%, 20%)))));\n }\n .border-tertiary-300 {\n border-color: var(--graupl-theme-active--tertiary--300, var(--graupl-theme-default--tertiary--300, light-dark(var(--graupl-tertiary--300, hsl(340, 65%, 65%)), var(--graupl-tertiary--700, hsl(340, 65%, 35%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--tertiary--300, var(--graupl-theme-default--tertiary--300, light-dark(var(--graupl-tertiary--300, hsl(340, 65%, 65%)), var(--graupl-tertiary--700, hsl(340, 65%, 35%)))));\n }\n .border-tertiary-400 {\n border-color: var(--graupl-theme-active--tertiary--400, var(--graupl-theme-default--tertiary--400, light-dark(var(--graupl-tertiary--400, hsl(340, 60%, 55%)), var(--graupl-tertiary--600, hsl(340, 60%, 45%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--tertiary--400, var(--graupl-theme-default--tertiary--400, light-dark(var(--graupl-tertiary--400, hsl(340, 60%, 55%)), var(--graupl-tertiary--600, hsl(340, 60%, 45%)))));\n }\n .border-tertiary-500 {\n border-color: var(--graupl-theme-active--tertiary--500, var(--graupl-theme-default--tertiary--500, light-dark(var(--graupl-tertiary--500, hsl(340, 60%, 50%)), var(--graupl-tertiary--500, hsl(340, 60%, 50%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--tertiary--500, var(--graupl-theme-default--tertiary--500, light-dark(var(--graupl-tertiary--500, hsl(340, 60%, 50%)), var(--graupl-tertiary--500, hsl(340, 60%, 50%)))));\n }\n .border-tertiary-600 {\n border-color: var(--graupl-theme-active--tertiary--600, var(--graupl-theme-default--tertiary--600, light-dark(var(--graupl-tertiary--600, hsl(340, 60%, 45%)), var(--graupl-tertiary--400, hsl(340, 60%, 55%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--tertiary--600, var(--graupl-theme-default--tertiary--600, light-dark(var(--graupl-tertiary--600, hsl(340, 60%, 45%)), var(--graupl-tertiary--400, hsl(340, 60%, 55%)))));\n }\n .border-tertiary-700 {\n border-color: var(--graupl-theme-active--tertiary--700, var(--graupl-theme-default--tertiary--700, light-dark(var(--graupl-tertiary--700, hsl(340, 65%, 35%)), var(--graupl-tertiary--300, hsl(340, 65%, 65%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--tertiary--700, var(--graupl-theme-default--tertiary--700, light-dark(var(--graupl-tertiary--700, hsl(340, 65%, 35%)), var(--graupl-tertiary--300, hsl(340, 65%, 65%)))));\n }\n .border-tertiary-800 {\n border-color: var(--graupl-theme-active--tertiary--800, var(--graupl-theme-default--tertiary--800, light-dark(var(--graupl-tertiary--800, hsl(340, 75%, 20%)), var(--graupl-tertiary--200, hsl(340, 75%, 80%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--tertiary--800, var(--graupl-theme-default--tertiary--800, light-dark(var(--graupl-tertiary--800, hsl(340, 75%, 20%)), var(--graupl-tertiary--200, hsl(340, 75%, 80%)))));\n }\n .border-tertiary-900 {\n border-color: var(--graupl-theme-active--tertiary--900, var(--graupl-theme-default--tertiary--900, light-dark(var(--graupl-tertiary--900, hsl(340, 85%, 10%)), var(--graupl-tertiary--100, hsl(340, 85%, 95%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--tertiary--900, var(--graupl-theme-default--tertiary--900, light-dark(var(--graupl-tertiary--900, hsl(340, 85%, 10%)), var(--graupl-tertiary--100, hsl(340, 85%, 95%)))));\n }\n}\n@layer graupl.utilities {\n .border-radius-rounded {\n border-radius: 100vw !important;\n }\n .border-radius-squared {\n border-radius: 0 !important;\n }\n .border-radius-0 {\n border-radius: var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem))) !important;\n }\n .border-radius-1 {\n border-radius: var(--graupl-spacer-1, calc(0.125 * var(--graupl-spacer, 1rem))) !important;\n }\n .border-radius-2 {\n border-radius: var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem))) !important;\n }\n .border-radius-3 {\n border-radius: var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem))) !important;\n }\n .border-radius-4 {\n border-radius: var(--graupl-spacer-4, calc(0.75 * var(--graupl-spacer, 1rem))) !important;\n }\n .border-radius-5 {\n border-radius: var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem))) !important;\n }\n .border-radius-6 {\n border-radius: var(--graupl-spacer-6, calc(1.5 * var(--graupl-spacer, 1rem))) !important;\n }\n .border-radius-7 {\n border-radius: var(--graupl-spacer-7, calc(2 * var(--graupl-spacer, 1rem))) !important;\n }\n .border-radius-8 {\n border-radius: var(--graupl-spacer-8, calc(3 * var(--graupl-spacer, 1rem))) !important;\n }\n .border-radius-9 {\n border-radius: var(--graupl-spacer-9, calc(5 * var(--graupl-spacer, 1rem))) !important;\n }\n .border-radius-10 {\n border-radius: var(--graupl-spacer-10, calc(10 * var(--graupl-spacer, 1rem))) !important;\n }\n}\n@layer graupl.utilities {\n .border-solid {\n border-style: solid !important;\n }\n .border-dashed {\n border-style: dashed !important;\n }\n .border-dotted {\n border-style: dotted !important;\n }\n .border-double {\n border-style: double !important;\n }\n .border-groove {\n border-style: groove !important;\n }\n .border-ridge {\n border-style: ridge !important;\n }\n .border-inset {\n border-style: inset !important;\n }\n .border-outset {\n border-style: outset !important;\n }\n .border-none {\n border-style: none !important;\n }\n}\n@layer graupl.utilities {\n .border-thick {\n border-width: thick !important;\n }\n .border-thin {\n border-width: thin !important;\n }\n .border-medium {\n border-width: medium !important;\n }\n .border-none {\n border-width: none !important;\n }\n .border-0 {\n border-width: var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem))) !important;\n }\n .border-1 {\n border-width: var(--graupl-spacer-1, calc(0.125 * var(--graupl-spacer, 1rem))) !important;\n }\n .border-2 {\n border-width: var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem))) !important;\n }\n .border-3 {\n border-width: var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem))) !important;\n }\n .border-4 {\n border-width: var(--graupl-spacer-4, calc(0.75 * var(--graupl-spacer, 1rem))) !important;\n }\n .border-5 {\n border-width: var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem))) !important;\n }\n .border-6 {\n border-width: var(--graupl-spacer-6, calc(1.5 * var(--graupl-spacer, 1rem))) !important;\n }\n .border-7 {\n border-width: var(--graupl-spacer-7, calc(2 * var(--graupl-spacer, 1rem))) !important;\n }\n .border-8 {\n border-width: var(--graupl-spacer-8, calc(3 * var(--graupl-spacer, 1rem))) !important;\n }\n .border-9 {\n border-width: var(--graupl-spacer-9, calc(5 * var(--graupl-spacer, 1rem))) !important;\n }\n .border-10 {\n border-width: var(--graupl-spacer-10, calc(10 * var(--graupl-spacer, 1rem))) !important;\n }\n}\n@layer graupl.utilities {\n .bordered {\n border-width: var(--graupl-border-top-width, var(--graupl-border-width, 0.125rem)) var(--graupl-border-right-width, var(--graupl-border-width, 0.125rem)) var(--graupl-border-bottom-width, var(--graupl-border-width, 0.125rem)) var(--graupl-border-left-width, var(--graupl-border-width, 0.125rem)) !important;\n border-radius: var(--graupl-border-top-left-radius, var(--graupl-border-radius, 0.125rem)) var(--graupl-border-top-right-radius, var(--graupl-border-radius, 0.125rem)) var(--graupl-border-bottom-right-radius, var(--graupl-border-radius, 0.125rem)) var(--graupl-border-bottom-left-radius, var(--graupl-border-radius, 0.125rem)) !important;\n border-style: var(--graupl-border-top-style, var(--graupl-border-style, solid)) var(--graupl-border-right-style, var(--graupl-border-style, solid)) var(--graupl-border-bottom-style, var(--graupl-border-style, solid)) var(--graupl-border-left-style, var(--graupl-border-style, solid)) !important;\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 utility mixins.\n//\n// Mixins to help generate utility classes.\n\n@use \"./screen\";\n@use \"./container\";\n@use \"./state\";\n@use \"./theme\";\n@use \"../functions/important\";\n@use \"../functions/utility\";\n@use \"../defaults\" as root-defaults;\n@use \"../theme/color/defaults\" as color-defaults;\n@use \"sass:map\";\n@use \"sass:string\";\n\n/// Insert a map of properties and values into a utility class.\n///\n/// @param {Map} $map\n/// The map of properties and values to apply to the selector.\n/// @param {Boolean} $important\n/// A flag to determine if the important flag should be added.\n@mixin _insert($map, $important: null) {\n @each $prop, $value in $map {\n // Do not attempt to insert important values inside of custom properties.\n @if string.slice($prop, 1, 2) != \"--\" {\n #{$prop}: important.insert(#{$value}, $override: $important);\n } @else {\n #{$prop}: #{$value};\n }\n }\n\n // Allow for custom overrides and additional styles.\n @content;\n}\n\n/// Handles wrapping utilities with a conditional state.\n///\n/// @param {?string} $state\n/// The state to wrap.\n@mixin _handle-state($state: null) {\n @if $state {\n @include state.state($state) {\n @content;\n }\n } @else {\n @content;\n }\n}\n\n/// Handles wrapping utilities with a conditional screen.\n///\n/// @param {?string} $screen\n/// The screen to wrap.\n@mixin _handle-screen($screen: null) {\n @if $screen {\n @include screen.up($screen) {\n @content;\n }\n } @else {\n @content;\n }\n}\n\n/// Handles wrapping utilities with a conditional container.\n///\n/// @param {?string} $container\n/// The container to wrap.\n@mixin _handle-container($container: null) {\n @if $container {\n @include container.up($container) {\n @content;\n }\n } @else {\n @content;\n }\n}\n\n/// Handles wrapping utilities with a conditional theme.\n///\n/// @param {?string} $theme\n/// The theme mode to wrap.\n@mixin _handle-theme($theme: null) {\n @if $theme {\n @include theme.theme($theme) {\n @content;\n }\n } @else {\n @content;\n }\n}\n\n/// Handles wrapping utilities with a conditional scheme.\n///\n/// @param {?string} $scheme\n/// The scheme mode to wrap.\n@mixin _handle-scheme($scheme: null) {\n @if $scheme {\n @include theme.scheme($scheme) {\n @content;\n }\n } @else {\n @content;\n }\n}\n\n/// Create a utility class with a list of properties and a single value.\n///\n/// @param {string} $selector\n/// The selector to apply the utility class to.\n/// @param {string|List} $property\n/// The property/properties to apply to the selector.\n/// @param {string} $value\n/// The value to apply to the property/properties.\n/// @param {?Boolean} $important\n/// A flag to determine if the important flag should be added.\n/// @param {?string} $screen\n/// The screen to apply the utility class to.\n/// @param {?string} $theme\n/// The theme to apply the utility class to.\n/// @param {?string} $scheme\n/// The scheme mode to apply the utility class to.\n/// @param {?string} $state\n/// The state to apply the utility class to.\n@mixin create(\n $selector,\n $property,\n $value,\n $important: null,\n $screen: null,\n $theme: null,\n $scheme: null,\n $state: null,\n $container: null\n) {\n $map: utility.convert-property-values-to-map($property, $value);\n\n @include create-mapped(\n $selector,\n $map,\n $important: $important,\n $screen: $screen,\n $theme: $theme,\n $scheme: $scheme,\n $state: $state,\n $container: $container\n ) {\n @content;\n }\n}\n\n/// Create a utility class with a map of properties and values.\n///\n/// @param {string} $selector\n/// The selector to apply the utility class to.\n/// @param {Map} $map\n/// The map of properties and values to apply to the selector.\n/// @param {?Boolean} $important\n/// A flag to determine if the important flag should be added.\n/// @param {?string} $screen\n/// The screen to apply the utility class to.\n/// @param {?string} $theme\n/// The theme to apply the utility class to.\n/// @param {?string} $scheme\n/// The scheme mode to apply the utility class to.\n/// @param {?string} $state\n/// The state to apply the utility class to.\n@mixin create-mapped(\n $selector,\n $map,\n $important: null,\n $screen: null,\n $theme: null,\n $scheme: null,\n $state: null,\n $container: null\n) {\n @include _handle-theme($theme) {\n @include _handle-scheme($scheme) {\n #{$selector} {\n @if $screen or $container {\n @if $screen {\n @include _handle-screen($screen) {\n @include _handle-state($state) {\n @include _insert($map, $important) {\n @content;\n }\n }\n }\n }\n\n @if $container {\n @include _handle-container($container) {\n @include _handle-state($state) {\n @include _insert($map, $important) {\n @content;\n }\n }\n }\n }\n } @else {\n @include _handle-state($state) {\n @include _insert($map, $important) {\n @content;\n }\n }\n }\n }\n }\n }\n}\n\n/// Create a suite of utilities for all base and responsive classes.\n///\n/// Takes a utility map that is generated by the generate-utility-map() function.\n///\n/// @param {?Map} $map [()]\n/// The utility map.\n/// @param {?string} $selector-base [root-defaults.$utility-selector-base]\n/// The selector base to use for all generated utilities.\n/// @param {?string} $selector-prefix [root-defaults.$utility-selector-prefix]\n/// The selector prefix to use for all generated utilities.\n/// @param {?string} $selector-suffix [root-defaults.$utility-selector-suffix]\n/// The selector suffix to use for all generated utilities.\n/// @param {?Boolean} $screen-aware [false]\n/// A flag to enable screen-aware utility generation.\n/// @param {?string} $screen-aware-selector-prefix [root-defaults.$utility-screen-aware-selector-prefix]\n/// The selector base to use for all generated screen-aware utilities.\n/// @param {?string} $screen-aware-selector-suffix [root-defaults.$utility-screen-aware-selector-suffix]\n/// The selector prefix to use for all generated screen-aware utilities.\n/// @param {?string} $screen-aware-selector-separator [root-defaults.$utility-screen-aware-selector-separator]\n/// The selector suffix to use for all generated screen-aware utilities.\n/// @param {?Boolean} $theme-aware [false]\n/// A flag to enable theme-aware utility generation.\n/// @param {?string} $theme-aware-selector-prefix [root-defaults.$utility-theme-aware-selector-prefix]\n/// The selector base to use for all generated theme-aware utilities.\n/// @param {?string} $theme-aware-selector-suffix [root-defaults.$utility-theme-aware-selector-suffix]\n/// The selector prefix to use for all generated theme-aware utilities.\n/// @param {?string} $theme-aware-selector-separator [root-defaults.$utility-theme-aware-selector-separator]\n/// The selector suffix to use for all generated theme-aware utilities.\n/// @param {?Boolean} $scheme-aware [false]\n/// A flag to enable scheme-aware utility generation.\n/// @param {?string} $scheme-aware-selector-prefix [root-defaults.$utility-scheme-aware-selector-prefix]\n/// The selector base to use for all generated scheme-aware utilities.\n/// @param {?string} $scheme-aware-selector-suffix [root-defaults.$utility-scheme-aware-selector-suffix]\n/// The selector prefix to use for all generated scheme-aware utilities.\n/// @param {?string} $scheme-aware-selector-separator [root-defaults.$utility-scheme-aware-selector-separator]\n/// The selector suffix to use for all generated scheme-aware utilities.\n/// @param {?Boolean} $state-aware [false]\n/// A flag to enable state-aware utility generation.\n/// @param {?string} $state-aware-selector-prefix [root-defaults.$utility-state-aware-selector-prefix]\n/// The selector base to use for all generated state-aware utilities.\n/// @param {?string} $state-aware-selector-suffix [root-defaults.$utility-state-aware-selector-suffix]\n/// The selector prefix to use for all generated state-aware utilities.\n/// @param {?string} $state-aware-selector-separator [root-defaults.$utility-state-aware-selector-separator]\n/// The selector suffix to use for all generated state-aware utilities.\n/// @param {?Boolean} $container-aware [false]\n/// A flag to enable container-aware utility generation.\n/// @param {?string} $container-aware-selector-prefix [root-defaults.$utility-container-aware-selector-prefix]\n/// The selector base to use for all generated container-aware utilities.\n/// @param {?string} $container-aware-selector-suffix [root-defaults.$utility-container-aware-selector-suffix]\n/// The selector prefix to use for all generated container-aware utilities.\n/// @param {?string} $container-aware-selector-separator [root-defaults.$utility-container-aware-selector-separator]\n/// The selector suffix to use for all generated container-aware utilities.\n/// @param {?Boolean} $important [root-defaults.$use-important]\n/// A flag to determine if the important flag should be added to all utility properties.\n@mixin generate(\n $map: (),\n $selector-base: root-defaults.$utility-selector-base,\n $selector-prefix: root-defaults.$utility-selector-prefix,\n $selector-suffix: root-defaults.$utility-selector-suffix,\n $screen-aware: false,\n $screen-aware-selector-prefix:\n root-defaults.$utility-screen-aware-selector-prefix,\n $screen-aware-selector-suffix:\n root-defaults.$utility-screen-aware-selector-suffix,\n $screen-aware-selector-separator:\n root-defaults.$utility-screen-aware-selector-separator,\n $theme-aware: false,\n $theme-aware-selector-prefix:\n root-defaults.$utility-theme-aware-selector-prefix,\n $theme-aware-selector-suffix:\n root-defaults.$utility-theme-aware-selector-suffix,\n $theme-aware-selector-separator:\n root-defaults.$utility-theme-aware-selector-separator,\n $scheme-aware: false,\n $scheme-aware-selector-prefix:\n root-defaults.$utility-scheme-aware-selector-prefix,\n $scheme-aware-selector-suffix:\n root-defaults.$utility-scheme-aware-selector-suffix,\n $scheme-aware-selector-separator:\n root-defaults.$utility-scheme-aware-selector-separator,\n $state-aware: false,\n $state-aware-selector-prefix:\n root-defaults.$utility-state-aware-selector-prefix,\n $state-aware-selector-suffix:\n root-defaults.$utility-state-aware-selector-suffix,\n $state-aware-selector-separator:\n root-defaults.$utility-state-aware-selector-separator,\n $container-aware: false,\n $container-aware-selector-prefix:\n root-defaults.$utility-container-aware-selector-prefix,\n $container-aware-selector-suffix:\n root-defaults.$utility-container-aware-selector-suffix,\n $container-aware-selector-separator:\n root-defaults.$utility-container-aware-selector-separator,\n $important: root-defaults.$use-important\n) {\n $utility-selector-prefix: $selector-base;\n\n // Generate all base utilities.\n @each $selector, $properties in $map {\n $utility-selector: #{$selector-prefix}#{$selector}#{$selector-suffix};\n\n @include create-mapped(\n #{$utility-selector-prefix}#{$utility-selector},\n $properties,\n $important\n ) {\n @content ($selector, $properties, $responsive-name: null, $responsive-type: null);\n }\n }\n\n // Generate screen-aware utilities.\n @if $screen-aware and root-defaults.$screen-aware-utilities {\n @each $screen-name in map.keys(root-defaults.$screen-sizes) {\n // e.g. `.md:` or `.lg:`\n $utility-selector-prefix: #{$selector-base}#{$screen-aware-selector-prefix}#{$screen-name}#{$screen-aware-selector-suffix}#{$screen-aware-selector-separator};\n\n @each $selector, $properties in $map {\n $utility-selector: #{$selector-prefix}#{$selector}#{$selector-suffix};\n\n @include create-mapped(\n #{$utility-selector-prefix}#{$utility-selector},\n $properties,\n $important,\n $screen: $screen-name\n ) {\n @content ($selector, $properties, $responsive-name: $screen-name, $responsive-type: \"screen\");\n }\n }\n }\n }\n\n // Generate theme-aware utilities.\n @if $theme-aware and root-defaults.$theme-aware-utilities {\n @each $theme-name in color-defaults.$themes {\n // e.g. `.default-theme:`\n $utility-selector-prefix: #{$selector-base}#{$theme-aware-selector-prefix}#{$theme-name}#{$theme-aware-selector-suffix}#{$theme-aware-selector-separator};\n\n @each $selector, $properties in $map {\n $utility-selector: #{$selector-prefix}#{$selector}#{$selector-suffix};\n\n @include create-mapped(\n #{$utility-selector-prefix}#{$utility-selector},\n $properties,\n $important,\n $theme: $theme-name\n ) {\n @content ($selector, $properties, $responsive-name: $theme-name, $responsive-type: \"theme\");\n }\n }\n }\n }\n\n // Generate scheme-aware utilities.\n @if $scheme-aware and root-defaults.$scheme-aware-utilities {\n @each $scheme-name in color-defaults.$schemes {\n // e.g. `.light-mode:` or `.dark-mode:`\n $utility-selector-prefix: #{$selector-base}#{$scheme-aware-selector-prefix}#{$scheme-name}#{$scheme-aware-selector-suffix}#{$scheme-aware-selector-separator};\n\n @each $selector, $properties in $map {\n $utility-selector: #{$selector-prefix}#{$selector}#{$selector-suffix};\n\n @include create-mapped(\n #{$utility-selector-prefix}#{$utility-selector},\n $properties,\n $important,\n $scheme: $scheme-name\n ) {\n @content ($selector, $properties, $responsive-name: $scheme-name, $responsive-type: \"scheme\");\n }\n }\n }\n }\n\n // Generate state-aware utilities.\n @if $state-aware and root-defaults.$state-aware-utilities {\n @each $state-name in root-defaults.$state-selectors {\n // e.g. `.hover:` or `.focus:`\n $utility-selector-prefix: #{$selector-base}#{$state-aware-selector-prefix}#{$state-name}#{$state-aware-selector-suffix}#{$state-aware-selector-separator};\n\n @each $selector, $properties in $map {\n $utility-selector: #{$selector-prefix}#{$selector}#{$selector-suffix};\n\n @include create-mapped(\n #{$utility-selector-prefix}#{$utility-selector},\n $properties,\n $important,\n $state: $state-name\n ) {\n @content ($selector, $properties, $responsive-name: $state-name, $responsive-type: \"state\");\n }\n }\n }\n }\n\n // Generate container-aware utilities.\n @if $container-aware and root-defaults.$container-aware-utilities {\n @each $container-name in map.keys(root-defaults.$container-sizes) {\n // e.g. `.cq:md:` or `.cq:lg:`\n $utility-selector-prefix: #{$selector-base}#{$container-aware-selector-prefix}#{$container-name}#{$container-aware-selector-suffix}#{$container-aware-selector-separator};\n\n @each $selector, $properties in $map {\n $utility-selector: #{$selector-prefix}#{$selector}#{$selector-suffix};\n\n @include create-mapped(\n #{$utility-selector-prefix}#{$utility-selector},\n $properties,\n $important,\n $container: $container-name\n ) {\n @content ($selector, $properties, $responsive-name: $container-name, $responsive-type: \"container\");\n }\n }\n }\n }\n}\n"],"names":[]}
1
+ {"version":3,"sourceRoot":null,"mappings":"ACSI,wBCyKE,mFAAA,+VAAA,2YAAA,2YAAA,2YAAA,2YAAA,2YAAA,2YAAA,2YAAA,2YAAA,2YAAA,iXAAA,6ZAAA,6ZAAA,6ZAAA,6ZAAA,6ZAAA,6ZAAA,6ZAAA,6ZAAA,6ZAAA,4VAAA,oZAAA,oZAAA,oZAAA,oZAAA,wYAAA,oZAAA,oZAAA,oZAAA,oZAAA,+FAAA,2WAAA,uZAAA,uZAAA,uZAAA,uZAAA,uZAAA,uZAAA,uZAAA,uZAAA,uZAAA,6XAAA,yaAAA,yaAAA,yaAAA,yaAAA,yaAAA,yaAAA,yaAAA,yaAAA,yaAAA,wWAAA,gaAAA,gaAAA,gaAAA,gaAAA,oZAAA,gaAAA,gaAAA,gaAAA,gaAAA,qGAAA,iXAAA,6ZAAA,6ZAAA,6ZAAA,6ZAAA,6ZAAA,6ZAAA,6ZAAA,6ZAAA,6ZAAA,mYAAA,+aAAA,+aAAA,+aAAA,+aAAA,+aAAA,+aAAA,+aAAA,+aAAA,+aAAA,8WAAA,saAAA,saAAA,saAAA,saAAA,0ZAAA,saAAA,saAAA,saAAA,saAAA,wGAAA,oXAAA,gaAAA,gaAAA,gaAAA,gaAAA,gaAAA,gaAAA,gaAAA,gaAAA,gaAAA,sYAAA,kbAAA,kbAAA,kbAAA,kbAAA,kbAAA,kbAAA,kbAAA,kbAAA,kbAAA,iXAAA,yaAAA,yaAAA,yaAAA,yaAAA,6ZAAA,yaAAA,yaAAA,yaAAA,yaAAA,kGAAA,8WAAA,0ZAAA,0ZAAA,0ZAAA,0ZAAA,0ZAAA,0ZAAA,0ZAAA,0ZAAA,0ZAAA,gYAAA,4aAAA,4aAAA,4aAAA,4aAAA,4aAAA,4aAAA,4aAAA,4aAAA,4aAAA,2WAAA,maAAA,maAAA,maAAA,maAAA,uZAAA,maAAA,maAAA,maAAA,maAAA,kFAAA,0EAAA,sLAAA,4LAAA,0LAAA,wLAAA,0LAAA,sLAAA,0LAAA,sLAAA,sLAAA,sLAAA,2LAAA,uLAAA,uKAAA,qYAAA,iZAAA,6YAAA,yYAAA,6YAAA,qYAAA,6YAAA,qYAAA,qYAAA,qYAAA,8YAAA,iMAAA,iLAAA,+YAAA,2ZAAA,uZAAA,mZAAA,uZAAA,+YAAA,uZAAA,+YAAA,+YAAA,+YAAA,wZAAA,sMAAA,sLAAA,oZAAA,gaAAA,4ZAAA,wZAAA,4ZAAA,oZAAA,4ZAAA,oZAAA,oZAAA,oZAAA,6ZAAA,4LAAA,4KAAA,0YAAA,sZAAA,kZAAA,8YAAA,kZAAA,0YAAA,kZAAA,0YAAA,0YAAA,0YAAA,mZAAA,6GAAA,qGAAA,iNAAA,uNAAA,qNAAA,mNAAA,qNAAA,iNAAA,qNAAA,iNAAA,iNAAA,iNAAA,sNAAA,gHAAA,wGAAA,oNAAA,0NAAA,wNAAA,sNAAA,wNAAA,oNAAA,wNAAA,oNAAA,oNAAA,oNAAA,yNAAA,yHAAA,iHAAA,6NAAA,mOAAA,iOAAA,+NAAA,iOAAA,6NAAA,iOAAA,6NAAA,6NAAA,6NAAA,kOAAA,sHAAA,8GAAA,0NAAA,gOAAA,8NAAA,4NAAA,8NAAA,0NAAA,8NAAA,0NAAA,0NAAA,0NAAA,+NAAA,uEAAA,0EAAA,0EAAA,0EAAA,0EAAA,uEAAA,uEAAA,0EAAA,oEAAA,mFAAA,sFAAA,sFAAA,sFAAA,sFAAA,mFAAA,mFAAA,sFAAA,gFAAA,yFAAA,4FAAA,4FAAA,4FAAA,4FAAA,yFAAA,yFAAA,4FAAA,sFAAA,4FAAA,+FAAA,+FAAA,+FAAA,+FAAA,4FAAA,4FAAA,+FAAA,yFAAA,sFAAA,yFAAA,yFAAA,yFAAA,yFAAA,sFAAA,sFAAA,yFAAA,mFAAA,uEAAA,oEAAA,0EAAA,oEAAA,6KAAA,mLAAA,iLAAA,+KAAA,iLAAA,6KAAA,iLAAA,6KAAA,6KAAA,6KAAA,kLAAA,mFAAA,gFAAA,sFAAA,gFAAA,yLAAA,+LAAA,6LAAA,2LAAA,6LAAA,yLAAA,6LAAA,yLAAA,yLAAA,yLAAA,8LAAA,yFAAA,sFAAA,4FAAA,sFAAA,+LAAA,qMAAA,mMAAA,iMAAA,mMAAA,+LAAA,mMAAA,+LAAA,+LAAA,+LAAA,oMAAA,4FAAA,yFAAA,+FAAA,yFAAA,kMAAA,wMAAA,sMAAA,oMAAA,sMAAA,kMAAA,sMAAA,kMAAA,kMAAA,kMAAA,uMAAA,sFAAA,mFAAA,yFAAA,mFAAA,4LAAA,kMAAA,gMAAA,8LAAA,gMAAA,4LAAA,gMAAA,4LAAA,4LAAA,4LAAA,iMAAA","sources":["dist/css/utilities/border.css","var/www/html/node_modules/@graupl/core/src/scss/mixins/_layer.scss","var/www/html/node_modules/@graupl/core/src/scss/mixins/_utility.scss"],"sourcesContent":["@layer graupl.utilities {\n .border-transparent {\n border-color: transparent !important;\n --graupl-border-color: transparent;\n }\n .border-primary {\n border-color: var(--graupl-theme-active--primary, var(--graupl-theme-default--primary, light-dark(var(--graupl-primary, hsl(219, 75%, 50%)), var(--graupl-primary, hsl(219, 75%, 50%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--primary, var(--graupl-theme-default--primary, light-dark(var(--graupl-primary, hsl(219, 75%, 50%)), var(--graupl-primary, hsl(219, 75%, 50%)))));\n }\n .border-primary-100 {\n border-color: var(--graupl-theme-active--primary--100, var(--graupl-theme-default--primary--100, light-dark(var(--graupl-primary--100, hsl(219, 100%, 95%)), var(--graupl-primary--900, hsl(219, 100%, 10%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--primary--100, var(--graupl-theme-default--primary--100, light-dark(var(--graupl-primary--100, hsl(219, 100%, 95%)), var(--graupl-primary--900, hsl(219, 100%, 10%)))));\n }\n .border-primary-200 {\n border-color: var(--graupl-theme-active--primary--200, var(--graupl-theme-default--primary--200, light-dark(var(--graupl-primary--200, hsl(219, 90%, 80%)), var(--graupl-primary--800, hsl(219, 90%, 20%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--primary--200, var(--graupl-theme-default--primary--200, light-dark(var(--graupl-primary--200, hsl(219, 90%, 80%)), var(--graupl-primary--800, hsl(219, 90%, 20%)))));\n }\n .border-primary-300 {\n border-color: var(--graupl-theme-active--primary--300, var(--graupl-theme-default--primary--300, light-dark(var(--graupl-primary--300, hsl(219, 80%, 65%)), var(--graupl-primary--700, hsl(219, 80%, 35%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--primary--300, var(--graupl-theme-default--primary--300, light-dark(var(--graupl-primary--300, hsl(219, 80%, 65%)), var(--graupl-primary--700, hsl(219, 80%, 35%)))));\n }\n .border-primary-400 {\n border-color: var(--graupl-theme-active--primary--400, var(--graupl-theme-default--primary--400, light-dark(var(--graupl-primary--400, hsl(219, 75%, 55%)), var(--graupl-primary--600, hsl(219, 75%, 45%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--primary--400, var(--graupl-theme-default--primary--400, light-dark(var(--graupl-primary--400, hsl(219, 75%, 55%)), var(--graupl-primary--600, hsl(219, 75%, 45%)))));\n }\n .border-primary-500 {\n border-color: var(--graupl-theme-active--primary--500, var(--graupl-theme-default--primary--500, light-dark(var(--graupl-primary--500, hsl(219, 75%, 50%)), var(--graupl-primary--500, hsl(219, 75%, 50%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--primary--500, var(--graupl-theme-default--primary--500, light-dark(var(--graupl-primary--500, hsl(219, 75%, 50%)), var(--graupl-primary--500, hsl(219, 75%, 50%)))));\n }\n .border-primary-600 {\n border-color: var(--graupl-theme-active--primary--600, var(--graupl-theme-default--primary--600, light-dark(var(--graupl-primary--600, hsl(219, 75%, 45%)), var(--graupl-primary--400, hsl(219, 75%, 55%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--primary--600, var(--graupl-theme-default--primary--600, light-dark(var(--graupl-primary--600, hsl(219, 75%, 45%)), var(--graupl-primary--400, hsl(219, 75%, 55%)))));\n }\n .border-primary-700 {\n border-color: var(--graupl-theme-active--primary--700, var(--graupl-theme-default--primary--700, light-dark(var(--graupl-primary--700, hsl(219, 80%, 35%)), var(--graupl-primary--300, hsl(219, 80%, 65%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--primary--700, var(--graupl-theme-default--primary--700, light-dark(var(--graupl-primary--700, hsl(219, 80%, 35%)), var(--graupl-primary--300, hsl(219, 80%, 65%)))));\n }\n .border-primary-800 {\n border-color: var(--graupl-theme-active--primary--800, var(--graupl-theme-default--primary--800, light-dark(var(--graupl-primary--800, hsl(219, 90%, 20%)), var(--graupl-primary--200, hsl(219, 90%, 80%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--primary--800, var(--graupl-theme-default--primary--800, light-dark(var(--graupl-primary--800, hsl(219, 90%, 20%)), var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n }\n .border-primary-900 {\n border-color: var(--graupl-theme-active--primary--900, var(--graupl-theme-default--primary--900, light-dark(var(--graupl-primary--900, hsl(219, 100%, 10%)), var(--graupl-primary--100, hsl(219, 100%, 95%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--primary--900, var(--graupl-theme-default--primary--900, light-dark(var(--graupl-primary--900, hsl(219, 100%, 10%)), var(--graupl-primary--100, hsl(219, 100%, 95%)))));\n }\n .border-secondary {\n border-color: var(--graupl-theme-active--secondary, var(--graupl-theme-default--secondary, light-dark(var(--graupl-secondary, hsl(235, 15%, 50%)), var(--graupl-secondary, hsl(235, 15%, 50%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--secondary, var(--graupl-theme-default--secondary, light-dark(var(--graupl-secondary, hsl(235, 15%, 50%)), var(--graupl-secondary, hsl(235, 15%, 50%)))));\n }\n .border-secondary-100 {\n border-color: var(--graupl-theme-active--secondary--100, var(--graupl-theme-default--secondary--100, light-dark(var(--graupl-secondary--100, hsl(235, 40%, 95%)), var(--graupl-secondary--900, hsl(235, 40%, 10%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--secondary--100, var(--graupl-theme-default--secondary--100, light-dark(var(--graupl-secondary--100, hsl(235, 40%, 95%)), var(--graupl-secondary--900, hsl(235, 40%, 10%)))));\n }\n .border-secondary-200 {\n border-color: var(--graupl-theme-active--secondary--200, var(--graupl-theme-default--secondary--200, light-dark(var(--graupl-secondary--200, hsl(235, 30%, 80%)), var(--graupl-secondary--800, hsl(235, 30%, 20%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--secondary--200, var(--graupl-theme-default--secondary--200, light-dark(var(--graupl-secondary--200, hsl(235, 30%, 80%)), var(--graupl-secondary--800, hsl(235, 30%, 20%)))));\n }\n .border-secondary-300 {\n border-color: var(--graupl-theme-active--secondary--300, var(--graupl-theme-default--secondary--300, light-dark(var(--graupl-secondary--300, hsl(235, 20%, 65%)), var(--graupl-secondary--700, hsl(235, 20%, 35%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--secondary--300, var(--graupl-theme-default--secondary--300, light-dark(var(--graupl-secondary--300, hsl(235, 20%, 65%)), var(--graupl-secondary--700, hsl(235, 20%, 35%)))));\n }\n .border-secondary-400 {\n border-color: var(--graupl-theme-active--secondary--400, var(--graupl-theme-default--secondary--400, light-dark(var(--graupl-secondary--400, hsl(235, 15%, 55%)), var(--graupl-secondary--600, hsl(235, 15%, 45%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--secondary--400, var(--graupl-theme-default--secondary--400, light-dark(var(--graupl-secondary--400, hsl(235, 15%, 55%)), var(--graupl-secondary--600, hsl(235, 15%, 45%)))));\n }\n .border-secondary-500 {\n border-color: var(--graupl-theme-active--secondary--500, var(--graupl-theme-default--secondary--500, light-dark(var(--graupl-secondary--500, hsl(235, 15%, 50%)), var(--graupl-secondary--500, hsl(235, 15%, 50%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--secondary--500, var(--graupl-theme-default--secondary--500, light-dark(var(--graupl-secondary--500, hsl(235, 15%, 50%)), var(--graupl-secondary--500, hsl(235, 15%, 50%)))));\n }\n .border-secondary-600 {\n border-color: var(--graupl-theme-active--secondary--600, var(--graupl-theme-default--secondary--600, light-dark(var(--graupl-secondary--600, hsl(235, 15%, 45%)), var(--graupl-secondary--400, hsl(235, 15%, 55%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--secondary--600, var(--graupl-theme-default--secondary--600, light-dark(var(--graupl-secondary--600, hsl(235, 15%, 45%)), var(--graupl-secondary--400, hsl(235, 15%, 55%)))));\n }\n .border-secondary-700 {\n border-color: var(--graupl-theme-active--secondary--700, var(--graupl-theme-default--secondary--700, light-dark(var(--graupl-secondary--700, hsl(235, 20%, 35%)), var(--graupl-secondary--300, hsl(235, 20%, 65%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--secondary--700, var(--graupl-theme-default--secondary--700, light-dark(var(--graupl-secondary--700, hsl(235, 20%, 35%)), var(--graupl-secondary--300, hsl(235, 20%, 65%)))));\n }\n .border-secondary-800 {\n border-color: var(--graupl-theme-active--secondary--800, var(--graupl-theme-default--secondary--800, light-dark(var(--graupl-secondary--800, hsl(235, 30%, 20%)), var(--graupl-secondary--200, hsl(235, 30%, 80%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--secondary--800, var(--graupl-theme-default--secondary--800, light-dark(var(--graupl-secondary--800, hsl(235, 30%, 20%)), var(--graupl-secondary--200, hsl(235, 30%, 80%)))));\n }\n .border-secondary-900 {\n border-color: var(--graupl-theme-active--secondary--900, var(--graupl-theme-default--secondary--900, light-dark(var(--graupl-secondary--900, hsl(235, 40%, 10%)), var(--graupl-secondary--100, hsl(235, 40%, 95%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--secondary--900, var(--graupl-theme-default--secondary--900, light-dark(var(--graupl-secondary--900, hsl(235, 40%, 10%)), var(--graupl-secondary--100, hsl(235, 40%, 95%)))));\n }\n .border-tertiary {\n border-color: var(--graupl-theme-active--tertiary, var(--graupl-theme-default--tertiary, light-dark(var(--graupl-tertiary, hsl(340, 60%, 50%)), var(--graupl-tertiary, hsl(340, 60%, 50%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--tertiary, var(--graupl-theme-default--tertiary, light-dark(var(--graupl-tertiary, hsl(340, 60%, 50%)), var(--graupl-tertiary, hsl(340, 60%, 50%)))));\n }\n .border-tertiary-100 {\n border-color: var(--graupl-theme-active--tertiary--100, var(--graupl-theme-default--tertiary--100, light-dark(var(--graupl-tertiary--100, hsl(340, 85%, 95%)), var(--graupl-tertiary--900, hsl(340, 85%, 10%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--tertiary--100, var(--graupl-theme-default--tertiary--100, light-dark(var(--graupl-tertiary--100, hsl(340, 85%, 95%)), var(--graupl-tertiary--900, hsl(340, 85%, 10%)))));\n }\n .border-tertiary-200 {\n border-color: var(--graupl-theme-active--tertiary--200, var(--graupl-theme-default--tertiary--200, light-dark(var(--graupl-tertiary--200, hsl(340, 75%, 80%)), var(--graupl-tertiary--800, hsl(340, 75%, 20%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--tertiary--200, var(--graupl-theme-default--tertiary--200, light-dark(var(--graupl-tertiary--200, hsl(340, 75%, 80%)), var(--graupl-tertiary--800, hsl(340, 75%, 20%)))));\n }\n .border-tertiary-300 {\n border-color: var(--graupl-theme-active--tertiary--300, var(--graupl-theme-default--tertiary--300, light-dark(var(--graupl-tertiary--300, hsl(340, 65%, 65%)), var(--graupl-tertiary--700, hsl(340, 65%, 35%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--tertiary--300, var(--graupl-theme-default--tertiary--300, light-dark(var(--graupl-tertiary--300, hsl(340, 65%, 65%)), var(--graupl-tertiary--700, hsl(340, 65%, 35%)))));\n }\n .border-tertiary-400 {\n border-color: var(--graupl-theme-active--tertiary--400, var(--graupl-theme-default--tertiary--400, light-dark(var(--graupl-tertiary--400, hsl(340, 60%, 55%)), var(--graupl-tertiary--600, hsl(340, 60%, 45%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--tertiary--400, var(--graupl-theme-default--tertiary--400, light-dark(var(--graupl-tertiary--400, hsl(340, 60%, 55%)), var(--graupl-tertiary--600, hsl(340, 60%, 45%)))));\n }\n .border-tertiary-500 {\n border-color: var(--graupl-theme-active--tertiary--500, var(--graupl-theme-default--tertiary--500, light-dark(var(--graupl-tertiary--500, hsl(340, 60%, 50%)), var(--graupl-tertiary--500, hsl(340, 60%, 50%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--tertiary--500, var(--graupl-theme-default--tertiary--500, light-dark(var(--graupl-tertiary--500, hsl(340, 60%, 50%)), var(--graupl-tertiary--500, hsl(340, 60%, 50%)))));\n }\n .border-tertiary-600 {\n border-color: var(--graupl-theme-active--tertiary--600, var(--graupl-theme-default--tertiary--600, light-dark(var(--graupl-tertiary--600, hsl(340, 60%, 45%)), var(--graupl-tertiary--400, hsl(340, 60%, 55%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--tertiary--600, var(--graupl-theme-default--tertiary--600, light-dark(var(--graupl-tertiary--600, hsl(340, 60%, 45%)), var(--graupl-tertiary--400, hsl(340, 60%, 55%)))));\n }\n .border-tertiary-700 {\n border-color: var(--graupl-theme-active--tertiary--700, var(--graupl-theme-default--tertiary--700, light-dark(var(--graupl-tertiary--700, hsl(340, 65%, 35%)), var(--graupl-tertiary--300, hsl(340, 65%, 65%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--tertiary--700, var(--graupl-theme-default--tertiary--700, light-dark(var(--graupl-tertiary--700, hsl(340, 65%, 35%)), var(--graupl-tertiary--300, hsl(340, 65%, 65%)))));\n }\n .border-tertiary-800 {\n border-color: var(--graupl-theme-active--tertiary--800, var(--graupl-theme-default--tertiary--800, light-dark(var(--graupl-tertiary--800, hsl(340, 75%, 20%)), var(--graupl-tertiary--200, hsl(340, 75%, 80%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--tertiary--800, var(--graupl-theme-default--tertiary--800, light-dark(var(--graupl-tertiary--800, hsl(340, 75%, 20%)), var(--graupl-tertiary--200, hsl(340, 75%, 80%)))));\n }\n .border-tertiary-900 {\n border-color: var(--graupl-theme-active--tertiary--900, var(--graupl-theme-default--tertiary--900, light-dark(var(--graupl-tertiary--900, hsl(340, 85%, 10%)), var(--graupl-tertiary--100, hsl(340, 85%, 95%))))) !important;\n --graupl-border-color: var(--graupl-theme-active--tertiary--900, var(--graupl-theme-default--tertiary--900, light-dark(var(--graupl-tertiary--900, hsl(340, 85%, 10%)), var(--graupl-tertiary--100, hsl(340, 85%, 95%)))));\n }\n .border-top-transparent {\n border-top-color: transparent !important;\n --graupl-border-top-color: transparent;\n }\n .border-top-primary {\n border-top-color: var(--graupl-theme-active--primary, var(--graupl-theme-default--primary, light-dark(var(--graupl-primary, hsl(219, 75%, 50%)), var(--graupl-primary, hsl(219, 75%, 50%))))) !important;\n --graupl-border-top-color: var(--graupl-theme-active--primary, var(--graupl-theme-default--primary, light-dark(var(--graupl-primary, hsl(219, 75%, 50%)), var(--graupl-primary, hsl(219, 75%, 50%)))));\n }\n .border-top-primary-100 {\n border-top-color: var(--graupl-theme-active--primary--100, var(--graupl-theme-default--primary--100, light-dark(var(--graupl-primary--100, hsl(219, 100%, 95%)), var(--graupl-primary--900, hsl(219, 100%, 10%))))) !important;\n --graupl-border-top-color: var(--graupl-theme-active--primary--100, var(--graupl-theme-default--primary--100, light-dark(var(--graupl-primary--100, hsl(219, 100%, 95%)), var(--graupl-primary--900, hsl(219, 100%, 10%)))));\n }\n .border-top-primary-200 {\n border-top-color: var(--graupl-theme-active--primary--200, var(--graupl-theme-default--primary--200, light-dark(var(--graupl-primary--200, hsl(219, 90%, 80%)), var(--graupl-primary--800, hsl(219, 90%, 20%))))) !important;\n --graupl-border-top-color: var(--graupl-theme-active--primary--200, var(--graupl-theme-default--primary--200, light-dark(var(--graupl-primary--200, hsl(219, 90%, 80%)), var(--graupl-primary--800, hsl(219, 90%, 20%)))));\n }\n .border-top-primary-300 {\n border-top-color: var(--graupl-theme-active--primary--300, var(--graupl-theme-default--primary--300, light-dark(var(--graupl-primary--300, hsl(219, 80%, 65%)), var(--graupl-primary--700, hsl(219, 80%, 35%))))) !important;\n --graupl-border-top-color: var(--graupl-theme-active--primary--300, var(--graupl-theme-default--primary--300, light-dark(var(--graupl-primary--300, hsl(219, 80%, 65%)), var(--graupl-primary--700, hsl(219, 80%, 35%)))));\n }\n .border-top-primary-400 {\n border-top-color: var(--graupl-theme-active--primary--400, var(--graupl-theme-default--primary--400, light-dark(var(--graupl-primary--400, hsl(219, 75%, 55%)), var(--graupl-primary--600, hsl(219, 75%, 45%))))) !important;\n --graupl-border-top-color: var(--graupl-theme-active--primary--400, var(--graupl-theme-default--primary--400, light-dark(var(--graupl-primary--400, hsl(219, 75%, 55%)), var(--graupl-primary--600, hsl(219, 75%, 45%)))));\n }\n .border-top-primary-500 {\n border-top-color: var(--graupl-theme-active--primary--500, var(--graupl-theme-default--primary--500, light-dark(var(--graupl-primary--500, hsl(219, 75%, 50%)), var(--graupl-primary--500, hsl(219, 75%, 50%))))) !important;\n --graupl-border-top-color: var(--graupl-theme-active--primary--500, var(--graupl-theme-default--primary--500, light-dark(var(--graupl-primary--500, hsl(219, 75%, 50%)), var(--graupl-primary--500, hsl(219, 75%, 50%)))));\n }\n .border-top-primary-600 {\n border-top-color: var(--graupl-theme-active--primary--600, var(--graupl-theme-default--primary--600, light-dark(var(--graupl-primary--600, hsl(219, 75%, 45%)), var(--graupl-primary--400, hsl(219, 75%, 55%))))) !important;\n --graupl-border-top-color: var(--graupl-theme-active--primary--600, var(--graupl-theme-default--primary--600, light-dark(var(--graupl-primary--600, hsl(219, 75%, 45%)), var(--graupl-primary--400, hsl(219, 75%, 55%)))));\n }\n .border-top-primary-700 {\n border-top-color: var(--graupl-theme-active--primary--700, var(--graupl-theme-default--primary--700, light-dark(var(--graupl-primary--700, hsl(219, 80%, 35%)), var(--graupl-primary--300, hsl(219, 80%, 65%))))) !important;\n --graupl-border-top-color: var(--graupl-theme-active--primary--700, var(--graupl-theme-default--primary--700, light-dark(var(--graupl-primary--700, hsl(219, 80%, 35%)), var(--graupl-primary--300, hsl(219, 80%, 65%)))));\n }\n .border-top-primary-800 {\n border-top-color: var(--graupl-theme-active--primary--800, var(--graupl-theme-default--primary--800, light-dark(var(--graupl-primary--800, hsl(219, 90%, 20%)), var(--graupl-primary--200, hsl(219, 90%, 80%))))) !important;\n --graupl-border-top-color: var(--graupl-theme-active--primary--800, var(--graupl-theme-default--primary--800, light-dark(var(--graupl-primary--800, hsl(219, 90%, 20%)), var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n }\n .border-top-primary-900 {\n border-top-color: var(--graupl-theme-active--primary--900, var(--graupl-theme-default--primary--900, light-dark(var(--graupl-primary--900, hsl(219, 100%, 10%)), var(--graupl-primary--100, hsl(219, 100%, 95%))))) !important;\n --graupl-border-top-color: var(--graupl-theme-active--primary--900, var(--graupl-theme-default--primary--900, light-dark(var(--graupl-primary--900, hsl(219, 100%, 10%)), var(--graupl-primary--100, hsl(219, 100%, 95%)))));\n }\n .border-top-secondary {\n border-top-color: var(--graupl-theme-active--secondary, var(--graupl-theme-default--secondary, light-dark(var(--graupl-secondary, hsl(235, 15%, 50%)), var(--graupl-secondary, hsl(235, 15%, 50%))))) !important;\n --graupl-border-top-color: var(--graupl-theme-active--secondary, var(--graupl-theme-default--secondary, light-dark(var(--graupl-secondary, hsl(235, 15%, 50%)), var(--graupl-secondary, hsl(235, 15%, 50%)))));\n }\n .border-top-secondary-100 {\n border-top-color: var(--graupl-theme-active--secondary--100, var(--graupl-theme-default--secondary--100, light-dark(var(--graupl-secondary--100, hsl(235, 40%, 95%)), var(--graupl-secondary--900, hsl(235, 40%, 10%))))) !important;\n --graupl-border-top-color: var(--graupl-theme-active--secondary--100, var(--graupl-theme-default--secondary--100, light-dark(var(--graupl-secondary--100, hsl(235, 40%, 95%)), var(--graupl-secondary--900, hsl(235, 40%, 10%)))));\n }\n .border-top-secondary-200 {\n border-top-color: var(--graupl-theme-active--secondary--200, var(--graupl-theme-default--secondary--200, light-dark(var(--graupl-secondary--200, hsl(235, 30%, 80%)), var(--graupl-secondary--800, hsl(235, 30%, 20%))))) !important;\n --graupl-border-top-color: var(--graupl-theme-active--secondary--200, var(--graupl-theme-default--secondary--200, light-dark(var(--graupl-secondary--200, hsl(235, 30%, 80%)), var(--graupl-secondary--800, hsl(235, 30%, 20%)))));\n }\n .border-top-secondary-300 {\n border-top-color: var(--graupl-theme-active--secondary--300, var(--graupl-theme-default--secondary--300, light-dark(var(--graupl-secondary--300, hsl(235, 20%, 65%)), var(--graupl-secondary--700, hsl(235, 20%, 35%))))) !important;\n --graupl-border-top-color: var(--graupl-theme-active--secondary--300, var(--graupl-theme-default--secondary--300, light-dark(var(--graupl-secondary--300, hsl(235, 20%, 65%)), var(--graupl-secondary--700, hsl(235, 20%, 35%)))));\n }\n .border-top-secondary-400 {\n border-top-color: var(--graupl-theme-active--secondary--400, var(--graupl-theme-default--secondary--400, light-dark(var(--graupl-secondary--400, hsl(235, 15%, 55%)), var(--graupl-secondary--600, hsl(235, 15%, 45%))))) !important;\n --graupl-border-top-color: var(--graupl-theme-active--secondary--400, var(--graupl-theme-default--secondary--400, light-dark(var(--graupl-secondary--400, hsl(235, 15%, 55%)), var(--graupl-secondary--600, hsl(235, 15%, 45%)))));\n }\n .border-top-secondary-500 {\n border-top-color: var(--graupl-theme-active--secondary--500, var(--graupl-theme-default--secondary--500, light-dark(var(--graupl-secondary--500, hsl(235, 15%, 50%)), var(--graupl-secondary--500, hsl(235, 15%, 50%))))) !important;\n --graupl-border-top-color: var(--graupl-theme-active--secondary--500, var(--graupl-theme-default--secondary--500, light-dark(var(--graupl-secondary--500, hsl(235, 15%, 50%)), var(--graupl-secondary--500, hsl(235, 15%, 50%)))));\n }\n .border-top-secondary-600 {\n border-top-color: var(--graupl-theme-active--secondary--600, var(--graupl-theme-default--secondary--600, light-dark(var(--graupl-secondary--600, hsl(235, 15%, 45%)), var(--graupl-secondary--400, hsl(235, 15%, 55%))))) !important;\n --graupl-border-top-color: var(--graupl-theme-active--secondary--600, var(--graupl-theme-default--secondary--600, light-dark(var(--graupl-secondary--600, hsl(235, 15%, 45%)), var(--graupl-secondary--400, hsl(235, 15%, 55%)))));\n }\n .border-top-secondary-700 {\n border-top-color: var(--graupl-theme-active--secondary--700, var(--graupl-theme-default--secondary--700, light-dark(var(--graupl-secondary--700, hsl(235, 20%, 35%)), var(--graupl-secondary--300, hsl(235, 20%, 65%))))) !important;\n --graupl-border-top-color: var(--graupl-theme-active--secondary--700, var(--graupl-theme-default--secondary--700, light-dark(var(--graupl-secondary--700, hsl(235, 20%, 35%)), var(--graupl-secondary--300, hsl(235, 20%, 65%)))));\n }\n .border-top-secondary-800 {\n border-top-color: var(--graupl-theme-active--secondary--800, var(--graupl-theme-default--secondary--800, light-dark(var(--graupl-secondary--800, hsl(235, 30%, 20%)), var(--graupl-secondary--200, hsl(235, 30%, 80%))))) !important;\n --graupl-border-top-color: var(--graupl-theme-active--secondary--800, var(--graupl-theme-default--secondary--800, light-dark(var(--graupl-secondary--800, hsl(235, 30%, 20%)), var(--graupl-secondary--200, hsl(235, 30%, 80%)))));\n }\n .border-top-secondary-900 {\n border-top-color: var(--graupl-theme-active--secondary--900, var(--graupl-theme-default--secondary--900, light-dark(var(--graupl-secondary--900, hsl(235, 40%, 10%)), var(--graupl-secondary--100, hsl(235, 40%, 95%))))) !important;\n --graupl-border-top-color: var(--graupl-theme-active--secondary--900, var(--graupl-theme-default--secondary--900, light-dark(var(--graupl-secondary--900, hsl(235, 40%, 10%)), var(--graupl-secondary--100, hsl(235, 40%, 95%)))));\n }\n .border-top-tertiary {\n border-top-color: var(--graupl-theme-active--tertiary, var(--graupl-theme-default--tertiary, light-dark(var(--graupl-tertiary, hsl(340, 60%, 50%)), var(--graupl-tertiary, hsl(340, 60%, 50%))))) !important;\n --graupl-border-top-color: var(--graupl-theme-active--tertiary, var(--graupl-theme-default--tertiary, light-dark(var(--graupl-tertiary, hsl(340, 60%, 50%)), var(--graupl-tertiary, hsl(340, 60%, 50%)))));\n }\n .border-top-tertiary-100 {\n border-top-color: var(--graupl-theme-active--tertiary--100, var(--graupl-theme-default--tertiary--100, light-dark(var(--graupl-tertiary--100, hsl(340, 85%, 95%)), var(--graupl-tertiary--900, hsl(340, 85%, 10%))))) !important;\n --graupl-border-top-color: var(--graupl-theme-active--tertiary--100, var(--graupl-theme-default--tertiary--100, light-dark(var(--graupl-tertiary--100, hsl(340, 85%, 95%)), var(--graupl-tertiary--900, hsl(340, 85%, 10%)))));\n }\n .border-top-tertiary-200 {\n border-top-color: var(--graupl-theme-active--tertiary--200, var(--graupl-theme-default--tertiary--200, light-dark(var(--graupl-tertiary--200, hsl(340, 75%, 80%)), var(--graupl-tertiary--800, hsl(340, 75%, 20%))))) !important;\n --graupl-border-top-color: var(--graupl-theme-active--tertiary--200, var(--graupl-theme-default--tertiary--200, light-dark(var(--graupl-tertiary--200, hsl(340, 75%, 80%)), var(--graupl-tertiary--800, hsl(340, 75%, 20%)))));\n }\n .border-top-tertiary-300 {\n border-top-color: var(--graupl-theme-active--tertiary--300, var(--graupl-theme-default--tertiary--300, light-dark(var(--graupl-tertiary--300, hsl(340, 65%, 65%)), var(--graupl-tertiary--700, hsl(340, 65%, 35%))))) !important;\n --graupl-border-top-color: var(--graupl-theme-active--tertiary--300, var(--graupl-theme-default--tertiary--300, light-dark(var(--graupl-tertiary--300, hsl(340, 65%, 65%)), var(--graupl-tertiary--700, hsl(340, 65%, 35%)))));\n }\n .border-top-tertiary-400 {\n border-top-color: var(--graupl-theme-active--tertiary--400, var(--graupl-theme-default--tertiary--400, light-dark(var(--graupl-tertiary--400, hsl(340, 60%, 55%)), var(--graupl-tertiary--600, hsl(340, 60%, 45%))))) !important;\n --graupl-border-top-color: var(--graupl-theme-active--tertiary--400, var(--graupl-theme-default--tertiary--400, light-dark(var(--graupl-tertiary--400, hsl(340, 60%, 55%)), var(--graupl-tertiary--600, hsl(340, 60%, 45%)))));\n }\n .border-top-tertiary-500 {\n border-top-color: var(--graupl-theme-active--tertiary--500, var(--graupl-theme-default--tertiary--500, light-dark(var(--graupl-tertiary--500, hsl(340, 60%, 50%)), var(--graupl-tertiary--500, hsl(340, 60%, 50%))))) !important;\n --graupl-border-top-color: var(--graupl-theme-active--tertiary--500, var(--graupl-theme-default--tertiary--500, light-dark(var(--graupl-tertiary--500, hsl(340, 60%, 50%)), var(--graupl-tertiary--500, hsl(340, 60%, 50%)))));\n }\n .border-top-tertiary-600 {\n border-top-color: var(--graupl-theme-active--tertiary--600, var(--graupl-theme-default--tertiary--600, light-dark(var(--graupl-tertiary--600, hsl(340, 60%, 45%)), var(--graupl-tertiary--400, hsl(340, 60%, 55%))))) !important;\n --graupl-border-top-color: var(--graupl-theme-active--tertiary--600, var(--graupl-theme-default--tertiary--600, light-dark(var(--graupl-tertiary--600, hsl(340, 60%, 45%)), var(--graupl-tertiary--400, hsl(340, 60%, 55%)))));\n }\n .border-top-tertiary-700 {\n border-top-color: var(--graupl-theme-active--tertiary--700, var(--graupl-theme-default--tertiary--700, light-dark(var(--graupl-tertiary--700, hsl(340, 65%, 35%)), var(--graupl-tertiary--300, hsl(340, 65%, 65%))))) !important;\n --graupl-border-top-color: var(--graupl-theme-active--tertiary--700, var(--graupl-theme-default--tertiary--700, light-dark(var(--graupl-tertiary--700, hsl(340, 65%, 35%)), var(--graupl-tertiary--300, hsl(340, 65%, 65%)))));\n }\n .border-top-tertiary-800 {\n border-top-color: var(--graupl-theme-active--tertiary--800, var(--graupl-theme-default--tertiary--800, light-dark(var(--graupl-tertiary--800, hsl(340, 75%, 20%)), var(--graupl-tertiary--200, hsl(340, 75%, 80%))))) !important;\n --graupl-border-top-color: var(--graupl-theme-active--tertiary--800, var(--graupl-theme-default--tertiary--800, light-dark(var(--graupl-tertiary--800, hsl(340, 75%, 20%)), var(--graupl-tertiary--200, hsl(340, 75%, 80%)))));\n }\n .border-top-tertiary-900 {\n border-top-color: var(--graupl-theme-active--tertiary--900, var(--graupl-theme-default--tertiary--900, light-dark(var(--graupl-tertiary--900, hsl(340, 85%, 10%)), var(--graupl-tertiary--100, hsl(340, 85%, 95%))))) !important;\n --graupl-border-top-color: var(--graupl-theme-active--tertiary--900, var(--graupl-theme-default--tertiary--900, light-dark(var(--graupl-tertiary--900, hsl(340, 85%, 10%)), var(--graupl-tertiary--100, hsl(340, 85%, 95%)))));\n }\n .border-right-transparent {\n border-right-color: transparent !important;\n --graupl-border-right-color: transparent;\n }\n .border-right-primary {\n border-right-color: var(--graupl-theme-active--primary, var(--graupl-theme-default--primary, light-dark(var(--graupl-primary, hsl(219, 75%, 50%)), var(--graupl-primary, hsl(219, 75%, 50%))))) !important;\n --graupl-border-right-color: var(--graupl-theme-active--primary, var(--graupl-theme-default--primary, light-dark(var(--graupl-primary, hsl(219, 75%, 50%)), var(--graupl-primary, hsl(219, 75%, 50%)))));\n }\n .border-right-primary-100 {\n border-right-color: var(--graupl-theme-active--primary--100, var(--graupl-theme-default--primary--100, light-dark(var(--graupl-primary--100, hsl(219, 100%, 95%)), var(--graupl-primary--900, hsl(219, 100%, 10%))))) !important;\n --graupl-border-right-color: var(--graupl-theme-active--primary--100, var(--graupl-theme-default--primary--100, light-dark(var(--graupl-primary--100, hsl(219, 100%, 95%)), var(--graupl-primary--900, hsl(219, 100%, 10%)))));\n }\n .border-right-primary-200 {\n border-right-color: var(--graupl-theme-active--primary--200, var(--graupl-theme-default--primary--200, light-dark(var(--graupl-primary--200, hsl(219, 90%, 80%)), var(--graupl-primary--800, hsl(219, 90%, 20%))))) !important;\n --graupl-border-right-color: var(--graupl-theme-active--primary--200, var(--graupl-theme-default--primary--200, light-dark(var(--graupl-primary--200, hsl(219, 90%, 80%)), var(--graupl-primary--800, hsl(219, 90%, 20%)))));\n }\n .border-right-primary-300 {\n border-right-color: var(--graupl-theme-active--primary--300, var(--graupl-theme-default--primary--300, light-dark(var(--graupl-primary--300, hsl(219, 80%, 65%)), var(--graupl-primary--700, hsl(219, 80%, 35%))))) !important;\n --graupl-border-right-color: var(--graupl-theme-active--primary--300, var(--graupl-theme-default--primary--300, light-dark(var(--graupl-primary--300, hsl(219, 80%, 65%)), var(--graupl-primary--700, hsl(219, 80%, 35%)))));\n }\n .border-right-primary-400 {\n border-right-color: var(--graupl-theme-active--primary--400, var(--graupl-theme-default--primary--400, light-dark(var(--graupl-primary--400, hsl(219, 75%, 55%)), var(--graupl-primary--600, hsl(219, 75%, 45%))))) !important;\n --graupl-border-right-color: var(--graupl-theme-active--primary--400, var(--graupl-theme-default--primary--400, light-dark(var(--graupl-primary--400, hsl(219, 75%, 55%)), var(--graupl-primary--600, hsl(219, 75%, 45%)))));\n }\n .border-right-primary-500 {\n border-right-color: var(--graupl-theme-active--primary--500, var(--graupl-theme-default--primary--500, light-dark(var(--graupl-primary--500, hsl(219, 75%, 50%)), var(--graupl-primary--500, hsl(219, 75%, 50%))))) !important;\n --graupl-border-right-color: var(--graupl-theme-active--primary--500, var(--graupl-theme-default--primary--500, light-dark(var(--graupl-primary--500, hsl(219, 75%, 50%)), var(--graupl-primary--500, hsl(219, 75%, 50%)))));\n }\n .border-right-primary-600 {\n border-right-color: var(--graupl-theme-active--primary--600, var(--graupl-theme-default--primary--600, light-dark(var(--graupl-primary--600, hsl(219, 75%, 45%)), var(--graupl-primary--400, hsl(219, 75%, 55%))))) !important;\n --graupl-border-right-color: var(--graupl-theme-active--primary--600, var(--graupl-theme-default--primary--600, light-dark(var(--graupl-primary--600, hsl(219, 75%, 45%)), var(--graupl-primary--400, hsl(219, 75%, 55%)))));\n }\n .border-right-primary-700 {\n border-right-color: var(--graupl-theme-active--primary--700, var(--graupl-theme-default--primary--700, light-dark(var(--graupl-primary--700, hsl(219, 80%, 35%)), var(--graupl-primary--300, hsl(219, 80%, 65%))))) !important;\n --graupl-border-right-color: var(--graupl-theme-active--primary--700, var(--graupl-theme-default--primary--700, light-dark(var(--graupl-primary--700, hsl(219, 80%, 35%)), var(--graupl-primary--300, hsl(219, 80%, 65%)))));\n }\n .border-right-primary-800 {\n border-right-color: var(--graupl-theme-active--primary--800, var(--graupl-theme-default--primary--800, light-dark(var(--graupl-primary--800, hsl(219, 90%, 20%)), var(--graupl-primary--200, hsl(219, 90%, 80%))))) !important;\n --graupl-border-right-color: var(--graupl-theme-active--primary--800, var(--graupl-theme-default--primary--800, light-dark(var(--graupl-primary--800, hsl(219, 90%, 20%)), var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n }\n .border-right-primary-900 {\n border-right-color: var(--graupl-theme-active--primary--900, var(--graupl-theme-default--primary--900, light-dark(var(--graupl-primary--900, hsl(219, 100%, 10%)), var(--graupl-primary--100, hsl(219, 100%, 95%))))) !important;\n --graupl-border-right-color: var(--graupl-theme-active--primary--900, var(--graupl-theme-default--primary--900, light-dark(var(--graupl-primary--900, hsl(219, 100%, 10%)), var(--graupl-primary--100, hsl(219, 100%, 95%)))));\n }\n .border-right-secondary {\n border-right-color: var(--graupl-theme-active--secondary, var(--graupl-theme-default--secondary, light-dark(var(--graupl-secondary, hsl(235, 15%, 50%)), var(--graupl-secondary, hsl(235, 15%, 50%))))) !important;\n --graupl-border-right-color: var(--graupl-theme-active--secondary, var(--graupl-theme-default--secondary, light-dark(var(--graupl-secondary, hsl(235, 15%, 50%)), var(--graupl-secondary, hsl(235, 15%, 50%)))));\n }\n .border-right-secondary-100 {\n border-right-color: var(--graupl-theme-active--secondary--100, var(--graupl-theme-default--secondary--100, light-dark(var(--graupl-secondary--100, hsl(235, 40%, 95%)), var(--graupl-secondary--900, hsl(235, 40%, 10%))))) !important;\n --graupl-border-right-color: var(--graupl-theme-active--secondary--100, var(--graupl-theme-default--secondary--100, light-dark(var(--graupl-secondary--100, hsl(235, 40%, 95%)), var(--graupl-secondary--900, hsl(235, 40%, 10%)))));\n }\n .border-right-secondary-200 {\n border-right-color: var(--graupl-theme-active--secondary--200, var(--graupl-theme-default--secondary--200, light-dark(var(--graupl-secondary--200, hsl(235, 30%, 80%)), var(--graupl-secondary--800, hsl(235, 30%, 20%))))) !important;\n --graupl-border-right-color: var(--graupl-theme-active--secondary--200, var(--graupl-theme-default--secondary--200, light-dark(var(--graupl-secondary--200, hsl(235, 30%, 80%)), var(--graupl-secondary--800, hsl(235, 30%, 20%)))));\n }\n .border-right-secondary-300 {\n border-right-color: var(--graupl-theme-active--secondary--300, var(--graupl-theme-default--secondary--300, light-dark(var(--graupl-secondary--300, hsl(235, 20%, 65%)), var(--graupl-secondary--700, hsl(235, 20%, 35%))))) !important;\n --graupl-border-right-color: var(--graupl-theme-active--secondary--300, var(--graupl-theme-default--secondary--300, light-dark(var(--graupl-secondary--300, hsl(235, 20%, 65%)), var(--graupl-secondary--700, hsl(235, 20%, 35%)))));\n }\n .border-right-secondary-400 {\n border-right-color: var(--graupl-theme-active--secondary--400, var(--graupl-theme-default--secondary--400, light-dark(var(--graupl-secondary--400, hsl(235, 15%, 55%)), var(--graupl-secondary--600, hsl(235, 15%, 45%))))) !important;\n --graupl-border-right-color: var(--graupl-theme-active--secondary--400, var(--graupl-theme-default--secondary--400, light-dark(var(--graupl-secondary--400, hsl(235, 15%, 55%)), var(--graupl-secondary--600, hsl(235, 15%, 45%)))));\n }\n .border-right-secondary-500 {\n border-right-color: var(--graupl-theme-active--secondary--500, var(--graupl-theme-default--secondary--500, light-dark(var(--graupl-secondary--500, hsl(235, 15%, 50%)), var(--graupl-secondary--500, hsl(235, 15%, 50%))))) !important;\n --graupl-border-right-color: var(--graupl-theme-active--secondary--500, var(--graupl-theme-default--secondary--500, light-dark(var(--graupl-secondary--500, hsl(235, 15%, 50%)), var(--graupl-secondary--500, hsl(235, 15%, 50%)))));\n }\n .border-right-secondary-600 {\n border-right-color: var(--graupl-theme-active--secondary--600, var(--graupl-theme-default--secondary--600, light-dark(var(--graupl-secondary--600, hsl(235, 15%, 45%)), var(--graupl-secondary--400, hsl(235, 15%, 55%))))) !important;\n --graupl-border-right-color: var(--graupl-theme-active--secondary--600, var(--graupl-theme-default--secondary--600, light-dark(var(--graupl-secondary--600, hsl(235, 15%, 45%)), var(--graupl-secondary--400, hsl(235, 15%, 55%)))));\n }\n .border-right-secondary-700 {\n border-right-color: var(--graupl-theme-active--secondary--700, var(--graupl-theme-default--secondary--700, light-dark(var(--graupl-secondary--700, hsl(235, 20%, 35%)), var(--graupl-secondary--300, hsl(235, 20%, 65%))))) !important;\n --graupl-border-right-color: var(--graupl-theme-active--secondary--700, var(--graupl-theme-default--secondary--700, light-dark(var(--graupl-secondary--700, hsl(235, 20%, 35%)), var(--graupl-secondary--300, hsl(235, 20%, 65%)))));\n }\n .border-right-secondary-800 {\n border-right-color: var(--graupl-theme-active--secondary--800, var(--graupl-theme-default--secondary--800, light-dark(var(--graupl-secondary--800, hsl(235, 30%, 20%)), var(--graupl-secondary--200, hsl(235, 30%, 80%))))) !important;\n --graupl-border-right-color: var(--graupl-theme-active--secondary--800, var(--graupl-theme-default--secondary--800, light-dark(var(--graupl-secondary--800, hsl(235, 30%, 20%)), var(--graupl-secondary--200, hsl(235, 30%, 80%)))));\n }\n .border-right-secondary-900 {\n border-right-color: var(--graupl-theme-active--secondary--900, var(--graupl-theme-default--secondary--900, light-dark(var(--graupl-secondary--900, hsl(235, 40%, 10%)), var(--graupl-secondary--100, hsl(235, 40%, 95%))))) !important;\n --graupl-border-right-color: var(--graupl-theme-active--secondary--900, var(--graupl-theme-default--secondary--900, light-dark(var(--graupl-secondary--900, hsl(235, 40%, 10%)), var(--graupl-secondary--100, hsl(235, 40%, 95%)))));\n }\n .border-right-tertiary {\n border-right-color: var(--graupl-theme-active--tertiary, var(--graupl-theme-default--tertiary, light-dark(var(--graupl-tertiary, hsl(340, 60%, 50%)), var(--graupl-tertiary, hsl(340, 60%, 50%))))) !important;\n --graupl-border-right-color: var(--graupl-theme-active--tertiary, var(--graupl-theme-default--tertiary, light-dark(var(--graupl-tertiary, hsl(340, 60%, 50%)), var(--graupl-tertiary, hsl(340, 60%, 50%)))));\n }\n .border-right-tertiary-100 {\n border-right-color: var(--graupl-theme-active--tertiary--100, var(--graupl-theme-default--tertiary--100, light-dark(var(--graupl-tertiary--100, hsl(340, 85%, 95%)), var(--graupl-tertiary--900, hsl(340, 85%, 10%))))) !important;\n --graupl-border-right-color: var(--graupl-theme-active--tertiary--100, var(--graupl-theme-default--tertiary--100, light-dark(var(--graupl-tertiary--100, hsl(340, 85%, 95%)), var(--graupl-tertiary--900, hsl(340, 85%, 10%)))));\n }\n .border-right-tertiary-200 {\n border-right-color: var(--graupl-theme-active--tertiary--200, var(--graupl-theme-default--tertiary--200, light-dark(var(--graupl-tertiary--200, hsl(340, 75%, 80%)), var(--graupl-tertiary--800, hsl(340, 75%, 20%))))) !important;\n --graupl-border-right-color: var(--graupl-theme-active--tertiary--200, var(--graupl-theme-default--tertiary--200, light-dark(var(--graupl-tertiary--200, hsl(340, 75%, 80%)), var(--graupl-tertiary--800, hsl(340, 75%, 20%)))));\n }\n .border-right-tertiary-300 {\n border-right-color: var(--graupl-theme-active--tertiary--300, var(--graupl-theme-default--tertiary--300, light-dark(var(--graupl-tertiary--300, hsl(340, 65%, 65%)), var(--graupl-tertiary--700, hsl(340, 65%, 35%))))) !important;\n --graupl-border-right-color: var(--graupl-theme-active--tertiary--300, var(--graupl-theme-default--tertiary--300, light-dark(var(--graupl-tertiary--300, hsl(340, 65%, 65%)), var(--graupl-tertiary--700, hsl(340, 65%, 35%)))));\n }\n .border-right-tertiary-400 {\n border-right-color: var(--graupl-theme-active--tertiary--400, var(--graupl-theme-default--tertiary--400, light-dark(var(--graupl-tertiary--400, hsl(340, 60%, 55%)), var(--graupl-tertiary--600, hsl(340, 60%, 45%))))) !important;\n --graupl-border-right-color: var(--graupl-theme-active--tertiary--400, var(--graupl-theme-default--tertiary--400, light-dark(var(--graupl-tertiary--400, hsl(340, 60%, 55%)), var(--graupl-tertiary--600, hsl(340, 60%, 45%)))));\n }\n .border-right-tertiary-500 {\n border-right-color: var(--graupl-theme-active--tertiary--500, var(--graupl-theme-default--tertiary--500, light-dark(var(--graupl-tertiary--500, hsl(340, 60%, 50%)), var(--graupl-tertiary--500, hsl(340, 60%, 50%))))) !important;\n --graupl-border-right-color: var(--graupl-theme-active--tertiary--500, var(--graupl-theme-default--tertiary--500, light-dark(var(--graupl-tertiary--500, hsl(340, 60%, 50%)), var(--graupl-tertiary--500, hsl(340, 60%, 50%)))));\n }\n .border-right-tertiary-600 {\n border-right-color: var(--graupl-theme-active--tertiary--600, var(--graupl-theme-default--tertiary--600, light-dark(var(--graupl-tertiary--600, hsl(340, 60%, 45%)), var(--graupl-tertiary--400, hsl(340, 60%, 55%))))) !important;\n --graupl-border-right-color: var(--graupl-theme-active--tertiary--600, var(--graupl-theme-default--tertiary--600, light-dark(var(--graupl-tertiary--600, hsl(340, 60%, 45%)), var(--graupl-tertiary--400, hsl(340, 60%, 55%)))));\n }\n .border-right-tertiary-700 {\n border-right-color: var(--graupl-theme-active--tertiary--700, var(--graupl-theme-default--tertiary--700, light-dark(var(--graupl-tertiary--700, hsl(340, 65%, 35%)), var(--graupl-tertiary--300, hsl(340, 65%, 65%))))) !important;\n --graupl-border-right-color: var(--graupl-theme-active--tertiary--700, var(--graupl-theme-default--tertiary--700, light-dark(var(--graupl-tertiary--700, hsl(340, 65%, 35%)), var(--graupl-tertiary--300, hsl(340, 65%, 65%)))));\n }\n .border-right-tertiary-800 {\n border-right-color: var(--graupl-theme-active--tertiary--800, var(--graupl-theme-default--tertiary--800, light-dark(var(--graupl-tertiary--800, hsl(340, 75%, 20%)), var(--graupl-tertiary--200, hsl(340, 75%, 80%))))) !important;\n --graupl-border-right-color: var(--graupl-theme-active--tertiary--800, var(--graupl-theme-default--tertiary--800, light-dark(var(--graupl-tertiary--800, hsl(340, 75%, 20%)), var(--graupl-tertiary--200, hsl(340, 75%, 80%)))));\n }\n .border-right-tertiary-900 {\n border-right-color: var(--graupl-theme-active--tertiary--900, var(--graupl-theme-default--tertiary--900, light-dark(var(--graupl-tertiary--900, hsl(340, 85%, 10%)), var(--graupl-tertiary--100, hsl(340, 85%, 95%))))) !important;\n --graupl-border-right-color: var(--graupl-theme-active--tertiary--900, var(--graupl-theme-default--tertiary--900, light-dark(var(--graupl-tertiary--900, hsl(340, 85%, 10%)), var(--graupl-tertiary--100, hsl(340, 85%, 95%)))));\n }\n .border-bottom-transparent {\n border-bottom-color: transparent !important;\n --graupl-border-bottom-color: transparent;\n }\n .border-bottom-primary {\n border-bottom-color: var(--graupl-theme-active--primary, var(--graupl-theme-default--primary, light-dark(var(--graupl-primary, hsl(219, 75%, 50%)), var(--graupl-primary, hsl(219, 75%, 50%))))) !important;\n --graupl-border-bottom-color: var(--graupl-theme-active--primary, var(--graupl-theme-default--primary, light-dark(var(--graupl-primary, hsl(219, 75%, 50%)), var(--graupl-primary, hsl(219, 75%, 50%)))));\n }\n .border-bottom-primary-100 {\n border-bottom-color: var(--graupl-theme-active--primary--100, var(--graupl-theme-default--primary--100, light-dark(var(--graupl-primary--100, hsl(219, 100%, 95%)), var(--graupl-primary--900, hsl(219, 100%, 10%))))) !important;\n --graupl-border-bottom-color: var(--graupl-theme-active--primary--100, var(--graupl-theme-default--primary--100, light-dark(var(--graupl-primary--100, hsl(219, 100%, 95%)), var(--graupl-primary--900, hsl(219, 100%, 10%)))));\n }\n .border-bottom-primary-200 {\n border-bottom-color: var(--graupl-theme-active--primary--200, var(--graupl-theme-default--primary--200, light-dark(var(--graupl-primary--200, hsl(219, 90%, 80%)), var(--graupl-primary--800, hsl(219, 90%, 20%))))) !important;\n --graupl-border-bottom-color: var(--graupl-theme-active--primary--200, var(--graupl-theme-default--primary--200, light-dark(var(--graupl-primary--200, hsl(219, 90%, 80%)), var(--graupl-primary--800, hsl(219, 90%, 20%)))));\n }\n .border-bottom-primary-300 {\n border-bottom-color: var(--graupl-theme-active--primary--300, var(--graupl-theme-default--primary--300, light-dark(var(--graupl-primary--300, hsl(219, 80%, 65%)), var(--graupl-primary--700, hsl(219, 80%, 35%))))) !important;\n --graupl-border-bottom-color: var(--graupl-theme-active--primary--300, var(--graupl-theme-default--primary--300, light-dark(var(--graupl-primary--300, hsl(219, 80%, 65%)), var(--graupl-primary--700, hsl(219, 80%, 35%)))));\n }\n .border-bottom-primary-400 {\n border-bottom-color: var(--graupl-theme-active--primary--400, var(--graupl-theme-default--primary--400, light-dark(var(--graupl-primary--400, hsl(219, 75%, 55%)), var(--graupl-primary--600, hsl(219, 75%, 45%))))) !important;\n --graupl-border-bottom-color: var(--graupl-theme-active--primary--400, var(--graupl-theme-default--primary--400, light-dark(var(--graupl-primary--400, hsl(219, 75%, 55%)), var(--graupl-primary--600, hsl(219, 75%, 45%)))));\n }\n .border-bottom-primary-500 {\n border-bottom-color: var(--graupl-theme-active--primary--500, var(--graupl-theme-default--primary--500, light-dark(var(--graupl-primary--500, hsl(219, 75%, 50%)), var(--graupl-primary--500, hsl(219, 75%, 50%))))) !important;\n --graupl-border-bottom-color: var(--graupl-theme-active--primary--500, var(--graupl-theme-default--primary--500, light-dark(var(--graupl-primary--500, hsl(219, 75%, 50%)), var(--graupl-primary--500, hsl(219, 75%, 50%)))));\n }\n .border-bottom-primary-600 {\n border-bottom-color: var(--graupl-theme-active--primary--600, var(--graupl-theme-default--primary--600, light-dark(var(--graupl-primary--600, hsl(219, 75%, 45%)), var(--graupl-primary--400, hsl(219, 75%, 55%))))) !important;\n --graupl-border-bottom-color: var(--graupl-theme-active--primary--600, var(--graupl-theme-default--primary--600, light-dark(var(--graupl-primary--600, hsl(219, 75%, 45%)), var(--graupl-primary--400, hsl(219, 75%, 55%)))));\n }\n .border-bottom-primary-700 {\n border-bottom-color: var(--graupl-theme-active--primary--700, var(--graupl-theme-default--primary--700, light-dark(var(--graupl-primary--700, hsl(219, 80%, 35%)), var(--graupl-primary--300, hsl(219, 80%, 65%))))) !important;\n --graupl-border-bottom-color: var(--graupl-theme-active--primary--700, var(--graupl-theme-default--primary--700, light-dark(var(--graupl-primary--700, hsl(219, 80%, 35%)), var(--graupl-primary--300, hsl(219, 80%, 65%)))));\n }\n .border-bottom-primary-800 {\n border-bottom-color: var(--graupl-theme-active--primary--800, var(--graupl-theme-default--primary--800, light-dark(var(--graupl-primary--800, hsl(219, 90%, 20%)), var(--graupl-primary--200, hsl(219, 90%, 80%))))) !important;\n --graupl-border-bottom-color: var(--graupl-theme-active--primary--800, var(--graupl-theme-default--primary--800, light-dark(var(--graupl-primary--800, hsl(219, 90%, 20%)), var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n }\n .border-bottom-primary-900 {\n border-bottom-color: var(--graupl-theme-active--primary--900, var(--graupl-theme-default--primary--900, light-dark(var(--graupl-primary--900, hsl(219, 100%, 10%)), var(--graupl-primary--100, hsl(219, 100%, 95%))))) !important;\n --graupl-border-bottom-color: var(--graupl-theme-active--primary--900, var(--graupl-theme-default--primary--900, light-dark(var(--graupl-primary--900, hsl(219, 100%, 10%)), var(--graupl-primary--100, hsl(219, 100%, 95%)))));\n }\n .border-bottom-secondary {\n border-bottom-color: var(--graupl-theme-active--secondary, var(--graupl-theme-default--secondary, light-dark(var(--graupl-secondary, hsl(235, 15%, 50%)), var(--graupl-secondary, hsl(235, 15%, 50%))))) !important;\n --graupl-border-bottom-color: var(--graupl-theme-active--secondary, var(--graupl-theme-default--secondary, light-dark(var(--graupl-secondary, hsl(235, 15%, 50%)), var(--graupl-secondary, hsl(235, 15%, 50%)))));\n }\n .border-bottom-secondary-100 {\n border-bottom-color: var(--graupl-theme-active--secondary--100, var(--graupl-theme-default--secondary--100, light-dark(var(--graupl-secondary--100, hsl(235, 40%, 95%)), var(--graupl-secondary--900, hsl(235, 40%, 10%))))) !important;\n --graupl-border-bottom-color: var(--graupl-theme-active--secondary--100, var(--graupl-theme-default--secondary--100, light-dark(var(--graupl-secondary--100, hsl(235, 40%, 95%)), var(--graupl-secondary--900, hsl(235, 40%, 10%)))));\n }\n .border-bottom-secondary-200 {\n border-bottom-color: var(--graupl-theme-active--secondary--200, var(--graupl-theme-default--secondary--200, light-dark(var(--graupl-secondary--200, hsl(235, 30%, 80%)), var(--graupl-secondary--800, hsl(235, 30%, 20%))))) !important;\n --graupl-border-bottom-color: var(--graupl-theme-active--secondary--200, var(--graupl-theme-default--secondary--200, light-dark(var(--graupl-secondary--200, hsl(235, 30%, 80%)), var(--graupl-secondary--800, hsl(235, 30%, 20%)))));\n }\n .border-bottom-secondary-300 {\n border-bottom-color: var(--graupl-theme-active--secondary--300, var(--graupl-theme-default--secondary--300, light-dark(var(--graupl-secondary--300, hsl(235, 20%, 65%)), var(--graupl-secondary--700, hsl(235, 20%, 35%))))) !important;\n --graupl-border-bottom-color: var(--graupl-theme-active--secondary--300, var(--graupl-theme-default--secondary--300, light-dark(var(--graupl-secondary--300, hsl(235, 20%, 65%)), var(--graupl-secondary--700, hsl(235, 20%, 35%)))));\n }\n .border-bottom-secondary-400 {\n border-bottom-color: var(--graupl-theme-active--secondary--400, var(--graupl-theme-default--secondary--400, light-dark(var(--graupl-secondary--400, hsl(235, 15%, 55%)), var(--graupl-secondary--600, hsl(235, 15%, 45%))))) !important;\n --graupl-border-bottom-color: var(--graupl-theme-active--secondary--400, var(--graupl-theme-default--secondary--400, light-dark(var(--graupl-secondary--400, hsl(235, 15%, 55%)), var(--graupl-secondary--600, hsl(235, 15%, 45%)))));\n }\n .border-bottom-secondary-500 {\n border-bottom-color: var(--graupl-theme-active--secondary--500, var(--graupl-theme-default--secondary--500, light-dark(var(--graupl-secondary--500, hsl(235, 15%, 50%)), var(--graupl-secondary--500, hsl(235, 15%, 50%))))) !important;\n --graupl-border-bottom-color: var(--graupl-theme-active--secondary--500, var(--graupl-theme-default--secondary--500, light-dark(var(--graupl-secondary--500, hsl(235, 15%, 50%)), var(--graupl-secondary--500, hsl(235, 15%, 50%)))));\n }\n .border-bottom-secondary-600 {\n border-bottom-color: var(--graupl-theme-active--secondary--600, var(--graupl-theme-default--secondary--600, light-dark(var(--graupl-secondary--600, hsl(235, 15%, 45%)), var(--graupl-secondary--400, hsl(235, 15%, 55%))))) !important;\n --graupl-border-bottom-color: var(--graupl-theme-active--secondary--600, var(--graupl-theme-default--secondary--600, light-dark(var(--graupl-secondary--600, hsl(235, 15%, 45%)), var(--graupl-secondary--400, hsl(235, 15%, 55%)))));\n }\n .border-bottom-secondary-700 {\n border-bottom-color: var(--graupl-theme-active--secondary--700, var(--graupl-theme-default--secondary--700, light-dark(var(--graupl-secondary--700, hsl(235, 20%, 35%)), var(--graupl-secondary--300, hsl(235, 20%, 65%))))) !important;\n --graupl-border-bottom-color: var(--graupl-theme-active--secondary--700, var(--graupl-theme-default--secondary--700, light-dark(var(--graupl-secondary--700, hsl(235, 20%, 35%)), var(--graupl-secondary--300, hsl(235, 20%, 65%)))));\n }\n .border-bottom-secondary-800 {\n border-bottom-color: var(--graupl-theme-active--secondary--800, var(--graupl-theme-default--secondary--800, light-dark(var(--graupl-secondary--800, hsl(235, 30%, 20%)), var(--graupl-secondary--200, hsl(235, 30%, 80%))))) !important;\n --graupl-border-bottom-color: var(--graupl-theme-active--secondary--800, var(--graupl-theme-default--secondary--800, light-dark(var(--graupl-secondary--800, hsl(235, 30%, 20%)), var(--graupl-secondary--200, hsl(235, 30%, 80%)))));\n }\n .border-bottom-secondary-900 {\n border-bottom-color: var(--graupl-theme-active--secondary--900, var(--graupl-theme-default--secondary--900, light-dark(var(--graupl-secondary--900, hsl(235, 40%, 10%)), var(--graupl-secondary--100, hsl(235, 40%, 95%))))) !important;\n --graupl-border-bottom-color: var(--graupl-theme-active--secondary--900, var(--graupl-theme-default--secondary--900, light-dark(var(--graupl-secondary--900, hsl(235, 40%, 10%)), var(--graupl-secondary--100, hsl(235, 40%, 95%)))));\n }\n .border-bottom-tertiary {\n border-bottom-color: var(--graupl-theme-active--tertiary, var(--graupl-theme-default--tertiary, light-dark(var(--graupl-tertiary, hsl(340, 60%, 50%)), var(--graupl-tertiary, hsl(340, 60%, 50%))))) !important;\n --graupl-border-bottom-color: var(--graupl-theme-active--tertiary, var(--graupl-theme-default--tertiary, light-dark(var(--graupl-tertiary, hsl(340, 60%, 50%)), var(--graupl-tertiary, hsl(340, 60%, 50%)))));\n }\n .border-bottom-tertiary-100 {\n border-bottom-color: var(--graupl-theme-active--tertiary--100, var(--graupl-theme-default--tertiary--100, light-dark(var(--graupl-tertiary--100, hsl(340, 85%, 95%)), var(--graupl-tertiary--900, hsl(340, 85%, 10%))))) !important;\n --graupl-border-bottom-color: var(--graupl-theme-active--tertiary--100, var(--graupl-theme-default--tertiary--100, light-dark(var(--graupl-tertiary--100, hsl(340, 85%, 95%)), var(--graupl-tertiary--900, hsl(340, 85%, 10%)))));\n }\n .border-bottom-tertiary-200 {\n border-bottom-color: var(--graupl-theme-active--tertiary--200, var(--graupl-theme-default--tertiary--200, light-dark(var(--graupl-tertiary--200, hsl(340, 75%, 80%)), var(--graupl-tertiary--800, hsl(340, 75%, 20%))))) !important;\n --graupl-border-bottom-color: var(--graupl-theme-active--tertiary--200, var(--graupl-theme-default--tertiary--200, light-dark(var(--graupl-tertiary--200, hsl(340, 75%, 80%)), var(--graupl-tertiary--800, hsl(340, 75%, 20%)))));\n }\n .border-bottom-tertiary-300 {\n border-bottom-color: var(--graupl-theme-active--tertiary--300, var(--graupl-theme-default--tertiary--300, light-dark(var(--graupl-tertiary--300, hsl(340, 65%, 65%)), var(--graupl-tertiary--700, hsl(340, 65%, 35%))))) !important;\n --graupl-border-bottom-color: var(--graupl-theme-active--tertiary--300, var(--graupl-theme-default--tertiary--300, light-dark(var(--graupl-tertiary--300, hsl(340, 65%, 65%)), var(--graupl-tertiary--700, hsl(340, 65%, 35%)))));\n }\n .border-bottom-tertiary-400 {\n border-bottom-color: var(--graupl-theme-active--tertiary--400, var(--graupl-theme-default--tertiary--400, light-dark(var(--graupl-tertiary--400, hsl(340, 60%, 55%)), var(--graupl-tertiary--600, hsl(340, 60%, 45%))))) !important;\n --graupl-border-bottom-color: var(--graupl-theme-active--tertiary--400, var(--graupl-theme-default--tertiary--400, light-dark(var(--graupl-tertiary--400, hsl(340, 60%, 55%)), var(--graupl-tertiary--600, hsl(340, 60%, 45%)))));\n }\n .border-bottom-tertiary-500 {\n border-bottom-color: var(--graupl-theme-active--tertiary--500, var(--graupl-theme-default--tertiary--500, light-dark(var(--graupl-tertiary--500, hsl(340, 60%, 50%)), var(--graupl-tertiary--500, hsl(340, 60%, 50%))))) !important;\n --graupl-border-bottom-color: var(--graupl-theme-active--tertiary--500, var(--graupl-theme-default--tertiary--500, light-dark(var(--graupl-tertiary--500, hsl(340, 60%, 50%)), var(--graupl-tertiary--500, hsl(340, 60%, 50%)))));\n }\n .border-bottom-tertiary-600 {\n border-bottom-color: var(--graupl-theme-active--tertiary--600, var(--graupl-theme-default--tertiary--600, light-dark(var(--graupl-tertiary--600, hsl(340, 60%, 45%)), var(--graupl-tertiary--400, hsl(340, 60%, 55%))))) !important;\n --graupl-border-bottom-color: var(--graupl-theme-active--tertiary--600, var(--graupl-theme-default--tertiary--600, light-dark(var(--graupl-tertiary--600, hsl(340, 60%, 45%)), var(--graupl-tertiary--400, hsl(340, 60%, 55%)))));\n }\n .border-bottom-tertiary-700 {\n border-bottom-color: var(--graupl-theme-active--tertiary--700, var(--graupl-theme-default--tertiary--700, light-dark(var(--graupl-tertiary--700, hsl(340, 65%, 35%)), var(--graupl-tertiary--300, hsl(340, 65%, 65%))))) !important;\n --graupl-border-bottom-color: var(--graupl-theme-active--tertiary--700, var(--graupl-theme-default--tertiary--700, light-dark(var(--graupl-tertiary--700, hsl(340, 65%, 35%)), var(--graupl-tertiary--300, hsl(340, 65%, 65%)))));\n }\n .border-bottom-tertiary-800 {\n border-bottom-color: var(--graupl-theme-active--tertiary--800, var(--graupl-theme-default--tertiary--800, light-dark(var(--graupl-tertiary--800, hsl(340, 75%, 20%)), var(--graupl-tertiary--200, hsl(340, 75%, 80%))))) !important;\n --graupl-border-bottom-color: var(--graupl-theme-active--tertiary--800, var(--graupl-theme-default--tertiary--800, light-dark(var(--graupl-tertiary--800, hsl(340, 75%, 20%)), var(--graupl-tertiary--200, hsl(340, 75%, 80%)))));\n }\n .border-bottom-tertiary-900 {\n border-bottom-color: var(--graupl-theme-active--tertiary--900, var(--graupl-theme-default--tertiary--900, light-dark(var(--graupl-tertiary--900, hsl(340, 85%, 10%)), var(--graupl-tertiary--100, hsl(340, 85%, 95%))))) !important;\n --graupl-border-bottom-color: var(--graupl-theme-active--tertiary--900, var(--graupl-theme-default--tertiary--900, light-dark(var(--graupl-tertiary--900, hsl(340, 85%, 10%)), var(--graupl-tertiary--100, hsl(340, 85%, 95%)))));\n }\n .border-left-transparent {\n border-left-color: transparent !important;\n --graupl-border-left-color: transparent;\n }\n .border-left-primary {\n border-left-color: var(--graupl-theme-active--primary, var(--graupl-theme-default--primary, light-dark(var(--graupl-primary, hsl(219, 75%, 50%)), var(--graupl-primary, hsl(219, 75%, 50%))))) !important;\n --graupl-border-left-color: var(--graupl-theme-active--primary, var(--graupl-theme-default--primary, light-dark(var(--graupl-primary, hsl(219, 75%, 50%)), var(--graupl-primary, hsl(219, 75%, 50%)))));\n }\n .border-left-primary-100 {\n border-left-color: var(--graupl-theme-active--primary--100, var(--graupl-theme-default--primary--100, light-dark(var(--graupl-primary--100, hsl(219, 100%, 95%)), var(--graupl-primary--900, hsl(219, 100%, 10%))))) !important;\n --graupl-border-left-color: var(--graupl-theme-active--primary--100, var(--graupl-theme-default--primary--100, light-dark(var(--graupl-primary--100, hsl(219, 100%, 95%)), var(--graupl-primary--900, hsl(219, 100%, 10%)))));\n }\n .border-left-primary-200 {\n border-left-color: var(--graupl-theme-active--primary--200, var(--graupl-theme-default--primary--200, light-dark(var(--graupl-primary--200, hsl(219, 90%, 80%)), var(--graupl-primary--800, hsl(219, 90%, 20%))))) !important;\n --graupl-border-left-color: var(--graupl-theme-active--primary--200, var(--graupl-theme-default--primary--200, light-dark(var(--graupl-primary--200, hsl(219, 90%, 80%)), var(--graupl-primary--800, hsl(219, 90%, 20%)))));\n }\n .border-left-primary-300 {\n border-left-color: var(--graupl-theme-active--primary--300, var(--graupl-theme-default--primary--300, light-dark(var(--graupl-primary--300, hsl(219, 80%, 65%)), var(--graupl-primary--700, hsl(219, 80%, 35%))))) !important;\n --graupl-border-left-color: var(--graupl-theme-active--primary--300, var(--graupl-theme-default--primary--300, light-dark(var(--graupl-primary--300, hsl(219, 80%, 65%)), var(--graupl-primary--700, hsl(219, 80%, 35%)))));\n }\n .border-left-primary-400 {\n border-left-color: var(--graupl-theme-active--primary--400, var(--graupl-theme-default--primary--400, light-dark(var(--graupl-primary--400, hsl(219, 75%, 55%)), var(--graupl-primary--600, hsl(219, 75%, 45%))))) !important;\n --graupl-border-left-color: var(--graupl-theme-active--primary--400, var(--graupl-theme-default--primary--400, light-dark(var(--graupl-primary--400, hsl(219, 75%, 55%)), var(--graupl-primary--600, hsl(219, 75%, 45%)))));\n }\n .border-left-primary-500 {\n border-left-color: var(--graupl-theme-active--primary--500, var(--graupl-theme-default--primary--500, light-dark(var(--graupl-primary--500, hsl(219, 75%, 50%)), var(--graupl-primary--500, hsl(219, 75%, 50%))))) !important;\n --graupl-border-left-color: var(--graupl-theme-active--primary--500, var(--graupl-theme-default--primary--500, light-dark(var(--graupl-primary--500, hsl(219, 75%, 50%)), var(--graupl-primary--500, hsl(219, 75%, 50%)))));\n }\n .border-left-primary-600 {\n border-left-color: var(--graupl-theme-active--primary--600, var(--graupl-theme-default--primary--600, light-dark(var(--graupl-primary--600, hsl(219, 75%, 45%)), var(--graupl-primary--400, hsl(219, 75%, 55%))))) !important;\n --graupl-border-left-color: var(--graupl-theme-active--primary--600, var(--graupl-theme-default--primary--600, light-dark(var(--graupl-primary--600, hsl(219, 75%, 45%)), var(--graupl-primary--400, hsl(219, 75%, 55%)))));\n }\n .border-left-primary-700 {\n border-left-color: var(--graupl-theme-active--primary--700, var(--graupl-theme-default--primary--700, light-dark(var(--graupl-primary--700, hsl(219, 80%, 35%)), var(--graupl-primary--300, hsl(219, 80%, 65%))))) !important;\n --graupl-border-left-color: var(--graupl-theme-active--primary--700, var(--graupl-theme-default--primary--700, light-dark(var(--graupl-primary--700, hsl(219, 80%, 35%)), var(--graupl-primary--300, hsl(219, 80%, 65%)))));\n }\n .border-left-primary-800 {\n border-left-color: var(--graupl-theme-active--primary--800, var(--graupl-theme-default--primary--800, light-dark(var(--graupl-primary--800, hsl(219, 90%, 20%)), var(--graupl-primary--200, hsl(219, 90%, 80%))))) !important;\n --graupl-border-left-color: var(--graupl-theme-active--primary--800, var(--graupl-theme-default--primary--800, light-dark(var(--graupl-primary--800, hsl(219, 90%, 20%)), var(--graupl-primary--200, hsl(219, 90%, 80%)))));\n }\n .border-left-primary-900 {\n border-left-color: var(--graupl-theme-active--primary--900, var(--graupl-theme-default--primary--900, light-dark(var(--graupl-primary--900, hsl(219, 100%, 10%)), var(--graupl-primary--100, hsl(219, 100%, 95%))))) !important;\n --graupl-border-left-color: var(--graupl-theme-active--primary--900, var(--graupl-theme-default--primary--900, light-dark(var(--graupl-primary--900, hsl(219, 100%, 10%)), var(--graupl-primary--100, hsl(219, 100%, 95%)))));\n }\n .border-left-secondary {\n border-left-color: var(--graupl-theme-active--secondary, var(--graupl-theme-default--secondary, light-dark(var(--graupl-secondary, hsl(235, 15%, 50%)), var(--graupl-secondary, hsl(235, 15%, 50%))))) !important;\n --graupl-border-left-color: var(--graupl-theme-active--secondary, var(--graupl-theme-default--secondary, light-dark(var(--graupl-secondary, hsl(235, 15%, 50%)), var(--graupl-secondary, hsl(235, 15%, 50%)))));\n }\n .border-left-secondary-100 {\n border-left-color: var(--graupl-theme-active--secondary--100, var(--graupl-theme-default--secondary--100, light-dark(var(--graupl-secondary--100, hsl(235, 40%, 95%)), var(--graupl-secondary--900, hsl(235, 40%, 10%))))) !important;\n --graupl-border-left-color: var(--graupl-theme-active--secondary--100, var(--graupl-theme-default--secondary--100, light-dark(var(--graupl-secondary--100, hsl(235, 40%, 95%)), var(--graupl-secondary--900, hsl(235, 40%, 10%)))));\n }\n .border-left-secondary-200 {\n border-left-color: var(--graupl-theme-active--secondary--200, var(--graupl-theme-default--secondary--200, light-dark(var(--graupl-secondary--200, hsl(235, 30%, 80%)), var(--graupl-secondary--800, hsl(235, 30%, 20%))))) !important;\n --graupl-border-left-color: var(--graupl-theme-active--secondary--200, var(--graupl-theme-default--secondary--200, light-dark(var(--graupl-secondary--200, hsl(235, 30%, 80%)), var(--graupl-secondary--800, hsl(235, 30%, 20%)))));\n }\n .border-left-secondary-300 {\n border-left-color: var(--graupl-theme-active--secondary--300, var(--graupl-theme-default--secondary--300, light-dark(var(--graupl-secondary--300, hsl(235, 20%, 65%)), var(--graupl-secondary--700, hsl(235, 20%, 35%))))) !important;\n --graupl-border-left-color: var(--graupl-theme-active--secondary--300, var(--graupl-theme-default--secondary--300, light-dark(var(--graupl-secondary--300, hsl(235, 20%, 65%)), var(--graupl-secondary--700, hsl(235, 20%, 35%)))));\n }\n .border-left-secondary-400 {\n border-left-color: var(--graupl-theme-active--secondary--400, var(--graupl-theme-default--secondary--400, light-dark(var(--graupl-secondary--400, hsl(235, 15%, 55%)), var(--graupl-secondary--600, hsl(235, 15%, 45%))))) !important;\n --graupl-border-left-color: var(--graupl-theme-active--secondary--400, var(--graupl-theme-default--secondary--400, light-dark(var(--graupl-secondary--400, hsl(235, 15%, 55%)), var(--graupl-secondary--600, hsl(235, 15%, 45%)))));\n }\n .border-left-secondary-500 {\n border-left-color: var(--graupl-theme-active--secondary--500, var(--graupl-theme-default--secondary--500, light-dark(var(--graupl-secondary--500, hsl(235, 15%, 50%)), var(--graupl-secondary--500, hsl(235, 15%, 50%))))) !important;\n --graupl-border-left-color: var(--graupl-theme-active--secondary--500, var(--graupl-theme-default--secondary--500, light-dark(var(--graupl-secondary--500, hsl(235, 15%, 50%)), var(--graupl-secondary--500, hsl(235, 15%, 50%)))));\n }\n .border-left-secondary-600 {\n border-left-color: var(--graupl-theme-active--secondary--600, var(--graupl-theme-default--secondary--600, light-dark(var(--graupl-secondary--600, hsl(235, 15%, 45%)), var(--graupl-secondary--400, hsl(235, 15%, 55%))))) !important;\n --graupl-border-left-color: var(--graupl-theme-active--secondary--600, var(--graupl-theme-default--secondary--600, light-dark(var(--graupl-secondary--600, hsl(235, 15%, 45%)), var(--graupl-secondary--400, hsl(235, 15%, 55%)))));\n }\n .border-left-secondary-700 {\n border-left-color: var(--graupl-theme-active--secondary--700, var(--graupl-theme-default--secondary--700, light-dark(var(--graupl-secondary--700, hsl(235, 20%, 35%)), var(--graupl-secondary--300, hsl(235, 20%, 65%))))) !important;\n --graupl-border-left-color: var(--graupl-theme-active--secondary--700, var(--graupl-theme-default--secondary--700, light-dark(var(--graupl-secondary--700, hsl(235, 20%, 35%)), var(--graupl-secondary--300, hsl(235, 20%, 65%)))));\n }\n .border-left-secondary-800 {\n border-left-color: var(--graupl-theme-active--secondary--800, var(--graupl-theme-default--secondary--800, light-dark(var(--graupl-secondary--800, hsl(235, 30%, 20%)), var(--graupl-secondary--200, hsl(235, 30%, 80%))))) !important;\n --graupl-border-left-color: var(--graupl-theme-active--secondary--800, var(--graupl-theme-default--secondary--800, light-dark(var(--graupl-secondary--800, hsl(235, 30%, 20%)), var(--graupl-secondary--200, hsl(235, 30%, 80%)))));\n }\n .border-left-secondary-900 {\n border-left-color: var(--graupl-theme-active--secondary--900, var(--graupl-theme-default--secondary--900, light-dark(var(--graupl-secondary--900, hsl(235, 40%, 10%)), var(--graupl-secondary--100, hsl(235, 40%, 95%))))) !important;\n --graupl-border-left-color: var(--graupl-theme-active--secondary--900, var(--graupl-theme-default--secondary--900, light-dark(var(--graupl-secondary--900, hsl(235, 40%, 10%)), var(--graupl-secondary--100, hsl(235, 40%, 95%)))));\n }\n .border-left-tertiary {\n border-left-color: var(--graupl-theme-active--tertiary, var(--graupl-theme-default--tertiary, light-dark(var(--graupl-tertiary, hsl(340, 60%, 50%)), var(--graupl-tertiary, hsl(340, 60%, 50%))))) !important;\n --graupl-border-left-color: var(--graupl-theme-active--tertiary, var(--graupl-theme-default--tertiary, light-dark(var(--graupl-tertiary, hsl(340, 60%, 50%)), var(--graupl-tertiary, hsl(340, 60%, 50%)))));\n }\n .border-left-tertiary-100 {\n border-left-color: var(--graupl-theme-active--tertiary--100, var(--graupl-theme-default--tertiary--100, light-dark(var(--graupl-tertiary--100, hsl(340, 85%, 95%)), var(--graupl-tertiary--900, hsl(340, 85%, 10%))))) !important;\n --graupl-border-left-color: var(--graupl-theme-active--tertiary--100, var(--graupl-theme-default--tertiary--100, light-dark(var(--graupl-tertiary--100, hsl(340, 85%, 95%)), var(--graupl-tertiary--900, hsl(340, 85%, 10%)))));\n }\n .border-left-tertiary-200 {\n border-left-color: var(--graupl-theme-active--tertiary--200, var(--graupl-theme-default--tertiary--200, light-dark(var(--graupl-tertiary--200, hsl(340, 75%, 80%)), var(--graupl-tertiary--800, hsl(340, 75%, 20%))))) !important;\n --graupl-border-left-color: var(--graupl-theme-active--tertiary--200, var(--graupl-theme-default--tertiary--200, light-dark(var(--graupl-tertiary--200, hsl(340, 75%, 80%)), var(--graupl-tertiary--800, hsl(340, 75%, 20%)))));\n }\n .border-left-tertiary-300 {\n border-left-color: var(--graupl-theme-active--tertiary--300, var(--graupl-theme-default--tertiary--300, light-dark(var(--graupl-tertiary--300, hsl(340, 65%, 65%)), var(--graupl-tertiary--700, hsl(340, 65%, 35%))))) !important;\n --graupl-border-left-color: var(--graupl-theme-active--tertiary--300, var(--graupl-theme-default--tertiary--300, light-dark(var(--graupl-tertiary--300, hsl(340, 65%, 65%)), var(--graupl-tertiary--700, hsl(340, 65%, 35%)))));\n }\n .border-left-tertiary-400 {\n border-left-color: var(--graupl-theme-active--tertiary--400, var(--graupl-theme-default--tertiary--400, light-dark(var(--graupl-tertiary--400, hsl(340, 60%, 55%)), var(--graupl-tertiary--600, hsl(340, 60%, 45%))))) !important;\n --graupl-border-left-color: var(--graupl-theme-active--tertiary--400, var(--graupl-theme-default--tertiary--400, light-dark(var(--graupl-tertiary--400, hsl(340, 60%, 55%)), var(--graupl-tertiary--600, hsl(340, 60%, 45%)))));\n }\n .border-left-tertiary-500 {\n border-left-color: var(--graupl-theme-active--tertiary--500, var(--graupl-theme-default--tertiary--500, light-dark(var(--graupl-tertiary--500, hsl(340, 60%, 50%)), var(--graupl-tertiary--500, hsl(340, 60%, 50%))))) !important;\n --graupl-border-left-color: var(--graupl-theme-active--tertiary--500, var(--graupl-theme-default--tertiary--500, light-dark(var(--graupl-tertiary--500, hsl(340, 60%, 50%)), var(--graupl-tertiary--500, hsl(340, 60%, 50%)))));\n }\n .border-left-tertiary-600 {\n border-left-color: var(--graupl-theme-active--tertiary--600, var(--graupl-theme-default--tertiary--600, light-dark(var(--graupl-tertiary--600, hsl(340, 60%, 45%)), var(--graupl-tertiary--400, hsl(340, 60%, 55%))))) !important;\n --graupl-border-left-color: var(--graupl-theme-active--tertiary--600, var(--graupl-theme-default--tertiary--600, light-dark(var(--graupl-tertiary--600, hsl(340, 60%, 45%)), var(--graupl-tertiary--400, hsl(340, 60%, 55%)))));\n }\n .border-left-tertiary-700 {\n border-left-color: var(--graupl-theme-active--tertiary--700, var(--graupl-theme-default--tertiary--700, light-dark(var(--graupl-tertiary--700, hsl(340, 65%, 35%)), var(--graupl-tertiary--300, hsl(340, 65%, 65%))))) !important;\n --graupl-border-left-color: var(--graupl-theme-active--tertiary--700, var(--graupl-theme-default--tertiary--700, light-dark(var(--graupl-tertiary--700, hsl(340, 65%, 35%)), var(--graupl-tertiary--300, hsl(340, 65%, 65%)))));\n }\n .border-left-tertiary-800 {\n border-left-color: var(--graupl-theme-active--tertiary--800, var(--graupl-theme-default--tertiary--800, light-dark(var(--graupl-tertiary--800, hsl(340, 75%, 20%)), var(--graupl-tertiary--200, hsl(340, 75%, 80%))))) !important;\n --graupl-border-left-color: var(--graupl-theme-active--tertiary--800, var(--graupl-theme-default--tertiary--800, light-dark(var(--graupl-tertiary--800, hsl(340, 75%, 20%)), var(--graupl-tertiary--200, hsl(340, 75%, 80%)))));\n }\n .border-left-tertiary-900 {\n border-left-color: var(--graupl-theme-active--tertiary--900, var(--graupl-theme-default--tertiary--900, light-dark(var(--graupl-tertiary--900, hsl(340, 85%, 10%)), var(--graupl-tertiary--100, hsl(340, 85%, 95%))))) !important;\n --graupl-border-left-color: var(--graupl-theme-active--tertiary--900, var(--graupl-theme-default--tertiary--900, light-dark(var(--graupl-tertiary--900, hsl(340, 85%, 10%)), var(--graupl-tertiary--100, hsl(340, 85%, 95%)))));\n }\n}\n@layer graupl.utilities {\n .border-radius-rounded {\n border-radius: 100vw !important;\n --graupl-border-radius: 100vw;\n }\n .border-radius-squared {\n border-radius: 0 !important;\n --graupl-border-radius: 0;\n }\n .border-radius-0 {\n border-radius: var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-radius: var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)));\n }\n .border-radius-1 {\n border-radius: var(--graupl-spacer-1, calc(0.125 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-radius: var(--graupl-spacer-1, calc(0.125 * var(--graupl-spacer, 1rem)));\n }\n .border-radius-2 {\n border-radius: var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-radius: var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem)));\n }\n .border-radius-3 {\n border-radius: var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-radius: var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem)));\n }\n .border-radius-4 {\n border-radius: var(--graupl-spacer-4, calc(0.75 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-radius: var(--graupl-spacer-4, calc(0.75 * var(--graupl-spacer, 1rem)));\n }\n .border-radius-5 {\n border-radius: var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-radius: var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem)));\n }\n .border-radius-6 {\n border-radius: var(--graupl-spacer-6, calc(1.5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-radius: var(--graupl-spacer-6, calc(1.5 * var(--graupl-spacer, 1rem)));\n }\n .border-radius-7 {\n border-radius: var(--graupl-spacer-7, calc(2 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-radius: var(--graupl-spacer-7, calc(2 * var(--graupl-spacer, 1rem)));\n }\n .border-radius-8 {\n border-radius: var(--graupl-spacer-8, calc(3 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-radius: var(--graupl-spacer-8, calc(3 * var(--graupl-spacer, 1rem)));\n }\n .border-radius-9 {\n border-radius: var(--graupl-spacer-9, calc(5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-radius: var(--graupl-spacer-9, calc(5 * var(--graupl-spacer, 1rem)));\n }\n .border-radius-10 {\n border-radius: var(--graupl-spacer-10, calc(10 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-radius: var(--graupl-spacer-10, calc(10 * var(--graupl-spacer, 1rem)));\n }\n .border-top-radius-rounded {\n border-top-left-radius: 100vw !important;\n --graupl-border-top-left-radius: 100vw;\n border-top-right-radius: 100vw !important;\n --graupl-border-top-right-radius: 100vw;\n }\n .border-top-radius-squared {\n border-top-left-radius: 0 !important;\n --graupl-border-top-left-radius: 0;\n border-top-right-radius: 0 !important;\n --graupl-border-top-right-radius: 0;\n }\n .border-top-radius-0 {\n border-top-left-radius: var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-left-radius: var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)));\n border-top-right-radius: var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-right-radius: var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)));\n }\n .border-top-radius-1 {\n border-top-left-radius: var(--graupl-spacer-1, calc(0.125 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-left-radius: var(--graupl-spacer-1, calc(0.125 * var(--graupl-spacer, 1rem)));\n border-top-right-radius: var(--graupl-spacer-1, calc(0.125 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-right-radius: var(--graupl-spacer-1, calc(0.125 * var(--graupl-spacer, 1rem)));\n }\n .border-top-radius-2 {\n border-top-left-radius: var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-left-radius: var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem)));\n border-top-right-radius: var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-right-radius: var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem)));\n }\n .border-top-radius-3 {\n border-top-left-radius: var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-left-radius: var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem)));\n border-top-right-radius: var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-right-radius: var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem)));\n }\n .border-top-radius-4 {\n border-top-left-radius: var(--graupl-spacer-4, calc(0.75 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-left-radius: var(--graupl-spacer-4, calc(0.75 * var(--graupl-spacer, 1rem)));\n border-top-right-radius: var(--graupl-spacer-4, calc(0.75 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-right-radius: var(--graupl-spacer-4, calc(0.75 * var(--graupl-spacer, 1rem)));\n }\n .border-top-radius-5 {\n border-top-left-radius: var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-left-radius: var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem)));\n border-top-right-radius: var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-right-radius: var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem)));\n }\n .border-top-radius-6 {\n border-top-left-radius: var(--graupl-spacer-6, calc(1.5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-left-radius: var(--graupl-spacer-6, calc(1.5 * var(--graupl-spacer, 1rem)));\n border-top-right-radius: var(--graupl-spacer-6, calc(1.5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-right-radius: var(--graupl-spacer-6, calc(1.5 * var(--graupl-spacer, 1rem)));\n }\n .border-top-radius-7 {\n border-top-left-radius: var(--graupl-spacer-7, calc(2 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-left-radius: var(--graupl-spacer-7, calc(2 * var(--graupl-spacer, 1rem)));\n border-top-right-radius: var(--graupl-spacer-7, calc(2 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-right-radius: var(--graupl-spacer-7, calc(2 * var(--graupl-spacer, 1rem)));\n }\n .border-top-radius-8 {\n border-top-left-radius: var(--graupl-spacer-8, calc(3 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-left-radius: var(--graupl-spacer-8, calc(3 * var(--graupl-spacer, 1rem)));\n border-top-right-radius: var(--graupl-spacer-8, calc(3 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-right-radius: var(--graupl-spacer-8, calc(3 * var(--graupl-spacer, 1rem)));\n }\n .border-top-radius-9 {\n border-top-left-radius: var(--graupl-spacer-9, calc(5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-left-radius: var(--graupl-spacer-9, calc(5 * var(--graupl-spacer, 1rem)));\n border-top-right-radius: var(--graupl-spacer-9, calc(5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-right-radius: var(--graupl-spacer-9, calc(5 * var(--graupl-spacer, 1rem)));\n }\n .border-top-radius-10 {\n border-top-left-radius: var(--graupl-spacer-10, calc(10 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-left-radius: var(--graupl-spacer-10, calc(10 * var(--graupl-spacer, 1rem)));\n border-top-right-radius: var(--graupl-spacer-10, calc(10 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-right-radius: var(--graupl-spacer-10, calc(10 * var(--graupl-spacer, 1rem)));\n }\n .border-right-radius-rounded {\n border-top-right-radius: 100vw !important;\n --graupl-border-top-right-radius: 100vw;\n border-bottom-right-radius: 100vw !important;\n --graupl-border-bottom-right-radius: 100vw;\n }\n .border-right-radius-squared {\n border-top-right-radius: 0 !important;\n --graupl-border-top-right-radius: 0;\n border-bottom-right-radius: 0 !important;\n --graupl-border-bottom-right-radius: 0;\n }\n .border-right-radius-0 {\n border-top-right-radius: var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-right-radius: var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)));\n border-bottom-right-radius: var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-right-radius: var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)));\n }\n .border-right-radius-1 {\n border-top-right-radius: var(--graupl-spacer-1, calc(0.125 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-right-radius: var(--graupl-spacer-1, calc(0.125 * var(--graupl-spacer, 1rem)));\n border-bottom-right-radius: var(--graupl-spacer-1, calc(0.125 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-right-radius: var(--graupl-spacer-1, calc(0.125 * var(--graupl-spacer, 1rem)));\n }\n .border-right-radius-2 {\n border-top-right-radius: var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-right-radius: var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem)));\n border-bottom-right-radius: var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-right-radius: var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem)));\n }\n .border-right-radius-3 {\n border-top-right-radius: var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-right-radius: var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem)));\n border-bottom-right-radius: var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-right-radius: var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem)));\n }\n .border-right-radius-4 {\n border-top-right-radius: var(--graupl-spacer-4, calc(0.75 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-right-radius: var(--graupl-spacer-4, calc(0.75 * var(--graupl-spacer, 1rem)));\n border-bottom-right-radius: var(--graupl-spacer-4, calc(0.75 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-right-radius: var(--graupl-spacer-4, calc(0.75 * var(--graupl-spacer, 1rem)));\n }\n .border-right-radius-5 {\n border-top-right-radius: var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-right-radius: var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem)));\n border-bottom-right-radius: var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-right-radius: var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem)));\n }\n .border-right-radius-6 {\n border-top-right-radius: var(--graupl-spacer-6, calc(1.5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-right-radius: var(--graupl-spacer-6, calc(1.5 * var(--graupl-spacer, 1rem)));\n border-bottom-right-radius: var(--graupl-spacer-6, calc(1.5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-right-radius: var(--graupl-spacer-6, calc(1.5 * var(--graupl-spacer, 1rem)));\n }\n .border-right-radius-7 {\n border-top-right-radius: var(--graupl-spacer-7, calc(2 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-right-radius: var(--graupl-spacer-7, calc(2 * var(--graupl-spacer, 1rem)));\n border-bottom-right-radius: var(--graupl-spacer-7, calc(2 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-right-radius: var(--graupl-spacer-7, calc(2 * var(--graupl-spacer, 1rem)));\n }\n .border-right-radius-8 {\n border-top-right-radius: var(--graupl-spacer-8, calc(3 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-right-radius: var(--graupl-spacer-8, calc(3 * var(--graupl-spacer, 1rem)));\n border-bottom-right-radius: var(--graupl-spacer-8, calc(3 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-right-radius: var(--graupl-spacer-8, calc(3 * var(--graupl-spacer, 1rem)));\n }\n .border-right-radius-9 {\n border-top-right-radius: var(--graupl-spacer-9, calc(5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-right-radius: var(--graupl-spacer-9, calc(5 * var(--graupl-spacer, 1rem)));\n border-bottom-right-radius: var(--graupl-spacer-9, calc(5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-right-radius: var(--graupl-spacer-9, calc(5 * var(--graupl-spacer, 1rem)));\n }\n .border-right-radius-10 {\n border-top-right-radius: var(--graupl-spacer-10, calc(10 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-right-radius: var(--graupl-spacer-10, calc(10 * var(--graupl-spacer, 1rem)));\n border-bottom-right-radius: var(--graupl-spacer-10, calc(10 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-right-radius: var(--graupl-spacer-10, calc(10 * var(--graupl-spacer, 1rem)));\n }\n .border-bottom-radius-rounded {\n border-bottom-right-radius: 100vw !important;\n --graupl-border-bottom-right-radius: 100vw;\n border-bottom-left-radius: 100vw !important;\n --graupl-border-bottom-left-radius: 100vw;\n }\n .border-bottom-radius-squared {\n border-bottom-right-radius: 0 !important;\n --graupl-border-bottom-right-radius: 0;\n border-bottom-left-radius: 0 !important;\n --graupl-border-bottom-left-radius: 0;\n }\n .border-bottom-radius-0 {\n border-bottom-right-radius: var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-right-radius: var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)));\n border-bottom-left-radius: var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-left-radius: var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)));\n }\n .border-bottom-radius-1 {\n border-bottom-right-radius: var(--graupl-spacer-1, calc(0.125 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-right-radius: var(--graupl-spacer-1, calc(0.125 * var(--graupl-spacer, 1rem)));\n border-bottom-left-radius: var(--graupl-spacer-1, calc(0.125 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-left-radius: var(--graupl-spacer-1, calc(0.125 * var(--graupl-spacer, 1rem)));\n }\n .border-bottom-radius-2 {\n border-bottom-right-radius: var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-right-radius: var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem)));\n border-bottom-left-radius: var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-left-radius: var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem)));\n }\n .border-bottom-radius-3 {\n border-bottom-right-radius: var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-right-radius: var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem)));\n border-bottom-left-radius: var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-left-radius: var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem)));\n }\n .border-bottom-radius-4 {\n border-bottom-right-radius: var(--graupl-spacer-4, calc(0.75 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-right-radius: var(--graupl-spacer-4, calc(0.75 * var(--graupl-spacer, 1rem)));\n border-bottom-left-radius: var(--graupl-spacer-4, calc(0.75 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-left-radius: var(--graupl-spacer-4, calc(0.75 * var(--graupl-spacer, 1rem)));\n }\n .border-bottom-radius-5 {\n border-bottom-right-radius: var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-right-radius: var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem)));\n border-bottom-left-radius: var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-left-radius: var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem)));\n }\n .border-bottom-radius-6 {\n border-bottom-right-radius: var(--graupl-spacer-6, calc(1.5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-right-radius: var(--graupl-spacer-6, calc(1.5 * var(--graupl-spacer, 1rem)));\n border-bottom-left-radius: var(--graupl-spacer-6, calc(1.5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-left-radius: var(--graupl-spacer-6, calc(1.5 * var(--graupl-spacer, 1rem)));\n }\n .border-bottom-radius-7 {\n border-bottom-right-radius: var(--graupl-spacer-7, calc(2 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-right-radius: var(--graupl-spacer-7, calc(2 * var(--graupl-spacer, 1rem)));\n border-bottom-left-radius: var(--graupl-spacer-7, calc(2 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-left-radius: var(--graupl-spacer-7, calc(2 * var(--graupl-spacer, 1rem)));\n }\n .border-bottom-radius-8 {\n border-bottom-right-radius: var(--graupl-spacer-8, calc(3 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-right-radius: var(--graupl-spacer-8, calc(3 * var(--graupl-spacer, 1rem)));\n border-bottom-left-radius: var(--graupl-spacer-8, calc(3 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-left-radius: var(--graupl-spacer-8, calc(3 * var(--graupl-spacer, 1rem)));\n }\n .border-bottom-radius-9 {\n border-bottom-right-radius: var(--graupl-spacer-9, calc(5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-right-radius: var(--graupl-spacer-9, calc(5 * var(--graupl-spacer, 1rem)));\n border-bottom-left-radius: var(--graupl-spacer-9, calc(5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-left-radius: var(--graupl-spacer-9, calc(5 * var(--graupl-spacer, 1rem)));\n }\n .border-bottom-radius-10 {\n border-bottom-right-radius: var(--graupl-spacer-10, calc(10 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-right-radius: var(--graupl-spacer-10, calc(10 * var(--graupl-spacer, 1rem)));\n border-bottom-left-radius: var(--graupl-spacer-10, calc(10 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-left-radius: var(--graupl-spacer-10, calc(10 * var(--graupl-spacer, 1rem)));\n }\n .border-left-radius-rounded {\n border-top-left-radius: 100vw !important;\n --graupl-border-top-left-radius: 100vw;\n border-bottom-left-radius: 100vw !important;\n --graupl-border-bottom-left-radius: 100vw;\n }\n .border-left-radius-squared {\n border-top-left-radius: 0 !important;\n --graupl-border-top-left-radius: 0;\n border-bottom-left-radius: 0 !important;\n --graupl-border-bottom-left-radius: 0;\n }\n .border-left-radius-0 {\n border-top-left-radius: var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-left-radius: var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)));\n border-bottom-left-radius: var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-left-radius: var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)));\n }\n .border-left-radius-1 {\n border-top-left-radius: var(--graupl-spacer-1, calc(0.125 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-left-radius: var(--graupl-spacer-1, calc(0.125 * var(--graupl-spacer, 1rem)));\n border-bottom-left-radius: var(--graupl-spacer-1, calc(0.125 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-left-radius: var(--graupl-spacer-1, calc(0.125 * var(--graupl-spacer, 1rem)));\n }\n .border-left-radius-2 {\n border-top-left-radius: var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-left-radius: var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem)));\n border-bottom-left-radius: var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-left-radius: var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem)));\n }\n .border-left-radius-3 {\n border-top-left-radius: var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-left-radius: var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem)));\n border-bottom-left-radius: var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-left-radius: var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem)));\n }\n .border-left-radius-4 {\n border-top-left-radius: var(--graupl-spacer-4, calc(0.75 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-left-radius: var(--graupl-spacer-4, calc(0.75 * var(--graupl-spacer, 1rem)));\n border-bottom-left-radius: var(--graupl-spacer-4, calc(0.75 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-left-radius: var(--graupl-spacer-4, calc(0.75 * var(--graupl-spacer, 1rem)));\n }\n .border-left-radius-5 {\n border-top-left-radius: var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-left-radius: var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem)));\n border-bottom-left-radius: var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-left-radius: var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem)));\n }\n .border-left-radius-6 {\n border-top-left-radius: var(--graupl-spacer-6, calc(1.5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-left-radius: var(--graupl-spacer-6, calc(1.5 * var(--graupl-spacer, 1rem)));\n border-bottom-left-radius: var(--graupl-spacer-6, calc(1.5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-left-radius: var(--graupl-spacer-6, calc(1.5 * var(--graupl-spacer, 1rem)));\n }\n .border-left-radius-7 {\n border-top-left-radius: var(--graupl-spacer-7, calc(2 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-left-radius: var(--graupl-spacer-7, calc(2 * var(--graupl-spacer, 1rem)));\n border-bottom-left-radius: var(--graupl-spacer-7, calc(2 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-left-radius: var(--graupl-spacer-7, calc(2 * var(--graupl-spacer, 1rem)));\n }\n .border-left-radius-8 {\n border-top-left-radius: var(--graupl-spacer-8, calc(3 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-left-radius: var(--graupl-spacer-8, calc(3 * var(--graupl-spacer, 1rem)));\n border-bottom-left-radius: var(--graupl-spacer-8, calc(3 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-left-radius: var(--graupl-spacer-8, calc(3 * var(--graupl-spacer, 1rem)));\n }\n .border-left-radius-9 {\n border-top-left-radius: var(--graupl-spacer-9, calc(5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-left-radius: var(--graupl-spacer-9, calc(5 * var(--graupl-spacer, 1rem)));\n border-bottom-left-radius: var(--graupl-spacer-9, calc(5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-left-radius: var(--graupl-spacer-9, calc(5 * var(--graupl-spacer, 1rem)));\n }\n .border-left-radius-10 {\n border-top-left-radius: var(--graupl-spacer-10, calc(10 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-left-radius: var(--graupl-spacer-10, calc(10 * var(--graupl-spacer, 1rem)));\n border-bottom-left-radius: var(--graupl-spacer-10, calc(10 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-left-radius: var(--graupl-spacer-10, calc(10 * var(--graupl-spacer, 1rem)));\n }\n .border-top-left-radius-rounded {\n border-top-left-radius: 100vw !important;\n --graupl-border-top-left-radius: 100vw;\n }\n .border-top-left-radius-squared {\n border-top-left-radius: 0 !important;\n --graupl-border-top-left-radius: 0;\n }\n .border-top-left-radius-0 {\n border-top-left-radius: var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-left-radius: var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)));\n }\n .border-top-left-radius-1 {\n border-top-left-radius: var(--graupl-spacer-1, calc(0.125 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-left-radius: var(--graupl-spacer-1, calc(0.125 * var(--graupl-spacer, 1rem)));\n }\n .border-top-left-radius-2 {\n border-top-left-radius: var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-left-radius: var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem)));\n }\n .border-top-left-radius-3 {\n border-top-left-radius: var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-left-radius: var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem)));\n }\n .border-top-left-radius-4 {\n border-top-left-radius: var(--graupl-spacer-4, calc(0.75 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-left-radius: var(--graupl-spacer-4, calc(0.75 * var(--graupl-spacer, 1rem)));\n }\n .border-top-left-radius-5 {\n border-top-left-radius: var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-left-radius: var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem)));\n }\n .border-top-left-radius-6 {\n border-top-left-radius: var(--graupl-spacer-6, calc(1.5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-left-radius: var(--graupl-spacer-6, calc(1.5 * var(--graupl-spacer, 1rem)));\n }\n .border-top-left-radius-7 {\n border-top-left-radius: var(--graupl-spacer-7, calc(2 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-left-radius: var(--graupl-spacer-7, calc(2 * var(--graupl-spacer, 1rem)));\n }\n .border-top-left-radius-8 {\n border-top-left-radius: var(--graupl-spacer-8, calc(3 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-left-radius: var(--graupl-spacer-8, calc(3 * var(--graupl-spacer, 1rem)));\n }\n .border-top-left-radius-9 {\n border-top-left-radius: var(--graupl-spacer-9, calc(5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-left-radius: var(--graupl-spacer-9, calc(5 * var(--graupl-spacer, 1rem)));\n }\n .border-top-left-radius-10 {\n border-top-left-radius: var(--graupl-spacer-10, calc(10 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-left-radius: var(--graupl-spacer-10, calc(10 * var(--graupl-spacer, 1rem)));\n }\n .border-top-right-radius-rounded {\n border-top-right-radius: 100vw !important;\n --graupl-border-top-right-radius: 100vw;\n }\n .border-top-right-radius-squared {\n border-top-right-radius: 0 !important;\n --graupl-border-top-right-radius: 0;\n }\n .border-top-right-radius-0 {\n border-top-right-radius: var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-right-radius: var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)));\n }\n .border-top-right-radius-1 {\n border-top-right-radius: var(--graupl-spacer-1, calc(0.125 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-right-radius: var(--graupl-spacer-1, calc(0.125 * var(--graupl-spacer, 1rem)));\n }\n .border-top-right-radius-2 {\n border-top-right-radius: var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-right-radius: var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem)));\n }\n .border-top-right-radius-3 {\n border-top-right-radius: var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-right-radius: var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem)));\n }\n .border-top-right-radius-4 {\n border-top-right-radius: var(--graupl-spacer-4, calc(0.75 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-right-radius: var(--graupl-spacer-4, calc(0.75 * var(--graupl-spacer, 1rem)));\n }\n .border-top-right-radius-5 {\n border-top-right-radius: var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-right-radius: var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem)));\n }\n .border-top-right-radius-6 {\n border-top-right-radius: var(--graupl-spacer-6, calc(1.5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-right-radius: var(--graupl-spacer-6, calc(1.5 * var(--graupl-spacer, 1rem)));\n }\n .border-top-right-radius-7 {\n border-top-right-radius: var(--graupl-spacer-7, calc(2 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-right-radius: var(--graupl-spacer-7, calc(2 * var(--graupl-spacer, 1rem)));\n }\n .border-top-right-radius-8 {\n border-top-right-radius: var(--graupl-spacer-8, calc(3 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-right-radius: var(--graupl-spacer-8, calc(3 * var(--graupl-spacer, 1rem)));\n }\n .border-top-right-radius-9 {\n border-top-right-radius: var(--graupl-spacer-9, calc(5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-right-radius: var(--graupl-spacer-9, calc(5 * var(--graupl-spacer, 1rem)));\n }\n .border-top-right-radius-10 {\n border-top-right-radius: var(--graupl-spacer-10, calc(10 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-right-radius: var(--graupl-spacer-10, calc(10 * var(--graupl-spacer, 1rem)));\n }\n .border-bottom-right-radius-rounded {\n border-bottom-right-radius: 100vw !important;\n --graupl-border-bottom-right-radius: 100vw;\n }\n .border-bottom-right-radius-squared {\n border-bottom-right-radius: 0 !important;\n --graupl-border-bottom-right-radius: 0;\n }\n .border-bottom-right-radius-0 {\n border-bottom-right-radius: var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-right-radius: var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)));\n }\n .border-bottom-right-radius-1 {\n border-bottom-right-radius: var(--graupl-spacer-1, calc(0.125 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-right-radius: var(--graupl-spacer-1, calc(0.125 * var(--graupl-spacer, 1rem)));\n }\n .border-bottom-right-radius-2 {\n border-bottom-right-radius: var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-right-radius: var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem)));\n }\n .border-bottom-right-radius-3 {\n border-bottom-right-radius: var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-right-radius: var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem)));\n }\n .border-bottom-right-radius-4 {\n border-bottom-right-radius: var(--graupl-spacer-4, calc(0.75 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-right-radius: var(--graupl-spacer-4, calc(0.75 * var(--graupl-spacer, 1rem)));\n }\n .border-bottom-right-radius-5 {\n border-bottom-right-radius: var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-right-radius: var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem)));\n }\n .border-bottom-right-radius-6 {\n border-bottom-right-radius: var(--graupl-spacer-6, calc(1.5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-right-radius: var(--graupl-spacer-6, calc(1.5 * var(--graupl-spacer, 1rem)));\n }\n .border-bottom-right-radius-7 {\n border-bottom-right-radius: var(--graupl-spacer-7, calc(2 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-right-radius: var(--graupl-spacer-7, calc(2 * var(--graupl-spacer, 1rem)));\n }\n .border-bottom-right-radius-8 {\n border-bottom-right-radius: var(--graupl-spacer-8, calc(3 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-right-radius: var(--graupl-spacer-8, calc(3 * var(--graupl-spacer, 1rem)));\n }\n .border-bottom-right-radius-9 {\n border-bottom-right-radius: var(--graupl-spacer-9, calc(5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-right-radius: var(--graupl-spacer-9, calc(5 * var(--graupl-spacer, 1rem)));\n }\n .border-bottom-right-radius-10 {\n border-bottom-right-radius: var(--graupl-spacer-10, calc(10 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-right-radius: var(--graupl-spacer-10, calc(10 * var(--graupl-spacer, 1rem)));\n }\n .border-bottom-left-radius-rounded {\n border-bottom-left-radius: 100vw !important;\n --graupl-border-bottom-left-radius: 100vw;\n }\n .border-bottom-left-radius-squared {\n border-bottom-left-radius: 0 !important;\n --graupl-border-bottom-left-radius: 0;\n }\n .border-bottom-left-radius-0 {\n border-bottom-left-radius: var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-left-radius: var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)));\n }\n .border-bottom-left-radius-1 {\n border-bottom-left-radius: var(--graupl-spacer-1, calc(0.125 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-left-radius: var(--graupl-spacer-1, calc(0.125 * var(--graupl-spacer, 1rem)));\n }\n .border-bottom-left-radius-2 {\n border-bottom-left-radius: var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-left-radius: var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem)));\n }\n .border-bottom-left-radius-3 {\n border-bottom-left-radius: var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-left-radius: var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem)));\n }\n .border-bottom-left-radius-4 {\n border-bottom-left-radius: var(--graupl-spacer-4, calc(0.75 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-left-radius: var(--graupl-spacer-4, calc(0.75 * var(--graupl-spacer, 1rem)));\n }\n .border-bottom-left-radius-5 {\n border-bottom-left-radius: var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-left-radius: var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem)));\n }\n .border-bottom-left-radius-6 {\n border-bottom-left-radius: var(--graupl-spacer-6, calc(1.5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-left-radius: var(--graupl-spacer-6, calc(1.5 * var(--graupl-spacer, 1rem)));\n }\n .border-bottom-left-radius-7 {\n border-bottom-left-radius: var(--graupl-spacer-7, calc(2 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-left-radius: var(--graupl-spacer-7, calc(2 * var(--graupl-spacer, 1rem)));\n }\n .border-bottom-left-radius-8 {\n border-bottom-left-radius: var(--graupl-spacer-8, calc(3 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-left-radius: var(--graupl-spacer-8, calc(3 * var(--graupl-spacer, 1rem)));\n }\n .border-bottom-left-radius-9 {\n border-bottom-left-radius: var(--graupl-spacer-9, calc(5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-left-radius: var(--graupl-spacer-9, calc(5 * var(--graupl-spacer, 1rem)));\n }\n .border-bottom-left-radius-10 {\n border-bottom-left-radius: var(--graupl-spacer-10, calc(10 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-left-radius: var(--graupl-spacer-10, calc(10 * var(--graupl-spacer, 1rem)));\n }\n}\n@layer graupl.utilities {\n .border-solid {\n border-style: solid !important;\n --graupl-border-style: solid;\n }\n .border-dashed {\n border-style: dashed !important;\n --graupl-border-style: dashed;\n }\n .border-dotted {\n border-style: dotted !important;\n --graupl-border-style: dotted;\n }\n .border-double {\n border-style: double !important;\n --graupl-border-style: double;\n }\n .border-groove {\n border-style: groove !important;\n --graupl-border-style: groove;\n }\n .border-ridge {\n border-style: ridge !important;\n --graupl-border-style: ridge;\n }\n .border-inset {\n border-style: inset !important;\n --graupl-border-style: inset;\n }\n .border-outset {\n border-style: outset !important;\n --graupl-border-style: outset;\n }\n .border-none {\n border-style: none !important;\n --graupl-border-style: none;\n }\n .border-top-solid {\n border-top-style: solid !important;\n --graupl-border-top-style: solid;\n }\n .border-top-dashed {\n border-top-style: dashed !important;\n --graupl-border-top-style: dashed;\n }\n .border-top-dotted {\n border-top-style: dotted !important;\n --graupl-border-top-style: dotted;\n }\n .border-top-double {\n border-top-style: double !important;\n --graupl-border-top-style: double;\n }\n .border-top-groove {\n border-top-style: groove !important;\n --graupl-border-top-style: groove;\n }\n .border-top-ridge {\n border-top-style: ridge !important;\n --graupl-border-top-style: ridge;\n }\n .border-top-inset {\n border-top-style: inset !important;\n --graupl-border-top-style: inset;\n }\n .border-top-outset {\n border-top-style: outset !important;\n --graupl-border-top-style: outset;\n }\n .border-top-none {\n border-top-style: none !important;\n --graupl-border-top-style: none;\n }\n .border-right-solid {\n border-right-style: solid !important;\n --graupl-border-right-style: solid;\n }\n .border-right-dashed {\n border-right-style: dashed !important;\n --graupl-border-right-style: dashed;\n }\n .border-right-dotted {\n border-right-style: dotted !important;\n --graupl-border-right-style: dotted;\n }\n .border-right-double {\n border-right-style: double !important;\n --graupl-border-right-style: double;\n }\n .border-right-groove {\n border-right-style: groove !important;\n --graupl-border-right-style: groove;\n }\n .border-right-ridge {\n border-right-style: ridge !important;\n --graupl-border-right-style: ridge;\n }\n .border-right-inset {\n border-right-style: inset !important;\n --graupl-border-right-style: inset;\n }\n .border-right-outset {\n border-right-style: outset !important;\n --graupl-border-right-style: outset;\n }\n .border-right-none {\n border-right-style: none !important;\n --graupl-border-right-style: none;\n }\n .border-bottom-solid {\n border-bottom-style: solid !important;\n --graupl-border-bottom-style: solid;\n }\n .border-bottom-dashed {\n border-bottom-style: dashed !important;\n --graupl-border-bottom-style: dashed;\n }\n .border-bottom-dotted {\n border-bottom-style: dotted !important;\n --graupl-border-bottom-style: dotted;\n }\n .border-bottom-double {\n border-bottom-style: double !important;\n --graupl-border-bottom-style: double;\n }\n .border-bottom-groove {\n border-bottom-style: groove !important;\n --graupl-border-bottom-style: groove;\n }\n .border-bottom-ridge {\n border-bottom-style: ridge !important;\n --graupl-border-bottom-style: ridge;\n }\n .border-bottom-inset {\n border-bottom-style: inset !important;\n --graupl-border-bottom-style: inset;\n }\n .border-bottom-outset {\n border-bottom-style: outset !important;\n --graupl-border-bottom-style: outset;\n }\n .border-bottom-none {\n border-bottom-style: none !important;\n --graupl-border-bottom-style: none;\n }\n .border-left-solid {\n border-left-style: solid !important;\n --graupl-border-left-style: solid;\n }\n .border-left-dashed {\n border-left-style: dashed !important;\n --graupl-border-left-style: dashed;\n }\n .border-left-dotted {\n border-left-style: dotted !important;\n --graupl-border-left-style: dotted;\n }\n .border-left-double {\n border-left-style: double !important;\n --graupl-border-left-style: double;\n }\n .border-left-groove {\n border-left-style: groove !important;\n --graupl-border-left-style: groove;\n }\n .border-left-ridge {\n border-left-style: ridge !important;\n --graupl-border-left-style: ridge;\n }\n .border-left-inset {\n border-left-style: inset !important;\n --graupl-border-left-style: inset;\n }\n .border-left-outset {\n border-left-style: outset !important;\n --graupl-border-left-style: outset;\n }\n .border-left-none {\n border-left-style: none !important;\n --graupl-border-left-style: none;\n }\n}\n@layer graupl.utilities {\n .border-thick {\n border-width: thick !important;\n --graupl-border-width: thick;\n }\n .border-thin {\n border-width: thin !important;\n --graupl-border-width: thin;\n }\n .border-medium {\n border-width: medium !important;\n --graupl-border-width: medium;\n }\n .border-none {\n border-width: none !important;\n --graupl-border-width: none;\n }\n .border-0 {\n border-width: var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-width: var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)));\n }\n .border-1 {\n border-width: var(--graupl-spacer-1, calc(0.125 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-width: var(--graupl-spacer-1, calc(0.125 * var(--graupl-spacer, 1rem)));\n }\n .border-2 {\n border-width: var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-width: var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem)));\n }\n .border-3 {\n border-width: var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-width: var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem)));\n }\n .border-4 {\n border-width: var(--graupl-spacer-4, calc(0.75 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-width: var(--graupl-spacer-4, calc(0.75 * var(--graupl-spacer, 1rem)));\n }\n .border-5 {\n border-width: var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-width: var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem)));\n }\n .border-6 {\n border-width: var(--graupl-spacer-6, calc(1.5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-width: var(--graupl-spacer-6, calc(1.5 * var(--graupl-spacer, 1rem)));\n }\n .border-7 {\n border-width: var(--graupl-spacer-7, calc(2 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-width: var(--graupl-spacer-7, calc(2 * var(--graupl-spacer, 1rem)));\n }\n .border-8 {\n border-width: var(--graupl-spacer-8, calc(3 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-width: var(--graupl-spacer-8, calc(3 * var(--graupl-spacer, 1rem)));\n }\n .border-9 {\n border-width: var(--graupl-spacer-9, calc(5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-width: var(--graupl-spacer-9, calc(5 * var(--graupl-spacer, 1rem)));\n }\n .border-10 {\n border-width: var(--graupl-spacer-10, calc(10 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-width: var(--graupl-spacer-10, calc(10 * var(--graupl-spacer, 1rem)));\n }\n .border-top-thick {\n border-top-width: thick !important;\n --graupl-border-top-width: thick;\n }\n .border-top-thin {\n border-top-width: thin !important;\n --graupl-border-top-width: thin;\n }\n .border-top-medium {\n border-top-width: medium !important;\n --graupl-border-top-width: medium;\n }\n .border-top-none {\n border-top-width: none !important;\n --graupl-border-top-width: none;\n }\n .border-top-0 {\n border-top-width: var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-width: var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)));\n }\n .border-top-1 {\n border-top-width: var(--graupl-spacer-1, calc(0.125 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-width: var(--graupl-spacer-1, calc(0.125 * var(--graupl-spacer, 1rem)));\n }\n .border-top-2 {\n border-top-width: var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-width: var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem)));\n }\n .border-top-3 {\n border-top-width: var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-width: var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem)));\n }\n .border-top-4 {\n border-top-width: var(--graupl-spacer-4, calc(0.75 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-width: var(--graupl-spacer-4, calc(0.75 * var(--graupl-spacer, 1rem)));\n }\n .border-top-5 {\n border-top-width: var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-width: var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem)));\n }\n .border-top-6 {\n border-top-width: var(--graupl-spacer-6, calc(1.5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-width: var(--graupl-spacer-6, calc(1.5 * var(--graupl-spacer, 1rem)));\n }\n .border-top-7 {\n border-top-width: var(--graupl-spacer-7, calc(2 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-width: var(--graupl-spacer-7, calc(2 * var(--graupl-spacer, 1rem)));\n }\n .border-top-8 {\n border-top-width: var(--graupl-spacer-8, calc(3 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-width: var(--graupl-spacer-8, calc(3 * var(--graupl-spacer, 1rem)));\n }\n .border-top-9 {\n border-top-width: var(--graupl-spacer-9, calc(5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-width: var(--graupl-spacer-9, calc(5 * var(--graupl-spacer, 1rem)));\n }\n .border-top-10 {\n border-top-width: var(--graupl-spacer-10, calc(10 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-top-width: var(--graupl-spacer-10, calc(10 * var(--graupl-spacer, 1rem)));\n }\n .border-right-thick {\n border-right-width: thick !important;\n --graupl-border-right-width: thick;\n }\n .border-right-thin {\n border-right-width: thin !important;\n --graupl-border-right-width: thin;\n }\n .border-right-medium {\n border-right-width: medium !important;\n --graupl-border-right-width: medium;\n }\n .border-right-none {\n border-right-width: none !important;\n --graupl-border-right-width: none;\n }\n .border-right-0 {\n border-right-width: var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-right-width: var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)));\n }\n .border-right-1 {\n border-right-width: var(--graupl-spacer-1, calc(0.125 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-right-width: var(--graupl-spacer-1, calc(0.125 * var(--graupl-spacer, 1rem)));\n }\n .border-right-2 {\n border-right-width: var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-right-width: var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem)));\n }\n .border-right-3 {\n border-right-width: var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-right-width: var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem)));\n }\n .border-right-4 {\n border-right-width: var(--graupl-spacer-4, calc(0.75 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-right-width: var(--graupl-spacer-4, calc(0.75 * var(--graupl-spacer, 1rem)));\n }\n .border-right-5 {\n border-right-width: var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-right-width: var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem)));\n }\n .border-right-6 {\n border-right-width: var(--graupl-spacer-6, calc(1.5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-right-width: var(--graupl-spacer-6, calc(1.5 * var(--graupl-spacer, 1rem)));\n }\n .border-right-7 {\n border-right-width: var(--graupl-spacer-7, calc(2 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-right-width: var(--graupl-spacer-7, calc(2 * var(--graupl-spacer, 1rem)));\n }\n .border-right-8 {\n border-right-width: var(--graupl-spacer-8, calc(3 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-right-width: var(--graupl-spacer-8, calc(3 * var(--graupl-spacer, 1rem)));\n }\n .border-right-9 {\n border-right-width: var(--graupl-spacer-9, calc(5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-right-width: var(--graupl-spacer-9, calc(5 * var(--graupl-spacer, 1rem)));\n }\n .border-right-10 {\n border-right-width: var(--graupl-spacer-10, calc(10 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-right-width: var(--graupl-spacer-10, calc(10 * var(--graupl-spacer, 1rem)));\n }\n .border-bottom-thick {\n border-bottom-width: thick !important;\n --graupl-border-bottom-width: thick;\n }\n .border-bottom-thin {\n border-bottom-width: thin !important;\n --graupl-border-bottom-width: thin;\n }\n .border-bottom-medium {\n border-bottom-width: medium !important;\n --graupl-border-bottom-width: medium;\n }\n .border-bottom-none {\n border-bottom-width: none !important;\n --graupl-border-bottom-width: none;\n }\n .border-bottom-0 {\n border-bottom-width: var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-width: var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)));\n }\n .border-bottom-1 {\n border-bottom-width: var(--graupl-spacer-1, calc(0.125 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-width: var(--graupl-spacer-1, calc(0.125 * var(--graupl-spacer, 1rem)));\n }\n .border-bottom-2 {\n border-bottom-width: var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-width: var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem)));\n }\n .border-bottom-3 {\n border-bottom-width: var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-width: var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem)));\n }\n .border-bottom-4 {\n border-bottom-width: var(--graupl-spacer-4, calc(0.75 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-width: var(--graupl-spacer-4, calc(0.75 * var(--graupl-spacer, 1rem)));\n }\n .border-bottom-5 {\n border-bottom-width: var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-width: var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem)));\n }\n .border-bottom-6 {\n border-bottom-width: var(--graupl-spacer-6, calc(1.5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-width: var(--graupl-spacer-6, calc(1.5 * var(--graupl-spacer, 1rem)));\n }\n .border-bottom-7 {\n border-bottom-width: var(--graupl-spacer-7, calc(2 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-width: var(--graupl-spacer-7, calc(2 * var(--graupl-spacer, 1rem)));\n }\n .border-bottom-8 {\n border-bottom-width: var(--graupl-spacer-8, calc(3 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-width: var(--graupl-spacer-8, calc(3 * var(--graupl-spacer, 1rem)));\n }\n .border-bottom-9 {\n border-bottom-width: var(--graupl-spacer-9, calc(5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-width: var(--graupl-spacer-9, calc(5 * var(--graupl-spacer, 1rem)));\n }\n .border-bottom-10 {\n border-bottom-width: var(--graupl-spacer-10, calc(10 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-bottom-width: var(--graupl-spacer-10, calc(10 * var(--graupl-spacer, 1rem)));\n }\n .border-left-thick {\n border-left-width: thick !important;\n --graupl-border-left-width: thick;\n }\n .border-left-thin {\n border-left-width: thin !important;\n --graupl-border-left-width: thin;\n }\n .border-left-medium {\n border-left-width: medium !important;\n --graupl-border-left-width: medium;\n }\n .border-left-none {\n border-left-width: none !important;\n --graupl-border-left-width: none;\n }\n .border-left-0 {\n border-left-width: var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-left-width: var(--graupl-spacer-0, calc(0 * var(--graupl-spacer, 1rem)));\n }\n .border-left-1 {\n border-left-width: var(--graupl-spacer-1, calc(0.125 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-left-width: var(--graupl-spacer-1, calc(0.125 * var(--graupl-spacer, 1rem)));\n }\n .border-left-2 {\n border-left-width: var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-left-width: var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem)));\n }\n .border-left-3 {\n border-left-width: var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-left-width: var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem)));\n }\n .border-left-4 {\n border-left-width: var(--graupl-spacer-4, calc(0.75 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-left-width: var(--graupl-spacer-4, calc(0.75 * var(--graupl-spacer, 1rem)));\n }\n .border-left-5 {\n border-left-width: var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-left-width: var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem)));\n }\n .border-left-6 {\n border-left-width: var(--graupl-spacer-6, calc(1.5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-left-width: var(--graupl-spacer-6, calc(1.5 * var(--graupl-spacer, 1rem)));\n }\n .border-left-7 {\n border-left-width: var(--graupl-spacer-7, calc(2 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-left-width: var(--graupl-spacer-7, calc(2 * var(--graupl-spacer, 1rem)));\n }\n .border-left-8 {\n border-left-width: var(--graupl-spacer-8, calc(3 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-left-width: var(--graupl-spacer-8, calc(3 * var(--graupl-spacer, 1rem)));\n }\n .border-left-9 {\n border-left-width: var(--graupl-spacer-9, calc(5 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-left-width: var(--graupl-spacer-9, calc(5 * var(--graupl-spacer, 1rem)));\n }\n .border-left-10 {\n border-left-width: var(--graupl-spacer-10, calc(10 * var(--graupl-spacer, 1rem))) !important;\n --graupl-border-left-width: var(--graupl-spacer-10, calc(10 * var(--graupl-spacer, 1rem)));\n }\n}\n@layer graupl.utilities {\n .bordered {\n border-width: var(--graupl-border-top-width, var(--graupl-border-width, 0.125rem)) var(--graupl-border-right-width, var(--graupl-border-width, 0.125rem)) var(--graupl-border-bottom-width, var(--graupl-border-width, 0.125rem)) var(--graupl-border-left-width, var(--graupl-border-width, 0.125rem)) !important;\n border-radius: var(--graupl-border-top-left-radius, var(--graupl-border-radius, 0.125rem)) var(--graupl-border-top-right-radius, var(--graupl-border-radius, 0.125rem)) var(--graupl-border-bottom-right-radius, var(--graupl-border-radius, 0.125rem)) var(--graupl-border-bottom-left-radius, var(--graupl-border-radius, 0.125rem)) !important;\n border-style: var(--graupl-border-top-style, var(--graupl-border-style, solid)) var(--graupl-border-right-style, var(--graupl-border-style, solid)) var(--graupl-border-bottom-style, var(--graupl-border-style, solid)) var(--graupl-border-left-style, var(--graupl-border-style, solid)) !important;\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 utility mixins.\n//\n// Mixins to help generate utility classes.\n\n@use \"./screen\";\n@use \"./container\";\n@use \"./state\";\n@use \"./theme\";\n@use \"../functions/important\";\n@use \"../functions/utility\";\n@use \"../defaults\" as root-defaults;\n@use \"../theme/color/defaults\" as color-defaults;\n@use \"sass:map\";\n@use \"sass:string\";\n\n/// Insert a map of properties and values into a utility class.\n///\n/// @param {Map} $map\n/// The map of properties and values to apply to the selector.\n/// @param {Boolean} $important\n/// A flag to determine if the important flag should be added.\n@mixin _insert($map, $important: null) {\n @each $prop, $value in $map {\n // Do not attempt to insert important values inside of custom properties.\n @if string.slice($prop, 1, 2) != \"--\" {\n #{$prop}: important.insert(#{$value}, $override: $important);\n } @else {\n #{$prop}: #{$value};\n }\n }\n\n // Allow for custom overrides and additional styles.\n @content;\n}\n\n/// Handles wrapping utilities with a conditional state.\n///\n/// @param {?string} $state\n/// The state to wrap.\n@mixin _handle-state($state: null) {\n @if $state {\n @include state.state($state) {\n @content;\n }\n } @else {\n @content;\n }\n}\n\n/// Handles wrapping utilities with a conditional screen.\n///\n/// @param {?string} $screen\n/// The screen to wrap.\n@mixin _handle-screen($screen: null) {\n @if $screen {\n @include screen.up($screen) {\n @content;\n }\n } @else {\n @content;\n }\n}\n\n/// Handles wrapping utilities with a conditional container.\n///\n/// @param {?string} $container\n/// The container to wrap.\n@mixin _handle-container($container: null) {\n @if $container {\n @include container.up($container) {\n @content;\n }\n } @else {\n @content;\n }\n}\n\n/// Handles wrapping utilities with a conditional theme.\n///\n/// @param {?string} $theme\n/// The theme mode to wrap.\n@mixin _handle-theme($theme: null) {\n @if $theme {\n @include theme.theme($theme) {\n @content;\n }\n } @else {\n @content;\n }\n}\n\n/// Handles wrapping utilities with a conditional scheme.\n///\n/// @param {?string} $scheme\n/// The scheme mode to wrap.\n@mixin _handle-scheme($scheme: null) {\n @if $scheme {\n @include theme.scheme($scheme) {\n @content;\n }\n } @else {\n @content;\n }\n}\n\n/// Create a utility class with a list of properties and a single value.\n///\n/// @param {string} $selector\n/// The selector to apply the utility class to.\n/// @param {string|List} $property\n/// The property/properties to apply to the selector.\n/// @param {string} $value\n/// The value to apply to the property/properties.\n/// @param {?Boolean} $important\n/// A flag to determine if the important flag should be added.\n/// @param {?string} $screen\n/// The screen to apply the utility class to.\n/// @param {?string} $theme\n/// The theme to apply the utility class to.\n/// @param {?string} $scheme\n/// The scheme mode to apply the utility class to.\n/// @param {?string} $state\n/// The state to apply the utility class to.\n@mixin create(\n $selector,\n $property,\n $value,\n $important: null,\n $screen: null,\n $theme: null,\n $scheme: null,\n $state: null,\n $container: null\n) {\n $map: utility.convert-property-values-to-map($property, $value);\n\n @include create-mapped(\n $selector,\n $map,\n $important: $important,\n $screen: $screen,\n $theme: $theme,\n $scheme: $scheme,\n $state: $state,\n $container: $container\n ) {\n @content;\n }\n}\n\n/// Create a utility class with a map of properties and values.\n///\n/// @param {string} $selector\n/// The selector to apply the utility class to.\n/// @param {Map} $map\n/// The map of properties and values to apply to the selector.\n/// @param {?Boolean} $important\n/// A flag to determine if the important flag should be added.\n/// @param {?string} $screen\n/// The screen to apply the utility class to.\n/// @param {?string} $theme\n/// The theme to apply the utility class to.\n/// @param {?string} $scheme\n/// The scheme mode to apply the utility class to.\n/// @param {?string} $state\n/// The state to apply the utility class to.\n@mixin create-mapped(\n $selector,\n $map,\n $important: null,\n $screen: null,\n $theme: null,\n $scheme: null,\n $state: null,\n $container: null\n) {\n @include _handle-theme($theme) {\n @include _handle-scheme($scheme) {\n #{$selector} {\n @if $screen or $container {\n @if $screen {\n @include _handle-screen($screen) {\n @include _handle-state($state) {\n @include _insert($map, $important) {\n @content;\n }\n }\n }\n }\n\n @if $container {\n @include _handle-container($container) {\n @include _handle-state($state) {\n @include _insert($map, $important) {\n @content;\n }\n }\n }\n }\n } @else {\n @include _handle-state($state) {\n @include _insert($map, $important) {\n @content;\n }\n }\n }\n }\n }\n }\n}\n\n/// Create a suite of utilities for all base and responsive classes.\n///\n/// Takes a utility map that is generated by the generate-utility-map() function.\n///\n/// @param {?Map} $map [()]\n/// The utility map.\n/// @param {?string} $selector-base [root-defaults.$utility-selector-base]\n/// The selector base to use for all generated utilities.\n/// @param {?string} $selector-prefix [root-defaults.$utility-selector-prefix]\n/// The selector prefix to use for all generated utilities.\n/// @param {?string} $selector-suffix [root-defaults.$utility-selector-suffix]\n/// The selector suffix to use for all generated utilities.\n/// @param {?Boolean} $screen-aware [false]\n/// A flag to enable screen-aware utility generation.\n/// @param {?string} $screen-aware-selector-prefix [root-defaults.$utility-screen-aware-selector-prefix]\n/// The selector base to use for all generated screen-aware utilities.\n/// @param {?string} $screen-aware-selector-suffix [root-defaults.$utility-screen-aware-selector-suffix]\n/// The selector prefix to use for all generated screen-aware utilities.\n/// @param {?string} $screen-aware-selector-separator [root-defaults.$utility-screen-aware-selector-separator]\n/// The selector suffix to use for all generated screen-aware utilities.\n/// @param {?Boolean} $theme-aware [false]\n/// A flag to enable theme-aware utility generation.\n/// @param {?string} $theme-aware-selector-prefix [root-defaults.$utility-theme-aware-selector-prefix]\n/// The selector base to use for all generated theme-aware utilities.\n/// @param {?string} $theme-aware-selector-suffix [root-defaults.$utility-theme-aware-selector-suffix]\n/// The selector prefix to use for all generated theme-aware utilities.\n/// @param {?string} $theme-aware-selector-separator [root-defaults.$utility-theme-aware-selector-separator]\n/// The selector suffix to use for all generated theme-aware utilities.\n/// @param {?Boolean} $scheme-aware [false]\n/// A flag to enable scheme-aware utility generation.\n/// @param {?string} $scheme-aware-selector-prefix [root-defaults.$utility-scheme-aware-selector-prefix]\n/// The selector base to use for all generated scheme-aware utilities.\n/// @param {?string} $scheme-aware-selector-suffix [root-defaults.$utility-scheme-aware-selector-suffix]\n/// The selector prefix to use for all generated scheme-aware utilities.\n/// @param {?string} $scheme-aware-selector-separator [root-defaults.$utility-scheme-aware-selector-separator]\n/// The selector suffix to use for all generated scheme-aware utilities.\n/// @param {?Boolean} $state-aware [false]\n/// A flag to enable state-aware utility generation.\n/// @param {?string} $state-aware-selector-prefix [root-defaults.$utility-state-aware-selector-prefix]\n/// The selector base to use for all generated state-aware utilities.\n/// @param {?string} $state-aware-selector-suffix [root-defaults.$utility-state-aware-selector-suffix]\n/// The selector prefix to use for all generated state-aware utilities.\n/// @param {?string} $state-aware-selector-separator [root-defaults.$utility-state-aware-selector-separator]\n/// The selector suffix to use for all generated state-aware utilities.\n/// @param {?Boolean} $container-aware [false]\n/// A flag to enable container-aware utility generation.\n/// @param {?string} $container-aware-selector-prefix [root-defaults.$utility-container-aware-selector-prefix]\n/// The selector base to use for all generated container-aware utilities.\n/// @param {?string} $container-aware-selector-suffix [root-defaults.$utility-container-aware-selector-suffix]\n/// The selector prefix to use for all generated container-aware utilities.\n/// @param {?string} $container-aware-selector-separator [root-defaults.$utility-container-aware-selector-separator]\n/// The selector suffix to use for all generated container-aware utilities.\n/// @param {?Boolean} $important [root-defaults.$use-important]\n/// A flag to determine if the important flag should be added to all utility properties.\n@mixin generate(\n $map: (),\n $selector-base: root-defaults.$utility-selector-base,\n $selector-prefix: root-defaults.$utility-selector-prefix,\n $selector-suffix: root-defaults.$utility-selector-suffix,\n $screen-aware: false,\n $screen-aware-selector-prefix:\n root-defaults.$utility-screen-aware-selector-prefix,\n $screen-aware-selector-suffix:\n root-defaults.$utility-screen-aware-selector-suffix,\n $screen-aware-selector-separator:\n root-defaults.$utility-screen-aware-selector-separator,\n $theme-aware: false,\n $theme-aware-selector-prefix:\n root-defaults.$utility-theme-aware-selector-prefix,\n $theme-aware-selector-suffix:\n root-defaults.$utility-theme-aware-selector-suffix,\n $theme-aware-selector-separator:\n root-defaults.$utility-theme-aware-selector-separator,\n $scheme-aware: false,\n $scheme-aware-selector-prefix:\n root-defaults.$utility-scheme-aware-selector-prefix,\n $scheme-aware-selector-suffix:\n root-defaults.$utility-scheme-aware-selector-suffix,\n $scheme-aware-selector-separator:\n root-defaults.$utility-scheme-aware-selector-separator,\n $state-aware: false,\n $state-aware-selector-prefix:\n root-defaults.$utility-state-aware-selector-prefix,\n $state-aware-selector-suffix:\n root-defaults.$utility-state-aware-selector-suffix,\n $state-aware-selector-separator:\n root-defaults.$utility-state-aware-selector-separator,\n $container-aware: false,\n $container-aware-selector-prefix:\n root-defaults.$utility-container-aware-selector-prefix,\n $container-aware-selector-suffix:\n root-defaults.$utility-container-aware-selector-suffix,\n $container-aware-selector-separator:\n root-defaults.$utility-container-aware-selector-separator,\n $important: root-defaults.$use-important\n) {\n $utility-selector-prefix: $selector-base;\n\n // Generate all base utilities.\n @each $selector, $properties in $map {\n $utility-selector: #{$selector-prefix}#{$selector}#{$selector-suffix};\n\n @include create-mapped(\n #{$utility-selector-prefix}#{$utility-selector},\n $properties,\n $important\n ) {\n @content ($selector, $properties, $responsive-name: null, $responsive-type: null);\n }\n }\n\n // Generate screen-aware utilities.\n @if $screen-aware and root-defaults.$screen-aware-utilities {\n @each $screen-name in map.keys(root-defaults.$screen-sizes) {\n // e.g. `.md:` or `.lg:`\n $utility-selector-prefix: #{$selector-base}#{$screen-aware-selector-prefix}#{$screen-name}#{$screen-aware-selector-suffix}#{$screen-aware-selector-separator};\n\n @each $selector, $properties in $map {\n $utility-selector: #{$selector-prefix}#{$selector}#{$selector-suffix};\n\n @include create-mapped(\n #{$utility-selector-prefix}#{$utility-selector},\n $properties,\n $important,\n $screen: $screen-name\n ) {\n @content ($selector, $properties, $responsive-name: $screen-name, $responsive-type: \"screen\");\n }\n }\n }\n }\n\n // Generate theme-aware utilities.\n @if $theme-aware and root-defaults.$theme-aware-utilities {\n @each $theme-name in color-defaults.$themes {\n // e.g. `.default-theme:`\n $utility-selector-prefix: #{$selector-base}#{$theme-aware-selector-prefix}#{$theme-name}#{$theme-aware-selector-suffix}#{$theme-aware-selector-separator};\n\n @each $selector, $properties in $map {\n $utility-selector: #{$selector-prefix}#{$selector}#{$selector-suffix};\n\n @include create-mapped(\n #{$utility-selector-prefix}#{$utility-selector},\n $properties,\n $important,\n $theme: $theme-name\n ) {\n @content ($selector, $properties, $responsive-name: $theme-name, $responsive-type: \"theme\");\n }\n }\n }\n }\n\n // Generate scheme-aware utilities.\n @if $scheme-aware and root-defaults.$scheme-aware-utilities {\n @each $scheme-name in color-defaults.$schemes {\n // e.g. `.light-mode:` or `.dark-mode:`\n $utility-selector-prefix: #{$selector-base}#{$scheme-aware-selector-prefix}#{$scheme-name}#{$scheme-aware-selector-suffix}#{$scheme-aware-selector-separator};\n\n @each $selector, $properties in $map {\n $utility-selector: #{$selector-prefix}#{$selector}#{$selector-suffix};\n\n @include create-mapped(\n #{$utility-selector-prefix}#{$utility-selector},\n $properties,\n $important,\n $scheme: $scheme-name\n ) {\n @content ($selector, $properties, $responsive-name: $scheme-name, $responsive-type: \"scheme\");\n }\n }\n }\n }\n\n // Generate state-aware utilities.\n @if $state-aware and root-defaults.$state-aware-utilities {\n @each $state-name in root-defaults.$state-selectors {\n // e.g. `.hover:` or `.focus:`\n $utility-selector-prefix: #{$selector-base}#{$state-aware-selector-prefix}#{$state-name}#{$state-aware-selector-suffix}#{$state-aware-selector-separator};\n\n @each $selector, $properties in $map {\n $utility-selector: #{$selector-prefix}#{$selector}#{$selector-suffix};\n\n @include create-mapped(\n #{$utility-selector-prefix}#{$utility-selector},\n $properties,\n $important,\n $state: $state-name\n ) {\n @content ($selector, $properties, $responsive-name: $state-name, $responsive-type: \"state\");\n }\n }\n }\n }\n\n // Generate container-aware utilities.\n @if $container-aware and root-defaults.$container-aware-utilities {\n @each $container-name in map.keys(root-defaults.$container-sizes) {\n // e.g. `.cq:md:` or `.cq:lg:`\n $utility-selector-prefix: #{$selector-base}#{$container-aware-selector-prefix}#{$container-name}#{$container-aware-selector-suffix}#{$container-aware-selector-separator};\n\n @each $selector, $properties in $map {\n $utility-selector: #{$selector-prefix}#{$selector}#{$selector-suffix};\n\n @include create-mapped(\n #{$utility-selector-prefix}#{$utility-selector},\n $properties,\n $important,\n $container: $container-name\n ) {\n @content ($selector, $properties, $responsive-name: $container-name, $responsive-type: \"container\");\n }\n }\n }\n }\n}\n"],"names":[]}