@linzjs/lui 11.3.1 → 11.4.0

package/dist/lui.esm.js

@@ -612,11 +612,6 @@ function LuiFormikForm(props) {
   }, React__default.createElement(Form, null, props.children, " ")));
 }
 
-var e=[],t=[];function n(n,r){if(n&&"undefined"!=typeof document){var a,s=!0===r.prepend?"prepend":"append",d=!0===r.singleTag,i="string"==typeof r.container?document.querySelector(r.container):document.getElementsByTagName("head")[0];if(d){var u=e.indexOf(i);-1===u&&(u=e.push(i)-1,t[u]={}),a=t[u]&&t[u][s]?t[u][s]:t[u][s]=c();}else a=c();65279===n.charCodeAt(0)&&(n=n.substring(1)),a.styleSheet?a.styleSheet.cssText+=n:a.appendChild(document.createTextNode(n));}function c(){var e=document.createElement("style");if(e.setAttribute("type","text/css"),r.attributes)for(var t=Object.keys(r.attributes),n=0;n<t.length;n++)e.setAttribute(t[n],r.attributes[t[n]]);var a="prepend"===s?"afterbegin":"beforeend";return i.insertAdjacentElement(a,e),e}}
-
-var css = "/**\n  @deprecated\n */\n/**\n  @deprecated\n */\n/**\n  @deprecated\n */\n:root {\n  --grey-80: #2a292c;\n  --grey-60: #6b6966;\n  --$gray: #989189;\n  --grey-20: #beb9b4;\n  --grey-10: #eaeaea;\n  --grey-05: #f9f9f9;\n  --teal: #00425d;\n  --sea: #007198;\n  --electric: #0096cc;\n  --spray: #73c8e1;\n  --polar: #e2f3f7;\n  --sherpa: #004b50;\n  --surfie: #017a76;\n  --persian: #00a599;\n  --downy: #73cdc8;\n  --iceberg: #dcf5f0;\n  --sacramento: #004e32;\n  --salem: #08814d;\n  --pigment: #0aa245;\n  --granny: #9bd79b;\n  --panache: #e9fae7;\n  --brand-primary: #004b50;\n  --brand-secondary: #017a76;\n  --success: #0aa245;\n  --success-bg: #e9fae7;\n  --info: #3a7cdf;\n  --info-bg: #d8e5f9;\n  --warning: #ea6a2e;\n  --warning-bg: #fbdfd2;\n  --error: #cc0000;\n  --error-focus: #5a0000;\n  --error-bg: #f5cccc;\n  --visited: #00425d;\n  --green-hover: #08814d;\n  --color-green-active: #004e32;\n  --green-btn: #0aa245;\n  --txt-link: #0096cc;\n  --color-primary-hover-btn: #007198;\n  --color-selection: #c7e9f3;\n  --heading-color: #017a76;\n  --heading-color--secondary: #2a292c;\n  --base-type-color: #2a292c;\n  --base-icon-color: #007198;\n  --disabled-color: #989189;\n  --disabled-color-dark: #6b6966;\n  --linz-color-primary: #023d48;\n  --linz-color-primary-hover: #01818a;\n  --linz-color-tertiary: #e1e44a;\n  --linz-color-tertiary-hover: #cdcf59;\n  --color-test-pink: #f09;\n  --linz-linear-gradient-blue: linear-gradient(70deg, #00425d 12%, #007198 100%);\n  --linz-linear-gradient-teal: linear-gradient(270deg, #00a599 1%, #73cdc8 100%);\n}\n\n.LuiCheckboxInput_LuiCheckboxInput__6b87fd8c {\n  margin-bottom: 24px;\n  box-sizing: border-box;\n}\n\n.LuiCheckboxInput_LuiCheckboxInputGroup__6b87fd8c {\n  display: block;\n  user-select: none;\n  cursor: pointer;\n}\n\n.LuiCheckboxInput_LuiCheckboxInputLabel__6b87fd8c {\n  position: relative;\n  display: flex;\n  flex-direction: row;\n  align-items: flex-start;\n  padding: 2px;\n  font-family: \"Open Sans\", system-ui, sans-serif;\n  font-style: normal;\n  font-weight: 600;\n  margin-bottom: 0.5rem;\n  font-size: 0.875rem;\n  line-height: 1.5rem;\n  color: #2a292c;\n  margin-bottom: 0;\n}\n.LuiCheckboxInput_isDisabled__6b87fd8c .LuiCheckboxInput_LuiCheckboxInputLabel__6b87fd8c {\n  cursor: not-allowed;\n  color: #989189;\n}\n\n.LuiCheckboxInput_LuiCheckboxInputInput__6b87fd8c {\n  width: 0.1px;\n  height: 0.1px;\n  opacity: 0;\n  overflow: hidden;\n  position: absolute;\n  z-index: -1;\n}\n\n.LuiCheckboxInput_LuiCheckboxInputLabel__6b87fd8c::before {\n  font-size: 18px;\n  line-height: 10px;\n  content: \" \";\n  display: block;\n  text-align: center;\n  color: transparent;\n  width: 23px;\n  height: 23px;\n  border: 2px solid #007198;\n  margin-right: 0.5rem;\n  border-radius: 5px;\n  transition: all 0.2s ease-in-out;\n}\n.LuiCheckboxInput_hasError__6b87fd8c .LuiCheckboxInput_LuiCheckboxInputLabel__6b87fd8c::before {\n  border-color: #eb5757;\n}\n\n.LuiCheckboxInput_LuiCheckboxInputError__6b87fd8c {\n  margin-top: 2px;\n  text-align: left;\n}\n\n.LuiCheckboxInput_LuiCheckboxInputErrorIcon__6b87fd8c {\n  margin-left: 2rem;\n}\n\n.LuiCheckboxInput_LuiCheckboxInputInput__6b87fd8c:checked + .LuiCheckboxInput_LuiCheckboxInputLabel__6b87fd8c::before,\n.LuiCheckboxInput_LuiCheckboxInput_IsChecked__6b87fd8c .LuiCheckboxInput_LuiCheckboxInputLabel__6b87fd8c::before {\n  color: white;\n  background: #007198 url(\"data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxNCAxMSI+CiAgICA8cGF0aCBmaWxsPSIjRkZGIiBkPSJNLjI5NyA0LjkzNGExLjAxMyAxLjAxMyAwIDAgMSAxLjM0NC0uMDc4bC4wODguMDc4TDUuMjU0IDguNDYgMTIuMjE5LjM1M2ExLjAxMyAxLjAxMyAwIDAgMSAxLjMzNC0uMThsLjA5NC4wNzJjLjM5NC4zMzguNDY0LjkxNC4xOCAxLjMzNGwtLjA3Mi4wOTQtNy42NzYgOC45MzVhMS4wMTMgMS4wMTMgMCAwIDEtMS4zOTguMTM0bC0uMDg3LS4wNzhMLjI5NyA2LjM2N2ExLjAxMyAxLjAxMyAwIDAgMSAwLTEuNDMzWiIvPgo8L3N2Zz4=\") no-repeat 50% 50%;\n  background-size: 15px;\n}\n\n.LuiCheckboxInput_LuiCheckboxInput_HasError__6b87fd8c .LuiCheckboxInput_LuiCheckboxInputLabel__6b87fd8c::before {\n  border-color: #cc0000;\n}\n\n.LuiCheckboxInput_LuiCheckboxInput_HasError__6b87fd8c.LuiCheckboxInput_LuiCheckboxInput_IsChecked__6b87fd8c .LuiCheckboxInput_LuiCheckboxInputLabel__6b87fd8c::before {\n  background-color: #cc0000;\n  border-color: #cc0000;\n}\n\n.LuiCheckboxInput_LuiCheckboxInputInput__6b87fd8c:disabled + .LuiCheckboxInput_LuiCheckboxInputLabel__6b87fd8c::before,\n.LuiCheckboxInput_LuiCheckboxInput_IsDisabled__6b87fd8c .LuiCheckboxInput_LuiCheckboxInputLabel__6b87fd8c::before {\n  background-color: #989189;\n  border-color: #989189;\n}\n\n.LuiCheckboxInput_LuiCheckboxInputInput__6b87fd8c:checked:disabled + .LuiCheckboxInput_LuiCheckboxInputLabel__6b87fd8c::before,\n.LuiCheckboxInput_LuiCheckboxInput_IsChecked__6b87fd8c.LuiCheckboxInput_LuiCheckboxInput_IsDisabled__6b87fd8c .LuiCheckboxInput_LuiCheckboxInputLabel__6b87fd8c::before {\n  color: white;\n  background-color: #989189;\n  border-color: #989189;\n}\n\n.LuiCheckboxInput_LuiCheckboxInput_Inline__6b87fd8c {\n  display: inline-block;\n}\n.LuiCheckboxInput_LuiCheckboxInput_Inline__6b87fd8c:not(:last-child) {\n  margin-bottom: 0;\n  margin-right: 24px;\n}";
-n(css,{});
-
 // NOTE: This is a generated file, nothing you do here matters
 
 var ic_account_circle = /*#__PURE__*/React__default.createElement("svg", {
@@ -943,8 +938,10 @@ var LuiIcon = function LuiIcon(_ref) {
   }, spanProps), iconSVG);
 };
 
