@graupl/graupl 1.0.0-beta.23 → 1.0.0-beta.25

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 (206) hide show
  1. package/dist/css/base/button.css +2 -2
  2. package/dist/css/base/button.css.map +1 -1
  3. package/dist/css/base/form.css +2 -2
  4. package/dist/css/base/form.css.map +1 -1
  5. package/dist/css/base/link.css +2 -2
  6. package/dist/css/base/link.css.map +1 -1
  7. package/dist/css/base/table.css +2 -2
  8. package/dist/css/base/table.css.map +1 -1
  9. package/dist/css/base.css +2 -2
  10. package/dist/css/base.css.map +1 -1
  11. package/dist/css/component/accordion.css +2 -5
  12. package/dist/css/component/accordion.css.map +1 -1
  13. package/dist/css/component/alert.css +2 -2
  14. package/dist/css/component/alert.css.map +1 -1
  15. package/dist/css/component/badge.css +2 -2
  16. package/dist/css/component/badge.css.map +1 -1
  17. package/dist/css/component/card.css +2 -2
  18. package/dist/css/component/card.css.map +1 -1
  19. package/dist/css/component/carousel.css +2 -2
  20. package/dist/css/component/carousel.css.map +1 -1
  21. package/dist/css/component/disclosure.css +2 -2
  22. package/dist/css/component/disclosure.css.map +1 -1
  23. package/dist/css/component/input-group.css +2 -2
  24. package/dist/css/component/input-group.css.map +1 -1
  25. package/dist/css/component/list.css +2 -2
  26. package/dist/css/component/list.css.map +1 -1
  27. package/dist/css/component/menu.css +2 -2
  28. package/dist/css/component/menu.css.map +1 -1
  29. package/dist/css/component/navigation.css +2 -2
  30. package/dist/css/component/navigation.css.map +1 -1
  31. package/dist/css/component.css +2 -5
  32. package/dist/css/component.css.map +1 -1
  33. package/dist/css/graupl.css +2 -5
  34. package/dist/css/graupl.css.map +1 -1
  35. package/dist/css/init.css +2 -2
  36. package/dist/css/init.css.map +1 -1
  37. package/dist/css/layout/columns.css +2 -2
  38. package/dist/css/layout/columns.css.map +1 -1
  39. package/dist/css/layout/container.css +2 -2
  40. package/dist/css/layout/container.css.map +1 -1
  41. package/dist/css/layout/flex-columns.css +2 -2
  42. package/dist/css/layout/flex-columns.css.map +1 -1
  43. package/dist/css/layout.css +2 -5
  44. package/dist/css/layout.css.map +1 -1
  45. package/dist/css/normalize.css +2 -2
  46. package/dist/css/normalize.css.map +1 -1
  47. package/dist/css/state/focus.css +2 -2
  48. package/dist/css/state/focus.css.map +1 -1
  49. package/dist/css/state.css +2 -2
  50. package/dist/css/state.css.map +1 -1
  51. package/dist/css/theme/color.css +2 -2
  52. package/dist/css/theme/color.css.map +1 -1
  53. package/dist/css/theme/typography.css +2 -2
  54. package/dist/css/theme/typography.css.map +1 -1
  55. package/dist/css/theme.css +2 -2
  56. package/dist/css/theme.css.map +1 -1
  57. package/dist/css/utilities/alignment.css +1 -1
  58. package/dist/css/utilities/alignment.css.map +1 -1
  59. package/dist/css/utilities/background.css +2 -2
  60. package/dist/css/utilities/background.css.map +1 -1
  61. package/dist/css/utilities/border.css +2 -2
  62. package/dist/css/utilities/border.css.map +1 -1
  63. package/dist/css/utilities/color.css +2 -2
  64. package/dist/css/utilities/color.css.map +1 -1
  65. package/dist/css/utilities/container.css +1 -1
  66. package/dist/css/utilities/container.css.map +1 -1
  67. package/dist/css/utilities/display.css +2 -2
  68. package/dist/css/utilities/display.css.map +1 -1
  69. package/dist/css/utilities/flex.css +2 -2
  70. package/dist/css/utilities/flex.css.map +1 -1
  71. package/dist/css/utilities/gradient.css +2 -2
  72. package/dist/css/utilities/gradient.css.map +1 -1
  73. package/dist/css/utilities/height.css +2 -2
  74. package/dist/css/utilities/height.css.map +1 -1
  75. package/dist/css/utilities/inset.css +2 -2
  76. package/dist/css/utilities/inset.css.map +1 -1
  77. package/dist/css/utilities/justification.css +1 -1
  78. package/dist/css/utilities/justification.css.map +1 -1
  79. package/dist/css/utilities/list.css +1 -1
  80. package/dist/css/utilities/list.css.map +1 -1
  81. package/dist/css/utilities/order.css +2 -2
  82. package/dist/css/utilities/order.css.map +1 -1
  83. package/dist/css/utilities/position.css +2 -2
  84. package/dist/css/utilities/position.css.map +1 -1
  85. package/dist/css/utilities/ratio.css +2 -2
  86. package/dist/css/utilities/ratio.css.map +1 -1
  87. package/dist/css/utilities/spacing.css +2 -2
  88. package/dist/css/utilities/spacing.css.map +1 -1
  89. package/dist/css/utilities/typography.css +2 -2
  90. package/dist/css/utilities/typography.css.map +1 -1
  91. package/dist/css/utilities/visibility.css +2 -2
  92. package/dist/css/utilities/visibility.css.map +1 -1
  93. package/dist/css/utilities/visually-hidden.css +2 -2
  94. package/dist/css/utilities/visually-hidden.css.map +1 -1
  95. package/dist/css/utilities/width.css +2 -2
  96. package/dist/css/utilities/width.css.map +1 -1
  97. package/dist/css/utilities/z-index.css +1 -1
  98. package/dist/css/utilities/z-index.css.map +1 -1
  99. package/dist/css/utilities.css +2 -2
  100. package/dist/css/utilities.css.map +1 -1
  101. package/dist/js/accordion.js.map +1 -1
  102. package/dist/js/alert.js.map +1 -1
  103. package/dist/js/carousel.js.map +1 -1
  104. package/dist/js/component/accordion.cjs.js.map +1 -1
  105. package/dist/js/component/accordion.es.js.map +1 -1
  106. package/dist/js/component/accordion.iife.js.map +1 -1
  107. package/dist/js/component/alert.cjs.js.map +1 -1
  108. package/dist/js/component/alert.es.js.map +1 -1
  109. package/dist/js/component/alert.iife.js.map +1 -1
  110. package/dist/js/component/carousel.cjs.js.map +1 -1
  111. package/dist/js/component/carousel.es.js.map +1 -1
  112. package/dist/js/component/carousel.iife.js.map +1 -1
  113. package/dist/js/component/disclosure.cjs.js +2 -2
  114. package/dist/js/component/disclosure.cjs.js.map +1 -1
  115. package/dist/js/component/disclosure.es.js +2 -2
  116. package/dist/js/component/disclosure.es.js.map +1 -1
  117. package/dist/js/component/disclosure.iife.js +2 -2
  118. package/dist/js/component/disclosure.iife.js.map +1 -1
  119. package/dist/js/component/tabs.cjs.js +5 -0
  120. package/dist/js/component/tabs.cjs.js.map +1 -0
  121. package/dist/js/component/tabs.es.js +5 -0
  122. package/dist/js/component/tabs.es.js.map +1 -0
  123. package/dist/js/component/tabs.iife.js +5 -0
  124. package/dist/js/component/tabs.iife.js.map +1 -0
  125. package/dist/js/disclosure.js +2 -2
  126. package/dist/js/disclosure.js.map +1 -1
  127. package/dist/js/generator/accordion.cjs.js.map +1 -1
  128. package/dist/js/generator/accordion.es.js.map +1 -1
  129. package/dist/js/generator/accordion.iife.js.map +1 -1
  130. package/dist/js/generator/alert.cjs.js.map +1 -1
  131. package/dist/js/generator/alert.es.js.map +1 -1
  132. package/dist/js/generator/alert.iife.js.map +1 -1
  133. package/dist/js/generator/carousel.cjs.js.map +1 -1
  134. package/dist/js/generator/carousel.es.js.map +1 -1
  135. package/dist/js/generator/carousel.iife.js.map +1 -1
  136. package/dist/js/generator/disclosure.cjs.js +2 -2
  137. package/dist/js/generator/disclosure.cjs.js.map +1 -1
  138. package/dist/js/generator/disclosure.es.js +2 -2
  139. package/dist/js/generator/disclosure.es.js.map +1 -1
  140. package/dist/js/generator/disclosure.iife.js +2 -2
  141. package/dist/js/generator/disclosure.iife.js.map +1 -1
  142. package/dist/js/generator/navigation.cjs.js.map +1 -1
  143. package/dist/js/generator/navigation.es.js.map +1 -1
  144. package/dist/js/generator/navigation.iife.js.map +1 -1
  145. package/dist/js/generator/tabs.cjs.js +5 -0
  146. package/dist/js/generator/tabs.cjs.js.map +1 -0
  147. package/dist/js/generator/tabs.es.js +5 -0
  148. package/dist/js/generator/tabs.es.js.map +1 -0
  149. package/dist/js/generator/tabs.iife.js +5 -0
  150. package/dist/js/generator/tabs.iife.js.map +1 -0
  151. package/dist/js/graupl.js +5 -5
  152. package/dist/js/graupl.js.map +1 -1
  153. package/dist/js/navigation.js.map +1 -1
  154. package/dist/js/tabs.js +5 -0
  155. package/dist/js/tabs.js.map +1 -0
  156. package/package.json +6 -11
  157. package/scss/base/button.scss +1 -1
  158. package/scss/base/form.scss +1 -1
  159. package/scss/base/link.scss +1 -1
  160. package/scss/base/table.scss +1 -1
  161. package/scss/base.scss +1 -1
  162. package/scss/component/accordion.scss +1 -1
  163. package/scss/component/alert.scss +1 -1
  164. package/scss/component/badge.scss +1 -1
  165. package/scss/component/card.scss +1 -1
  166. package/scss/component/carousel.scss +1 -1
  167. package/scss/component/disclosure.scss +1 -1
  168. package/scss/component/input-group.scss +1 -1
  169. package/scss/component/list.scss +1 -1
  170. package/scss/component/menu.scss +1 -1
  171. package/scss/component/navigation.scss +1 -1
  172. package/scss/component.scss +1 -1
  173. package/scss/graupl.scss +1 -1
  174. package/scss/init.scss +1 -1
  175. package/scss/layout/columns.scss +1 -1
  176. package/scss/layout/container.scss +1 -1
  177. package/scss/layout/flex-columns.scss +1 -1
  178. package/scss/layout.scss +1 -1
  179. package/scss/normalize.scss +1 -1
  180. package/scss/state/focus.scss +1 -1
  181. package/scss/state.scss +1 -1
  182. package/scss/theme/color.scss +1 -1
  183. package/scss/theme/typography.scss +1 -1
  184. package/scss/theme.scss +1 -1
  185. package/scss/utilities/alignment.scss +1 -1
  186. package/scss/utilities/background.scss +1 -1
  187. package/scss/utilities/border.scss +1 -1
  188. package/scss/utilities/color.scss +1 -1
  189. package/scss/utilities/container.scss +1 -1
  190. package/scss/utilities/display.scss +1 -1
  191. package/scss/utilities/flex.scss +1 -1
  192. package/scss/utilities/gradient.scss +1 -1
  193. package/scss/utilities/height.scss +1 -1
  194. package/scss/utilities/inset.scss +1 -1
  195. package/scss/utilities/justification.scss +1 -1
  196. package/scss/utilities/list.scss +1 -1
  197. package/scss/utilities/order.scss +1 -1
  198. package/scss/utilities/position.scss +1 -1
  199. package/scss/utilities/ratio.scss +1 -1
  200. package/scss/utilities/spacing.scss +1 -1
  201. package/scss/utilities/typography.scss +1 -1
  202. package/scss/utilities/visibility.scss +1 -1
  203. package/scss/utilities/visually-hidden.scss +1 -1
  204. package/scss/utilities/width.scss +1 -1
  205. package/scss/utilities/z-index.scss +1 -1
  206. package/scss/utilities.scss +1 -1