-var css$1 = "/**\n  @deprecated\n */\n/**\n  @deprecated\n */\n/**\n  @deprecated\n */\n:root {\n  --grey-80: #2a292c;\n  --grey-60: #6b6966;\n  --$gray: #989189;\n  --grey-20: #beb9b4;\n  --grey-10: #eaeaea;\n  --grey-05: #f9f9f9;\n  --teal: #00425d;\n  --sea: #007198;\n  --electric: #0096cc;\n  --spray: #73c8e1;\n  --polar: #e2f3f7;\n  --sherpa: #004b50;\n  --surfie: #017a76;\n  --persian: #00a599;\n  --downy: #73cdc8;\n  --iceberg: #dcf5f0;\n  --sacramento: #004e32;\n  --salem: #08814d;\n  --pigment: #0aa245;\n  --granny: #9bd79b;\n  --panache: #e9fae7;\n  --brand-primary: #004b50;\n  --brand-secondary: #017a76;\n  --success: #0aa245;\n  --success-bg: #e9fae7;\n  --info: #3a7cdf;\n  --info-bg: #d8e5f9;\n  --warning: #ea6a2e;\n  --warning-bg: #fbdfd2;\n  --error: #cc0000;\n  --error-focus: #5a0000;\n  --error-bg: #f5cccc;\n  --visited: #00425d;\n  --green-hover: #08814d;\n  --color-green-active: #004e32;\n  --green-btn: #0aa245;\n  --txt-link: #0096cc;\n  --color-primary-hover-btn: #007198;\n  --color-selection: #c7e9f3;\n  --heading-color: #017a76;\n  --heading-color--secondary: #2a292c;\n  --base-type-color: #2a292c;\n  --base-icon-color: #007198;\n  --disabled-color: #989189;\n  --disabled-color-dark: #6b6966;\n  --linz-color-primary: #023d48;\n  --linz-color-primary-hover: #01818a;\n  --linz-color-tertiary: #e1e44a;\n  --linz-color-tertiary-hover: #cdcf59;\n  --color-test-pink: #f09;\n  --linz-linear-gradient-blue: linear-gradient(70deg, #00425d 12%, #007198 100%);\n  --linz-linear-gradient-teal: linear-gradient(270deg, #00a599 1%, #73cdc8 100%);\n}\n\n.LuiError_LuiError__b4d4eed5 {\n  font-family: \"Open Sans\", system-ui, sans-serif;\n  font-style: normal;\n  font-weight: 600;\n  margin-bottom: 0.5rem;\n  font-size: 0.875rem;\n  line-height: 1.5rem;\n  color: #2a292c;\n}\n.LuiError_LuiErrorErrorIcon__b4d4eed5 {\n  vertical-align: middle;\n  display: inline-block;\n}\n.LuiError_LuiErrorErrorText__b4d4eed5 {\n  margin-left: 0.5rem;\n}";
-n(css$1,{});
+var e=[],t=[];function n(n,r){if(n&&"undefined"!=typeof document){var a,s=!0===r.prepend?"prepend":"append",d=!0===r.singleTag,i="string"==typeof r.container?document.querySelector(r.container):document.getElementsByTagName("head")[0];if(d){var u=e.indexOf(i);-1===u&&(u=e.push(i)-1,t[u]={}),a=t[u]&&t[u][s]?t[u][s]:t[u][s]=c();}else a=c();65279===n.charCodeAt(0)&&(n=n.substring(1)),a.styleSheet?a.styleSheet.cssText+=n:a.appendChild(document.createTextNode(n));}function c(){var e=document.createElement("style");if(e.setAttribute("type","text/css"),r.attributes)for(var t=Object.keys(r.attributes),n=0;n<t.length;n++)e.setAttribute(t[n],r.attributes[t[n]]);var a="prepend"===s?"afterbegin":"beforeend";return i.insertAdjacentElement(a,e),e}}
+
+var css = "/**\n  @deprecated\n */\n/**\n  @deprecated\n */\n/**\n  @deprecated\n */\n:root {\n  --grey-80: #2a292c;\n  --grey-60: #6b6966;\n  --$gray: #989189;\n  --grey-20: #beb9b4;\n  --grey-10: #eaeaea;\n  --grey-05: #f9f9f9;\n  --teal: #00425d;\n  --sea: #007198;\n  --electric: #0096cc;\n  --spray: #73c8e1;\n  --polar: #e2f3f7;\n  --sherpa: #004b50;\n  --surfie: #017a76;\n  --persian: #00a599;\n  --downy: #73cdc8;\n  --iceberg: #dcf5f0;\n  --sacramento: #004e32;\n  --salem: #08814d;\n  --pigment: #0aa245;\n  --granny: #9bd79b;\n  --panache: #e9fae7;\n  --brand-primary: #004b50;\n  --brand-secondary: #017a76;\n  --success: #0aa245;\n  --success-bg: #e9fae7;\n  --info: #3a7cdf;\n  --info-bg: #d8e5f9;\n  --warning: #ea6a2e;\n  --warning-bg: #fbdfd2;\n  --error: #cc0000;\n  --error-focus: #5a0000;\n  --error-bg: #f5cccc;\n  --visited: #00425d;\n  --green-hover: #08814d;\n  --color-green-active: #004e32;\n  --green-btn: #0aa245;\n  --txt-link: #0096cc;\n  --color-primary-hover-btn: #007198;\n  --color-selection: #c7e9f3;\n  --heading-color: #017a76;\n  --heading-color--secondary: #2a292c;\n  --base-type-color: #2a292c;\n  --base-icon-color: #007198;\n  --disabled-color: #989189;\n  --disabled-color-dark: #6b6966;\n  --linz-color-primary: #023d48;\n  --linz-color-primary-hover: #01818a;\n  --linz-color-tertiary: #e1e44a;\n  --linz-color-tertiary-hover: #cdcf59;\n  --color-test-pink: #f09;\n  --linz-linear-gradient-blue: linear-gradient(70deg, #00425d 12%, #007198 100%);\n  --linz-linear-gradient-teal: linear-gradient(270deg, #00a599 1%, #73cdc8 100%);\n}\n\n.LuiError_LuiError__b4d4eed5 {\n  font-family: \"Open Sans\", system-ui, sans-serif;\n  font-style: normal;\n  font-weight: 600;\n  margin-bottom: 0.5rem;\n  font-size: 0.875rem;\n  line-height: 1.5rem;\n  color: #2a292c;\n}\n.LuiError_LuiErrorErrorIcon__b4d4eed5 {\n  vertical-align: middle;\n  display: inline-block;\n}\n.LuiError_LuiErrorErrorText__b4d4eed5 {\n  margin-left: 0.5rem;\n}";
+n(css,{});
 
 var LuiError = function LuiError(_ref) {
   var error = _ref.error,
@@ -962,9 +959,6 @@ var LuiError = function LuiError(_ref) {
   }, error));
 };
 
-var css$2 = ":root {\n  --grey-80: #2a292c;\n  --grey-60: #6b6966;\n  --$gray: #989189;\n  --grey-20: #beb9b4;\n  --grey-10: #eaeaea;\n  --grey-05: #f9f9f9;\n  --teal: #00425d;\n  --sea: #007198;\n  --electric: #0096cc;\n  --spray: #73c8e1;\n  --polar: #e2f3f7;\n  --sherpa: #004b50;\n  --surfie: #017a76;\n  --persian: #00a599;\n  --downy: #73cdc8;\n  --iceberg: #dcf5f0;\n  --sacramento: #004e32;\n  --salem: #08814d;\n  --pigment: #0aa245;\n  --granny: #9bd79b;\n  --panache: #e9fae7;\n  --brand-primary: #004b50;\n  --brand-secondary: #017a76;\n  --success: #0aa245;\n  --success-bg: #e9fae7;\n  --info: #3a7cdf;\n  --info-bg: #d8e5f9;\n  --warning: #ea6a2e;\n  --warning-bg: #fbdfd2;\n  --error: #cc0000;\n  --error-focus: #5a0000;\n  --error-bg: #f5cccc;\n  --visited: #00425d;\n  --green-hover: #08814d;\n  --color-green-active: #004e32;\n  --green-btn: #0aa245;\n  --txt-link: #0096cc;\n  --color-primary-hover-btn: #007198;\n  --color-selection: #c7e9f3;\n  --heading-color: #017a76;\n  --heading-color--secondary: #2a292c;\n  --base-type-color: #2a292c;\n  --base-icon-color: #007198;\n  --disabled-color: #989189;\n  --disabled-color-dark: #6b6966;\n  --linz-color-primary: #023d48;\n  --linz-color-primary-hover: #01818a;\n  --linz-color-tertiary: #e1e44a;\n  --linz-color-tertiary-hover: #cdcf59;\n  --color-test-pink: #f09;\n  --linz-linear-gradient-blue: linear-gradient(70deg, #00425d 12%, #007198 100%);\n  --linz-linear-gradient-teal: linear-gradient(270deg, #00a599 1%, #73cdc8 100%);\n}\n\n/**\n  @deprecated\n */\n/**\n  @deprecated\n */\n/**\n  @deprecated\n */\n.LuiTextInput_LuiTextInput__7a248431 {\n  margin-bottom: 24px;\n}\n.LuiTextInput_LuiTextInputLabel__7a248431 {\n  font-family: \"Open Sans\", system-ui, sans-serif;\n  font-style: normal;\n  font-weight: 600;\n  margin-bottom: 0.5rem;\n  font-size: 0.875rem;\n  line-height: 1.5rem;\n  color: #2a292c;\n}\n\n.LuiTextInput_LuiTextInputInputWrapper__7a248431 {\n  position: relative;\n  display: block;\n  box-shadow: -1px 0 0 0 transparent;\n  border-radius: 4px;\n  transition: box-shadow 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.3s, border-color 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.3s;\n}\n.LuiTextInput_hasError__7a248431 .LuiTextInput_LuiTextInputInputWrapper__7a248431 {\n  box-shadow: -8px 0px 0 0 #cc0000;\n  border-radius: 4px;\n}\n\n.LuiTextInput_LuiTextInputPasswordReveal__7a248431 {\n  position: absolute;\n  background: transparent;\n  min-height: 0;\n  min-width: 0;\n  margin: 0;\n  padding: 12px;\n  top: 50%;\n  right: 0;\n  transform: translateY(-50%);\n}\n.LuiTextInput_LuiTextInputPasswordReveal__7a248431:hover {\n  background: transparent;\n}\n\n.LuiTextInput_LuiTextInputInput__7a248431 {\n  font-family: \"Open Sans\", system-ui, sans-serif;\n  font-style: normal;\n  font-weight: normal;\n  margin-bottom: 0;\n  border: 1px solid #b2b2b2;\n  border-radius: 4px;\n  height: 48px;\n  color: #000000;\n  caret-color: #000000;\n  padding-top: 14px;\n  padding-right: 32px;\n  padding-bottom: 14px;\n  padding-left: 16px;\n  min-width: 300px;\n  transition: all 0.15 ease-in-out;\n  transition: border 0.2s ease;\n}\n.LuiTextInput_LuiTextInputInput__7a248431::placeholder {\n  font-weight: normal;\n  color: #6b6966;\n  opacity: 1;\n}\n.LuiTextInput_isDisabled__7a248431 .LuiTextInput_LuiTextInputInput__7a248431::placeholder {\n  color: #989189;\n}\n.LuiTextInput_LuiTextInputInput__7a248431:hover, .LuiTextInput_LuiTextInputInput__7a248431:active {\n  border-color: #053d52;\n}\n.LuiTextInput_LuiTextInputInput__7a248431:focus {\n  outline: none;\n  border-color: #053d52;\n}\n.LuiTextInput_hasError__7a248431 .LuiTextInput_LuiTextInputInput__7a248431 {\n  border-color: #cc0000 !important;\n}\n.LuiTextInput_isDisabled__7a248431 .LuiTextInput_LuiTextInputInput__7a248431 {\n  border-color: #beb9b4;\n  background-color: #eaeaea;\n  cursor: not-allowed;\n}\n\n.LuiTextInput_LuiTextInputError__7a248431 {\n  position: relative;\n  display: flex;\n  color: #cc0000;\n  text-align: left;\n  padding-left: 22px;\n  font-size: 14px;\n  line-height: 20px;\n  margin-top: 2px;\n}\n\n.LuiTextInput_LuiTextInputErrorIcon__7a248431 {\n  position: absolute;\n  left: 0;\n  top: 2px;\n}\n\n.LuiTextInput_LuiTextInputMandatory__7a248431 {\n  display: inline-block;\n  width: 10px;\n  margin: 0 0 0 -10px;\n  color: #cc0000;\n}\n\n.LuiTextInput_LuiFieldWrapper__7a248431 {\n  position: relative;\n  box-shadow: -1px 0 0 0 transparent;\n  border-radius: 4px;\n  transition: box-shadow 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.3s, border-color 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.3s;\n}\n.LuiTextInput_LuiFieldWrapper__7a248431 input {\n  transition: border 0.2s ease;\n}\n.LuiTextInput_LuiFieldWrapper__7a248431.LuiTextInput_LuiFieldWrapper_Error__7a248431 {\n  box-shadow: -12px 0px 0 0 #cc0000;\n  border-radius: 4px;\n}\n.LuiTextInput_LuiFieldWrapper__7a248431.LuiTextInput_LuiFieldWrapper_Error__7a248431 input {\n  border-color: #cc0000;\n}";
-n(css$2,{});
-
 function useGenerateOrDefaultId(idFromProps) {
   var _useState = useState(idFromProps ? idFromProps : v4()),
       id = _useState[0];
@@ -1164,9 +1158,6 @@ var extensionsAsHumanReadableList = function extensionsAsHumanReadableList(exten
   return uppercaseExtensions.slice(0, -1).join(', ') + " or " + uppercaseExtensions[extensions.length - 1];
 };
 
-var css$3 = ":root {\n  --grey-80: #2a292c;\n  --grey-60: #6b6966;\n  --$gray: #989189;\n  --grey-20: #beb9b4;\n  --grey-10: #eaeaea;\n  --grey-05: #f9f9f9;\n  --teal: #00425d;\n  --sea: #007198;\n  --electric: #0096cc;\n  --spray: #73c8e1;\n  --polar: #e2f3f7;\n  --sherpa: #004b50;\n  --surfie: #017a76;\n  --persian: #00a599;\n  --downy: #73cdc8;\n  --iceberg: #dcf5f0;\n  --sacramento: #004e32;\n  --salem: #08814d;\n  --pigment: #0aa245;\n  --granny: #9bd79b;\n  --panache: #e9fae7;\n  --brand-primary: #004b50;\n  --brand-secondary: #017a76;\n  --success: #0aa245;\n  --success-bg: #e9fae7;\n  --info: #3a7cdf;\n  --info-bg: #d8e5f9;\n  --warning: #ea6a2e;\n  --warning-bg: #fbdfd2;\n  --error: #cc0000;\n  --error-focus: #5a0000;\n  --error-bg: #f5cccc;\n  --visited: #00425d;\n  --green-hover: #08814d;\n  --color-green-active: #004e32;\n  --green-btn: #0aa245;\n  --txt-link: #0096cc;\n  --color-primary-hover-btn: #007198;\n  --color-selection: #c7e9f3;\n  --heading-color: #017a76;\n  --heading-color--secondary: #2a292c;\n  --base-type-color: #2a292c;\n  --base-icon-color: #007198;\n  --disabled-color: #989189;\n  --disabled-color-dark: #6b6966;\n  --linz-color-primary: #023d48;\n  --linz-color-primary-hover: #01818a;\n  --linz-color-tertiary: #e1e44a;\n  --linz-color-tertiary-hover: #cdcf59;\n  --color-test-pink: #f09;\n  --linz-linear-gradient-blue: linear-gradient(70deg, #00425d 12%, #007198 100%);\n  --linz-linear-gradient-teal: linear-gradient(270deg, #00a599 1%, #73cdc8 100%);\n}\n\n/**\n  @deprecated\n */\n/**\n  @deprecated\n */\n/**\n  @deprecated\n */\n.LuiSelectInput_LuiSelect__c0e7e1aa {\n  margin-bottom: 24px;\n}\n\n.LuiSelectInput_LuiSelectLabelText__c0e7e1aa {\n  font-family: \"Open Sans\", system-ui, sans-serif;\n  font-style: normal;\n  font-weight: 600;\n  margin-bottom: 0.5rem;\n  font-size: 0.875rem;\n  line-height: 1.5rem;\n  color: #2a292c;\n}\n\n.LuiSelectInput_LuiSelectSelect__c0e7e1aa {\n  font-family: \"Open Sans\", system-ui, sans-serif;\n  font-style: normal;\n  font-weight: normal;\n  margin-bottom: 0;\n  border: 1px solid #b2b2b2;\n  border-radius: 4px;\n  display: block;\n  height: 48px;\n  color: #000000;\n  caret-color: #000000;\n  padding-right: 32px;\n  padding-left: 16px;\n  width: 100%;\n  transition: all 0.15 ease-in-out;\n  appearance: none;\n}\n.LuiSelectInput_LuiSelectSelect__c0e7e1aa:hover, .LuiSelectInput_LuiSelectSelect__c0e7e1aa:active {\n  border-color: #053d52;\n  cursor: pointer;\n}\n.LuiSelectInput_LuiSelectSelect__c0e7e1aa:focus {\n  outline: none;\n  border-color: #053d52;\n}\n.LuiSelectInput_hasError__c0e7e1aa .LuiSelectInput_LuiSelectSelect__c0e7e1aa {\n  border-color: #eb5757;\n}\n.LuiSelectInput_isDisabled__c0e7e1aa .LuiSelectInput_LuiSelectSelect__c0e7e1aa {\n  border-color: #b2b2b2;\n  background-color: #fff;\n  color: #b2b2b2;\n  opacity: 0.3;\n  cursor: not-allowed;\n}\n.LuiSelectInput_hasPlaceholder__c0e7e1aa .LuiSelectInput_LuiSelectSelect__c0e7e1aa {\n  color: #b2b2b2;\n}\n.LuiSelectInput_hasValue__c0e7e1aa .LuiSelectInput_LuiSelectSelect__c0e7e1aa {\n  color: #2a292c;\n}\n\n.LuiSelectInput_LuiSelectWrapper__c0e7e1aa {\n  position: relative;\n  max-width: 300px;\n}\n\n.LuiSelectInput_LuiSelectChevronIcon__c0e7e1aa {\n  position: absolute;\n  right: 16px;\n  top: 50%;\n  transform: translateY(-50%);\n  pointer-events: none;\n}\n\n.LuiSelectInput_LuiSelectError__c0e7e1aa {\n  position: relative;\n  display: flex;\n  color: #eb5757;\n  text-align: left;\n  padding-left: 22px;\n  font-size: 14px;\n  line-height: 20px;\n  margin-top: 2px;\n}\n\n.LuiSelectInput_LuiSelectErrorIcon__c0e7e1aa {\n  position: absolute;\n  left: 0;\n  top: 2px;\n}";
-n(css$3,{});
-
 var LuiSelectInput = function LuiSelectInput(props) {
   var _props$selectProps;
 
@@ -1209,9 +1200,6 @@ var LuiSelectInput = function LuiSelectInput(props) {
   }), props.error)));
 };
 