package/dist/css/base/form.css CHANGED
@@ -1,2 +1,2 @@
1
- @layer graupl.base{input,select,textarea{border-radius:var(--graupl-input-border-radius,var(--graupl-input-border-top-left-radius,var(--graupl-border-top-left-radius,var(--graupl-border-radius,.125rem))) var(--graupl-input-border-top-right-radius,var(--graupl-border-top-right-radius,var(--graupl-border-radius,.125rem))) var(--graupl-input-border-bottom-right-radius,var(--graupl-border-bottom-right-radius,var(--graupl-border-radius,.125rem))) var(--graupl-input-border-bottom-left-radius,var(--graupl-border-bottom-left-radius,var(--graupl-border-radius,.125rem))));border-style:var(--graupl-input-border-style,var(--graupl-input-border-top-style,var(--graupl-border-top-style,var(--graupl-border-style,solid))) var(--graupl-input-border-right-style,var(--graupl-border-right-style,var(--graupl-border-style,solid))) var(--graupl-input-border-bottom-style,var(--graupl-border-bottom-style,var(--graupl-border-style,solid))) var(--graupl-input-border-left-style,var(--graupl-border-left-style,var(--graupl-border-style,solid))));border-width:var(--graupl-input-border-width,var(--graupl-input-border-top-width,var(--graupl-border-top-width,var(--graupl-border-width,.125rem))) var(--graupl-input-border-right-width,var(--graupl-border-right-width,var(--graupl-border-width,.125rem))) var(--graupl-input-border-bottom-width,var(--graupl-border-bottom-width,var(--graupl-border-width,.125rem))) var(--graupl-input-border-left-width,var(--graupl-border-left-width,var(--graupl-border-width,.125rem))));font-size:var(--graupl-input-font-size,var(--graupl-font-base,calc(var(--graupl-font-size-base, 1rem)*1)));padding:var(--graupl-input-padding,var(--graupl-input-padding-y,var(--graupl-spacer-3,calc(var(--graupl-spacer, 1rem)*.5))) var(--graupl-input-padding-x,var(--graupl-spacer-5,calc(var(--graupl-spacer, 1rem)*1))))}input.disabled,input:disabled,input[aria-disabled=true],input[disabled],select.disabled,select:disabled,select[aria-disabled=true],select[disabled],textarea.disabled,textarea:disabled,textarea[aria-disabled=true],textarea[disabled]{cursor:not-allowed}label{font-size:var(--graupl-label-font-size,var(--graupl-input-font-size,var(--graupl-font-base,calc(var(--graupl-font-size-base, 1rem)*1))))}fieldset{border-radius:var(--graupl-fieldset-border-radius,var(--graupl-fieldset-border-top-left-radius,var(--graupl-input-border-top-left-radius,var(--graupl-border-top-left-radius,var(--graupl-border-radius,.125rem)))) var(--graupl-fieldset-border-top-right-radius,var(--graupl-input-border-top-right-radius,var(--graupl-border-top-right-radius,var(--graupl-border-radius,.125rem)))) var(--graupl-fieldset-border-bottom-right-radius,var(--graupl-input-border-bottom-right-radius,var(--graupl-border-bottom-right-radius,var(--graupl-border-radius,.125rem)))) var(--graupl-fieldset-border-bottom-left-radius,var(--graupl-input-border-bottom-left-radius,var(--graupl-border-bottom-left-radius,var(--graupl-border-radius,.125rem)))));border-style:var(--graupl-fieldset-border-style,var(--graupl-fieldset-border-top-style,var(--graupl-input-border-top-style,var(--graupl-border-top-style,var(--graupl-border-style,solid)))) var(--graupl-fieldset-border-right-style,var(--graupl-input-border-right-style,var(--graupl-border-right-style,var(--graupl-border-style,solid)))) var(--graupl-fieldset-border-bottom-style,var(--graupl-input-border-bottom-style,var(--graupl-border-bottom-style,var(--graupl-border-style,solid)))) var(--graupl-fieldset-border-left-style,var(--graupl-input-border-left-style,var(--graupl-border-left-style,var(--graupl-border-style,solid)))));border-width:var(--graupl-fieldset-border-width,var(--graupl-fieldset-border-top-width,var(--graupl-input-border-top-width,var(--graupl-border-top-width,var(--graupl-border-width,.125rem)))) var(--graupl-fieldset-border-right-width,var(--graupl-input-border-right-width,var(--graupl-border-right-width,var(--graupl-border-width,.125rem)))) var(--graupl-fieldset-border-bottom-width,var(--graupl-input-border-bottom-width,var(--graupl-border-bottom-width,var(--graupl-border-width,.125rem)))) var(--graupl-fieldset-border-left-width,var(--graupl-input-border-left-width,var(--graupl-border-left-width,var(--graupl-border-width,.125rem)))));display:flex;flex-flow:var(--graupl-fieldset-direction,column) wrap;font-size:var(--graupl-fieldset-font-size,var(--graupl-input-font-size,var(--graupl-font-base,calc(var(--graupl-font-size-base, 1rem)*1))));gap:var(--graupl-fieldset-gap,var(--graupl-spacer-2,calc(var(--graupl-spacer, 1rem)*.25)));padding:var(--graupl-fieldset-padding,var(--graupl-fieldset-padding-y,var(--graupl-input-padding-y,var(--graupl-spacer-3,calc(var(--graupl-spacer, 1rem)*.5)))) var(--graupl-fieldset-padding-x,var(--graupl-input-padding-x,var(--graupl-spacer-5,calc(var(--graupl-spacer, 1rem)*1)))))}fieldset.disabled input,fieldset.disabled select,fieldset.disabled textarea,fieldset:disabled input,fieldset:disabled select,fieldset:disabled textarea,fieldset[aria-disabled=true] input,fieldset[aria-disabled=true] select,fieldset[aria-disabled=true] textarea,fieldset[disabled] input,fieldset[disabled] select,fieldset[disabled] textarea{cursor:not-allowed}}@layer graupl.theme{input,select,textarea{accent-color:var(--graupl-input-accent-color,var(--graupl-input-color,var(--graupl-color,var(--graupl-root-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233)))))));background:var(--graupl-input-background,var(--graupl-background,var(--graupl-root-background,var(--graupl-theme-active--primary--100,var(--graupl-theme-light--primary--100,var(--graupl-primary--100,#e6eeff))))));border-color:var(--graupl-input-border-color,var(--graupl-border-color,var(--graupl-color,var(--graupl-root-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233)))))));color:var(--graupl-input-color,var(--graupl-color,var(--graupl-root-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233))))))}input::-moz-placeholder,select::-moz-placeholder,textarea::-moz-placeholder{color:var(--graupl-input-placeholder-color,var(--graupl-theme-active--secondary--600,var(--graupl-theme-light--secondary--600,var(--graupl-secondary--600,#626484))))}input::placeholder,select::placeholder,textarea::placeholder{color:var(--graupl-input-placeholder-color,var(--graupl-theme-active--secondary--600,var(--graupl-theme-light--secondary--600,var(--graupl-secondary--600,#626484))))}input:disabled,select:disabled,textarea:disabled{border-color:var(--graupl-input-disabled-border-color,var(--graupl-theme-active--secondary--200,var(--graupl-theme-light--secondary--200,var(--graupl-secondary--200,#bdbfdb))));color:var(--graupl-input-disabled-color,var(--graupl-theme-active--secondary--400,var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d))))}input:disabled::-moz-placeholder,select:disabled::-moz-placeholder,textarea:disabled::-moz-placeholder{color:var(--graupl-input-placeholder-disabled-color,var(--graupl-input-disabled-color,var(--graupl-theme-active--secondary--400,var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d)))))}input:disabled::placeholder,select:disabled::placeholder,textarea:disabled::placeholder{color:var(--graupl-input-placeholder-disabled-color,var(--graupl-input-disabled-color,var(--graupl-theme-active--secondary--400,var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d)))))}input[disabled],select[disabled],textarea[disabled]{border-color:var(--graupl-input-disabled-border-color,var(--graupl-theme-active--secondary--200,var(--graupl-theme-light--secondary--200,var(--graupl-secondary--200,#bdbfdb))));color:var(--graupl-input-disabled-color,var(--graupl-theme-active--secondary--400,var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d))))}input[disabled]::-moz-placeholder,select[disabled]::-moz-placeholder,textarea[disabled]::-moz-placeholder{color:var(--graupl-input-placeholder-disabled-color,var(--graupl-input-disabled-color,var(--graupl-theme-active--secondary--400,var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d)))))}input[disabled]::placeholder,select[disabled]::placeholder,textarea[disabled]::placeholder{color:var(--graupl-input-placeholder-disabled-color,var(--graupl-input-disabled-color,var(--graupl-theme-active--secondary--400,var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d)))))}input[aria-disabled=true],select[aria-disabled=true],textarea[aria-disabled=true]{border-color:var(--graupl-input-disabled-border-color,var(--graupl-theme-active--secondary--200,var(--graupl-theme-light--secondary--200,var(--graupl-secondary--200,#bdbfdb))));color:var(--graupl-input-disabled-color,var(--graupl-theme-active--secondary--400,var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d))))}input[aria-disabled=true]::-moz-placeholder,select[aria-disabled=true]::-moz-placeholder,textarea[aria-disabled=true]::-moz-placeholder{color:var(--graupl-input-placeholder-disabled-color,var(--graupl-input-disabled-color,var(--graupl-theme-active--secondary--400,var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d)))))}input[aria-disabled=true]::placeholder,select[aria-disabled=true]::placeholder,textarea[aria-disabled=true]::placeholder{color:var(--graupl-input-placeholder-disabled-color,var(--graupl-input-disabled-color,var(--graupl-theme-active--secondary--400,var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d)))))}input.disabled,select.disabled,textarea.disabled{border-color:var(--graupl-input-disabled-border-color,var(--graupl-theme-active--secondary--200,var(--graupl-theme-light--secondary--200,var(--graupl-secondary--200,#bdbfdb))));color:var(--graupl-input-disabled-color,var(--graupl-theme-active--secondary--400,var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d))))}input.disabled::-moz-placeholder,select.disabled::-moz-placeholder,textarea.disabled::-moz-placeholder{color:var(--graupl-input-placeholder-disabled-color,var(--graupl-input-disabled-color,var(--graupl-theme-active--secondary--400,var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d)))))}input.disabled::placeholder,select.disabled::placeholder,textarea.disabled::placeholder{color:var(--graupl-input-placeholder-disabled-color,var(--graupl-input-disabled-color,var(--graupl-theme-active--secondary--400,var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d)))))}label{color:var(--graupl-label-color,var(--graupl-input-color,var(--graupl-color,var(--graupl-root-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233)))))))}label:has(+input:disabled,+textarea:disabled,+select:disabled){color:var(--graupl-label-disabled-color,var(--graupl-input-disabled-color,var(--graupl-theme-active--secondary--400,var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d)))))}label:has(+input[disabled],+textarea[disabled],+select[disabled]){color:var(--graupl-label-disabled-color,var(--graupl-input-disabled-color,var(--graupl-theme-active--secondary--400,var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d)))))}label:has(+input[aria-disabled=true],+textarea[aria-disabled=true],+select[aria-disabled=true]){color:var(--graupl-label-disabled-color,var(--graupl-input-disabled-color,var(--graupl-theme-active--secondary--400,var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d)))))}label:has(+input.disabled,+textarea.disabled,+select.disabled){color:var(--graupl-label-disabled-color,var(--graupl-input-disabled-color,var(--graupl-theme-active--secondary--400,var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d)))))}fieldset{background:var(--graupl-fieldset-background,var(--graupl-input-background,var(--graupl-background,var(--graupl-root-background,var(--graupl-theme-active--primary--100,var(--graupl-theme-light--primary--100,var(--graupl-primary--100,#e6eeff)))))));border-color:var(--graupl-fieldset-border-color,var(--graupl-input-border-color,var(--graupl-border-color,var(--graupl-color,var(--graupl-root-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233))))))));color:var(--graupl-fieldset-color,var(--graupl-input-color,var(--graupl-color,var(--graupl-root-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233)))))))}fieldset:disabled{border-color:var(--graupl-fieldset-disabled-border-color,var(--graupl-input-disabled-border-color,var(--graupl-theme-active--secondary--200,var(--graupl-theme-light--secondary--200,var(--graupl-secondary--200,#bdbfdb)))));color:var(--graupl-fieldset-disabled-color,var(--graupl-input-disabled-color,var(--graupl-theme-active--secondary--400,var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d)))))}fieldset:disabled label{color:var(--graupl-label-disabled-color,var(--graupl-input-disabled-color,var(--graupl-theme-active--secondary--400,var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d)))))}fieldset[disabled]{border-color:var(--graupl-fieldset-disabled-border-color,var(--graupl-input-disabled-border-color,var(--graupl-theme-active--secondary--200,var(--graupl-theme-light--secondary--200,var(--graupl-secondary--200,#bdbfdb)))));color:var(--graupl-fieldset-disabled-color,var(--graupl-input-disabled-color,var(--graupl-theme-active--secondary--400,var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d)))))}fieldset[disabled] label{color:var(--graupl-label-disabled-color,var(--graupl-input-disabled-color,var(--graupl-theme-active--secondary--400,var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d)))))}fieldset[aria-disabled=true]{border-color:var(--graupl-fieldset-disabled-border-color,var(--graupl-input-disabled-border-color,var(--graupl-theme-active--secondary--200,var(--graupl-theme-light--secondary--200,var(--graupl-secondary--200,#bdbfdb)))));color:var(--graupl-fieldset-disabled-color,var(--graupl-input-disabled-color,var(--graupl-theme-active--secondary--400,var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d)))))}fieldset[aria-disabled=true] label{color:var(--graupl-label-disabled-color,var(--graupl-input-disabled-color,var(--graupl-theme-active--secondary--400,var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d)))))}fieldset.disabled{border-color:var(--graupl-fieldset-disabled-border-color,var(--graupl-input-disabled-border-color,var(--graupl-theme-active--secondary--200,var(--graupl-theme-light--secondary--200,var(--graupl-secondary--200,#bdbfdb)))));color:var(--graupl-fieldset-disabled-color,var(--graupl-input-disabled-color,var(--graupl-theme-active--secondary--400,var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d)))))}fieldset.disabled label{color:var(--graupl-label-disabled-color,var(--graupl-input-disabled-color,var(--graupl-theme-active--secondary--400,var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d)))))}}
2
- /*# sourceMappingURL=form.css.map */
1
+ @layer graupl.base{input,textarea,select{padding:var(--graupl-input-padding,var(--graupl-input-padding-y,var(--graupl-spacer-3,calc(.5*var(--graupl-spacer,1rem))))var(--graupl-input-padding-x,var(--graupl-spacer-5,calc(1*var(--graupl-spacer,1rem)))));border-width:var(--graupl-input-border-width,var(--graupl-input-border-top-width,var(--graupl-border-top-width,var(--graupl-border-width,.125rem)))var(--graupl-input-border-right-width,var(--graupl-border-right-width,var(--graupl-border-width,.125rem)))var(--graupl-input-border-bottom-width,var(--graupl-border-bottom-width,var(--graupl-border-width,.125rem)))var(--graupl-input-border-left-width,var(--graupl-border-left-width,var(--graupl-border-width,.125rem))));border-style:var(--graupl-input-border-style,var(--graupl-input-border-top-style,var(--graupl-border-top-style,var(--graupl-border-style,solid)))var(--graupl-input-border-right-style,var(--graupl-border-right-style,var(--graupl-border-style,solid)))var(--graupl-input-border-bottom-style,var(--graupl-border-bottom-style,var(--graupl-border-style,solid)))var(--graupl-input-border-left-style,var(--graupl-border-left-style,var(--graupl-border-style,solid))));border-radius:var(--graupl-input-border-radius,var(--graupl-input-border-top-left-radius,var(--graupl-border-top-left-radius,var(--graupl-border-radius,.125rem)))var(--graupl-input-border-top-right-radius,var(--graupl-border-top-right-radius,var(--graupl-border-radius,.125rem)))var(--graupl-input-border-bottom-right-radius,var(--graupl-border-bottom-right-radius,var(--graupl-border-radius,.125rem)))var(--graupl-input-border-bottom-left-radius,var(--graupl-border-bottom-left-radius,var(--graupl-border-radius,.125rem))));font-size:var(--graupl-input-font-size,var(--graupl-font-base,calc(1*var(--graupl-font-size-base,1rem))))}input:disabled,textarea:disabled,select:disabled,input[disabled],textarea[disabled],select[disabled],input[aria-disabled=true],textarea[aria-disabled=true],select[aria-disabled=true],input.disabled,textarea.disabled,select.disabled{cursor:not-allowed}label{font-size:var(--graupl-label-font-size,var(--graupl-input-font-size,var(--graupl-font-base,calc(1*var(--graupl-font-size-base,1rem)))))}fieldset{flex-flow:var(--graupl-fieldset-direction,column)wrap;gap:var(--graupl-fieldset-gap,var(--graupl-spacer-2,calc(.25*var(--graupl-spacer,1rem))));padding:var(--graupl-fieldset-padding,var(--graupl-fieldset-padding-y,var(--graupl-input-padding-y,var(--graupl-spacer-3,calc(.5*var(--graupl-spacer,1rem)))))var(--graupl-fieldset-padding-x,var(--graupl-input-padding-x,var(--graupl-spacer-5,calc(1*var(--graupl-spacer,1rem))))));border-width:var(--graupl-fieldset-border-width,var(--graupl-fieldset-border-top-width,var(--graupl-input-border-top-width,var(--graupl-border-top-width,var(--graupl-border-width,.125rem))))var(--graupl-fieldset-border-right-width,var(--graupl-input-border-right-width,var(--graupl-border-right-width,var(--graupl-border-width,.125rem))))var(--graupl-fieldset-border-bottom-width,var(--graupl-input-border-bottom-width,var(--graupl-border-bottom-width,var(--graupl-border-width,.125rem))))var(--graupl-fieldset-border-left-width,var(--graupl-input-border-left-width,var(--graupl-border-left-width,var(--graupl-border-width,.125rem)))));border-style:var(--graupl-fieldset-border-style,var(--graupl-fieldset-border-top-style,var(--graupl-input-border-top-style,var(--graupl-border-top-style,var(--graupl-border-style,solid))))var(--graupl-fieldset-border-right-style,var(--graupl-input-border-right-style,var(--graupl-border-right-style,var(--graupl-border-style,solid))))var(--graupl-fieldset-border-bottom-style,var(--graupl-input-border-bottom-style,var(--graupl-border-bottom-style,var(--graupl-border-style,solid))))var(--graupl-fieldset-border-left-style,var(--graupl-input-border-left-style,var(--graupl-border-left-style,var(--graupl-border-style,solid)))));border-radius:var(--graupl-fieldset-border-radius,var(--graupl-fieldset-border-top-left-radius,var(--graupl-input-border-top-left-radius,var(--graupl-border-top-left-radius,var(--graupl-border-radius,.125rem))))var(--graupl-fieldset-border-top-right-radius,var(--graupl-input-border-top-right-radius,var(--graupl-border-top-right-radius,var(--graupl-border-radius,.125rem))))var(--graupl-fieldset-border-bottom-right-radius,var(--graupl-input-border-bottom-right-radius,var(--graupl-border-bottom-right-radius,var(--graupl-border-radius,.125rem))))var(--graupl-fieldset-border-bottom-left-radius,var(--graupl-input-border-bottom-left-radius,var(--graupl-border-bottom-left-radius,var(--graupl-border-radius,.125rem)))));font-size:var(--graupl-fieldset-font-size,var(--graupl-input-font-size,var(--graupl-font-base,calc(1*var(--graupl-font-size-base,1rem)))));display:flex}fieldset:disabled input,fieldset:disabled textarea,fieldset:disabled select,fieldset[disabled] input,fieldset[disabled] textarea,fieldset[disabled] select,fieldset[aria-disabled=true] input,fieldset[aria-disabled=true] textarea,fieldset[aria-disabled=true] select,fieldset.disabled input,fieldset.disabled textarea,fieldset.disabled select{cursor:not-allowed}}@layer graupl.theme{input,textarea,select{border-color:var(--graupl-input-border-color,var(--graupl-border-color,var(--graupl-color,var(--graupl-root-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233)))))));background:var(--graupl-input-background,var(--graupl-background,var(--graupl-root-background,var(--graupl-theme-active--primary--100,var(--graupl-theme-light--primary--100,var(--graupl-primary--100,#e6eeff))))));color:var(--graupl-input-color,var(--graupl-color,var(--graupl-root-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233))))));accent-color:var(--graupl-input-accent-color,var(--graupl-input-color,var(--graupl-color,var(--graupl-root-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233)))))))}input::placeholder,textarea::placeholder,select::placeholder{color:var(--graupl-input-placeholder-color,var(--graupl-theme-active--secondary--600,var(--graupl-theme-light--secondary--600,var(--graupl-secondary--600,#626484))))}input:disabled,textarea:disabled,select:disabled{border-color:var(--graupl-input-disabled-border-color,var(--graupl-theme-active--secondary--200,var(--graupl-theme-light--secondary--200,var(--graupl-secondary--200,#bdbfdb))));color:var(--graupl-input-disabled-color,var(--graupl-theme-active--secondary--400,var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d))))}input:disabled::placeholder,textarea:disabled::placeholder,select:disabled::placeholder{color:var(--graupl-input-placeholder-disabled-color,var(--graupl-input-disabled-color,var(--graupl-theme-active--secondary--400,var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d)))))}input[disabled],textarea[disabled],select[disabled]{border-color:var(--graupl-input-disabled-border-color,var(--graupl-theme-active--secondary--200,var(--graupl-theme-light--secondary--200,var(--graupl-secondary--200,#bdbfdb))));color:var(--graupl-input-disabled-color,var(--graupl-theme-active--secondary--400,var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d))))}input[disabled]::placeholder,textarea[disabled]::placeholder,select[disabled]::placeholder{color:var(--graupl-input-placeholder-disabled-color,var(--graupl-input-disabled-color,var(--graupl-theme-active--secondary--400,var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d)))))}input[aria-disabled=true],textarea[aria-disabled=true],select[aria-disabled=true]{border-color:var(--graupl-input-disabled-border-color,var(--graupl-theme-active--secondary--200,var(--graupl-theme-light--secondary--200,var(--graupl-secondary--200,#bdbfdb))));color:var(--graupl-input-disabled-color,var(--graupl-theme-active--secondary--400,var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d))))}input[aria-disabled=true]::placeholder,textarea[aria-disabled=true]::placeholder,select[aria-disabled=true]::placeholder{color:var(--graupl-input-placeholder-disabled-color,var(--graupl-input-disabled-color,var(--graupl-theme-active--secondary--400,var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d)))))}input.disabled,textarea.disabled,select.disabled{border-color:var(--graupl-input-disabled-border-color,var(--graupl-theme-active--secondary--200,var(--graupl-theme-light--secondary--200,var(--graupl-secondary--200,#bdbfdb))));color:var(--graupl-input-disabled-color,var(--graupl-theme-active--secondary--400,var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d))))}input.disabled::placeholder,textarea.disabled::placeholder,select.disabled::placeholder{color:var(--graupl-input-placeholder-disabled-color,var(--graupl-input-disabled-color,var(--graupl-theme-active--secondary--400,var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d)))))}input.primary,textarea.primary,select.primary{--graupl-input-color:var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233)));--graupl-input-background:var(--graupl-theme-active--primary--100,var(--graupl-theme-light--primary--100,var(--graupl-primary--100,#e6eeff)));--graupl-input-border-color:var(--graupl-theme-active--primary--700,var(--graupl-theme-light--primary--700,var(--graupl-primary--700,#1244a1)));--graupl-input-placeholder-color:var(--graupl-theme-active--primary--600,var(--graupl-theme-light--primary--600,var(--graupl-primary--600,#1d59c9)));--graupl-input-disabled-color:var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa)));--graupl-input-disabled-border-color:var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa)))}input.secondary,textarea.secondary,select.secondary{--graupl-input-color:var(--graupl-theme-active--secondary--900,var(--graupl-theme-light--secondary--900,var(--graupl-secondary--900,#0f1124)));--graupl-input-background:var(--graupl-theme-active--secondary--100,var(--graupl-theme-light--secondary--100,var(--graupl-secondary--100,#edeef7)));--graupl-input-border-color:var(--graupl-theme-active--secondary--700,var(--graupl-theme-light--secondary--700,var(--graupl-secondary--700,#474a6b)));--graupl-input-placeholder-color:var(--graupl-theme-active--secondary--600,var(--graupl-theme-light--secondary--600,var(--graupl-secondary--600,#626484)));--graupl-input-disabled-color:var(--graupl-theme-active--secondary--200,var(--graupl-theme-light--secondary--200,var(--graupl-secondary--200,#bdbfdb)));--graupl-input-disabled-border-color:var(--graupl-theme-active--secondary--200,var(--graupl-theme-light--secondary--200,var(--graupl-secondary--200,#bdbfdb)))}input.tertiary,textarea.tertiary,select.tertiary{--graupl-input-color:var(--graupl-theme-active--tertiary--900,var(--graupl-theme-light--tertiary--900,var(--graupl-tertiary--900,#2f0412)));--graupl-input-background:var(--graupl-theme-active--tertiary--100,var(--graupl-theme-light--tertiary--100,var(--graupl-tertiary--100,#fde7ef)));--graupl-input-border-color:var(--graupl-theme-active--tertiary--700,var(--graupl-theme-light--tertiary--700,var(--graupl-tertiary--700,#931f46)));--graupl-input-placeholder-color:var(--graupl-theme-active--tertiary--600,var(--graupl-theme-light--tertiary--600,var(--graupl-tertiary--600,#b82e5c)));--graupl-input-disabled-color:var(--graupl-theme-active--tertiary--200,var(--graupl-theme-light--tertiary--200,var(--graupl-tertiary--200,#f2a6bf)));--graupl-input-disabled-border-color:var(--graupl-theme-active--tertiary--200,var(--graupl-theme-light--tertiary--200,var(--graupl-tertiary--200,#f2a6bf)))}label{color:var(--graupl-label-color,var(--graupl-input-color,var(--graupl-color,var(--graupl-root-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233)))))))}label:has(+input:disabled,+textarea:disabled,+select:disabled),label:has(+input[disabled],+textarea[disabled],+select[disabled]),label:has(+input[aria-disabled=true],+textarea[aria-disabled=true],+select[aria-disabled=true]),label:has(+input.disabled,+textarea.disabled,+select.disabled){color:var(--graupl-label-disabled-color,var(--graupl-input-disabled-color,var(--graupl-theme-active--secondary--400,var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d)))))}label.primary{--graupl-label-color:var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233)));--graupl-label-background:var(--graupl-theme-active--primary--100,var(--graupl-theme-light--primary--100,var(--graupl-primary--100,#e6eeff)));--graupl-label-border-color:var(--graupl-theme-active--primary--700,var(--graupl-theme-light--primary--700,var(--graupl-primary--700,#1244a1)))}label.secondary{--graupl-label-color:var(--graupl-theme-active--secondary--900,var(--graupl-theme-light--secondary--900,var(--graupl-secondary--900,#0f1124)));--graupl-label-background:var(--graupl-theme-active--secondary--100,var(--graupl-theme-light--secondary--100,var(--graupl-secondary--100,#edeef7)));--graupl-label-border-color:var(--graupl-theme-active--secondary--700,var(--graupl-theme-light--secondary--700,var(--graupl-secondary--700,#474a6b)))}label.tertiary{--graupl-label-color:var(--graupl-theme-active--tertiary--900,var(--graupl-theme-light--tertiary--900,var(--graupl-tertiary--900,#2f0412)));--graupl-label-background:var(--graupl-theme-active--tertiary--100,var(--graupl-theme-light--tertiary--100,var(--graupl-tertiary--100,#fde7ef)));--graupl-label-border-color:var(--graupl-theme-active--tertiary--700,var(--graupl-theme-light--tertiary--700,var(--graupl-tertiary--700,#931f46)))}label.primary{--graupl-input-color:var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233)));--graupl-input-background:var(--graupl-theme-active--primary--100,var(--graupl-theme-light--primary--100,var(--graupl-primary--100,#e6eeff)));--graupl-input-border-color:var(--graupl-theme-active--primary--700,var(--graupl-theme-light--primary--700,var(--graupl-primary--700,#1244a1)));--graupl-input-placeholder-color:var(--graupl-theme-active--primary--600,var(--graupl-theme-light--primary--600,var(--graupl-primary--600,#1d59c9)));--graupl-input-disabled-color:var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa)));--graupl-input-disabled-border-color:var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa)))}label.secondary{--graupl-input-color:var(--graupl-theme-active--secondary--900,var(--graupl-theme-light--secondary--900,var(--graupl-secondary--900,#0f1124)));--graupl-input-background:var(--graupl-theme-active--secondary--100,var(--graupl-theme-light--secondary--100,var(--graupl-secondary--100,#edeef7)));--graupl-input-border-color:var(--graupl-theme-active--secondary--700,var(--graupl-theme-light--secondary--700,var(--graupl-secondary--700,#474a6b)));--graupl-input-placeholder-color:var(--graupl-theme-active--secondary--600,var(--graupl-theme-light--secondary--600,var(--graupl-secondary--600,#626484)));--graupl-input-disabled-color:var(--graupl-theme-active--secondary--200,var(--graupl-theme-light--secondary--200,var(--graupl-secondary--200,#bdbfdb)));--graupl-input-disabled-border-color:var(--graupl-theme-active--secondary--200,var(--graupl-theme-light--secondary--200,var(--graupl-secondary--200,#bdbfdb)))}label.tertiary{--graupl-input-color:var(--graupl-theme-active--tertiary--900,var(--graupl-theme-light--tertiary--900,var(--graupl-tertiary--900,#2f0412)));--graupl-input-background:var(--graupl-theme-active--tertiary--100,var(--graupl-theme-light--tertiary--100,var(--graupl-tertiary--100,#fde7ef)));--graupl-input-border-color:var(--graupl-theme-active--tertiary--700,var(--graupl-theme-light--tertiary--700,var(--graupl-tertiary--700,#931f46)));--graupl-input-placeholder-color:var(--graupl-theme-active--tertiary--600,var(--graupl-theme-light--tertiary--600,var(--graupl-tertiary--600,#b82e5c)));--graupl-input-disabled-color:var(--graupl-theme-active--tertiary--200,var(--graupl-theme-light--tertiary--200,var(--graupl-tertiary--200,#f2a6bf)));--graupl-input-disabled-border-color:var(--graupl-theme-active--tertiary--200,var(--graupl-theme-light--tertiary--200,var(--graupl-tertiary--200,#f2a6bf)))}fieldset{border-color:var(--graupl-fieldset-border-color,var(--graupl-input-border-color,var(--graupl-border-color,var(--graupl-color,var(--graupl-root-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233))))))));background:var(--graupl-fieldset-background,var(--graupl-input-background,var(--graupl-background,var(--graupl-root-background,var(--graupl-theme-active--primary--100,var(--graupl-theme-light--primary--100,var(--graupl-primary--100,#e6eeff)))))));color:var(--graupl-fieldset-color,var(--graupl-input-color,var(--graupl-color,var(--graupl-root-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233)))))))}fieldset:disabled{border-color:var(--graupl-fieldset-disabled-border-color,var(--graupl-input-disabled-border-color,var(--graupl-theme-active--secondary--200,var(--graupl-theme-light--secondary--200,var(--graupl-secondary--200,#bdbfdb)))));color:var(--graupl-fieldset-disabled-color,var(--graupl-input-disabled-color,var(--graupl-theme-active--secondary--400,var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d)))))}fieldset:disabled label{color:var(--graupl-label-disabled-color,var(--graupl-input-disabled-color,var(--graupl-theme-active--secondary--400,var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d)))))}fieldset[disabled]{border-color:var(--graupl-fieldset-disabled-border-color,var(--graupl-input-disabled-border-color,var(--graupl-theme-active--secondary--200,var(--graupl-theme-light--secondary--200,var(--graupl-secondary--200,#bdbfdb)))));color:var(--graupl-fieldset-disabled-color,var(--graupl-input-disabled-color,var(--graupl-theme-active--secondary--400,var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d)))))}fieldset[disabled] label{color:var(--graupl-label-disabled-color,var(--graupl-input-disabled-color,var(--graupl-theme-active--secondary--400,var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d)))))}fieldset[aria-disabled=true]{border-color:var(--graupl-fieldset-disabled-border-color,var(--graupl-input-disabled-border-color,var(--graupl-theme-active--secondary--200,var(--graupl-theme-light--secondary--200,var(--graupl-secondary--200,#bdbfdb)))));color:var(--graupl-fieldset-disabled-color,var(--graupl-input-disabled-color,var(--graupl-theme-active--secondary--400,var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d)))))}fieldset[aria-disabled=true] label{color:var(--graupl-label-disabled-color,var(--graupl-input-disabled-color,var(--graupl-theme-active--secondary--400,var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d)))))}fieldset.disabled{border-color:var(--graupl-fieldset-disabled-border-color,var(--graupl-input-disabled-border-color,var(--graupl-theme-active--secondary--200,var(--graupl-theme-light--secondary--200,var(--graupl-secondary--200,#bdbfdb)))));color:var(--graupl-fieldset-disabled-color,var(--graupl-input-disabled-color,var(--graupl-theme-active--secondary--400,var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d)))))}fieldset.disabled label{color:var(--graupl-label-disabled-color,var(--graupl-input-disabled-color,var(--graupl-theme-active--secondary--400,var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d)))))}fieldset.primary{--graupl-fieldset-color:var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233)));--graupl-fieldset-background:var(--graupl-theme-active--primary--100,var(--graupl-theme-light--primary--100,var(--graupl-primary--100,#e6eeff)));--graupl-fieldset-border-color:var(--graupl-theme-active--primary--700,var(--graupl-theme-light--primary--700,var(--graupl-primary--700,#1244a1)));--graupl-fieldset-accent-color:var(--graupl-theme-active--primary--700,var(--graupl-theme-light--primary--700,var(--graupl-primary--700,#1244a1)))}fieldset.secondary{--graupl-fieldset-color:var(--graupl-theme-active--secondary--900,var(--graupl-theme-light--secondary--900,var(--graupl-secondary--900,#0f1124)));--graupl-fieldset-background:var(--graupl-theme-active--secondary--100,var(--graupl-theme-light--secondary--100,var(--graupl-secondary--100,#edeef7)));--graupl-fieldset-border-color:var(--graupl-theme-active--secondary--700,var(--graupl-theme-light--secondary--700,var(--graupl-secondary--700,#474a6b)));--graupl-fieldset-accent-color:var(--graupl-theme-active--secondary--700,var(--graupl-theme-light--secondary--700,var(--graupl-secondary--700,#474a6b)))}fieldset.tertiary{--graupl-fieldset-color:var(--graupl-theme-active--tertiary--900,var(--graupl-theme-light--tertiary--900,var(--graupl-tertiary--900,#2f0412)));--graupl-fieldset-background:var(--graupl-theme-active--tertiary--100,var(--graupl-theme-light--tertiary--100,var(--graupl-tertiary--100,#fde7ef)));--graupl-fieldset-border-color:var(--graupl-theme-active--tertiary--700,var(--graupl-theme-light--tertiary--700,var(--graupl-tertiary--700,#931f46)));--graupl-fieldset-accent-color:var(--graupl-theme-active--tertiary--700,var(--graupl-theme-light--tertiary--700,var(--graupl-tertiary--700,#931f46)))}fieldset.primary{--graupl-label-color:var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233)));--graupl-label-background:var(--graupl-theme-active--primary--100,var(--graupl-theme-light--primary--100,var(--graupl-primary--100,#e6eeff)));--graupl-label-border-color:var(--graupl-theme-active--primary--700,var(--graupl-theme-light--primary--700,var(--graupl-primary--700,#1244a1)))}fieldset.secondary{--graupl-label-color:var(--graupl-theme-active--secondary--900,var(--graupl-theme-light--secondary--900,var(--graupl-secondary--900,#0f1124)));--graupl-label-background:var(--graupl-theme-active--secondary--100,var(--graupl-theme-light--secondary--100,var(--graupl-secondary--100,#edeef7)));--graupl-label-border-color:var(--graupl-theme-active--secondary--700,var(--graupl-theme-light--secondary--700,var(--graupl-secondary--700,#474a6b)))}fieldset.tertiary{--graupl-label-color:var(--graupl-theme-active--tertiary--900,var(--graupl-theme-light--tertiary--900,var(--graupl-tertiary--900,#2f0412)));--graupl-label-background:var(--graupl-theme-active--tertiary--100,var(--graupl-theme-light--tertiary--100,var(--graupl-tertiary--100,#fde7ef)));--graupl-label-border-color:var(--graupl-theme-active--tertiary--700,var(--graupl-theme-light--tertiary--700,var(--graupl-tertiary--700,#931f46)))}fieldset.primary{--graupl-input-color:var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233)));--graupl-input-background:var(--graupl-theme-active--primary--100,var(--graupl-theme-light--primary--100,var(--graupl-primary--100,#e6eeff)));--graupl-input-border-color:var(--graupl-theme-active--primary--700,var(--graupl-theme-light--primary--700,var(--graupl-primary--700,#1244a1)));--graupl-input-placeholder-color:var(--graupl-theme-active--primary--600,var(--graupl-theme-light--primary--600,var(--graupl-primary--600,#1d59c9)));--graupl-input-disabled-color:var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa)));--graupl-input-disabled-border-color:var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa)))}fieldset.secondary{--graupl-input-color:var(--graupl-theme-active--secondary--900,var(--graupl-theme-light--secondary--900,var(--graupl-secondary--900,#0f1124)));--graupl-input-background:var(--graupl-theme-active--secondary--100,var(--graupl-theme-light--secondary--100,var(--graupl-secondary--100,#edeef7)));--graupl-input-border-color:var(--graupl-theme-active--secondary--700,var(--graupl-theme-light--secondary--700,var(--graupl-secondary--700,#474a6b)));--graupl-input-placeholder-color:var(--graupl-theme-active--secondary--600,var(--graupl-theme-light--secondary--600,var(--graupl-secondary--600,#626484)));--graupl-input-disabled-color:var(--graupl-theme-active--secondary--200,var(--graupl-theme-light--secondary--200,var(--graupl-secondary--200,#bdbfdb)));--graupl-input-disabled-border-color:var(--graupl-theme-active--secondary--200,var(--graupl-theme-light--secondary--200,var(--graupl-secondary--200,#bdbfdb)))}fieldset.tertiary{--graupl-input-color:var(--graupl-theme-active--tertiary--900,var(--graupl-theme-light--tertiary--900,var(--graupl-tertiary--900,#2f0412)));--graupl-input-background:var(--graupl-theme-active--tertiary--100,var(--graupl-theme-light--tertiary--100,var(--graupl-tertiary--100,#fde7ef)));--graupl-input-border-color:var(--graupl-theme-active--tertiary--700,var(--graupl-theme-light--tertiary--700,var(--graupl-tertiary--700,#931f46)));--graupl-input-placeholder-color:var(--graupl-theme-active--tertiary--600,var(--graupl-theme-light--tertiary--600,var(--graupl-tertiary--600,#b82e5c)));--graupl-input-disabled-color:var(--graupl-theme-active--tertiary--200,var(--graupl-theme-light--tertiary--200,var(--graupl-tertiary--200,#f2a6bf)));--graupl-input-disabled-border-color:var(--graupl-theme-active--tertiary--200,var(--graupl-theme-light--tertiary--200,var(--graupl-tertiary--200,#f2a6bf)))}}
2
+ /*# sourceMappingURL=form.css.map */
package/dist/css/base/form.css.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../node_modules/@graupl/core/src/scss/mixins/_layer.scss","../../../node_modules/@graupl/core/src/scss/base/form/_index.scss","../../../node_modules/@graupl/core/src/scss/base/form/_variables.scss","form.css"],"names":[],"mappings":"AASI,mBC8G8B,sBAM9B,+gBC2BkB,CD5BlB,6cCOiB,CDRjB,qdCbiB,CDgBjB,0GCrGc,CDiGd,oNEhHF,CFwHI,wOACE,kBErGN,CF2GgC,MAC9B,wIEzGF,CF6GmC,SAOjC,ktBCkEqB,CDnErB,snBC8CoB,CD/CpB,8nBC0BoB,CD9BpB,YAAA,CACA,sDAAA,CAMA,2ICjGiB,CD4FjB,0FC5GW,CD6GX,yREvGF,CFgHM,oVAGE,kBE/FR,CACF,CHvDI,oBC8J8B,sBAM9B,wOCoEiB,CDtEjB,oNChHe,CD+Gf,yOCqDiB,CDnDjB,gMEnGF,CFsGE,4EACE,qKElGJ,CFiGE,6DACE,qKElGJ,CFuGI,iDACE,gLC6CsB,CD5CtB,kKEnGN,CFqGM,uGACE,iNEjGR,CFgGM,wFACE,iNEjGR,CF4FI,oDACE,gLC6CsB,CD5CtB,kKExFN,CF0FM,0GACE,iNEtFR,CFqFM,2FACE,iNEtFR,CFiFI,kFACE,gLC6CsB,CD5CtB,kKE7EN,CF+EM,wIACE,iNE3ER,CF0EM,yHACE,iNE3ER,CFsEI,iDACE,gLC6CsB,CD5CtB,kKElEN,CFoEM,uGACE,iNEhER,CF+DM,wFACE,iNEhER,CFuEgC,MAC9B,0NErEF,CFyEI,+DAKE,qMEzEN,CFoEI,kEAKE,qMEpEN,CF+DI,gGAKE,qME/DN,CF0DI,+DAKE,qME1DN,CFgEmC,SAEjC,sPCpJkB,CDmJlB,6QCqBoB,CDnBpB,6NE9DF,CFkEI,kBACE,6NCkByB,CDjBzB,wMEhEN,CFkEM,wBACE,qMEhER,CF2DI,mBACE,6NCkByB,CDjBzB,wMEzDN,CF2DM,yBACE,qMEzDR,CFoDI,6BACE,6NCkByB,CDjBzB,wMElDN,CFoDM,mCACE,qMElDR,CF6CI,kBACE,6NCkByB,CDjBzB,wME3CN,CF6CM,wBACE,qME3CR,CACF","file":"form.css"}
1
+ {"version":3,"sourceRoot":null,"mappings":"AESI,mBC+L8B,6vDAW5B,2PAO4B,8IAKG,wgFAa7B,wWDnOJ,oBC+O8B,+3BAQ9B,mOAME,qYAIE,0SAJF,wYAIE,6SAJF,saAIE,2UAJF,qYAIE,0SElOJ,q5BAAA,+7BAAA,06BFmP8B,iOAK5B,seExPF,qbAAA,ycAAA,+bAAA,q3BAAA,25BAAA,w4BFkRiC,4uBAO/B,ybAIE,8NAJF,0bAIE,+NAJF,ocAIE,yOAJF,ybAIE,8NE7RJ,olBAAA,8mBAAA,imBAAA,wbAAA,4cAAA,kcAAA,w3BAAA,85BAAA","sources":["dist/css/base/form.css","var/www/html/node_modules/@graupl/core/src/scss/theme/typography/_defaults.scss","var/www/html/node_modules/@graupl/core/src/scss/mixins/_layer.scss","var/www/html/node_modules/@graupl/core/src/scss/base/form/_index.scss","var/www/html/node_modules/@graupl/core/src/scss/base/form/_variables.scss","var/www/html/node_modules/@graupl/core/src/scss/mixins/_theme.scss"],"sourcesContent":["/* stylelint-disable-next-line scss/dollar-variable-colon-space-after */\n@layer graupl.base {\n input,\n textarea,\n select {\n padding: var(--graupl-input-padding, var(--graupl-input-padding-y, var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem)))) var(--graupl-input-padding-x, var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem)))));\n border-width: var(--graupl-input-border-width, var(--graupl-input-border-top-width, var(--graupl-border-top-width, var(--graupl-border-width, 0.125rem))) var(--graupl-input-border-right-width, var(--graupl-border-right-width, var(--graupl-border-width, 0.125rem))) var(--graupl-input-border-bottom-width, var(--graupl-border-bottom-width, var(--graupl-border-width, 0.125rem))) var(--graupl-input-border-left-width, var(--graupl-border-left-width, var(--graupl-border-width, 0.125rem))));\n border-style: var(--graupl-input-border-style, var(--graupl-input-border-top-style, var(--graupl-border-top-style, var(--graupl-border-style, solid))) var(--graupl-input-border-right-style, var(--graupl-border-right-style, var(--graupl-border-style, solid))) var(--graupl-input-border-bottom-style, var(--graupl-border-bottom-style, var(--graupl-border-style, solid))) var(--graupl-input-border-left-style, var(--graupl-border-left-style, var(--graupl-border-style, solid))));\n border-radius: var(--graupl-input-border-radius, var(--graupl-input-border-top-left-radius, var(--graupl-border-top-left-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-input-border-top-right-radius, var(--graupl-border-top-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-input-border-bottom-right-radius, var(--graupl-border-bottom-right-radius, var(--graupl-border-radius, 0.125rem))) var(--graupl-input-border-bottom-left-radius, var(--graupl-border-bottom-left-radius, var(--graupl-border-radius, 0.125rem))));\n font-size: var(--graupl-input-font-size, var(--graupl-font-base, calc(1 * var(--graupl-font-size-base, 1rem))));\n }\n input:disabled,\n textarea:disabled,\n select:disabled {\n cursor: not-allowed;\n }\n input[disabled],\n textarea[disabled],\n select[disabled] {\n cursor: not-allowed;\n }\n input[aria-disabled=true],\n textarea[aria-disabled=true],\n select[aria-disabled=true] {\n cursor: not-allowed;\n }\n input.disabled,\n textarea.disabled,\n select.disabled {\n cursor: not-allowed;\n }\n label {\n font-size: var(--graupl-label-font-size, var(--graupl-input-font-size, var(--graupl-font-base, calc(1 * var(--graupl-font-size-base, 1rem)))));\n }\n fieldset {\n display: flex;\n flex-flow: var(--graupl-fieldset-direction, column) wrap;\n gap: var(--graupl-fieldset-gap, var(--graupl-spacer-2, calc(0.25 * var(--graupl-spacer, 1rem))));\n padding: var(--graupl-fieldset-padding, var(--graupl-fieldset-padding-y, var(--graupl-input-padding-y, var(--graupl-spacer-3, calc(0.5 * var(--graupl-spacer, 1rem))))) var(--graupl-fieldset-padding-x, var(--graupl-input-padding-x, var(--graupl-spacer-5, calc(1 * var(--graupl-spacer, 1rem))))));\n border-width: var(--graupl-fieldset-border-width, var(--graupl-fieldset-border-top-width, var(--graupl-input-border-top-width, var(--graupl-border-top-width, var(--graupl-border-width, 0.125rem)))) var(--graupl-fieldset-border-right-width, var(--graupl-input-border-right-width, var(--graupl-border-right-width, var(--graupl-border-width, 0.125rem)))) var(--graupl-fieldset-border-bottom-width, var(--graupl-input-border-bottom-width, var(--graupl-border-bottom-width, var(--graupl-border-width, 0.125rem)))) var(--graupl-fieldset-border-left-width, var(--graupl-input-border-left-width, var(--graupl-border-left-width, var(--graupl-border-width, 0.125rem)))));\n border-style: var(--graupl-fieldset-border-style, var(--graupl-fieldset-border-top-style, var(--graupl-input-border-top-style, var(--graupl-border-top-style, var(--graupl-border-style, solid)))) var(--graupl-fieldset-border-right-style, var(--graupl-input-border-right-style, var(--graupl-border-right-style, var(--graupl-border-style, solid)))) var(--graupl-fieldset-border-bottom-style, var(--graupl-input-border-bottom-style, var(--graupl-border-bottom-style, var(--graupl-border-style, solid)))) var(--graupl-fieldset-border-left-style, var(--graupl-input-border-left-style, var(--graupl-border-left-style, var(--graupl-border-style, solid)))));\n border-radius: var(--graupl-fieldset-border-radius, var(--graupl-fieldset-border-top-left-radius, var(--graupl-input-border-top-left-radius, var(--graupl-border-top-left-radius, var(--graupl-border-radius, 0.125rem)))) var(--graupl-fieldset-border-top-right-radius, var(--graupl-input-border-top-right-radius, var(--graupl-border-top-right-radius, var(--graupl-border-radius, 0.125rem)))) var(--graupl-fieldset-border-bottom-right-radius, var(--graupl-input-border-bottom-right-radius, var(--graupl-border-bottom-right-radius, var(--graupl-border-radius, 0.125rem)))) var(--graupl-fieldset-border-bottom-left-radius, var(--graupl-input-border-bottom-left-radius, var(--graupl-border-bottom-left-radius, var(--graupl-border-radius, 0.125rem)))));\n font-size: var(--graupl-fieldset-font-size, var(--graupl-input-font-size, var(--graupl-font-base, calc(1 * var(--graupl-font-size-base, 1rem)))));\n }\n fieldset:disabled input,\n fieldset:disabled textarea,\n fieldset:disabled select {\n cursor: not-allowed;\n }\n fieldset[disabled] input,\n fieldset[disabled] textarea,\n fieldset[disabled] select {\n cursor: not-allowed;\n }\n fieldset[aria-disabled=true] input,\n fieldset[aria-disabled=true] textarea,\n fieldset[aria-disabled=true] select {\n cursor: not-allowed;\n }\n fieldset.disabled input,\n fieldset.disabled textarea,\n fieldset.disabled select {\n cursor: not-allowed;\n }\n}\n@layer graupl.theme {\n input,\n textarea,\n select {\n border-color: var(--graupl-input-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n background: var(--graupl-input-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%)))))));\n color: var(--graupl-input-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))));\n accent-color: var(--graupl-input-accent-color, var(--graupl-input-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n }\n input::placeholder,\n textarea::placeholder,\n select::placeholder {\n color: var(--graupl-input-placeholder-color, var(--graupl-theme-active--secondary--600, var(--graupl-theme-light--secondary--600, var(--graupl-secondary--600, hsl(235, 15%, 45%)))));\n }\n input:disabled,\n textarea:disabled,\n select:disabled {\n border-color: var(--graupl-input-disabled-border-color, var(--graupl-theme-active--secondary--200, var(--graupl-theme-light--secondary--200, var(--graupl-secondary--200, hsl(235, 30%, 80%)))));\n color: var(--graupl-input-disabled-color, var(--graupl-theme-active--secondary--400, var(--graupl-theme-light--secondary--400, var(--graupl-secondary--400, hsl(235, 15%, 55%)))));\n }\n input:disabled::placeholder,\n textarea:disabled::placeholder,\n select:disabled::placeholder {\n color: var(--graupl-input-placeholder-disabled-color, var(--graupl-input-disabled-color, var(--graupl-theme-active--secondary--400, var(--graupl-theme-light--secondary--400, var(--graupl-secondary--400, hsl(235, 15%, 55%))))));\n }\n input[disabled],\n textarea[disabled],\n select[disabled] {\n border-color: var(--graupl-input-disabled-border-color, var(--graupl-theme-active--secondary--200, var(--graupl-theme-light--secondary--200, var(--graupl-secondary--200, hsl(235, 30%, 80%)))));\n color: var(--graupl-input-disabled-color, var(--graupl-theme-active--secondary--400, var(--graupl-theme-light--secondary--400, var(--graupl-secondary--400, hsl(235, 15%, 55%)))));\n }\n input[disabled]::placeholder,\n textarea[disabled]::placeholder,\n select[disabled]::placeholder {\n color: var(--graupl-input-placeholder-disabled-color, var(--graupl-input-disabled-color, var(--graupl-theme-active--secondary--400, var(--graupl-theme-light--secondary--400, var(--graupl-secondary--400, hsl(235, 15%, 55%))))));\n }\n input[aria-disabled=true],\n textarea[aria-disabled=true],\n select[aria-disabled=true] {\n border-color: var(--graupl-input-disabled-border-color, var(--graupl-theme-active--secondary--200, var(--graupl-theme-light--secondary--200, var(--graupl-secondary--200, hsl(235, 30%, 80%)))));\n color: var(--graupl-input-disabled-color, var(--graupl-theme-active--secondary--400, var(--graupl-theme-light--secondary--400, var(--graupl-secondary--400, hsl(235, 15%, 55%)))));\n }\n input[aria-disabled=true]::placeholder,\n textarea[aria-disabled=true]::placeholder,\n select[aria-disabled=true]::placeholder {\n color: var(--graupl-input-placeholder-disabled-color, var(--graupl-input-disabled-color, var(--graupl-theme-active--secondary--400, var(--graupl-theme-light--secondary--400, var(--graupl-secondary--400, hsl(235, 15%, 55%))))));\n }\n input.disabled,\n textarea.disabled,\n select.disabled {\n border-color: var(--graupl-input-disabled-border-color, var(--graupl-theme-active--secondary--200, var(--graupl-theme-light--secondary--200, var(--graupl-secondary--200, hsl(235, 30%, 80%)))));\n color: var(--graupl-input-disabled-color, var(--graupl-theme-active--secondary--400, var(--graupl-theme-light--secondary--400, var(--graupl-secondary--400, hsl(235, 15%, 55%)))));\n }\n input.disabled::placeholder,\n textarea.disabled::placeholder,\n select.disabled::placeholder {\n color: var(--graupl-input-placeholder-disabled-color, var(--graupl-input-disabled-color, var(--graupl-theme-active--secondary--400, var(--graupl-theme-light--secondary--400, var(--graupl-secondary--400, hsl(235, 15%, 55%))))));\n }\n input.primary,\n textarea.primary,\n select.primary {\n --graupl-input-color: var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))));\n --graupl-input-background: var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))));\n --graupl-input-border-color: var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%))));\n --graupl-input-placeholder-color: var(--graupl-theme-active--primary--600, var(--graupl-theme-light--primary--600, var(--graupl-primary--600, hsl(219, 75%, 45%))));\n --graupl-input-disabled-color: var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))));\n --graupl-input-disabled-border-color: var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))));\n }\n input.secondary,\n textarea.secondary,\n select.secondary {\n --graupl-input-color: var(--graupl-theme-active--secondary--900, var(--graupl-theme-light--secondary--900, var(--graupl-secondary--900, hsl(235, 40%, 10%))));\n --graupl-input-background: var(--graupl-theme-active--secondary--100, var(--graupl-theme-light--secondary--100, var(--graupl-secondary--100, hsl(235, 40%, 95%))));\n --graupl-input-border-color: var(--graupl-theme-active--secondary--700, var(--graupl-theme-light--secondary--700, var(--graupl-secondary--700, hsl(235, 20%, 35%))));\n --graupl-input-placeholder-color: var(--graupl-theme-active--secondary--600, var(--graupl-theme-light--secondary--600, var(--graupl-secondary--600, hsl(235, 15%, 45%))));\n --graupl-input-disabled-color: var(--graupl-theme-active--secondary--200, var(--graupl-theme-light--secondary--200, var(--graupl-secondary--200, hsl(235, 30%, 80%))));\n --graupl-input-disabled-border-color: var(--graupl-theme-active--secondary--200, var(--graupl-theme-light--secondary--200, var(--graupl-secondary--200, hsl(235, 30%, 80%))));\n }\n input.tertiary,\n textarea.tertiary,\n select.tertiary {\n --graupl-input-color: var(--graupl-theme-active--tertiary--900, var(--graupl-theme-light--tertiary--900, var(--graupl-tertiary--900, hsl(340, 85%, 10%))));\n --graupl-input-background: var(--graupl-theme-active--tertiary--100, var(--graupl-theme-light--tertiary--100, var(--graupl-tertiary--100, hsl(340, 85%, 95%))));\n --graupl-input-border-color: var(--graupl-theme-active--tertiary--700, var(--graupl-theme-light--tertiary--700, var(--graupl-tertiary--700, hsl(340, 65%, 35%))));\n --graupl-input-placeholder-color: var(--graupl-theme-active--tertiary--600, var(--graupl-theme-light--tertiary--600, var(--graupl-tertiary--600, hsl(340, 60%, 45%))));\n --graupl-input-disabled-color: var(--graupl-theme-active--tertiary--200, var(--graupl-theme-light--tertiary--200, var(--graupl-tertiary--200, hsl(340, 75%, 80%))));\n --graupl-input-disabled-border-color: var(--graupl-theme-active--tertiary--200, var(--graupl-theme-light--tertiary--200, var(--graupl-tertiary--200, hsl(340, 75%, 80%))));\n }\n label {\n color: var(--graupl-label-color, var(--graupl-input-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n }\n label:has(+ input:disabled,\n + textarea:disabled,\n + select:disabled) {\n color: var(--graupl-label-disabled-color, var(--graupl-input-disabled-color, var(--graupl-theme-active--secondary--400, var(--graupl-theme-light--secondary--400, var(--graupl-secondary--400, hsl(235, 15%, 55%))))));\n }\n label:has(+ input[disabled],\n + textarea[disabled],\n + select[disabled]) {\n color: var(--graupl-label-disabled-color, var(--graupl-input-disabled-color, var(--graupl-theme-active--secondary--400, var(--graupl-theme-light--secondary--400, var(--graupl-secondary--400, hsl(235, 15%, 55%))))));\n }\n label:has(+ input[aria-disabled=true],\n + textarea[aria-disabled=true],\n + select[aria-disabled=true]) {\n color: var(--graupl-label-disabled-color, var(--graupl-input-disabled-color, var(--graupl-theme-active--secondary--400, var(--graupl-theme-light--secondary--400, var(--graupl-secondary--400, hsl(235, 15%, 55%))))));\n }\n label:has(+ input.disabled,\n + textarea.disabled,\n + select.disabled) {\n color: var(--graupl-label-disabled-color, var(--graupl-input-disabled-color, var(--graupl-theme-active--secondary--400, var(--graupl-theme-light--secondary--400, var(--graupl-secondary--400, hsl(235, 15%, 55%))))));\n }\n label.primary {\n --graupl-label-color: var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))));\n --graupl-label-background: var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))));\n --graupl-label-border-color: var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%))));\n }\n label.secondary {\n --graupl-label-color: var(--graupl-theme-active--secondary--900, var(--graupl-theme-light--secondary--900, var(--graupl-secondary--900, hsl(235, 40%, 10%))));\n --graupl-label-background: var(--graupl-theme-active--secondary--100, var(--graupl-theme-light--secondary--100, var(--graupl-secondary--100, hsl(235, 40%, 95%))));\n --graupl-label-border-color: var(--graupl-theme-active--secondary--700, var(--graupl-theme-light--secondary--700, var(--graupl-secondary--700, hsl(235, 20%, 35%))));\n }\n label.tertiary {\n --graupl-label-color: var(--graupl-theme-active--tertiary--900, var(--graupl-theme-light--tertiary--900, var(--graupl-tertiary--900, hsl(340, 85%, 10%))));\n --graupl-label-background: var(--graupl-theme-active--tertiary--100, var(--graupl-theme-light--tertiary--100, var(--graupl-tertiary--100, hsl(340, 85%, 95%))));\n --graupl-label-border-color: var(--graupl-theme-active--tertiary--700, var(--graupl-theme-light--tertiary--700, var(--graupl-tertiary--700, hsl(340, 65%, 35%))));\n }\n label.primary {\n --graupl-input-color: var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))));\n --graupl-input-background: var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))));\n --graupl-input-border-color: var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%))));\n --graupl-input-placeholder-color: var(--graupl-theme-active--primary--600, var(--graupl-theme-light--primary--600, var(--graupl-primary--600, hsl(219, 75%, 45%))));\n --graupl-input-disabled-color: var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))));\n --graupl-input-disabled-border-color: var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))));\n }\n label.secondary {\n --graupl-input-color: var(--graupl-theme-active--secondary--900, var(--graupl-theme-light--secondary--900, var(--graupl-secondary--900, hsl(235, 40%, 10%))));\n --graupl-input-background: var(--graupl-theme-active--secondary--100, var(--graupl-theme-light--secondary--100, var(--graupl-secondary--100, hsl(235, 40%, 95%))));\n --graupl-input-border-color: var(--graupl-theme-active--secondary--700, var(--graupl-theme-light--secondary--700, var(--graupl-secondary--700, hsl(235, 20%, 35%))));\n --graupl-input-placeholder-color: var(--graupl-theme-active--secondary--600, var(--graupl-theme-light--secondary--600, var(--graupl-secondary--600, hsl(235, 15%, 45%))));\n --graupl-input-disabled-color: var(--graupl-theme-active--secondary--200, var(--graupl-theme-light--secondary--200, var(--graupl-secondary--200, hsl(235, 30%, 80%))));\n --graupl-input-disabled-border-color: var(--graupl-theme-active--secondary--200, var(--graupl-theme-light--secondary--200, var(--graupl-secondary--200, hsl(235, 30%, 80%))));\n }\n label.tertiary {\n --graupl-input-color: var(--graupl-theme-active--tertiary--900, var(--graupl-theme-light--tertiary--900, var(--graupl-tertiary--900, hsl(340, 85%, 10%))));\n --graupl-input-background: var(--graupl-theme-active--tertiary--100, var(--graupl-theme-light--tertiary--100, var(--graupl-tertiary--100, hsl(340, 85%, 95%))));\n --graupl-input-border-color: var(--graupl-theme-active--tertiary--700, var(--graupl-theme-light--tertiary--700, var(--graupl-tertiary--700, hsl(340, 65%, 35%))));\n --graupl-input-placeholder-color: var(--graupl-theme-active--tertiary--600, var(--graupl-theme-light--tertiary--600, var(--graupl-tertiary--600, hsl(340, 60%, 45%))));\n --graupl-input-disabled-color: var(--graupl-theme-active--tertiary--200, var(--graupl-theme-light--tertiary--200, var(--graupl-tertiary--200, hsl(340, 75%, 80%))));\n --graupl-input-disabled-border-color: var(--graupl-theme-active--tertiary--200, var(--graupl-theme-light--tertiary--200, var(--graupl-tertiary--200, hsl(340, 75%, 80%))));\n }\n fieldset {\n border-color: var(--graupl-fieldset-border-color, var(--graupl-input-border-color, var(--graupl-border-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%)))))))));\n background: var(--graupl-fieldset-background, var(--graupl-input-background, var(--graupl-background, var(--graupl-root-background, var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))))))));\n color: var(--graupl-fieldset-color, var(--graupl-input-color, var(--graupl-color, var(--graupl-root-color, var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))))))));\n }\n fieldset:disabled {\n border-color: var(--graupl-fieldset-disabled-border-color, var(--graupl-input-disabled-border-color, var(--graupl-theme-active--secondary--200, var(--graupl-theme-light--secondary--200, var(--graupl-secondary--200, hsl(235, 30%, 80%))))));\n color: var(--graupl-fieldset-disabled-color, var(--graupl-input-disabled-color, var(--graupl-theme-active--secondary--400, var(--graupl-theme-light--secondary--400, var(--graupl-secondary--400, hsl(235, 15%, 55%))))));\n }\n fieldset:disabled label {\n color: var(--graupl-label-disabled-color, var(--graupl-input-disabled-color, var(--graupl-theme-active--secondary--400, var(--graupl-theme-light--secondary--400, var(--graupl-secondary--400, hsl(235, 15%, 55%))))));\n }\n fieldset[disabled] {\n border-color: var(--graupl-fieldset-disabled-border-color, var(--graupl-input-disabled-border-color, var(--graupl-theme-active--secondary--200, var(--graupl-theme-light--secondary--200, var(--graupl-secondary--200, hsl(235, 30%, 80%))))));\n color: var(--graupl-fieldset-disabled-color, var(--graupl-input-disabled-color, var(--graupl-theme-active--secondary--400, var(--graupl-theme-light--secondary--400, var(--graupl-secondary--400, hsl(235, 15%, 55%))))));\n }\n fieldset[disabled] label {\n color: var(--graupl-label-disabled-color, var(--graupl-input-disabled-color, var(--graupl-theme-active--secondary--400, var(--graupl-theme-light--secondary--400, var(--graupl-secondary--400, hsl(235, 15%, 55%))))));\n }\n fieldset[aria-disabled=true] {\n border-color: var(--graupl-fieldset-disabled-border-color, var(--graupl-input-disabled-border-color, var(--graupl-theme-active--secondary--200, var(--graupl-theme-light--secondary--200, var(--graupl-secondary--200, hsl(235, 30%, 80%))))));\n color: var(--graupl-fieldset-disabled-color, var(--graupl-input-disabled-color, var(--graupl-theme-active--secondary--400, var(--graupl-theme-light--secondary--400, var(--graupl-secondary--400, hsl(235, 15%, 55%))))));\n }\n fieldset[aria-disabled=true] label {\n color: var(--graupl-label-disabled-color, var(--graupl-input-disabled-color, var(--graupl-theme-active--secondary--400, var(--graupl-theme-light--secondary--400, var(--graupl-secondary--400, hsl(235, 15%, 55%))))));\n }\n fieldset.disabled {\n border-color: var(--graupl-fieldset-disabled-border-color, var(--graupl-input-disabled-border-color, var(--graupl-theme-active--secondary--200, var(--graupl-theme-light--secondary--200, var(--graupl-secondary--200, hsl(235, 30%, 80%))))));\n color: var(--graupl-fieldset-disabled-color, var(--graupl-input-disabled-color, var(--graupl-theme-active--secondary--400, var(--graupl-theme-light--secondary--400, var(--graupl-secondary--400, hsl(235, 15%, 55%))))));\n }\n fieldset.disabled label {\n color: var(--graupl-label-disabled-color, var(--graupl-input-disabled-color, var(--graupl-theme-active--secondary--400, var(--graupl-theme-light--secondary--400, var(--graupl-secondary--400, hsl(235, 15%, 55%))))));\n }\n fieldset.primary {\n --graupl-fieldset-color: var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))));\n --graupl-fieldset-background: var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))));\n --graupl-fieldset-border-color: var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%))));\n --graupl-fieldset-accent-color: var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%))));\n }\n fieldset.secondary {\n --graupl-fieldset-color: var(--graupl-theme-active--secondary--900, var(--graupl-theme-light--secondary--900, var(--graupl-secondary--900, hsl(235, 40%, 10%))));\n --graupl-fieldset-background: var(--graupl-theme-active--secondary--100, var(--graupl-theme-light--secondary--100, var(--graupl-secondary--100, hsl(235, 40%, 95%))));\n --graupl-fieldset-border-color: var(--graupl-theme-active--secondary--700, var(--graupl-theme-light--secondary--700, var(--graupl-secondary--700, hsl(235, 20%, 35%))));\n --graupl-fieldset-accent-color: var(--graupl-theme-active--secondary--700, var(--graupl-theme-light--secondary--700, var(--graupl-secondary--700, hsl(235, 20%, 35%))));\n }\n fieldset.tertiary {\n --graupl-fieldset-color: var(--graupl-theme-active--tertiary--900, var(--graupl-theme-light--tertiary--900, var(--graupl-tertiary--900, hsl(340, 85%, 10%))));\n --graupl-fieldset-background: var(--graupl-theme-active--tertiary--100, var(--graupl-theme-light--tertiary--100, var(--graupl-tertiary--100, hsl(340, 85%, 95%))));\n --graupl-fieldset-border-color: var(--graupl-theme-active--tertiary--700, var(--graupl-theme-light--tertiary--700, var(--graupl-tertiary--700, hsl(340, 65%, 35%))));\n --graupl-fieldset-accent-color: var(--graupl-theme-active--tertiary--700, var(--graupl-theme-light--tertiary--700, var(--graupl-tertiary--700, hsl(340, 65%, 35%))));\n }\n fieldset.primary {\n --graupl-label-color: var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))));\n --graupl-label-background: var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))));\n --graupl-label-border-color: var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%))));\n }\n fieldset.secondary {\n --graupl-label-color: var(--graupl-theme-active--secondary--900, var(--graupl-theme-light--secondary--900, var(--graupl-secondary--900, hsl(235, 40%, 10%))));\n --graupl-label-background: var(--graupl-theme-active--secondary--100, var(--graupl-theme-light--secondary--100, var(--graupl-secondary--100, hsl(235, 40%, 95%))));\n --graupl-label-border-color: var(--graupl-theme-active--secondary--700, var(--graupl-theme-light--secondary--700, var(--graupl-secondary--700, hsl(235, 20%, 35%))));\n }\n fieldset.tertiary {\n --graupl-label-color: var(--graupl-theme-active--tertiary--900, var(--graupl-theme-light--tertiary--900, var(--graupl-tertiary--900, hsl(340, 85%, 10%))));\n --graupl-label-background: var(--graupl-theme-active--tertiary--100, var(--graupl-theme-light--tertiary--100, var(--graupl-tertiary--100, hsl(340, 85%, 95%))));\n --graupl-label-border-color: var(--graupl-theme-active--tertiary--700, var(--graupl-theme-light--tertiary--700, var(--graupl-tertiary--700, hsl(340, 65%, 35%))));\n }\n fieldset.primary {\n --graupl-input-color: var(--graupl-theme-active--primary--900, var(--graupl-theme-light--primary--900, var(--graupl-primary--900, hsl(219, 100%, 10%))));\n --graupl-input-background: var(--graupl-theme-active--primary--100, var(--graupl-theme-light--primary--100, var(--graupl-primary--100, hsl(219, 100%, 95%))));\n --graupl-input-border-color: var(--graupl-theme-active--primary--700, var(--graupl-theme-light--primary--700, var(--graupl-primary--700, hsl(219, 80%, 35%))));\n --graupl-input-placeholder-color: var(--graupl-theme-active--primary--600, var(--graupl-theme-light--primary--600, var(--graupl-primary--600, hsl(219, 75%, 45%))));\n --graupl-input-disabled-color: var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))));\n --graupl-input-disabled-border-color: var(--graupl-theme-active--primary--200, var(--graupl-theme-light--primary--200, var(--graupl-primary--200, hsl(219, 90%, 80%))));\n }\n fieldset.secondary {\n --graupl-input-color: var(--graupl-theme-active--secondary--900, var(--graupl-theme-light--secondary--900, var(--graupl-secondary--900, hsl(235, 40%, 10%))));\n --graupl-input-background: var(--graupl-theme-active--secondary--100, var(--graupl-theme-light--secondary--100, var(--graupl-secondary--100, hsl(235, 40%, 95%))));\n --graupl-input-border-color: var(--graupl-theme-active--secondary--700, var(--graupl-theme-light--secondary--700, var(--graupl-secondary--700, hsl(235, 20%, 35%))));\n --graupl-input-placeholder-color: var(--graupl-theme-active--secondary--600, var(--graupl-theme-light--secondary--600, var(--graupl-secondary--600, hsl(235, 15%, 45%))));\n --graupl-input-disabled-color: var(--graupl-theme-active--secondary--200, var(--graupl-theme-light--secondary--200, var(--graupl-secondary--200, hsl(235, 30%, 80%))));\n --graupl-input-disabled-border-color: var(--graupl-theme-active--secondary--200, var(--graupl-theme-light--secondary--200, var(--graupl-secondary--200, hsl(235, 30%, 80%))));\n }\n fieldset.tertiary {\n --graupl-input-color: var(--graupl-theme-active--tertiary--900, var(--graupl-theme-light--tertiary--900, var(--graupl-tertiary--900, hsl(340, 85%, 10%))));\n --graupl-input-background: var(--graupl-theme-active--tertiary--100, var(--graupl-theme-light--tertiary--100, var(--graupl-tertiary--100, hsl(340, 85%, 95%))));\n --graupl-input-border-color: var(--graupl-theme-active--tertiary--700, var(--graupl-theme-light--tertiary--700, var(--graupl-tertiary--700, hsl(340, 65%, 35%))));\n --graupl-input-placeholder-color: var(--graupl-theme-active--tertiary--600, var(--graupl-theme-light--tertiary--600, var(--graupl-tertiary--600, hsl(340, 60%, 45%))));\n --graupl-input-disabled-color: var(--graupl-theme-active--tertiary--200, var(--graupl-theme-light--tertiary--200, var(--graupl-tertiary--200, hsl(340, 75%, 80%))));\n --graupl-input-disabled-border-color: var(--graupl-theme-active--tertiary--200, var(--graupl-theme-light--tertiary--200, var(--graupl-tertiary--200, hsl(340, 75%, 80%))));\n }\n}","// @graupl/core typography theme default values.\n//\n// Generally, these should not be used directly when styling components unless a static value is needed.\n// They are mainly used to provide class selectors, fallbacks for custom properties, or loop values.\n//\n// They should not be used to define direct property values (i.e. font-size, color, etc.).\n// Those should be defined as custom properties in the `_variables.scss` file.\n\n@use \"../../defaults\" as root-defaults;\n@use \"sass:map\";\n\n// font properties.\n$selector-base: root-defaults.$element-selector-base !default;\n$modifier-selector-base: root-defaults.$modifier-selector-base !default;\n$paragraph-selector-base: $selector-base !default;\n$paragraph-selector: \"p\";\n$small-selector-base: $selector-base !default;\n$small-selector: \"small\";\n$h1-selector-base: $selector-base !default;\n$h1-selector: \"h1\" !default;\n$h2-selector-base: $selector-base !default;\n$h2-selector: \"h2\" !default;\n$h3-selector-base: $selector-base !default;\n$h3-selector: \"h3\" !default;\n$h4-selector-base: $selector-base !default;\n$h4-selector: \"h4\" !default;\n$h5-selector-base: $selector-base !default;\n$h5-selector: \"h5\" !default;\n$h6-selector-base: $selector-base !default;\n$h6-selector: \"h6\" !default;\n$root-selector-base: \":\" !default;\n$root-selector: \"root\" !default;\n$bold-selector-base: $selector-base !default;\n$bold-selector: \"b\" !default;\n$strong-selector-base: $selector-base !default;\n$strong-selector: \"strong\" !default;\n$body-selector-base: $selector-base !default;\n$body-selector: \"body\" !default;\n$generate-base-font-sizes: root-defaults.$generate-base-font-sizes !default;\n$generate-base-font-weights: root-defaults.$generate-base-font-weights !default;\n$font-size-base: 1rem !default;\n$root-font-size: clamp(0.85rem, calc(0.8rem + 0.5vw), 1.25rem) !default;\n$line-height: 1.2em !default;\n\n// Multipliers for font sizes.\n// This uses a minor third scale.\n// See: https://typescale.com/?size=16&scale=1.250&text=A%20Visual%20Type%20Scale&font=Lato&fontweight=400&bodyfont=body_font_default&bodyfontweight=400&lineheight=1.75&backgroundcolor=%23ffffff&fontcolor=%23000000\n$-font-size-multipliers: (\n xs: 0.694,\n sm: 0.833,\n base: 1,\n lg: 1.2,\n xl: 1.44,\n 2xl: 1.728,\n 3xl: 2.074,\n 4xl: 2.488,\n 5xl: 2.986,\n);\n$font-size-multipliers: () !default;\n\n// Merge the font size multipliers with the default ones.\n@if $generate-base-font-sizes {\n $font-size-multipliers: map.merge(\n $-font-size-multipliers,\n $font-size-multipliers\n );\n}\n\n// Weights.\n$-font-weights: (\n light: 300,\n normal: 400,\n bold: 700,\n);\n$font-weights: () !default;\n\n// Merge the custom font weights with the default ones.\n@if $generate-base-font-weights {\n $font-weights: map.merge($-font-weights, $font-weights);\n}\n\n/* stylelint-disable-next-line scss/dollar-variable-colon-space-after */\n$root-font-family:\n system-ui,\n -apple-system,\n blinkmacsystemfont,\n \"Segoe UI\",\n roboto,\n \"Helvetica Neue\",\n arial,\n sans-serif !default;\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 form base styles.\n//\n// This module provides the base styles for form components such as inputs, textareas, selects, labels, and fieldsets.\n//\n// The following selectors are generated by default:\n// - `input`: The input component.\n// - `textarea`: The textarea component.\n// - `select`: The select component.\n// - `label`: The label component.\n// - `fieldset`: The fieldset component.\n//\n// The following custom properties can be used to customize the form components:\n// | Property | Description | Default Value |\n// | ---------------------------------------------- | -------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |\n// | `--graupl-input-padding-x` | The horizontal padding for input components. | `var(--graupl-spacer-5)` |\n// | `--graupl-input-padding-y` | The vertical padding for input components. | `var(--graupl-spacer-3)` |\n// | `--graupl-input-padding` | The padding for input components (combines x and y padding). | `var(--graupl-input-padding-y) var(--graupl-input-padding-x)` |\n// | `--graupl-input-font-size` | The font size for input components. | `var(--graupl-font-size-base)` |\n// | `--graupl-label-font-size` | The font size for label components. | `var(--graupl-input-font-size)` |\n// | `--graupl-fieldset-direction` | The direction of fieldset items- controls the `flex-direction` property. | `column` |\n// | `--graupl-fieldset-gap` | The gap between fieldset items. | `var(--graupl-spacer-2)` |\n// | `--graupl-fieldset-padding-x` | The horizontal padding for fieldset components. | `var(--graupl-input-padding-x)` |\n// | `--graupl-fieldset-padding-y` | The vertical padding for fieldset components. | `var(--graupl-input-padding-y)` |\n// | `--graupl-fieldset-padding` | The padding for fieldset components (combines x and y padding). | `var(--graupl-fieldset-padding-y) var(--graupl-fieldset-padding-x)` |\n// | `--graupl-fieldset-font-size` | The font size for fieldset components. | `var(--graupl-input-font-size)` |\n// | `--graupl-input-background` | The background color for input components. | `var(--graupl-background)` |\n// | `--graupl-fieldset-background` | The background color for fieldset components. | `var(--graupl-input-background)` |\n// | `--graupl-input-color` | The text color for input components. | `var(--graupl-color)` |\n// | `--graupl-input-placeholder-color` | The placeholder text color for input components. | `var(--graupl-theme-active--secondary--600)` |\n// | `--graupl-label-color` | The text color for label components. | `var(--graupl-input-color)` |\n// | `--graupl-fieldset-color` | The text color for fieldset components. | `var(--graupl-input-color)` |\n// | `--graupl-input-disabled-color` | The text color for disabled input components. | `var(--graupl-theme-active--secondary--400)` |\n// | `--graupl-input-placeholder-disabled-color` | The placeholder text color for disabled input components. | `var(--graupl-input-disabled-color)` |\n// | `--graupl-label-disabled-color` | The text color for labels for disabled components. | `var(--graupl-input-disabled-color)` |\n// | `--graupl-fieldset-disabled-color` | The text color for disabled fieldset components. | `var(--graupl-input-disabled-color)` |\n// | `--graupl-input-border-top-width` | The top border width for input components. | `var(--graupl-border-top-width)` |\n// | `--graupl-input-border-right-width` | The right border width for input components. | `var(--graupl-border-right-width)` |\n// | `--graupl-input-border-bottom-width` | The bottom border width for input components. | `var(--graupl-border-bottom-width)` |\n// | `--graupl-input-border-left-width` | The left border width for input components. | `var(--graupl-border-left-width)` |\n// | `--graupl-input-border-width` | The border width for input components (combines top, right, bottom, and left widths). | `var(--graupl-input-border-top-width) var(--graupl-input-border-right-width) var(--graupl-input-border-bottom-width) var(--graupl-input-border-left-width)` |\n// | `--graupl-input-border-top-style` | The top border style for input components. | `var(--graupl-border-top-style)` |\n// | `--graupl-input-border-right-style` | The right border style for input components. | `var(--graupl-border-right-style)` |\n// | `--graupl-input-border-bottom-style` | The bottom border style for input components. | `var(--graupl-border-bottom-style)` |\n// | `--graupl-input-border-left-style` | The left border style for input components. | `var(--graupl-border-left-style)` |\n// | `--graupl-input-border-style` | The border style for input components (combines top, right, bottom, and left styles). | `var(--graupl-input-border-top-style) var(--graupl-input-border-right-style) var(--graupl-input-border-bottom-style) var(--graupl-input-border-left-style)` |\n// | `--graupl-input-border-top-left-radius` | The top-left border radius for input components. | `var(--graupl-border-top-left-radius)` |\n// | `--graupl-input-border-top-right-radius` | The top-right border radius for input components. | `var(--graupl-border-top-right-radius)` |\n// | `--graupl-input-border-bottom-right-radius` | The bottom-right border radius for input components. | `var(--graupl-border-bottom-right-radius)` |\n// | `--graupl-input-border-bottom-left-radius` | The bottom-left border radius for input components. | `var(--graupl-border-bottom-left-radius)` |\n// | `--graupl-input-border-radius` | The border radius for input components (combines top-left, top-right, bottom-right, and bottom-left radii). | `var(--graupl-input-border-top-left-radius) var(--graupl-input-border-top-right-radius) var(--graupl-input-border-bottom-right-radius) var(--graupl-input-border-bottom-left-radius)` |\n// | `--graupl-fieldset-border-top-width` | The top border width for fieldset components. | `var(--graupl-input-border-top-width)` |\n// | `--graupl-fieldset-border-right-width` | The right border width for fieldset components. | `var(--graupl-input-border-right-width)` |\n// | `--graupl-fieldset-border-bottom-width` | The bottom border width for fieldset components. | `var(--graupl-input-border-bottom-width)` |\n// | `--graupl-fieldset-border-left-width` | The left border width for fieldset components. | `var(--graupl-input-border-left-width)` |\n// | `--graupl-fieldset-border-width` | The border width for fieldset components (combines top, right, bottom, and left widths). | `var(--graupl-fieldset-border-top-width) var(--graupl-fieldset-border-right-width) var(--graupl-fieldset-border-bottom-width) var(--graupl-fieldset-border-left-width)` |\n// | `--graupl-fieldset-border-top-style` | The top border style for fieldset components. | `var(--graupl-input-border-top-style)` |\n// | `--graupl-fieldset-border-right-style` | The right border style for fieldset components. | `var(--graupl-input-border-right-style)` |\n// | `--graupl-fieldset-border-bottom-style` | The bottom border style for fieldset components. | `var(--graupl-input-border-bottom-style)` |\n// | `--graupl-fieldset-border-left-style` | The left border style for fieldset components. | `var(--graupl-input-border-left-style)` |\n// | `--graupl-fieldset-border-style` | The border style for fieldset components (combines top, right, bottom, and left styles). | `var(--graupl-fieldset-border-top-style) var(--graupl-fieldset-border-right-style) var(--graupl-fieldset-border-bottom-style) var(--graupl-fieldset-border-left-style)` |\n// | `--graupl-fieldset-border-top-left-radius` | The top-left border radius for fieldset components. | `var(--graupl-input-border-top-left-radius)` |\n// | `--graupl-fieldset-border-top-right-radius` | The top-right border radius for fieldset components. | `var(--graupl-input-border-top-right-radius)` |\n// | `--graupl-fieldset-border-bottom-right-radius` | The bottom-right border radius for fieldset components. | `var(--graupl-input-border-bottom-right-radius)` |\n// | `--graupl-fieldset-border-bottom-left-radius` | The bottom-left border radius for fieldset components. | `var(--graupl-input-border-bottom-left-radius)` |\n// | `--graupl-fieldset-border-radius` | The border radius for fieldset components (combines top-left, top-right, bottom-right, and bottom-left radii). | `var(--graupl-fieldset-border-top-left-radius) var(--graupl-fieldset-border-top-right-radius) var(--graupl-fieldset-border-bottom-right-radius) var(--graupl-fieldset-border-bottom-left-radius)` |\n// | `--graupl-input-border-color` | The border color for input components. | `var(--graupl-border-color)` |\n// | `--graupl-input-disabled-border-color` | The border color for disabled input components. | `var(--graupl-theme-active--secondary--200)` |\n// | `--graupl-fieldset-border-color` | The border color for fieldset components. | `var(--graupl-input-border-color)` |\n// | `--graupl-fieldset-disabled-border-color` | The border color for disabled fieldset components. | `var(--graupl-input-disabled-border-color)` |\n// | `--graupl-input-accent-color` | The accent color for input components. | `var(--graupl-input-color)` |\n//\n// The following sass variables can be used to customize the generation of the form components:\n// | Variable | Description | Default Value |\n// | -------------------------------------- | -------------------------------------------------------------------------- | ----------------------------------- |\n// | `$selector-base` | The selector base for the component. | `\"\"` |\n// | `$modifier-selector-base` | The selector base for component modifiers. | `$selector-base` |\n// | `$generate-base-theme-map` | Flag to generate the base theme maps for form elements. | `true` |\n// | `$themeable` | Flag to generate theme modifiers. | `false` |\n// | `$input-selector-base` | The base selector for the input component. | `$selector-base` |\n// | `$input-selector` | The input component selector. | `input` |\n// | `$input-theme-prefix-selector-base` | Selector base used for input theme modifiers. | `$modifier-selector-base` |\n// | `$input-theme-prefix-selector` | Selector prefix used for input theme modifiers. | `\"\"` |\n// | `$textarea-selector-base` | The base selector for the textarea component. | `$selector-base` |\n// | `$textarea-selector` | The textarea component selector. | `textarea` |\n// | `$select-selector-base` | The base selector for the select component. | `$selector-base` |\n// | `$select-selector` | The select component selector. | `select` |\n// | `$label-selector-base` | The base selector for the label component. | `$selector-base` |\n// | `$label-selector` | The label component selector. | `label` |\n// | `$label-theme-prefix-selector-base` | Selector base used for label theme modifiers. | `$input-theme-prefix-selector-base` |\n// | `$label-theme-prefix-selector` | Selector prefix used for label theme modifiers. | `$input-theme-prefix-selector` |\n// | `$fieldset-selector-base` | The base selector for the fieldset component. | `$selector-base` |\n// | `$fieldset-selector` | The fieldset component selector. | `fieldset` |\n// | `$fieldset-theme-prefix-selector-base` | Selector base used for fieldset theme modifiers. | `$input-theme-prefix-selector-base` |\n// | `$fieldset-theme-prefix-selector` | Selector prefix used for fieldset theme modifiers. | `$input-theme-prefix-selector` |\n// | `$fieldset-direction` | The direction of fieldset component items. | `column` |\n// | `$input-theme-mappings` | Map of properties and shade values applied to themed input variants. | `()` |\n// | `$input-theme-map` | Fully expanded property map used to generate themed input variants. | `()` |\n// | `$label-theme-mappings` | Map of properties and shade values applied to themed label variants. | `()` |\n// | `$label-theme-map` | Fully expanded property map used to generate themed label variants. | `()` |\n// | `$fieldset-theme-mappings` | Map of properties and shade values applied to themed fieldset variants. | `()` |\n// | `$fieldset-theme-map` | Fully expanded property map used to generate themed fieldset variants. | `()` |\n//\n// ## Using `$input-theme-mappings`, `$label-theme-mappings`, and `$fieldset-theme-mappings`\n//\n// Each of these variables is a single-level map of properties and shade values.\n//\n// e.g.\n// ```scss\n// $input-theme-mappings: (\n// color: 900,\n// background: 100,\n// border-color: 700,\n// );\n// ```\n//\n// This directly[1] informs all input variants what shade to use for each property key.\n// Based on the example above:\n// - Primary inputs expose `--graupl-input-color`, `--graupl-input-background`, and `--graupl-input-border-color` as `var(--graupl-theme-active--primary--900/100/700)`,\n// - Secondary inputs expose those properties via the secondary palette, and\n// - Tertiary inputs expose those properties via the tertiary palette.\n//\n// The same pattern applies to `$label-theme-mappings` and `$fieldset-theme-mappings`, ensuring every form element stays in sync across variants.\n//\n// ```scss\n// $label-theme-mappings: (\n// color: 800,\n// );\n// $fieldset-theme-mappings: (\n// background: 50,\n// border-color: 600,\n// );\n// ```\n//\n// - Primary labels use `--graupl-theme-active--primary--800` for `--graupl-label-color`,\n// - Primary fieldsets use `--graupl-theme-active--primary--50` / `--graupl-theme-active--primary--600` for their background/border colours, and other variants follow suit using their palettes.\n//\n// [1] Each `*-theme-mappings` map gets parsed into a larger, more explicit map: the corresponding `*-theme-map`.\n//\n// ## Using `$input-theme-map`, `$label-theme-map`, and `$fieldset-theme-map`\n//\n// These variables are multi-level maps of properties, colours, and shade values, allowing you to override individual variants without affecting the others.\n//\n// e.g.\n// ```scss\n// $input-theme-map: (\n// primary: (\n// border-color: (\n// color: primary,\n// shade: 950,\n// ),\n// ),\n// secondary: (\n// background: (\n// color: secondary,\n// shade: 200,\n// ),\n// ),\n// );\n// ```\n//\n// This example deepens the primary input border colour while lightening the secondary input background. You can mix and match overrides for labels and fieldsets in their respective maps to target variants independently.\n//\n// @example\n// <label for=\"input-id\">Input Label</label>\n// <input id=\"input-id\" type=\"text\" placeholder=\"Enter text\" />\n//\n// @example\n// <label for=\"textarea-id\">Textarea Label</label>\n// <textarea id=\"textarea-id\" placeholder=\"Enter text\"></textarea>\n//\n// @example\n// <label for=\"select-id\">Select Label</label>\n// <select id=\"select-id\">\n// <option value=\"1\">Option 1</option>\n// <option value=\"2\">Option 2</option>\n// </select>\n//\n// @example\n// <fieldset>\n// <legend>Fieldset Legend</legend>\n// <label for=\"input-id\">Input Label</label>\n// <input id=\"input-id\" type=\"text\" placeholder=\"Enter text\" />\n// <label for=\"textarea-id\">Textarea Label</label>\n// <textarea id=\"textarea-id\" placeholder=\"Enter text\"></textarea>\n// <label for=\"select-id\">Select Label</label>\n// <select id=\"select-id\">\n// <option value=\"1\">Option 1</option>\n// <option value=\"2\">Option 2</option>\n// </select>\n// </fieldset>\n\n@use \"../../defaults\" as root-defaults;\n@use \"../../mixins/layer\" as *;\n@use \"../../mixins/theme\";\n@use \"defaults\";\n@use \"sass:map\";\n@use \"variables\" as *;\n\n@include layer(base) {\n // input, textarea, select\n #{defaults.$input-selector-base}#{defaults.$input-selector},\n #{defaults.$textarea-selector-base}#{defaults.$textarea-selector},\n #{defaults.$select-selector-base}#{defaults.$select-selector} {\n padding: $input-padding;\n border-width: $input-border-width;\n border-style: $input-border-style;\n border-radius: $input-border-radius;\n font-size: $input-font-size;\n\n @each $selector in map.get(root-defaults.$state-selectors, \"disabled\") {\n // e.g :disabled, .disabled\n &#{$selector} {\n cursor: not-allowed;\n }\n }\n }\n\n // label\n #{defaults.$label-selector-base}#{defaults.$label-selector} {\n font-size: $label-font-size;\n }\n\n // fieldset\n #{defaults.$fieldset-selector-base}#{defaults.$fieldset-selector} {\n display: flex;\n flex-flow: $fieldset-direction wrap;\n gap: $fieldset-gap;\n padding: $fieldset-padding;\n border-width: $fieldset-border-width;\n border-style: $fieldset-border-style;\n border-radius: $fieldset-border-radius;\n font-size: $fieldset-font-size;\n\n @each $selector in map.get(root-defaults.$state-selectors, \"disabled\") {\n // e.g :disabled, .disabled\n &#{$selector} {\n #{defaults.$input-selector},\n #{defaults.$textarea-selector},\n #{defaults.$select-selector} {\n cursor: not-allowed;\n }\n }\n }\n }\n}\n\n@include layer(theme) {\n // input, textarea, select\n #{defaults.$input-selector-base}#{defaults.$input-selector},\n #{defaults.$textarea-selector-base}#{defaults.$textarea-selector},\n #{defaults.$select-selector-base}#{defaults.$select-selector} {\n border-color: $input-border-color;\n background: $input-background;\n color: $input-color;\n accent-color: $input-accent-color;\n\n &::placeholder {\n color: $input-placeholder-color;\n }\n\n @each $selector in map.get(root-defaults.$state-selectors, \"disabled\") {\n // e.g :disabled, .disabled\n &#{$selector} {\n border-color: $input-disabled-border-color;\n color: $input-disabled-color;\n\n &::placeholder {\n color: $input-placeholder-disabled-color;\n }\n }\n }\n\n @if root-defaults.$themeable-components and defaults.$themeable {\n @include theme.generate-modifiers(\n defaults.$input-theme-map,\n defaults.$input-theme-prefix-selector-base,\n defaults.$input-theme-prefix-selector,\n \"input-\"\n );\n }\n }\n\n // label\n #{defaults.$label-selector-base}#{defaults.$label-selector} {\n color: $label-color;\n\n @each $selector in map.get(root-defaults.$state-selectors, \"disabled\") {\n // &:has(:disabled, .disabled)\n &:has(\n + #{defaults.$input-selector-base}#{defaults.$input-selector}#{$selector},\n + #{defaults.$textarea-selector-base}#{defaults.$textarea-selector}#{$selector},\n + #{defaults.$select-selector-base}#{defaults.$select-selector}#{$selector}\n ) {\n color: $label-disabled-color;\n }\n }\n\n @if root-defaults.$themeable-components and defaults.$themeable {\n @include theme.generate-modifiers(\n defaults.$label-theme-map,\n defaults.$label-theme-prefix-selector-base,\n defaults.$label-theme-prefix-selector,\n \"label-\"\n );\n @include theme.generate-modifiers(\n defaults.$input-theme-map,\n defaults.$input-theme-prefix-selector-base,\n defaults.$input-theme-prefix-selector,\n \"input-\"\n );\n }\n }\n\n // fieldset\n #{defaults.$fieldset-selector-base}#{defaults.$fieldset-selector} {\n border-color: $fieldset-border-color;\n background: $fieldset-background;\n color: $fieldset-color;\n\n @each $selector in map.get(root-defaults.$state-selectors, \"disabled\") {\n // e.g :disabled, .disabled\n &#{$selector} {\n border-color: $fieldset-disabled-border-color;\n color: $fieldset-disabled-color;\n\n #{defaults.$label-selector} {\n color: $label-disabled-color;\n }\n }\n }\n\n @if root-defaults.$themeable-components and defaults.$themeable {\n @include theme.generate-modifiers(\n defaults.$fieldset-theme-map,\n defaults.$fieldset-theme-prefix-selector-base,\n defaults.$fieldset-theme-prefix-selector,\n \"fieldset-\"\n );\n @include theme.generate-modifiers(\n defaults.$label-theme-map,\n defaults.$label-theme-prefix-selector-base,\n defaults.$label-theme-prefix-selector,\n \"label-\"\n );\n @include theme.generate-modifiers(\n defaults.$input-theme-map,\n defaults.$input-theme-prefix-selector-base,\n defaults.$input-theme-prefix-selector,\n \"input-\"\n );\n }\n }\n}\n","// @graupl/core form base variables.\n//\n// These values are to be used to directly style bases and provide a\n// cleaner way to reference custom properties.\n\n// Custom property defaults:\n// | Custom property | Default |\n// | -------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |\n// | --graupl-input-padding-x | var(--graupl-spacer-5) |\n// | --graupl-input-padding-y | var(--graupl-spacer-3) |\n// | --graupl-input-padding | var(--graupl-input-padding-y) var(--graupl-input-padding-x) |\n// | --graupl-input-font-size | var(--graupl-font-base) |\n// | --graupl-label-font-size | var(--graupl-input-font-size) |\n// | --graupl-fieldset-direction | column |\n// | --graupl-fieldset-gap | var(--graupl-spacer-2) |\n// | --graupl-fieldset-padding-x | var(--graupl-input-padding-x) |\n// | --graupl-fieldset-padding-y | var(--graupl-input-padding-y) |\n// | --graupl-fieldset-padding | var(--graupl-fieldset-padding-y) var(--graupl-fieldset-padding-x) |\n// | --graupl-fieldset-font-size | var(--graupl-input-font-size) |\n// | --graupl-input-background | var(--graupl-background) |\n// | --graupl-fieldset-background | var(--graupl-input-background) |\n// | --graupl-input-color | var(--graupl-color) |\n// | --graupl-input-placeholder-color | var(--graupl-theme-active--secondary--600) |\n// | --graupl-label-color | var(--graupl-input-color) |\n// | --graupl-fieldset-color | var(--graupl-input-color) |\n// | --graupl-input-disabled-color | var(--graupl-theme-active--secondary--400) |\n// | --graupl-input-placeholder-disabled-color | var(--graupl-input-disabled-color) |\n// | --graupl-label-disabled-color | var(--graupl-input-disabled-color) |\n// | --graupl-fieldset-disabled-color | var(--graupl-input-disabled-color) |\n// | --graupl-input-border-top-width | var(--graupl-border-top-width) |\n// | --graupl-input-border-right-width | var(--graupl-border-right-width) |\n// | --graupl-input-border-bottom-width | var(--graupl-border-bottom-width) |\n// | --graupl-input-border-left-width | var(--graupl-border-left-width) |\n// | --graupl-input-border-width | var(--graupl-input-border-top-width) var(--graupl-input-border-right-width) var(--graupl-input-border-bottom-width) var(--graupl-input-border-left-width) |\n// | --graupl-input-border-top-style | var(--graupl-border-top-style) |\n// | --graupl-input-border-right-style | var(--graupl-border-right-style) |\n// | --graupl-input-border-bottom-style | var(--graupl-border-bottom-style) |\n// | --graupl-input-border-left-style | var(--graupl-border-left-style) |\n// | --graupl-input-border-style | var(--graupl-input-border-top-style) var(--graupl-input-border-right-style) var(--graupl-input-border-bottom-style) var(--graupl-input-border-left-style) |\n// | --graupl-input-border-top-left-radius | var(--graupl-border-top-left-radius) |\n// | --graupl-input-border-top-right-radius | var(--graupl-border-top-right-radius) |\n// | --graupl-input-border-bottom-left-radius | var(--graupl-border-bottom-left-radius) |\n// | --graupl-input-border-bottom-right-radius | var(--graupl-border-bottom-right-radius) |\n// | --graupl-input-border-radius | var(--graupl-input-border-top-left-radius) var(--graupl-input-border-top-right-radius) var(--graupl-input-border-bottom-right-radius) var(--graupl-input-border-bottom-left-radius) |\n// | --graupl-fieldset-border-top-width | var(--graupl-input-border-top-width) |\n// | --graupl-fieldset-border-right-width | var(--graupl-input-border-right-width) |\n// | --graupl-fieldset-border-bottom-width | var(--graupl-input-border-bottom-width) |\n// | --graupl-fieldset-border-left-width | var(--graupl-input-border-left-width) |\n// | --graupl-fieldset-border-width | var(--graupl-fieldset-border-top-width) var(--graupl-fieldset-border-right-width) var(--graupl-fieldset-border-bottom-width) var(--graupl-fieldset-border-left-width) |\n// | --graupl-fieldset-border-top-style | var(--graupl-input-border-top-style) |\n// | --graupl-fieldset-border-right-style | var(--graupl-input-border-right-style) |\n// | --graupl-fieldset-border-bottom-style | var(--graupl-input-border-bottom-style) |\n// | --graupl-fieldset-border-left-style | var(--graupl-input-border-left-style) |\n// | --graupl-fieldset-border-style | var(--graupl-fieldset-border-top-style) var(--graupl-fieldset-border-right-style) var(--graupl-fieldset-border-bottom-style) var(--graupl-fieldset-border-left-style) |\n// | --graupl-fieldset-border-top-left-radius | var(--graupl-input-border-top-left-radius) |\n// | --graupl-fieldset-border-top-right-radius | var(--graupl-input-border-top-right-radius) |\n// | --graupl-fieldset-border-bottom-left-radius | var(--graupl-input-border-bottom-left-radius) |\n// | --graupl-fieldset-border-bottom-right-radius | var(--graupl-input-border-bottom-right-radius) |\n// | --graupl-fieldset-border-radius | var(--graupl-fieldset-border-top-left-radius) var(--graupl-fieldset-border-top-right-radius) var(--graupl-fieldset-border-bottom-right-radius) var(--graupl-fieldset-border-bottom-left-radius) |\n// | --graupl-input-border-color | var(--graupl-border-color) |\n// | --graupl-input-disabled-border-color | var(--graupl-theme-active--secondary--200) |\n// | --graupl-fieldset-border-color | var(--graupl-input-border-color) |\n// | --graupl-fieldset-disabled-border-color | var(--graupl-input-disabled-border-color) |\n// | --graupl-input-accent-color | var(--graupl-input-color) |\n\n@use \"defaults\";\n@use \"../../variables\" as root-variables;\n@use \"../../defaults\" as root-defaults;\n@use \"../../theme/typography/variables\" as typography;\n@use \"../../theme/color/variables\" as color;\n@use \"../../functions/theme\";\n@use \"sass:map\";\n\n// --graupl-input-padding-x\n$input-padding-x: var(\n --#{root-defaults.$prefix}input-padding-x,\n #{map.get(root-variables.$spacers, 5)}\n);\n\n// --graupl-input-padding-y\n$input-padding-y: var(\n --#{root-defaults.$prefix}input-padding-y,\n #{map.get(root-variables.$spacers, 3)}\n);\n\n// --graupl-input-padding\n$input-padding: var(\n --#{root-defaults.$prefix}input-padding,\n #{$input-padding-y} #{$input-padding-x}\n);\n\n// --graupl-input-font-size\n$input-font-size: var(\n --#{root-defaults.$prefix}input-font-size,\n #{map.get(typography.$font-sizes, base)}\n);\n\n// --graupl-label-font-size\n$label-font-size: var(\n --#{root-defaults.$prefix}label-font-size,\n #{$input-font-size}\n);\n\n// --graupl-fieldset-direction\n$fieldset-direction: var(\n --#{root-defaults.$prefix}fieldset-direction,\n #{defaults.$fieldset-direction}\n);\n\n// --graupl-fieldset-gap\n$fieldset-gap: var(\n --#{root-defaults.$prefix}fieldset-gap,\n map.get(root-variables.$spacers, 2)\n);\n\n// --graupl-fieldset-padding-x\n$fieldset-padding-x: var(\n --#{root-defaults.$prefix}fieldset-padding-x,\n #{$input-padding-x}\n);\n\n// --graupl-fieldset-padding-y\n$fieldset-padding-y: var(\n --#{root-defaults.$prefix}fieldset-padding-y,\n #{$input-padding-y}\n);\n\n// --graupl-fieldset-padding\n$fieldset-padding: var(\n --#{root-defaults.$prefix}fieldset-padding,\n #{$fieldset-padding-y} #{$fieldset-padding-x}\n);\n\n// --graupl-fieldset-font-size\n$fieldset-font-size: var(\n --#{root-defaults.$prefix}fieldset-font-size,\n #{$input-font-size}\n);\n\n// Background properties.\n// --graupl-input-background\n$input-background: var(\n --#{root-defaults.$prefix}input-background,\n #{color.$background}\n);\n\n// --graupl-fieldset-background\n$fieldset-background: var(\n --#{root-defaults.$prefix}fieldset-background,\n #{$input-background}\n);\n\n// Text properties.\n// --graupl-input-color\n$input-color: var(--#{root-defaults.$prefix}input-color, #{color.$color});\n\n// --graupl-input-placeholder-color\n$input-placeholder-color: var(\n --#{root-defaults.$prefix}input-placeholder-color,\n #{theme.get(secondary, 600)}\n);\n\n// --graupl-label-color\n$label-color: var(--#{root-defaults.$prefix}label-color, #{$input-color});\n\n// --graupl-fieldset-color\n$fieldset-color: var(--#{root-defaults.$prefix}fieldset-color, #{$input-color});\n\n// --graupl-input-disabled-color\n$input-disabled-color: var(\n --#{root-defaults.$prefix}input-disabled-color,\n #{theme.get(secondary, 400)}\n);\n\n// --graupl-input-placeholder-disabled-color\n$input-placeholder-disabled-color: var(\n --#{root-defaults.$prefix}input-placeholder-disabled-color,\n #{$input-disabled-color}\n);\n\n// --graupl-label-disabled-color\n$label-disabled-color: var(\n --#{root-defaults.$prefix}label-disabled-color,\n #{$input-disabled-color}\n);\n\n// --graupl-fieldset-disabled-color\n$fieldset-disabled-color: var(\n --#{root-defaults.$prefix}fieldset-disabled-color,\n #{$input-disabled-color}\n);\n\n// Border properties.\n// --graupl-input-border-top-width\n$input-border-top-width: var(\n --#{root-defaults.$prefix}input-border-top-width,\n #{root-variables.$border-top-width}\n);\n\n// --graupl-input-border-right-width\n$input-border-right-width: var(\n --#{root-defaults.$prefix}input-border-right-width,\n #{root-variables.$border-right-width}\n);\n\n// --graupl-input-border-bottom-width\n$input-border-bottom-width: var(\n --#{root-defaults.$prefix}input-border-bottom-width,\n #{root-variables.$border-bottom-width}\n);\n\n// --graupl-input-border-left-width\n$input-border-left-width: var(\n --#{root-defaults.$prefix}input-border-left-width,\n #{root-variables.$border-left-width}\n);\n\n// --graupl-input-border-width\n$input-border-width: var(\n --#{root-defaults.$prefix}input-border-width,\n #{$input-border-top-width} #{$input-border-right-width}\n #{$input-border-bottom-width} #{$input-border-left-width}\n);\n\n// --graupl-input-border-top-style\n$input-border-top-style: var(\n --#{root-defaults.$prefix}input-border-top-style,\n #{root-variables.$border-top-style}\n);\n\n// --graupl-input-border-right-style\n$input-border-right-style: var(\n --#{root-defaults.$prefix}input-border-right-style,\n #{root-variables.$border-right-style}\n);\n\n// --graupl-input-border-bottom-style\n$input-border-bottom-style: var(\n --#{root-defaults.$prefix}input-border-bottom-style,\n #{root-variables.$border-bottom-style}\n);\n\n// --graupl-input-border-left-style\n$input-border-left-style: var(\n --#{root-defaults.$prefix}input-border-left-style,\n #{root-variables.$border-left-style}\n);\n\n// --graupl-input-border-style\n$input-border-style: var(\n --#{root-defaults.$prefix}input-border-style,\n #{$input-border-top-style} #{$input-border-right-style}\n #{$input-border-bottom-style} #{$input-border-left-style}\n);\n\n// --graupl-input-border-top-left-radius\n$input-border-top-left-radius: var(\n --#{root-defaults.$prefix}input-border-top-left-radius,\n #{root-variables.$border-top-left-radius}\n);\n\n// --graupl-input-border-top-right-radius\n$input-border-top-right-radius: var(\n --#{root-defaults.$prefix}input-border-top-right-radius,\n #{root-variables.$border-top-right-radius}\n);\n\n// --graupl-input-border-bottom-left-radius\n$input-border-bottom-left-radius: var(\n --#{root-defaults.$prefix}input-border-bottom-left-radius,\n #{root-variables.$border-bottom-left-radius}\n);\n\n// --graupl-input-border-bottom-right-radius\n$input-border-bottom-right-radius: var(\n --#{root-defaults.$prefix}input-border-bottom-right-radius,\n #{root-variables.$border-bottom-right-radius}\n);\n\n// --graupl-input-border-radius\n$input-border-radius: var(\n --#{root-defaults.$prefix}input-border-radius,\n #{$input-border-top-left-radius} #{$input-border-top-right-radius}\n #{$input-border-bottom-right-radius} #{$input-border-bottom-left-radius}\n);\n\n// --graupl-fieldset-border-top-width\n$fieldset-border-top-width: var(\n --#{root-defaults.$prefix}fieldset-border-top-width,\n #{$input-border-top-width}\n);\n\n// --graupl-fieldset-border-right-width\n$fieldset-border-right-width: var(\n --#{root-defaults.$prefix}fieldset-border-right-width,\n #{$input-border-right-width}\n);\n\n// --graupl-fieldset-border-bottom-width\n$fieldset-border-bottom-width: var(\n --#{root-defaults.$prefix}fieldset-border-bottom-width,\n #{$input-border-bottom-width}\n);\n\n// --graupl-fieldset-border-left-width\n$fieldset-border-left-width: var(\n --#{root-defaults.$prefix}fieldset-border-left-width,\n #{$input-border-left-width}\n);\n\n// --graupl-fieldset-border-width\n$fieldset-border-width: var(\n --#{root-defaults.$prefix}fieldset-border-width,\n #{$fieldset-border-top-width} #{$fieldset-border-right-width}\n #{$fieldset-border-bottom-width} #{$fieldset-border-left-width}\n);\n\n// --graupl-fieldset-border-top-style\n$fieldset-border-top-style: var(\n --#{root-defaults.$prefix}fieldset-border-top-style,\n #{$input-border-top-style}\n);\n\n// --graupl-fieldset-border-right-style\n$fieldset-border-right-style: var(\n --#{root-defaults.$prefix}fieldset-border-right-style,\n #{$input-border-right-style}\n);\n\n// --graupl-fieldset-border-bottom-style\n$fieldset-border-bottom-style: var(\n --#{root-defaults.$prefix}fieldset-border-bottom-style,\n #{$input-border-bottom-style}\n);\n\n// --graupl-fieldset-border-left-style\n$fieldset-border-left-style: var(\n --#{root-defaults.$prefix}fieldset-border-left-style,\n #{$input-border-left-style}\n);\n\n// --graupl-fieldset-border-style\n$fieldset-border-style: var(\n --#{root-defaults.$prefix}fieldset-border-style,\n #{$fieldset-border-top-style} #{$fieldset-border-right-style}\n #{$fieldset-border-bottom-style} #{$fieldset-border-left-style}\n);\n\n// --graupl-fieldset-border-top-left-radius\n$fieldset-border-top-left-radius: var(\n --#{root-defaults.$prefix}fieldset-border-top-left-radius,\n #{$input-border-top-left-radius}\n);\n\n// --graupl-fieldset-border-top-right-radius\n$fieldset-border-top-right-radius: var(\n --#{root-defaults.$prefix}fieldset-border-top-right-radius,\n #{$input-border-top-right-radius}\n);\n\n// --graupl-fieldset-border-bottom-left-radius\n$fieldset-border-bottom-left-radius: var(\n --#{root-defaults.$prefix}fieldset-border-bottom-left-radius,\n #{$input-border-bottom-left-radius}\n);\n\n// --graupl-fieldset-border-bottom-right-radius\n$fieldset-border-bottom-right-radius: var(\n --#{root-defaults.$prefix}fieldset-border-bottom-right-radius,\n #{$input-border-bottom-right-radius}\n);\n\n// --graupl-fieldset-border-radius\n$fieldset-border-radius: var(\n --#{root-defaults.$prefix}fieldset-border-radius,\n #{$fieldset-border-top-left-radius} #{$fieldset-border-top-right-radius}\n #{$fieldset-border-bottom-right-radius}\n #{$fieldset-border-bottom-left-radius}\n);\n\n// Border colour properties.\n// --graupl-input-border-color\n$input-border-color: var(\n --#{root-defaults.$prefix}input-border-color,\n #{color.$border-color}\n);\n\n// --graupl-input-disabled-border-color\n$input-disabled-border-color: var(\n --#{root-defaults.$prefix}input-disabled-border-color,\n #{theme.get(secondary, 200)}\n);\n\n// --graupl-fieldset-border-color\n$fieldset-border-color: var(\n --#{root-defaults.$prefix}fieldset-border-color,\n #{$input-border-color}\n);\n\n// --graupl-fieldset-disabled-border-color\n$fieldset-disabled-border-color: var(\n --#{root-defaults.$prefix}fieldset-disabled-border-color,\n #{$input-disabled-border-color}\n);\n\n// Accent color properties.\n// --graupl-input-accent-color\n$input-accent-color: var(\n --#{root-defaults.$prefix}input-accent-color,\n #{$input-color}\n);\n","// @graupl/core theme mixins.\n//\n// A series of mixins to tie styles to a theme-mode.\n\n@use \"../functions/theme\";\n@use \"../theme/color/defaults\" as color-defaults;\n@use \"../defaults\" as root-defaults;\n@use \"sass:map\";\n\n/// Applies styles to a specific theme mode.\n///\n/// @param {string} $theme-name\n/// The name of the theme mode to apply the styles to.\n@mixin theme($theme-name) {\n #{color-defaults.$theme-selector-base}#{color-defaults.$theme-selector-prefix}#{$theme-name}#{color-defaults.$theme-selector-suffix} {\n @content;\n }\n}\n\n/// Generates a theme modifiers with custom props.\n///\n/// @param {map} $theme-map\n/// The map of custom props.\n/// @param {string} $selector-base\n/// The selector base for the theme modifier.\n/// @param {string} $selector-prefix\n/// The selector prefix for the theme modifer.\n/// @param {string} $scope\n/// The scope of the custom properties.\n/// @param {string} $base\n/// The base selector to append the theme modifier to.\n@mixin generate-modifiers(\n $theme-map,\n $selector-base,\n $selector-prefix,\n $scope: \"\",\n $base: \"&\"\n) {\n @each $color, $map in $theme-map {\n // e.g. &.primary, &.secondary, &.tertiary\n #{$base}#{$selector-base}#{$selector-prefix}#{$color} {\n @each $prop, $value in $map {\n --#{root-defaults.$prefix}#{$scope}#{$prop}: #{theme.get(\n map.get($value, color),\n map.get($value, shade)\n )};\n }\n }\n }\n}\n"],"names":[]}
package/dist/css/base/link.css CHANGED
@@ -1,2 +1,2 @@
1
- @layer graupl.base{a{border-radius:var(--graupl-link-border-radius,var(--graupl-link-border-top-left-radius,var(--graupl-border-top-left-radius,var(--graupl-border-radius,.125rem))) var(--graupl-link-border-top-right-radius,var(--graupl-border-top-right-radius,var(--graupl-border-radius,.125rem))) var(--graupl-link-border-bottom-right-radius,var(--graupl-border-bottom-right-radius,var(--graupl-border-radius,.125rem))) var(--graupl-link-border-bottom-left-radius,var(--graupl-border-bottom-left-radius,var(--graupl-border-radius,.125rem))));border-style:var(--graupl-link-border-style,var(--graupl-link-border-top-style,var(--graupl-border-top-style,var(--graupl-border-style,solid))) var(--graupl-link-border-right-style,var(--graupl-border-right-style,var(--graupl-border-style,solid))) var(--graupl-link-border-bottom-style,var(--graupl-border-bottom-style,var(--graupl-border-style,solid))) var(--graupl-link-border-left-style,var(--graupl-border-left-style,var(--graupl-border-style,solid))));border-width:var(--graupl-link-border-width,var(--graupl-link-border-top-width,0) var(--graupl-link-border-right-width,0) var(--graupl-link-border-bottom-width,0) var(--graupl-link-border-left-width,0));min-height:var(--graupl-link-min-height,auto);min-width:var(--graupl-link-min-width,auto);padding:var(--graupl-link-padding,var(--graupl-link-padding-y,var(--graupl-spacer-0,calc(var(--graupl-spacer, 1rem)*0))) var(--graupl-link-padding-x,var(--graupl-spacer-0,calc(var(--graupl-spacer, 1rem)*0))));-webkit-text-decoration:var(--graupl-link-text-decoration,underline);text-decoration:var(--graupl-link-text-decoration,underline);text-decoration-style:var(--graupl-link-text-decoration-style,solid);text-decoration-thickness:var(--graupl-link-text-decoration-thickness,var(--graupl-border-width,.125rem));transform:var(--graupl-link-transform,none);transition:var(--graupl-link-transition,background var(--graupl-transition-duration-fast,.15s) var(--graupl-transition-timing-function,ease),color var(--graupl-transition-duration-fast,.15s) var(--graupl-transition-timing-function,ease),transform var(--graupl-transition-duration-fast,.15s) var(--graupl-transition-timing-function,ease))}a.visited,a:visited{-webkit-text-decoration:var(--graupl-link-visited-text-decoration,var(--graupl-link-text-decoration,underline));text-decoration:var(--graupl-link-visited-text-decoration,var(--graupl-link-text-decoration,underline));text-decoration-style:var(--graupl-link-visited-text-decoration-style,var(--graupl-link-text-decoration-style,solid));text-decoration-thickness:var(--graupl-link-visited-text-decoration-thickness,var(--graupl-link-text-decoration-thickness,var(--graupl-border-width,.125rem)));transform:var(--graupl-link-visited-transform,var(--graupl-link-transform,none))}a:focus-visible{-webkit-text-decoration:var(--graupl-link-focus-text-decoration,var(--graupl-link-text-decoration,underline));text-decoration:var(--graupl-link-focus-text-decoration,var(--graupl-link-text-decoration,underline));text-decoration-style:var(--graupl-link-focus-text-decoration-style,var(--graupl-link-text-decoration-style,solid));text-decoration-thickness:var(--graupl-link-focus-text-decoration-thickness,var(--graupl-link-text-decoration-thickness,var(--graupl-border-width,.125rem)));transform:var(--graupl-link-focus-transform,var(--graupl-link-transform,none))}a.focus{-webkit-text-decoration:var(--graupl-link-focus-text-decoration,var(--graupl-link-text-decoration,underline));text-decoration:var(--graupl-link-focus-text-decoration,var(--graupl-link-text-decoration,underline));text-decoration-style:var(--graupl-link-focus-text-decoration-style,var(--graupl-link-text-decoration-style,solid));text-decoration-thickness:var(--graupl-link-focus-text-decoration-thickness,var(--graupl-link-text-decoration-thickness,var(--graupl-border-width,.125rem)));transform:var(--graupl-link-focus-transform,var(--graupl-link-transform,none))}a.hover,a:hover{-webkit-text-decoration:var(--graupl-link-hover-text-decoration,underline);text-decoration:var(--graupl-link-hover-text-decoration,underline);text-decoration-style:var(--graupl-link-hover-text-decoration-style,solid);text-decoration-thickness:var(--graupl-link-hover-text-decoration-thickness,var(--graupl-border-width,.125rem));transform:var(--graupl-link-hover-transform,none)}a.active,a:active{-webkit-text-decoration:var(--graupl-link-active-text-decoration,var(--graupl-link-hover-text-decoration,underline));text-decoration:var(--graupl-link-active-text-decoration,var(--graupl-link-hover-text-decoration,underline));text-decoration-style:var(--graupl-link-active-text-decoration-style,var(--graupl-link-hover-text-decoration-style,solid));text-decoration-thickness:var(--graupl-link-active-text-decoration-thickness,var(--graupl-link-hover-text-decoration-thickness,var(--graupl-border-width,.125rem)));transform:var(--graupl-link-active-transform,var(--graupl-link-hover-transform,none))}a:disabled{cursor:not-allowed}a:disabled,a:disabled.visited,a:disabled:visited{-webkit-text-decoration:var(--graupl-link-disabled-text-decoration,underline);text-decoration:var(--graupl-link-disabled-text-decoration,underline);text-decoration-style:var(--graupl-link-disabled-text-decoration-style,solid);text-decoration-thickness:var(--graupl-link-disabled-text-decoration-thickness,var(--graupl-border-width,.125rem));transform:var(--graupl-link-disabled-transform,none)}a:disabled:focus-visible{-webkit-text-decoration:var(--graupl-link-disabled-text-decoration,underline);text-decoration:var(--graupl-link-disabled-text-decoration,underline);text-decoration-style:var(--graupl-link-disabled-text-decoration-style,solid);text-decoration-thickness:var(--graupl-link-disabled-text-decoration-thickness,var(--graupl-border-width,.125rem));transform:var(--graupl-link-disabled-transform,none)}a:disabled.active,a:disabled.focus,a:disabled.hover,a:disabled:active,a:disabled:hover,a[disabled]{-webkit-text-decoration:var(--graupl-link-disabled-text-decoration,underline);text-decoration:var(--graupl-link-disabled-text-decoration,underline);text-decoration-style:var(--graupl-link-disabled-text-decoration-style,solid);text-decoration-thickness:var(--graupl-link-disabled-text-decoration-thickness,var(--graupl-border-width,.125rem));transform:var(--graupl-link-disabled-transform,none)}a[disabled]{cursor:not-allowed}a[disabled].visited,a[disabled]:visited{-webkit-text-decoration:var(--graupl-link-disabled-text-decoration,underline);text-decoration:var(--graupl-link-disabled-text-decoration,underline);text-decoration-style:var(--graupl-link-disabled-text-decoration-style,solid);text-decoration-thickness:var(--graupl-link-disabled-text-decoration-thickness,var(--graupl-border-width,.125rem));transform:var(--graupl-link-disabled-transform,none)}a[disabled]:focus-visible{-webkit-text-decoration:var(--graupl-link-disabled-text-decoration,underline);text-decoration:var(--graupl-link-disabled-text-decoration,underline);text-decoration-style:var(--graupl-link-disabled-text-decoration-style,solid);text-decoration-thickness:var(--graupl-link-disabled-text-decoration-thickness,var(--graupl-border-width,.125rem));transform:var(--graupl-link-disabled-transform,none)}a[aria-disabled=true],a[disabled].active,a[disabled].focus,a[disabled].hover,a[disabled]:active,a[disabled]:hover{-webkit-text-decoration:var(--graupl-link-disabled-text-decoration,underline);text-decoration:var(--graupl-link-disabled-text-decoration,underline);text-decoration-style:var(--graupl-link-disabled-text-decoration-style,solid);text-decoration-thickness:var(--graupl-link-disabled-text-decoration-thickness,var(--graupl-border-width,.125rem));transform:var(--graupl-link-disabled-transform,none)}a[aria-disabled=true]{cursor:not-allowed}a[aria-disabled=true].visited,a[aria-disabled=true]:visited{-webkit-text-decoration:var(--graupl-link-disabled-text-decoration,underline);text-decoration:var(--graupl-link-disabled-text-decoration,underline);text-decoration-style:var(--graupl-link-disabled-text-decoration-style,solid);text-decoration-thickness:var(--graupl-link-disabled-text-decoration-thickness,var(--graupl-border-width,.125rem));transform:var(--graupl-link-disabled-transform,none)}a[aria-disabled=true]:focus-visible{-webkit-text-decoration:var(--graupl-link-disabled-text-decoration,underline);text-decoration:var(--graupl-link-disabled-text-decoration,underline);text-decoration-style:var(--graupl-link-disabled-text-decoration-style,solid);text-decoration-thickness:var(--graupl-link-disabled-text-decoration-thickness,var(--graupl-border-width,.125rem));transform:var(--graupl-link-disabled-transform,none)}a.disabled,a[aria-disabled=true].active,a[aria-disabled=true].focus,a[aria-disabled=true].hover,a[aria-disabled=true]:active,a[aria-disabled=true]:hover{-webkit-text-decoration:var(--graupl-link-disabled-text-decoration,underline);text-decoration:var(--graupl-link-disabled-text-decoration,underline);text-decoration-style:var(--graupl-link-disabled-text-decoration-style,solid);text-decoration-thickness:var(--graupl-link-disabled-text-decoration-thickness,var(--graupl-border-width,.125rem));transform:var(--graupl-link-disabled-transform,none)}a.disabled{cursor:not-allowed}a.disabled.visited,a.disabled:visited{-webkit-text-decoration:var(--graupl-link-disabled-text-decoration,underline);text-decoration:var(--graupl-link-disabled-text-decoration,underline);text-decoration-style:var(--graupl-link-disabled-text-decoration-style,solid);text-decoration-thickness:var(--graupl-link-disabled-text-decoration-thickness,var(--graupl-border-width,.125rem));transform:var(--graupl-link-disabled-transform,none)}a.disabled:focus-visible{-webkit-text-decoration:var(--graupl-link-disabled-text-decoration,underline);text-decoration:var(--graupl-link-disabled-text-decoration,underline);text-decoration-style:var(--graupl-link-disabled-text-decoration-style,solid);text-decoration-thickness:var(--graupl-link-disabled-text-decoration-thickness,var(--graupl-border-width,.125rem));transform:var(--graupl-link-disabled-transform,none)}a.disabled.active,a.disabled.focus,a.disabled.hover,a.disabled:active,a.disabled:hover{-webkit-text-decoration:var(--graupl-link-disabled-text-decoration,underline);text-decoration:var(--graupl-link-disabled-text-decoration,underline);text-decoration-style:var(--graupl-link-disabled-text-decoration-style,solid);text-decoration-thickness:var(--graupl-link-disabled-text-decoration-thickness,var(--graupl-border-width,.125rem));transform:var(--graupl-link-disabled-transform,none)}a.stretched{isolation:isolate}a.stretched:before{content:"";inset:0;position:absolute;z-index:var(--graupl-stretched-link-z-index,5)}@media (prefers-reduced-motion:reduce){a{--graupl-link-transition:var(--graupl-link-transition-reduced-motion,background var(--graupl-transition-timing-function,ease),color var(--graupl-transition-timing-function,ease))}}}@layer graupl.theme{a{background:var(--graupl-link-background,transparent);border-color:var(--graupl-link-border-color,transparent);color:var(--graupl-link-color,var(--graupl-theme-active--primary--700,var(--graupl-theme-light--primary--700,var(--graupl-primary--700,#1244a1))));text-decoration-color:var(--graupl-link-text-decoration-color,var(--graupl-link-color,var(--graupl-theme-active--primary--700,var(--graupl-theme-light--primary--700,var(--graupl-primary--700,#1244a1)))))}a.visited,a:visited{background:var(--graupl-link-visited-background,var(--graupl-link-background,transparent));border-color:var(--graupl-link-visited-border-color,var(--graupl-link-border-color,transparent));color:var(--graupl-link-visited-color,var(--graupl-link-color,var(--graupl-theme-active--primary--700,var(--graupl-theme-light--primary--700,var(--graupl-primary--700,#1244a1)))));text-decoration-color:var(--graupl-link-visited-text-decoration-color,var(--graupl-link-visited-color,var(--graupl-link-color,var(--graupl-theme-active--primary--700,var(--graupl-theme-light--primary--700,var(--graupl-primary--700,#1244a1))))))}a:focus-visible{background:var(--graupl-link-focus-background,var(--graupl-link-background,transparent));border-color:var(--graupl-link-focus-border-color,var(--graupl-link-border-color,transparent));color:var(--graupl-link-focus-color,var(--graupl-link-color,var(--graupl-theme-active--primary--700,var(--graupl-theme-light--primary--700,var(--graupl-primary--700,#1244a1)))));text-decoration-color:var(--graupl-link-focus-text-decoration-color,var(--graupl-link-focus-color,var(--graupl-link-color,var(--graupl-theme-active--primary--700,var(--graupl-theme-light--primary--700,var(--graupl-primary--700,#1244a1))))))}a.focus{background:var(--graupl-link-focus-background,var(--graupl-link-background,transparent));border-color:var(--graupl-link-focus-border-color,var(--graupl-link-border-color,transparent));color:var(--graupl-link-focus-color,var(--graupl-link-color,var(--graupl-theme-active--primary--700,var(--graupl-theme-light--primary--700,var(--graupl-primary--700,#1244a1)))));text-decoration-color:var(--graupl-link-focus-text-decoration-color,var(--graupl-link-focus-color,var(--graupl-link-color,var(--graupl-theme-active--primary--700,var(--graupl-theme-light--primary--700,var(--graupl-primary--700,#1244a1))))))}a.hover,a:hover{background:var(--graupl-link-hover-background,transparent);border-color:var(--graupl-link-hover-border-color,transparent);color:var(--graupl-link-hover-color,var(--graupl-theme-active--tertiary--700,var(--graupl-theme-light--tertiary--700,var(--graupl-tertiary--700,#931f46))));text-decoration-color:var(--graupl-link-hover-text-decoration-color,var(--graupl-link-hover-color,var(--graupl-theme-active--tertiary--700,var(--graupl-theme-light--tertiary--700,var(--graupl-tertiary--700,#931f46)))))}a.active,a:active{background:var(--graupl-link-active-background,var(--graupl-link-hover-background,transparent));border-color:var(--graupl-link-active-border-color,var(--graupl-link-hover-border-color,transparent));color:var(--graupl-link-active-color,var(--graupl-link-hover-color,var(--graupl-theme-active--tertiary--700,var(--graupl-theme-light--tertiary--700,var(--graupl-tertiary--700,#931f46)))));text-decoration-color:var(--graupl-link-active-text-decoration-color,var(--graupl-link-active-color,var(--graupl-link-hover-color,var(--graupl-theme-active--tertiary--700,var(--graupl-theme-light--tertiary--700,var(--graupl-tertiary--700,#931f46))))))}a:disabled,a:disabled.visited,a:disabled:visited{background:var(--graupl-link-disabled-background,transparent);border-color:var(--graupl-link-disabled-border-color,transparent);color:var(--graupl-link-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))));text-decoration-color:var(--graupl-link-disabled-text-decoration-color,var(--graupl-link-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa)))))}a:disabled:focus-visible{background:var(--graupl-link-disabled-background,transparent);border-color:var(--graupl-link-disabled-border-color,transparent);color:var(--graupl-link-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))));text-decoration-color:var(--graupl-link-disabled-text-decoration-color,var(--graupl-link-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa)))))}a:disabled.active,a:disabled.focus,a:disabled.hover,a:disabled:active,a:disabled:hover,a[disabled],a[disabled].visited,a[disabled]:visited{background:var(--graupl-link-disabled-background,transparent);border-color:var(--graupl-link-disabled-border-color,transparent);color:var(--graupl-link-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))));text-decoration-color:var(--graupl-link-disabled-text-decoration-color,var(--graupl-link-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa)))))}a[disabled]:focus-visible{background:var(--graupl-link-disabled-background,transparent);border-color:var(--graupl-link-disabled-border-color,transparent);color:var(--graupl-link-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))));text-decoration-color:var(--graupl-link-disabled-text-decoration-color,var(--graupl-link-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa)))))}a[aria-disabled=true],a[aria-disabled=true].visited,a[aria-disabled=true]:visited,a[disabled].active,a[disabled].focus,a[disabled].hover,a[disabled]:active,a[disabled]:hover{background:var(--graupl-link-disabled-background,transparent);border-color:var(--graupl-link-disabled-border-color,transparent);color:var(--graupl-link-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))));text-decoration-color:var(--graupl-link-disabled-text-decoration-color,var(--graupl-link-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa)))))}a[aria-disabled=true]:focus-visible{background:var(--graupl-link-disabled-background,transparent);border-color:var(--graupl-link-disabled-border-color,transparent);color:var(--graupl-link-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))));text-decoration-color:var(--graupl-link-disabled-text-decoration-color,var(--graupl-link-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa)))))}a.disabled,a.disabled.visited,a.disabled:visited,a[aria-disabled=true].active,a[aria-disabled=true].focus,a[aria-disabled=true].hover,a[aria-disabled=true]:active,a[aria-disabled=true]:hover{background:var(--graupl-link-disabled-background,transparent);border-color:var(--graupl-link-disabled-border-color,transparent);color:var(--graupl-link-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))));text-decoration-color:var(--graupl-link-disabled-text-decoration-color,var(--graupl-link-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa)))))}a.disabled:focus-visible{background:var(--graupl-link-disabled-background,transparent);border-color:var(--graupl-link-disabled-border-color,transparent);color:var(--graupl-link-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))));text-decoration-color:var(--graupl-link-disabled-text-decoration-color,var(--graupl-link-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa)))))}a.disabled.active,a.disabled.focus,a.disabled.hover,a.disabled:active,a.disabled:hover{background:var(--graupl-link-disabled-background,transparent);border-color:var(--graupl-link-disabled-border-color,transparent);color:var(--graupl-link-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))));text-decoration-color:var(--graupl-link-disabled-text-decoration-color,var(--graupl-link-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa)))))}}
2
- /*# sourceMappingURL=link.css.map */
1
+ @layer graupl.base{a{min-width:var(--graupl-link-min-width,auto);min-height:var(--graupl-link-min-height,auto);padding:var(--graupl-link-padding,var(--graupl-link-padding-y,var(--graupl-spacer-0,calc(0*var(--graupl-spacer,1rem))))var(--graupl-link-padding-x,var(--graupl-spacer-0,calc(0*var(--graupl-spacer,1rem)))));transform:var(--graupl-link-transform,none);transition:var(--graupl-link-transition,background var(--graupl-transition-duration-fast,.15s)var(--graupl-transition-timing-function,ease),color var(--graupl-transition-duration-fast,.15s)var(--graupl-transition-timing-function,ease),transform var(--graupl-transition-duration-fast,.15s)var(--graupl-transition-timing-function,ease));border-width:var(--graupl-link-border-width,var(--graupl-link-border-top-width,0)var(--graupl-link-border-right-width,0)var(--graupl-link-border-bottom-width,0)var(--graupl-link-border-left-width,0));border-style:var(--graupl-link-border-style,var(--graupl-link-border-top-style,var(--graupl-border-top-style,var(--graupl-border-style,solid)))var(--graupl-link-border-right-style,var(--graupl-border-right-style,var(--graupl-border-style,solid)))var(--graupl-link-border-bottom-style,var(--graupl-border-bottom-style,var(--graupl-border-style,solid)))var(--graupl-link-border-left-style,var(--graupl-border-left-style,var(--graupl-border-style,solid))));border-radius:var(--graupl-link-border-radius,var(--graupl-link-border-top-left-radius,var(--graupl-border-top-left-radius,var(--graupl-border-radius,.125rem)))var(--graupl-link-border-top-right-radius,var(--graupl-border-top-right-radius,var(--graupl-border-radius,.125rem)))var(--graupl-link-border-bottom-right-radius,var(--graupl-border-bottom-right-radius,var(--graupl-border-radius,.125rem)))var(--graupl-link-border-bottom-left-radius,var(--graupl-border-bottom-left-radius,var(--graupl-border-radius,.125rem))));text-decoration:var(--graupl-link-text-decoration,underline);text-decoration-style:var(--graupl-link-text-decoration-style,solid);text-decoration-thickness:var(--graupl-link-text-decoration-thickness,var(--graupl-border-width,.125rem))}a:visited,a.visited{transform:var(--graupl-link-visited-transform,var(--graupl-link-transform,none));text-decoration:var(--graupl-link-visited-text-decoration,var(--graupl-link-text-decoration,underline));text-decoration-style:var(--graupl-link-visited-text-decoration-style,var(--graupl-link-text-decoration-style,solid));text-decoration-thickness:var(--graupl-link-visited-text-decoration-thickness,var(--graupl-link-text-decoration-thickness,var(--graupl-border-width,.125rem)))}a:focus-visible,a.focus{transform:var(--graupl-link-focus-transform,var(--graupl-link-transform,none));text-decoration:var(--graupl-link-focus-text-decoration,var(--graupl-link-text-decoration,underline));text-decoration-style:var(--graupl-link-focus-text-decoration-style,var(--graupl-link-text-decoration-style,solid));text-decoration-thickness:var(--graupl-link-focus-text-decoration-thickness,var(--graupl-link-text-decoration-thickness,var(--graupl-border-width,.125rem)))}a:hover,a.hover{transform:var(--graupl-link-hover-transform,none);text-decoration:var(--graupl-link-hover-text-decoration,underline);text-decoration-style:var(--graupl-link-hover-text-decoration-style,solid);text-decoration-thickness:var(--graupl-link-hover-text-decoration-thickness,var(--graupl-border-width,.125rem))}a:active,a.active{transform:var(--graupl-link-active-transform,var(--graupl-link-hover-transform,none));text-decoration:var(--graupl-link-active-text-decoration,var(--graupl-link-hover-text-decoration,underline));text-decoration-style:var(--graupl-link-active-text-decoration-style,var(--graupl-link-hover-text-decoration-style,solid));text-decoration-thickness:var(--graupl-link-active-text-decoration-thickness,var(--graupl-link-hover-text-decoration-thickness,var(--graupl-border-width,.125rem)))}a:disabled,a:disabled:visited,a:disabled.visited,a:disabled:focus-visible,a:disabled.focus,a:disabled:hover,a:disabled.hover,a:disabled:active,a:disabled.active,a:disabled[aria-selected=true],a:disabled.selected,a:disabled[aria-current=true],a:disabled.current,a[disabled],a[disabled]:visited,a[disabled].visited,a[disabled]:focus-visible,a[disabled].focus,a[disabled]:hover,a[disabled].hover,a[disabled]:active,a[disabled].active,a[disabled][aria-selected=true],a[disabled].selected,a[disabled][aria-current=true],a[disabled].current,a[aria-disabled=true],a[aria-disabled=true]:visited,a[aria-disabled=true].visited,a[aria-disabled=true]:focus-visible,a[aria-disabled=true].focus,a[aria-disabled=true]:hover,a[aria-disabled=true].hover,a[aria-disabled=true]:active,a[aria-disabled=true].active,a[aria-disabled=true][aria-selected=true],a[aria-disabled=true].selected,a[aria-disabled=true][aria-current=true],a[aria-disabled=true].current,a.disabled,a.disabled:visited,a.disabled.visited,a.disabled:focus-visible,a.disabled.focus,a.disabled:hover,a.disabled.hover,a.disabled:active,a.disabled.active,a.disabled[aria-selected=true],a.disabled.selected,a.disabled[aria-current=true],a.disabled.current{transform:var(--graupl-link-disabled-transform,none);text-decoration:var(--graupl-link-disabled-text-decoration,underline);text-decoration-style:var(--graupl-link-disabled-text-decoration-style,solid);text-decoration-thickness:var(--graupl-link-disabled-text-decoration-thickness,var(--graupl-border-width,.125rem))}a.stretched{isolation:isolate}a.stretched:before{content:"";z-index:var(--graupl-stretched-link-z-index,5);position:absolute;inset:0}@media (prefers-reduced-motion:reduce){a{--graupl-link-transition:var(--graupl-link-transition-reduced-motion,background var(--graupl-transition-timing-function,ease),color var(--graupl-transition-timing-function,ease))}}}@layer graupl.theme{a{border-color:var(--graupl-link-border-color,transparent);background:var(--graupl-link-background,transparent);color:var(--graupl-link-color,var(--graupl-theme-active--primary--700,var(--graupl-theme-light--primary--700,var(--graupl-primary--700,#1244a1))));text-decoration-color:var(--graupl-link-text-decoration-color,var(--graupl-link-color,var(--graupl-theme-active--primary--700,var(--graupl-theme-light--primary--700,var(--graupl-primary--700,#1244a1)))))}a:visited,a.visited{border-color:var(--graupl-link-visited-border-color,var(--graupl-link-border-color,transparent));background:var(--graupl-link-visited-background,var(--graupl-link-background,transparent));color:var(--graupl-link-visited-color,var(--graupl-link-color,var(--graupl-theme-active--primary--700,var(--graupl-theme-light--primary--700,var(--graupl-primary--700,#1244a1)))));text-decoration-color:var(--graupl-link-visited-text-decoration-color,var(--graupl-link-visited-color,var(--graupl-link-color,var(--graupl-theme-active--primary--700,var(--graupl-theme-light--primary--700,var(--graupl-primary--700,#1244a1))))))}a:focus-visible,a.focus{border-color:var(--graupl-link-focus-border-color,var(--graupl-link-border-color,transparent));background:var(--graupl-link-focus-background,var(--graupl-link-background,transparent));color:var(--graupl-link-focus-color,var(--graupl-link-color,var(--graupl-theme-active--primary--700,var(--graupl-theme-light--primary--700,var(--graupl-primary--700,#1244a1)))));text-decoration-color:var(--graupl-link-focus-text-decoration-color,var(--graupl-link-focus-color,var(--graupl-link-color,var(--graupl-theme-active--primary--700,var(--graupl-theme-light--primary--700,var(--graupl-primary--700,#1244a1))))))}a:hover,a.hover{border-color:var(--graupl-link-hover-border-color,transparent);background:var(--graupl-link-hover-background,transparent);color:var(--graupl-link-hover-color,var(--graupl-theme-active--tertiary--700,var(--graupl-theme-light--tertiary--700,var(--graupl-tertiary--700,#931f46))));text-decoration-color:var(--graupl-link-hover-text-decoration-color,var(--graupl-link-hover-color,var(--graupl-theme-active--tertiary--700,var(--graupl-theme-light--tertiary--700,var(--graupl-tertiary--700,#931f46)))))}a:active,a.active{border-color:var(--graupl-link-active-border-color,var(--graupl-link-hover-border-color,transparent));background:var(--graupl-link-active-background,var(--graupl-link-hover-background,transparent));color:var(--graupl-link-active-color,var(--graupl-link-hover-color,var(--graupl-theme-active--tertiary--700,var(--graupl-theme-light--tertiary--700,var(--graupl-tertiary--700,#931f46)))));text-decoration-color:var(--graupl-link-active-text-decoration-color,var(--graupl-link-active-color,var(--graupl-link-hover-color,var(--graupl-theme-active--tertiary--700,var(--graupl-theme-light--tertiary--700,var(--graupl-tertiary--700,#931f46))))))}a:disabled,a:disabled:visited,a:disabled.visited,a:disabled:focus-visible,a:disabled.focus,a:disabled:hover,a:disabled.hover,a:disabled:active,a:disabled.active,a:disabled[aria-selected=true],a:disabled.selected,a:disabled[aria-current=true],a:disabled.current,a[disabled],a[disabled]:visited,a[disabled].visited,a[disabled]:focus-visible,a[disabled].focus,a[disabled]:hover,a[disabled].hover,a[disabled]:active,a[disabled].active,a[disabled][aria-selected=true],a[disabled].selected,a[disabled][aria-current=true],a[disabled].current,a[aria-disabled=true],a[aria-disabled=true]:visited,a[aria-disabled=true].visited,a[aria-disabled=true]:focus-visible,a[aria-disabled=true].focus,a[aria-disabled=true]:hover,a[aria-disabled=true].hover,a[aria-disabled=true]:active,a[aria-disabled=true].active,a[aria-disabled=true][aria-selected=true],a[aria-disabled=true].selected,a[aria-disabled=true][aria-current=true],a[aria-disabled=true].current,a.disabled,a.disabled:visited,a.disabled.visited,a.disabled:focus-visible,a.disabled.focus,a.disabled:hover,a.disabled.hover,a.disabled:active,a.disabled.active,a.disabled[aria-selected=true],a.disabled.selected,a.disabled[aria-current=true],a.disabled.current{border-color:var(--graupl-link-disabled-border-color,transparent);background:var(--graupl-link-disabled-background,transparent);color:var(--graupl-link-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))));text-decoration-color:var(--graupl-link-disabled-text-decoration-color,var(--graupl-link-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa)))))}}
2
+ /*# sourceMappingURL=link.css.map */