-var css$4 = ":root {\n  --grey-80: #2a292c;\n  --grey-60: #6b6966;\n  --$gray: #989189;\n  --grey-20: #beb9b4;\n  --grey-10: #eaeaea;\n  --grey-05: #f9f9f9;\n  --teal: #00425d;\n  --sea: #007198;\n  --electric: #0096cc;\n  --spray: #73c8e1;\n  --polar: #e2f3f7;\n  --sherpa: #004b50;\n  --surfie: #017a76;\n  --persian: #00a599;\n  --downy: #73cdc8;\n  --iceberg: #dcf5f0;\n  --sacramento: #004e32;\n  --salem: #08814d;\n  --pigment: #0aa245;\n  --granny: #9bd79b;\n  --panache: #e9fae7;\n  --brand-primary: #004b50;\n  --brand-secondary: #017a76;\n  --success: #0aa245;\n  --success-bg: #e9fae7;\n  --info: #3a7cdf;\n  --info-bg: #d8e5f9;\n  --warning: #ea6a2e;\n  --warning-bg: #fbdfd2;\n  --error: #cc0000;\n  --error-focus: #5a0000;\n  --error-bg: #f5cccc;\n  --visited: #00425d;\n  --green-hover: #08814d;\n  --color-green-active: #004e32;\n  --green-btn: #0aa245;\n  --txt-link: #0096cc;\n  --color-primary-hover-btn: #007198;\n  --color-selection: #c7e9f3;\n  --heading-color: #017a76;\n  --heading-color--secondary: #2a292c;\n  --base-type-color: #2a292c;\n  --base-icon-color: #007198;\n  --disabled-color: #989189;\n  --disabled-color-dark: #6b6966;\n  --linz-color-primary: #023d48;\n  --linz-color-primary-hover: #01818a;\n  --linz-color-tertiary: #e1e44a;\n  --linz-color-tertiary-hover: #cdcf59;\n  --color-test-pink: #f09;\n  --linz-linear-gradient-blue: linear-gradient(70deg, #00425d 12%, #007198 100%);\n  --linz-linear-gradient-teal: linear-gradient(270deg, #00a599 1%, #73cdc8 100%);\n}\n\n/**\n  @deprecated\n */\n/**\n  @deprecated\n */\n/**\n  @deprecated\n */\n.LuiTextAreaInput_LuiTextAreaInput__02f8c8a8 {\n  width: 100%;\n  margin-bottom: 24px;\n  position: relative;\n}\n.LuiTextAreaInput_LuiTextAreaInput__02f8c8a8 textarea {\n  font-family: \"Open Sans\", system-ui, sans-serif;\n  font-style: normal;\n  font-weight: normal;\n  border-radius: 4px;\n  border: solid 1px #b2b2b2;\n  background: #fff;\n  padding-top: 14px;\n  padding-right: 32px;\n  padding-bottom: 14px;\n  padding-left: 16px;\n  box-sizing: border-box;\n  width: 100%;\n  resize: vertical;\n  min-height: 100px;\n}\n.LuiTextAreaInput_LuiTextAreaInput__02f8c8a8 textarea {\n  font-size: 14px;\n}\n@media screen and (min-width: 1px) {\n  .LuiTextAreaInput_LuiTextAreaInput__02f8c8a8 textarea {\n    font-size: calc(\n          14px + 2 *\n            (\n              (100vw - 1px) / 1279\n            )\n        );\n  }\n}\n@media screen and (min-width: 1280px) {\n  .LuiTextAreaInput_LuiTextAreaInput__02f8c8a8 textarea {\n    font-size: 16px;\n  }\n}\n.LuiTextAreaInput_LuiTextAreaInput__02f8c8a8 textarea::placeholder {\n  font-weight: normal;\n  color: #6b6966;\n  opacity: 1;\n}\n.LuiTextAreaInput_isDisabled__02f8c8a8 .LuiTextAreaInput_LuiTextAreaInput__02f8c8a8 textarea::placeholder {\n  color: #989189;\n}\n.LuiTextAreaInput_LuiTextAreaInput__02f8c8a8 textarea:focus {\n  outline: none;\n  border-color: #053d52;\n}\n.LuiTextAreaInput_LuiTextAreaInput__02f8c8a8 label,\n.LuiTextAreaInput_LuiTextAreaInput__02f8c8a8 textarea {\n  display: block;\n}\n.LuiTextAreaInput_LuiTextAreaInput__02f8c8a8.LuiTextAreaInput_hasError__02f8c8a8 textarea,\n.LuiTextAreaInput_LuiTextAreaInput__02f8c8a8.LuiTextAreaInput_hasError__02f8c8a8 select {\n  border-color: #eb5757;\n}\n.LuiTextAreaInput_LuiTextAreaInput__02f8c8a8.LuiTextAreaInput_isDisabled__02f8c8a8 textarea {\n  border-color: #b2b2b2;\n  background-color: #fff;\n  cursor: not-allowed;\n  opacity: 0.3;\n}\n.LuiTextAreaInput_LuiTextAreaInput__02f8c8a8.LuiTextAreaInput_isDisabled__02f8c8a8 label {\n  opacity: 0.3;\n}\n\n.LuiTextAreaInput_LuiTextAreaInputLabel__02f8c8a8 {\n  font-family: \"Open Sans\", system-ui, sans-serif;\n  font-style: normal;\n  font-weight: 600;\n  margin-bottom: 0.5rem;\n  font-size: 0.875rem;\n  line-height: 1.5rem;\n  color: #2a292c;\n}\n\n.LuiTextAreaInput_LuiTextAreaInputError__02f8c8a8 {\n  position: relative;\n  display: flex;\n  color: #eb5757;\n  text-align: left;\n  padding-left: 22px;\n  font-size: 14px;\n  line-height: 20px;\n  margin-top: 2px;\n}\n\n.LuiTextAreaInput_LuiTextAreaInputErrorIcon__02f8c8a8 {\n  position: absolute;\n  left: 0;\n  top: 2px;\n}";
-n(css$4,{});
-
 var LuiTextAreaInput = function LuiTextAreaInput(props) {
   var _props$inputProps;
 
@@ -1238,9 +1226,6 @@ var LuiTextAreaInput = function LuiTextAreaInput(props) {
   }), props.error));
 };
 
-var css$5 = ":root {\n  --grey-80: #2a292c;\n  --grey-60: #6b6966;\n  --$gray: #989189;\n  --grey-20: #beb9b4;\n  --grey-10: #eaeaea;\n  --grey-05: #f9f9f9;\n  --teal: #00425d;\n  --sea: #007198;\n  --electric: #0096cc;\n  --spray: #73c8e1;\n  --polar: #e2f3f7;\n  --sherpa: #004b50;\n  --surfie: #017a76;\n  --persian: #00a599;\n  --downy: #73cdc8;\n  --iceberg: #dcf5f0;\n  --sacramento: #004e32;\n  --salem: #08814d;\n  --pigment: #0aa245;\n  --granny: #9bd79b;\n  --panache: #e9fae7;\n  --brand-primary: #004b50;\n  --brand-secondary: #017a76;\n  --success: #0aa245;\n  --success-bg: #e9fae7;\n  --info: #3a7cdf;\n  --info-bg: #d8e5f9;\n  --warning: #ea6a2e;\n  --warning-bg: #fbdfd2;\n  --error: #cc0000;\n  --error-focus: #5a0000;\n  --error-bg: #f5cccc;\n  --visited: #00425d;\n  --green-hover: #08814d;\n  --color-green-active: #004e32;\n  --green-btn: #0aa245;\n  --txt-link: #0096cc;\n  --color-primary-hover-btn: #007198;\n  --color-selection: #c7e9f3;\n  --heading-color: #017a76;\n  --heading-color--secondary: #2a292c;\n  --base-type-color: #2a292c;\n  --base-icon-color: #007198;\n  --disabled-color: #989189;\n  --disabled-color-dark: #6b6966;\n  --linz-color-primary: #023d48;\n  --linz-color-primary-hover: #01818a;\n  --linz-color-tertiary: #e1e44a;\n  --linz-color-tertiary-hover: #cdcf59;\n  --color-test-pink: #f09;\n  --linz-linear-gradient-blue: linear-gradient(70deg, #00425d 12%, #007198 100%);\n  --linz-linear-gradient-teal: linear-gradient(270deg, #00a599 1%, #73cdc8 100%);\n}\n\n/**\n  @deprecated\n */\n/**\n  @deprecated\n */\n/**\n  @deprecated\n */\n.LuiRadioInput_LuiRadioInputFieldset__c10e594c {\n  border: none;\n  padding: 0;\n}\n\n.LuiRadioInput_LuiRadioInputInput__c10e594c {\n  position: absolute !important;\n  width: 1px !important;\n  height: 1px !important;\n  margin: 0 !important;\n  padding: 0 !important;\n  overflow: hidden !important;\n  clip: rect(0 0 0 0) !important;\n  -webkit-clip-path: inset(50%) !important;\n  clip-path: inset(50%) !important;\n  border: 0 !important;\n  white-space: nowrap !important;\n}\n\n.LuiRadioInput_LuiRadioInputLegend__c10e594c {\n  font-family: \"Open Sans\", system-ui, sans-serif;\n  font-style: normal;\n  font-weight: 600;\n}\n\n.LuiRadioInput_LuiRadioInputLabel__c10e594c {\n  position: relative;\n  display: flex;\n  justify-content: flex-start;\n  align-items: flex-start;\n  cursor: pointer;\n  padding: 0.5rem 0 0.5rem 2rem;\n}\n.LuiRadioInput_LuiRadioInputLabel__c10e594c:before {\n  content: \"\";\n  height: 1.5rem;\n  min-width: 1.5rem;\n  width: 1.5rem;\n  border: 2px solid #007198;\n  border-radius: 50%;\n  background-color: transparent;\n  position: absolute;\n  left: 0;\n  top: 8px;\n  margin-right: 0.75rem;\n}\n.LuiRadioInput_LuiRadioInputLabel__c10e594c:after {\n  content: \"\";\n  position: absolute;\n  left: 5px;\n  top: 13px;\n  background-color: #007198;\n  height: 14px;\n  min-width: 14px;\n  width: 14px;\n  border-radius: 50%;\n  opacity: 0;\n  transition: opacity 0.3s ease-in-out;\n}\n.LuiRadioInput_LuiRadioInputLabel_IsSelected__c10e594c:after {\n  opacity: 1;\n}\n.LuiRadioInput_LuiRadioInputLabel_IsDisabled__c10e594c {\n  color: #989189;\n}\n.LuiRadioInput_LuiRadioInputLabel_IsDisabled__c10e594c:before {\n  background-color: #eaeaea;\n  border-color: #989189;\n}\n\n.LuiRadioInput_LuiRadioInput_HasError__c10e594c .LuiRadioInput_LuiRadioInputLabel__c10e594c:before {\n  border-color: #cc0000;\n}\n\n.LuiRadioInput_LuiRadioInputErrorMsg__c10e594c {\n  display: flex;\n  margin-top: 0.5rem;\n}\n.LuiRadioInput_LuiRadioInputErrorMsg__c10e594c .LuiRadioInput_LuiIcon_Error__c10e594c {\n  margin-right: 0.5rem;\n}\n.LuiRadioInput_LuiRadioInputErrorMsg__c10e594c p {\n  margin: 0;\n}";
-n(css$5,{});
-
 var LuiRadioInput = function LuiRadioInput(props) {
   var _props$inputProps;
 
@@ -18109,9 +18094,9 @@ function isChromatic() {
   return !!((_window = window) != null && _window.navigator.userAgent.match(/Chromatic/) || (_window2 = window) != null && _window2.location.href.match(/chromatic=true/));
 }
 
-var css$6 = ":root {\n  --grey-80: #2a292c;\n  --grey-60: #6b6966;\n  --$gray: #989189;\n  --grey-20: #beb9b4;\n  --grey-10: #eaeaea;\n  --grey-05: #f9f9f9;\n  --teal: #00425d;\n  --sea: #007198;\n  --electric: #0096cc;\n  --spray: #73c8e1;\n  --polar: #e2f3f7;\n  --sherpa: #004b50;\n  --surfie: #017a76;\n  --persian: #00a599;\n  --downy: #73cdc8;\n  --iceberg: #dcf5f0;\n  --sacramento: #004e32;\n  --salem: #08814d;\n  --pigment: #0aa245;\n  --granny: #9bd79b;\n  --panache: #e9fae7;\n  --brand-primary: #004b50;\n  --brand-secondary: #017a76;\n  --success: #0aa245;\n  --success-bg: #e9fae7;\n  --info: #3a7cdf;\n  --info-bg: #d8e5f9;\n  --warning: #ea6a2e;\n  --warning-bg: #fbdfd2;\n  --error: #cc0000;\n  --error-focus: #5a0000;\n  --error-bg: #f5cccc;\n  --visited: #00425d;\n  --green-hover: #08814d;\n  --color-green-active: #004e32;\n  --green-btn: #0aa245;\n  --txt-link: #0096cc;\n  --color-primary-hover-btn: #007198;\n  --color-selection: #c7e9f3;\n  --heading-color: #017a76;\n  --heading-color--secondary: #2a292c;\n  --base-type-color: #2a292c;\n  --base-icon-color: #007198;\n  --disabled-color: #989189;\n  --disabled-color-dark: #6b6966;\n  --linz-color-primary: #023d48;\n  --linz-color-primary-hover: #01818a;\n  --linz-color-tertiary: #e1e44a;\n  --linz-color-tertiary-hover: #cdcf59;\n  --color-test-pink: #f09;\n  --linz-linear-gradient-blue: linear-gradient(70deg, #00425d 12%, #007198 100%);\n  --linz-linear-gradient-teal: linear-gradient(270deg, #00a599 1%, #73cdc8 100%);\n}";
+var css$1 = ":root {\n  --grey-80: #2a292c;\n  --grey-60: #6b6966;\n  --$gray: #989189;\n  --grey-20: #beb9b4;\n  --grey-10: #eaeaea;\n  --grey-05: #f9f9f9;\n  --teal: #00425d;\n  --sea: #007198;\n  --electric: #0096cc;\n  --spray: #73c8e1;\n  --polar: #e2f3f7;\n  --sherpa: #004b50;\n  --surfie: #017a76;\n  --persian: #00a599;\n  --downy: #73cdc8;\n  --iceberg: #dcf5f0;\n  --sacramento: #004e32;\n  --salem: #08814d;\n  --pigment: #0aa245;\n  --granny: #9bd79b;\n  --panache: #e9fae7;\n  --brand-primary: #004b50;\n  --brand-secondary: #017a76;\n  --success: #0aa245;\n  --success-bg: #e9fae7;\n  --info: #3a7cdf;\n  --info-bg: #d8e5f9;\n  --warning: #ea6a2e;\n  --warning-bg: #fbdfd2;\n  --error: #cc0000;\n  --error-focus: #5a0000;\n  --error-bg: #f5cccc;\n  --visited: #00425d;\n  --green-hover: #08814d;\n  --color-green-active: #004e32;\n  --green-btn: #0aa245;\n  --txt-link: #0096cc;\n  --color-primary-hover-btn: #007198;\n  --color-selection: #c7e9f3;\n  --heading-color: #017a76;\n  --heading-color--secondary: #2a292c;\n  --base-type-color: #2a292c;\n  --base-icon-color: #007198;\n  --disabled-color: #989189;\n  --disabled-color-dark: #6b6966;\n  --linz-color-primary: #023d48;\n  --linz-color-primary-hover: #01818a;\n  --linz-color-tertiary: #e1e44a;\n  --linz-color-tertiary-hover: #cdcf59;\n  --color-test-pink: #f09;\n  --linz-linear-gradient-blue: linear-gradient(70deg, #00425d 12%, #007198 100%);\n  --linz-linear-gradient-teal: linear-gradient(270deg, #00a599 1%, #73cdc8 100%);\n}";
 var modules_5b17bb95 = {"charcoal":"#2a292c","fuscous":"#6b6966","gray":"#989189","silver":"#beb9b4","lily":"#eaeaea","hint":"#f9f9f9","snow":"#ffffff","white":"#ffffff","teal":"#00425d","sea":"#007198","electric":"#0096cc","spray":"#73c8e1","polar":"#e2f3f7","sherpa":"#004b50","surfie":"#017a76","persian":"#00a599","downy":"#73cdc8","iceberg":"#dcf5f0","sacramento":"#004e32","salem":"#08814d","pigment":"#0aa245","granny":"#9bd79b","panache":"#e9fae7","brand-primary":"#004b50","brand-secondary":"#017a76","error":"#cc0000","error-bg":"#f5cccc","error-focus":"#5a0000","warning":"#ea6a2e","warning-bg":"#fbdfd2","warning-focus":"#b33a01","success":"#0aa245","success-bg":"#e9fae7","info":"#3a7cdf","info-bg":"#d8e5f9","visited":"#00425d","green-hover":"#08814d","green-active":"#004e32","green-btn":"#0aa245","txt-link":"#0096cc","primary-hover-btn":"#007198","selection":"#c7e9f3","heading-color":"#017a76","heading-color--secondary":"#2a292c","base-type-color":"#2a292c","base-icon-color":"#007198","disabled-color":"#989189","disabled-color-dark":"#6b6966","linz-color-primary":"#023d48","linz-color-primary-hover":"#01818a","linz-color-tertiary":"#e1e44a","linz-color-tertiary-hover":"#cdcf59","color-test-pink":"#f09","linz-linear-gradient-blue":"linear-gradient(70deg, #00425d 12%, #007198 100%)","linz-linear-gradient-teal":"linear-gradient(270deg, #00a599 1%, #73cdc8 100%)"};
-n(css$6,{});
+n(css$1,{});
 
 /**
  * A wrapper around React Select with Lui styling
@@ -18193,9 +18178,6 @@ function LuiComboSelectActual(givenProps, ref) {
   }));
 }
 
-var css$7 = ":root {\n  --grey-80: #2a292c;\n  --grey-60: #6b6966;\n  --$gray: #989189;\n  --grey-20: #beb9b4;\n  --grey-10: #eaeaea;\n  --grey-05: #f9f9f9;\n  --teal: #00425d;\n  --sea: #007198;\n  --electric: #0096cc;\n  --spray: #73c8e1;\n  --polar: #e2f3f7;\n  --sherpa: #004b50;\n  --surfie: #017a76;\n  --persian: #00a599;\n  --downy: #73cdc8;\n  --iceberg: #dcf5f0;\n  --sacramento: #004e32;\n  --salem: #08814d;\n  --pigment: #0aa245;\n  --granny: #9bd79b;\n  --panache: #e9fae7;\n  --brand-primary: #004b50;\n  --brand-secondary: #017a76;\n  --success: #0aa245;\n  --success-bg: #e9fae7;\n  --info: #3a7cdf;\n  --info-bg: #d8e5f9;\n  --warning: #ea6a2e;\n  --warning-bg: #fbdfd2;\n  --error: #cc0000;\n  --error-focus: #5a0000;\n  --error-bg: #f5cccc;\n  --visited: #00425d;\n  --green-hover: #08814d;\n  --color-green-active: #004e32;\n  --green-btn: #0aa245;\n  --txt-link: #0096cc;\n  --color-primary-hover-btn: #007198;\n  --color-selection: #c7e9f3;\n  --heading-color: #017a76;\n  --heading-color--secondary: #2a292c;\n  --base-type-color: #2a292c;\n  --base-icon-color: #007198;\n  --disabled-color: #989189;\n  --disabled-color-dark: #6b6966;\n  --linz-color-primary: #023d48;\n  --linz-color-primary-hover: #01818a;\n  --linz-color-tertiary: #e1e44a;\n  --linz-color-tertiary-hover: #cdcf59;\n  --color-test-pink: #f09;\n  --linz-linear-gradient-blue: linear-gradient(70deg, #00425d 12%, #007198 100%);\n  --linz-linear-gradient-teal: linear-gradient(270deg, #00a599 1%, #73cdc8 100%);\n}\n\n/**\n  @deprecated\n */\n/**\n  @deprecated\n */\n/**\n  @deprecated\n */\n.LuiShadow_LuiShadow__a0705fc2 {\n  box-shadow: 0 0 1.5rem 1px rgba(0, 113, 152, 0.1);\n  border-radius: 5px;\n  padding: 1.5rem;\n  margin-top: 0.75rem;\n  background-color: #ffffff;\n}";
-n(css$7,{});
-
 var LuiShadow = function LuiShadow(props) {
   return React__default.createElement("div", {
     className: clsx('LuiShadow', props.className)