@linzjs/lui 18.0.0 → 18.0.1

package/dist/lui.css

@@ -140,7 +140,7 @@ textarea {
 }
 
 a {
-  color: #0096cc;
+  color: #1F69C3;
   font-family: "Open Sans", system-ui, sans-serif;
   font-style: normal;
   font-weight: normal;
@@ -181,13 +181,13 @@ a.lui-button:before {
 }
 
 .Link {
-  color: #0096cc;
+  color: #1F69C3;
 }
 .Link:focus, .Link:hover, .Link:active {
-  color: #0096cc;
+  color: #1F69C3;
 }
 .Link.is-active {
-  color: #0096cc;
+  color: #1F69C3;
 }
 
 .Link--reversed {
@@ -946,6 +946,14 @@ body {
   vertical-align: middle;
 }
 
+.lui-justify-space-between {
+  justify-content: space-between;
+}
+
+.lui-items-center {
+  align-items: center;
+}
+
 .lui-content-buffer {
   padding-bottom: 3rem;
 }
@@ -986,6 +994,18 @@ body {
   padding-bottom: 0 !important;
 }
 
+.lui-flex {
+  display: flex;
+}
+
+.lui-flex-column {
+  flex-direction: column;
+}
+
+.lui-flex-row {
+  flex-direction: row;
+}
+
 @media only screen and (max-width: 480px) {
   .lui-hide-xs {
     display: none !important;
@@ -2045,7 +2065,7 @@ a.lui-button-reversed-no-bg:disabled:hover {
 a.lui-button-text {
   background-color: transparent;
   border: 0 solid #fff;
-  color: #0096cc;
+  color: #1F69C3;
   line-height: 24px;
   font-weight: 600;
   text-decoration: underline;
@@ -2060,12 +2080,12 @@ a.lui-button-text {
 .lui-button-text svg *,
 a.lui-button-text i,
 a.lui-button-text svg * {
-  color: #0096cc;
-  fill: #0096cc;
+  color: #1F69C3;
+  fill: #1F69C3;
 }
 .lui-button-text:visited,
 a.lui-button-text:visited {
-  color: #0096cc;
+  color: #1F69C3;
 }
 .lui-button-text:hover,
 a.lui-button-text:hover {
@@ -2174,8 +2194,8 @@ a.lui-button-plain-text:visited {
 .lui-button-plain-text svg *,
 a.lui-button-plain-text i,
 a.lui-button-plain-text svg * {
-  color: #989189;
-  fill: #989189;
+  color: #6b6966;
+  fill: #6b6966;
 }
 .lui-button-plain-text:disabled,
 a.lui-button-plain-text:disabled {
@@ -2284,7 +2304,7 @@ a.lui-button-icon-only-rev:active:enabled,
 a.lui-button-icon-only-link:active:enabled {
   background-color: transparent;
   cursor: pointer;
-  color: rgba(0, 150, 204, 0.9);
+  color: rgba(31, 105, 195, 0.9);
   border: 1px solid transparent;
 }
 .lui-button-icon-only-rev:active:enabled i,
@@ -2294,8 +2314,8 @@ a.lui-button-icon-only-rev:active:enabled i,
 a.lui-button-icon-only-rev:active:enabled svg *,
 a.lui-button-icon-only-link:active:enabled i,
 a.lui-button-icon-only-link:active:enabled svg * {
-  color: #0096cc;
-  fill: #0096cc;
+  color: #1F69C3;
+  fill: #1F69C3;
 }
 .lui-button-icon-only-rev:disabled, .lui-button-icon-only-link:disabled,
 a.lui-button-icon-only-rev:disabled,
@@ -2337,7 +2357,7 @@ a.lui-button-icon-only-rev:hover svg * {
 }
 .lui-button-icon-only-link,
 a.lui-button-icon-only-link {
-  color: #0096cc;
+  color: #1F69C3;
 }
 .lui-button.lui-button-sm,
 a.lui-button.lui-button-sm {
@@ -2499,11 +2519,14 @@ a.lui-button + a.lui-button {
 .lui-button-group .lui-button {
   background-color: #fff;
   border-radius: 0;
-  border: 1px solid #004b50;
+  border: 1px solid #007198;
   color: #004b50;
   border-left: none;
   width: 100%;
 }
+.lui-button-group .lui-button svg * {
+  fill: #007198;
+}
 .lui-button-group .lui-button.lui-button-active {
   background-color: #007198;
   -moz-box-shadow: inset 0 3px 6px rgba(0, 0, 0, 0.4);
@@ -2512,10 +2535,16 @@ a.lui-button + a.lui-button {
   color: #ffffff;
   text-shadow: 0 3px 6px rgba(0, 0, 0, 0.4);
 }
+.lui-button-group .lui-button.lui-button-active svg * {
+  fill: #ffffff;
+}
 .lui-button-group .lui-button.lui-button-active:disabled {
   background-color: #989189;
   color: #ffffff;
 }
+.lui-button-group .lui-button.lui-button-active:disabled.lui-button-icon-only svg * {
+  fill: #ffffff;
+}
 .lui-button-group .lui-button:hover {
   background: #007198;
   cursor: pointer;
@@ -2531,6 +2560,12 @@ a.lui-button + a.lui-button {
   color: #989189;
   cursor: not-allowed;
 }
+.lui-button-group .lui-button:disabled.lui-button-icon-only svg * {
+  fill: #989189;
+}
+.lui-button-group .lui-button.lui-button-icon-only {
+  width: 100%;
+}
 .lui-button-group--radio {
   margin-top: 1.5rem;
 }
@@ -2979,8 +3014,8 @@ a.lui-button + a.lui-button {
 .LuiDeprecatedForms .lui-input-warning input:not([type=checkbox]):not([type=radio]),
 .LuiDeprecatedForms .lui-input-warning textarea,
 .LuiDeprecatedForms .lui-input-warning select {
-  border: 0.06rem solid #ea6a2e;
-  border-left: 48px solid #ea6a2e;
+  border: 0.06rem solid #EA6A2E;
+  border-left: 48px solid #EA6A2E;
   box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
 }
 .LuiDeprecatedForms .lui-input-warning input:not([type=checkbox]):not([type=radio]):focus,
@@ -3202,11 +3237,19 @@ table .lui-checkbox-container input {
   border-radius: 0;
 }
 .tippy-box > .tippy-content {
+  padding: 5px 9px;
   font-size: 12px;
   font-family: "Open Sans", system-ui, sans-serif;
   font-style: normal;
   font-weight: normal;
 }
+.tippy-box > .tippy-content p {
+  font-size: 12px;
+  margin-top: 1em;
+}
+.tippy-box > .tippy-content p:first-child {
+  margin-top: 0;
+}
 
 .tippy-box[data-theme~=default] {
   background: #ffffff;
@@ -3406,6 +3449,15 @@ table .lui-checkbox-container input {
 .lui-collapse-text *:first-child {
   margin-top: 0;
 }
+.lui-accordion-content {
+  height: auto;
+  overflow: hidden;
+  max-height: 9999px;
+  transition: max-height 0.4s cubic-bezier(1, 0, 0, 1);
+}
+.lui-accordion-content *:first-child {
+  margin-top: 0;
+}
 
 .lui-footer {
   padding-top: 2rem;
@@ -3716,6 +3768,275 @@ table .lui-checkbox-container input {
   color: white;
 }
 
+.LuiHeaderV2 {
+  background: linear-gradient(70deg, #00425d 12%, #007198 100%);
+  color: #fff;
+}
+.LuiHeaderV2:after {
+  width: 100%;
+  content: "";
+  display: block;
+  height: 6px;
+  overflow: hidden;
+  background: linear-gradient(270deg, #00a599 1%, #73cdc8 100%);
+}
+.LuiHeaderV2.LuiHeaderV2-transparent {
+  background: transparent;
+  color: #007198;
+}
+.LuiHeaderV2.LuiHeaderV2-transparent:after {
+  content: none;
+}
+.LuiHeaderV2.LuiHeaderV2-transparent .LuiHeaderV2-menu-item-button-icon {
+  color: #017a76;
+}
+
+.LuiHeaderV2-row {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  height: 85px;
+  padding: 0.25rem;
+}
+
+.LuiHeaderV2-col {
+  display: flex;
+  align-items: center;
+  flex-wrap: nowrap;
+  flex: 0 1 auto;
+  height: 100%;
+  column-gap: 0.25rem;
+}
+
+.LuiHeaderV2-title {
+  white-space: nowrap;
+  padding-right: 0.5rem;
+  padding-left: 0.5rem;
+  vertical-align: middle;
+}
+.LuiHeaderV2-title h1 {
+  color: #ffffff;
+}
+@media only screen {
+  .LuiHeaderV2-title h1 {
+    display: none;
+  }
+}
+@media screen and (min-width: 480px) {
+  .LuiHeaderV2-title h1 {
+    display: block;
+    font-size: 2rem;
+    line-height: 2rem;
+    font-family: "Open Sans", system-ui, sans-serif;
+    font-style: normal;
+    font-weight: 300;
+    margin: 0;
+  }
+}
+@media screen and (min-width: 768px) {
+  .LuiHeaderV2-title h1 {
+    font-size: 2.25rem;
+    line-height: 2.25rem;
+  }
+}
+
+.LuiHeaderV2-logo {
+  margin-left: 0.5rem;
+  margin-right: 0.5rem;
+}
+.LuiHeaderV2-logo a:before {
+  display: none;
+}
+@media screen and (min-width: 480px) {
+  .LuiHeaderV2-logo {
+    border-right: 1px solid #00a599;
+    margin-right: 0.5rem;
+  }
+}
+.LuiHeaderV2-logo .clickable {
+  cursor: pointer;
+}
+
+.LuiHeaderV2-linz-logo {
+  width: 170px;
+  vertical-align: middle;
+}
+@media screen and (min-width: 480px) {
+  .LuiHeaderV2-linz-logo {
+    width: 200px;
+  }
+}
+
+.LuiHeaderV2-small .LuiHeaderV2-row {
+  height: 56px;
+}
+.LuiHeaderV2-small .LuiHeaderV2-row .LuiHeaderV2-col .LuiHeaderV2-logo {
+  border: none;
+}
+.LuiHeaderV2-small .LuiHeaderV2-row .LuiHeaderV2-col .LuiHeaderV2-linz-motif {
+  height: 32px;
+  width: 32px;
+  vertical-align: middle;
+}
+.LuiHeaderV2-small .LuiHeaderV2-row .LuiHeaderV2-col .LuiHeaderV2-title {
+  white-space: nowrap;
+}
+.LuiHeaderV2-small .LuiHeaderV2-row .LuiHeaderV2-col .LuiHeaderV2-title h1 {
+  color: #ffffff;
+  font-size: 20px;
+  line-height: 24px;
+  font-family: "Open Sans", system-ui, sans-serif;
+  font-style: normal;
+  font-weight: normal;
+}
+.LuiHeaderV2-small:after {
+  content: none;
+}
+
+.LuiHeaderV2-sticky {
+  position: fixed;
+  z-index: 50;
+  top: 0;
+  left: 0;
+  width: 100%;
+}
+.LuiHeaderV2-sticky + div, .LuiHeaderV2-sticky + main {
+  margin-top: 91px;
+}
+@media screen and (min-width: 768px) {
+  .LuiHeaderV2-sticky + div, .LuiHeaderV2-sticky + main {
+    margin-top: 116px;
+  }
+}
+.LuiHeaderV2-sticky.LuiHeaderV2-small + div, .LuiHeaderV2-sticky.LuiHeaderV2-small + main {
+  margin-top: 56px;
+}
+
+.LuiHeaderV2-non-sticky {
+  width: 100%;
+}
+
+.LuiHeaderV2-menu-item {
+  display: flex;
+  flex-direction: column;
+}
+.LuiHeaderV2-menu-item .clickable:hover {
+  cursor: pointer;
+}
+.LuiHeaderV2-menu-item-button {
+  font-family: "Open Sans", system-ui, sans-serif;
+  font-style: normal;
+  font-weight: 600;
+  position: relative;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: 3px;
+}
+.LuiHeaderV2-menu-item-button.selected {
+  background-color: rgba(0, 0, 0, 0.2);
+}
+.LuiHeaderV2-menu-item-button.unselected:hover {
+  background-color: rgba(255, 255, 255, 0.2);
+}
+.LuiHeaderV2-menu-item-button .menu-tooltip {
+  display: none;
+  background-color: black;
+  text-align: center;
+  border-radius: 4px;
+  padding: 6px 6px;
+  font-family: "Open Sans", system-ui, sans-serif;
+  font-style: normal;
+  font-weight: normal;
+  font-size: 14px;
+  white-space: nowrap;
+  position: absolute;
+  top: 60px;
+  z-index: 10;
+  box-shadow: 0px 2px 3px 0px #00000040, 0px 0px 3px 0px #00000026;
+  border-radius: 3px;
+}
+.LuiHeaderV2-menu-item-button .menu-tooltip.dark {
+  color: #f9f9f9;
+  background-color: #2a292c;
+}
+.LuiHeaderV2-menu-item-button .menu-tooltip.light {
+  color: #2a292c;
+  background-color: #f9f9f9;
+}
+.LuiHeaderV2-menu-item-button .menu-tooltip.left {
+  left: 8px;
+}
+.LuiHeaderV2-menu-item-button .menu-tooltip.right {
+  right: 8px;
+}
+.LuiHeaderV2-menu-item-button .menu-tooltip::after {
+  content: "";
+  position: absolute;
+  top: -14px;
+  border-width: 8px;
+  border-style: solid;
+}
+.LuiHeaderV2-menu-item-button .menu-tooltip.left:after {
+  left: 0;
+}
+.LuiHeaderV2-menu-item-button .menu-tooltip.right:after {
+  right: 0;
+}
+.LuiHeaderV2-menu-item-button .menu-tooltip.dark::after {
+  border-color: transparent transparent #2a292c transparent;
+}
+.LuiHeaderV2-menu-item-button .menu-tooltip.light::after {
+  border-color: transparent transparent #f9f9f9 transparent;
+}
+.LuiHeaderV2-menu-item-button:hover .menu-tooltip {
+  display: block;
+}
+.LuiHeaderV2-menu-item-button-icon {
+  display: flex;
+  align-items: center;
+  color: #ffffff;
+  cursor: default;
+  user-select: none;
+  width: 3rem;
+  height: 3rem;
+  align-items: center;
+  justify-content: center;
+}
+.LuiHeaderV2-menu-item-button-label {
+  text-align: left;
+  white-space: nowrap;
+  padding-right: 0.5rem;
+}
+.LuiHeaderV2-menu-item-button-label-only {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  padding-left: 0.5rem;
+  padding-right: 0.5rem;
+  white-space: nowrap;
+  height: 48px;
+  font-family: "Open Sans", system-ui, sans-serif;
+  font-style: normal;
+  font-weight: 600;
+  font-size: 16px;
+}
+.LuiHeaderV2-menu-item-button-badge {
+  position: absolute;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  top: 4px;
+  left: 25px;
+  width: 20px;
+  height: 20px;
+  font-size: 12px;
+  text-align: center;
+  border-radius: 50%;
+  background: #cc0000;
+  color: white;
+}
+
 .lui-help-section ol.lui-help-numbering {
   list-style: none;
   margin: 0;
@@ -3870,20 +4191,202 @@ body.lui-menu-drawer-open {
   background-color: #eaeaea;
 }
 
-.lui-msg-success {
-  border-left: 3rem solid #beb9b4;
-  border-radius: 3px;
-  background-clip: padding-box;
-  padding: 0.75rem 3rem 0.75rem 0.75rem;
-  margin: 2rem 0;
-  color: #2a292c;
-  background: #eaeaea;
+body.LuiHeaderMenuV2-drawer-open {
+  overflow-y: hidden;
+}
+
+.LuiHeaderMenuV2-drawer-container {
   position: relative;
-  border-color: #0aa245;
-  background: #e9fae7;
 }
-.lui-msg-success p {
-  margin: 0;
+.LuiHeaderMenuV2-drawer-container.drawer {
+  right: -0.25rem;
+}
+.LuiHeaderMenuV2-drawer-container .LuiHeaderMenuV2-drawer {
+  text-align: left;
+  background-color: white;
+  color: #2a292c;
+  box-shadow: 0px 1px 6px 0px #00000026, 0px 6px 10px 0px #00000040;
+  border-radius: 3px;
+  height: auto;
+  z-index: 900;
+}
+.LuiHeaderMenuV2-drawer-container .LuiHeaderMenuV2-drawer.sm {
+  width: 260px;
+}
+.LuiHeaderMenuV2-drawer-container .LuiHeaderMenuV2-drawer.md {
+  width: 280px;
+}
+.LuiHeaderMenuV2-drawer-container .LuiHeaderMenuV2-drawer.lg {
+  width: 300px;
+}
+.LuiHeaderMenuV2-drawer-container .LuiHeaderMenuV2-drawer.xlg {
+  width: 320px;
+}
+.LuiHeaderMenuV2-drawer-container .LuiHeaderMenuV2-drawer.dropdown {
+  display: none;
+  position: absolute;
+  right: 0;
+}
+.LuiHeaderMenuV2-drawer-container .LuiHeaderMenuV2-drawer.dropdown.open {
+  display: block;
+}
+.LuiHeaderV2 .LuiHeaderMenuV2-drawer-container .LuiHeaderMenuV2-drawer.drawer.sticky {
+  position: fixed;
+  top: 91px;
+}
+.LuiHeaderV2 .LuiHeaderMenuV2-drawer-container .LuiHeaderMenuV2-drawer.drawer.non-sticky {
+  position: absolute;
+  top: 0.25rem;
+}
+.LuiHeaderV2-small .LuiHeaderMenuV2-drawer-container .LuiHeaderMenuV2-drawer.drawer.sticky {
+  position: fixed;
+  top: 56px;
+}
+.LuiHeaderV2-small .LuiHeaderMenuV2-drawer-container .LuiHeaderMenuV2-drawer.drawer.non-sticky {
+  position: absolute;
+  top: 0.25rem;
+}
+.LuiHeaderMenuV2-drawer-container .LuiHeaderMenuV2-drawer.drawer {
+  transition: right 500ms, visibility 500ms;
+  visibility: hidden;
+}
+.LuiHeaderMenuV2-drawer-container .LuiHeaderMenuV2-drawer.drawer.sm {
+  right: -260px;
+}
+.LuiHeaderMenuV2-drawer-container .LuiHeaderMenuV2-drawer.drawer.md {
+  right: -280px;
+}
+.LuiHeaderMenuV2-drawer-container .LuiHeaderMenuV2-drawer.drawer.lg {
+  right: -300px;
+}
+.LuiHeaderMenuV2-drawer-container .LuiHeaderMenuV2-drawer.drawer.xlg {
+  right: -320px;
+}
+.LuiHeaderMenuV2-drawer-container .LuiHeaderMenuV2-drawer.drawer.open {
+  right: 0px;
+  visibility: visible;
+}
+.LuiHeaderMenuV2-drawer-container .LuiHeaderMenuV2-drawer-options hr {
+  background-color: #eaeaea;
+}
+.LuiHeaderMenuV2-drawer-container .LuiHeaderMenuV2-drawer-option {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 12px 16px;
+}
+.LuiHeaderMenuV2-drawer-container .LuiHeaderMenuV2-drawer-option a {
+  text-decoration: none;
+  color: inherit;
+  font-weight: inherit;
+}
+.LuiHeaderMenuV2-drawer-container .LuiHeaderMenuV2-drawer-option:hover {
+  cursor: pointer;
+  background-color: #e2f3f7;
+}
+.LuiHeaderMenuV2-drawer-container .LuiHeaderMenuV2-drawer-option-label {
+  display: flex;
+  align-items: center;
+}
+.LuiHeaderMenuV2-drawer-container .LuiHeaderMenuV2-drawer-option-label .LuiIcon:first-child {
+  margin-right: 10px;
+}
+.LuiHeaderMenuV2-drawer-container .LuiHeaderMenuV2-drawer-option-badge {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  margin-left: 10px;
+}
+
+.LuiHeaderMenuV2-dropdown-container {
+  position: relative;
+}
+.LuiHeaderMenuV2-dropdown-container .LuiHeaderMenuV2-dropdown {
+  text-align: left;
+  background-color: white;
+  color: #2a292c;
+  box-shadow: 0px 1px 6px 0px #00000026, 0px 6px 10px 0px #00000040;
+  border-radius: 3px;
+  position: absolute;
+  z-index: 900;
+  display: none;
+}
+.LuiHeaderMenuV2-dropdown-container .LuiHeaderMenuV2-dropdown.anchor-horizontal-icon-left {
+  left: 0;
+}
+.LuiHeaderMenuV2-dropdown-container .LuiHeaderMenuV2-dropdown.anchor-horizontal-icon-right {
+  right: 0;
+}
+.LuiHeaderMenuV2-dropdown-container .LuiHeaderMenuV2-dropdown.anchor-horizontal-label-right {
+  right: 0;
+}
+.LuiHeaderMenuV2-dropdown-container .LuiHeaderMenuV2-dropdown.open {
+  display: block;
+}
+.LuiHeaderMenuV2-dropdown-container .LuiHeaderMenuV2-dropdown.dropdown-xxl {
+  width: 400px;
+}
+.LuiHeaderMenuV2-dropdown-container .LuiHeaderMenuV2-dropdown.dropdown-xl {
+  width: 360px;
+}
+.LuiHeaderMenuV2-dropdown-container .LuiHeaderMenuV2-dropdown.dropdown-lg {
+  width: 300px;
+}
+.LuiHeaderMenuV2-dropdown-container .LuiHeaderMenuV2-dropdown.dropdown-md {
+  width: 280px;
+}
+.LuiHeaderMenuV2-dropdown-container .LuiHeaderMenuV2-dropdown.dropdown-sm {
+  width: 240px;
+}
+.LuiHeaderMenuV2-dropdown-container .LuiHeaderMenuV2-dropdown.dropdown-xs {
+  width: 160px;
+}
+
+.LuiDrawerMenuSectionV2-header {
+  font-family: "Open Sans", system-ui, sans-serif;
+  font-style: normal;
+  font-weight: 600;
+  white-space: nowrap;
+  padding-left: 16px;
+  padding-right: 8px;
+}
+.LuiDrawerMenuSectionV2-header .lui-expand-header {
+  padding-top: 8px;
+  padding-bottom: 8px;
+  display: flex;
+  justify-content: flex-start;
+  align-items: center;
+  cursor: revert;
+  font-family: "Open Sans", system-ui, sans-serif;
+  font-style: normal;
+  font-weight: 600;
+  font-size: 14px;
+  color: #6b6966;
+  line-height: 20px;
+}
+.LuiHeaderMenuV2-dropdown .LuiDrawerMenuSectionV2-header {
+  border-radius: 3px;
+}
+
+.LuiDrawerMenuDividerV2 {
+  height: 0.25px;
+  background-color: #beb9b4;
+}
+
+.lui-msg-success {
+  border-left: 3rem solid #beb9b4;
+  border-radius: 3px;
+  background-clip: padding-box;
+  padding: 0.75rem 3rem 0.75rem 0.75rem;
+  margin: 2rem 0;
+  color: #2a292c;
+  background: #eaeaea;
+  position: relative;
+  border-color: #0aa245;
+  background: #e9fae7;
+}
+.lui-msg-success p {
+  margin: 0;
   font-family: "Open Sans", system-ui, sans-serif;
   font-style: normal;
   font-weight: normal;
@@ -3922,7 +4425,7 @@ body.lui-menu-drawer-open {
   background: #eaeaea;
   position: relative;
   background: #d8e5f9;
-  border-color: #3a7cdf;
+  border-color: #3A7CDF;
 }
 .lui-msg-info p {
   margin: 0;
@@ -3964,7 +4467,7 @@ body.lui-menu-drawer-open {
   background: #eaeaea;
   position: relative;
   background: #fbdfd2;
-  border-color: #ea6a2e;
+  border-color: #EA6A2E;
 }
 .lui-msg-warning p {
   margin: 0;
@@ -4006,7 +4509,7 @@ body.lui-menu-drawer-open {
   background: #eaeaea;
   position: relative;
   border-color: #cc0000;
-  background: #f5cccc;
+  background: #F5CCCC;
 }
 .lui-msg-error p {
   margin: 0;
@@ -4211,11 +4714,11 @@ body.lui-menu-drawer-open {
   border-width: 3rem;
 }
 .lui-modal-info {
-  border-color: #3a7cdf;
+  border-color: #3A7CDF;
   border-width: 3rem;
 }
 .lui-modal-warning {
-  border-color: #ea6a2e;
+  border-color: #EA6A2E;
   border-width: 3rem;
 }
 .lui-modal-error {
@@ -4230,39 +4733,20 @@ body.lui-menu-drawer-open {
   padding: 0;
 }
 .lui-modal-header {
-  background: linear-gradient(70deg, #00425d 12%, #007198 100%);
-  color: #fff;
   color: #ffffff;
 }
-.lui-modal-header:after {
-  width: 100%;
-  content: "";
-  display: block;
-  height: 5px;
-  overflow: hidden;
-  background: linear-gradient(270deg, #00a599 1%, #73cdc8 100%);
-}
-.lui-modal-header.lui-header-transparent {
-  background: transparent;
-  color: #007198;
-}
-.lui-modal-header.lui-header-transparent:after {
-  content: none;
-}
-.lui-modal-header.lui-header-transparent .lui-header-menu-icon {
-  color: #017a76;
-}
 .lui-modal-header-title {
   display: flex;
   justify-content: space-between;
   align-items: center;
-  height: 85px;
+  height: 60px;
   width: 100%;
-  padding: 0 2rem;
+  padding: 0 1.5rem;
 }
 .lui-modal-header-title h1 {
   display: inline;
-  font-size: 2rem;
+  font-size: 1.625rem;
+  font-weight: 400;
   line-height: 2rem;
   font-family: "Open Sans", system-ui, sans-serif;
   font-style: normal;
@@ -4271,8 +4755,9 @@ body.lui-menu-drawer-open {
 }
 @media screen and (min-width: 768px) {
   .lui-modal-header-title h1 {
-    font-size: 2.25rem;
+    font-size: 1.625rem;
     line-height: 2.25rem;
+    font-weight: 400;
   }
 }
 .lui-modal-header-title button {
@@ -4281,9 +4766,8 @@ body.lui-menu-drawer-open {
 .lui-modal-header-title button i {
   vertical-align: middle;
 }
-.lui-modal-header-close-btn {
+.lui-modal-header-help-btn, .lui-modal-header-close-btn {
   border-bottom: none !important;
-  color: rgba(255, 255, 255, 0.7);
   border: none;
   outline: none;
   padding: 0;
@@ -4295,6 +4779,40 @@ body.lui-menu-drawer-open {
 .lui-modal-header-btn-size {
   font-size: 2rem;
 }
+.lui-modal-header-default {
+  background: linear-gradient(70deg, #00425d 12%, #007198 100%);
+  color: #fff;
+}
+.lui-modal-header-default:after {
+  width: 100%;
+  content: "";
+  display: block;
+  height: 5px;
+  overflow: hidden;
+  background: linear-gradient(270deg, #00a599 1%, #73cdc8 100%);
+}
+.lui-modal-header-default.lui-header-transparent {
+  background: transparent;
+  color: #007198;
+}
+.lui-modal-header-default.lui-header-transparent:after {
+  content: none;
+}
+.lui-modal-header-default.lui-header-transparent .lui-header-menu-icon {
+  color: #017a76;
+}
+.lui-modal-header-default h1 {
+  color: #ffffff;
+}
+.lui-modal-header-default path {
+  fill: rgba(255, 255, 255, 0.7);
+}
+.lui-modal-header-light h1 {
+  color: #017a76;
+}
+.lui-modal-header-light path {
+  fill: #989189;
+}
 .lui-modal-container {
   margin: 2rem;
 }
@@ -4305,8 +4823,77 @@ body.lui-menu-drawer-open {
   justify-content: center;
 }
 
-.lui-modal-header-title h1 {
-  color: #ffffff;
+.lui-modal-header-buttons {
+  padding-left: 12px;
+  display: flex;
+}
+.lui-modal-header-buttons button {
+  padding-left: 8px;
+  padding-right: 0px;
+  float: none;
+  display: flex;
+}
+
+.lui-splash-content {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: fit-content;
+  overflow: auto;
+  WebkitOverflowScrolling: touch;
+  border-radius: 9px;
+  margin: 0 0.75rem;
+  outline: none;
+}
+.lui-splash-content .lui-feature-header {
+  margin: 24px 24px 0 24px;
+}
+.lui-splash-content .lui-feature-header .lui-feature-title-wrapper {
+  display: flex;
+  align-items: center;
+}
+.lui-splash-content .lui-feature-header .lui-feature-title-wrapper h1 {
+  font-size: 1.625rem;
+  font-weight: 400;
+  text-shadow: none;
+}
+.lui-splash-content .lui-feature-header .lui-feature-title-wrapper .lui-feature-title-icon {
+  margin-right: 8px;
+}
+.lui-splash-content .lui-feature-header .lui-feature-title-wrapper .lui-feature-title-icon path {
+  fill: #ffffff;
+}
+.lui-splash-content .lui-feature-img {
+  padding: 12px 24px 0 24px;
+  border-bottom: 1px solid #DAD7D6;
+}
+.lui-splash-content .lui-feature-text {
+  padding: 24px;
+}
+.lui-splash-content .lui-feature-text h2:first-of-type,
+.lui-splash-content .lui-feature-text h3:first-of-type,
+.lui-splash-content .lui-feature-text h4:first-of-type {
+  margin-top: 0;
+}
+.lui-splash-content .lui-feature-text p {
+  font-weight: 400;
+  margin-top: 1rem;
+}
+.lui-splash-content .lui-feature-text p:first-of-type {
+  margin-top: 0.5rem;
+}
+
+.splash_overlay {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: rgba(0, 0, 0, 0.6);
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  z-index: 1000;
 }
 
 .MuiDrawer-paper {
@@ -4587,7 +5174,8 @@ body.lui-menu-drawer-open {
 }
 
 .LuiCheckboxInput-group {
-  display: block;
+  display: inline-block;
+  line-height: 28px;
   user-select: none;
   cursor: pointer;
 }
@@ -4824,14 +5412,14 @@ body.lui-menu-drawer-open {
 }
 
 .LuiRadioInput--hasWarning .LuiRadioInput-label:before {
-  border-color: #ea6a2e;
+  border-color: #EA6A2E;
 }
 
 .LuiRadioInput-label--hasWarning:before {
-  border-color: #ea6a2e;
+  border-color: #EA6A2E;
 }
 .LuiRadioInput-label--hasWarning:after {
-  background-color: #ea6a2e;
+  background-color: #EA6A2E;
 }
 
 .LuiSelect-label {
@@ -5000,13 +5588,10 @@ body.lui-menu-drawer-open {
 .LuiTextAreaInput textarea {
   display: block;
 }
-.LuiTextAreaInput.hasError textarea {
-  border: 1px solid #cc0000;
-}
-.LuiTextAreaInput.hasError .LuiTextAreaInput-wrapper {
+.LuiTextAreaInput.hasError .LuiTextAreaInput-wrapper, .LuiTextAreaInput.hasWarning .LuiTextAreaInput-wrapper {
   position: relative;
 }
-.LuiTextAreaInput.hasError .LuiTextAreaInput-wrapper:before {
+.LuiTextAreaInput.hasError .LuiTextAreaInput-wrapper:before, .LuiTextAreaInput.hasWarning .LuiTextAreaInput-wrapper:before {
   content: "";
   display: block;
   position: absolute;
@@ -5017,6 +5602,18 @@ body.lui-menu-drawer-open {
   background-color: #cc0000;
   border-radius: 3px 0 0 3px;
 }
+.LuiTextAreaInput.hasError textarea {
+  border: 1px solid #cc0000;
+}
+.LuiTextAreaInput.hasError .LuiTextAreaInput-wrapper:before {
+  background-color: #cc0000;
+}
+.LuiTextAreaInput.hasWarning textarea {
+  border: 1px solid #EA6A2E;
+}
+.LuiTextAreaInput.hasWarning .LuiTextAreaInput-wrapper:before {
+  background-color: #EA6A2E;
+}
 .LuiTextAreaInput.isDisabled textarea {
   border-color: #beb9b4;
   background-color: #eaeaea;
@@ -5034,10 +5631,9 @@ body.lui-menu-drawer-open {
   position: relative;
 }
 
-.LuiTextAreaInput-error {
+.LuiTextAreaInput-error, .LuiTextAreaInput-warning {
   position: relative;
   display: flex;
-  color: #cc0000;
   font-family: "Open Sans", system-ui, sans-serif;
   font-style: normal;
   font-weight: 600;
@@ -5048,7 +5644,11 @@ body.lui-menu-drawer-open {
   margin-top: 0.25rem;
 }
 
-.LuiTextAreaInput-error-icon {
+.LuiTextAreaInput-error {
+  color: #cc0000;
+}
+
+.LuiTextAreaInput-error-icon, .LuiTextAreaInput-warning-icon {
   position: absolute;
   left: 0;
   top: 2px;
@@ -5096,8 +5696,12 @@ body.lui-menu-drawer-open {
   box-shadow: -8px 0px 0 0 #cc0000;
   border-radius: 4px;
 }
+.LuiTextInput-inputWrapper:has(input:invalid:not(:focus)) {
+  box-shadow: -8px 0px 0 0 #cc0000;
+  border-radius: 4px;
+}
 .hasWarning .LuiTextInput-inputWrapper {
-  box-shadow: -8px 0px 0 0 #ea6a2e;
+  box-shadow: -8px 0px 0 0 #EA6A2E;
   border-radius: 4px;
 }
 
@@ -5154,13 +5758,27 @@ body.lui-menu-drawer-open {
   border-color: #cc0000;
 }
 .hasWarning .LuiTextInput-input {
-  border-color: #ea6a2e;
+  border-color: #EA6A2E;
 }
-.isDisabled .LuiTextInput-input {
+.isDisabled .LuiTextInput-input, .LuiTextInput-input:disabled {
   border-color: #beb9b4;
   background-color: #eaeaea;
   cursor: not-allowed;
 }
+.LuiTextInput-input[type=date] {
+  padding-right: 0.75rem;
+}
+.LuiTextInput-input:invalid:not(:focus) {
+  border-color: #cc0000;
+}
+
+.LuiTextInput-sm {
+  height: 2rem;
+  padding-top: 0.5rem;
+  padding-right: 0.75rem;
+  padding-bottom: 0.5rem;
+  padding-left: 0.75rem;
+}
 
 .LuiTextInput-iconPosition {
   position: absolute;
@@ -5178,7 +5796,8 @@ body.lui-menu-drawer-open {
   background-size: 16px 21px;
 }
 
-.LuiTextInput-error, .LuiTextInput-warning {
+.LuiTextInput-error,
+.LuiTextInput-warning {
   font-family: "Open Sans", system-ui, sans-serif;
   font-style: normal;
   font-weight: 600;
@@ -5195,7 +5814,8 @@ body.lui-menu-drawer-open {
   color: #cc0000;
 }
 
-.LuiTextInput-error-icon, .LuiTextInput-warning-icon {
+.LuiTextInput-error-icon,
+.LuiTextInput-warning-icon {
   position: absolute;
   left: 0;
   top: 2px;
@@ -5534,7 +6154,7 @@ body.lui-menu-drawer-open {
   padding-top: 8px;
 }
 .LuiFileInputBox-upload-text span {
-  color: #3a7cdf;
+  color: #3A7CDF;
   font-weight: 600;
 }
 
@@ -5607,12 +6227,18 @@ body.lui-menu-drawer-open {
 }
 
 .LuiShadow {
-  box-shadow: 0 0 1.5rem 1px rgba(0, 113, 152, 0.1);
+  box-shadow: 0px 2px 3px 0px #00000040, 0px 0px 3px 0px #00000026;
   border-radius: 5px;
   padding: 1.5rem;
   margin-top: 0.75rem;
   background-color: #ffffff;
 }
+.LuiShadow--md {
+  box-shadow: 0px 1px 6px 0px #00000026, 0px 6px 10px 0px #00000040;
+}
+.LuiShadow--lg {
+  box-shadow: 0px 3px 12px 0px #00000026, 0px 12px 18px 4px #00000040;
+}
 
 .LuiBadge {
   font-family: "Open Sans", system-ui, sans-serif;
@@ -5650,9 +6276,29 @@ body.lui-menu-drawer-open {
   background: #ffffff;
 }
 
-.LuiBadge--warning {
-  border-color: #ea6a2e;
-  color: #ea6a2e;
+.LuiBadge--variation-warning {
+  border-color: #EA6A2E;
+  color: #EA6A2E;
+}
+
+.LuiBadge--variation-info {
+  border-color: #3A7CDF;
+  color: #3A7CDF;
+}
+
+.LuiBadge--variation-warning.LuiBadge--fill-color {
+  background-color: #EA6A2E;
+  color: #ffffff;
+}
+
+.LuiBadge--variation-info.LuiBadge--fill-color {
+  background-color: #3A7CDF;
+  color: #ffffff;
+}
+
+.LuiBadge--variation-default.LuiBadge--fill-color {
+  background-color: #6b6966;
+  color: #ffffff;
 }
 
 .LuiAccordicardStatic {
@@ -5669,7 +6315,7 @@ body.lui-menu-drawer-open {
   box-shadow: 0px 2px 3px 0px #00000040, 0px 0px 3px 0px #00000026;
 }
 .LuiAccordicardStatic--warning {
-  border: 1px solid #ea6a2e;
+  border: 1px solid #EA6A2E;
   display: grid;
   grid-template-columns: 32px 1fr;
   grid-template-areas: "sidebar header" "sidebar content";
@@ -5689,7 +6335,7 @@ body.lui-menu-drawer-open {
 
 .LuiAccordicardStatic-sideBar {
   grid-area: sidebar;
-  background-color: #ea6a2e;
+  background-color: #EA6A2E;
   position: relative;
 }
 
@@ -5765,7 +6411,7 @@ body.lui-menu-drawer-open {
   box-shadow: 0px 2px 3px 0px #00000040, 0px 0px 3px 0px #00000026;
 }
 .LuiAccordicard--warning {
-  border: 1px solid #ea6a2e;
+  border: 1px solid #EA6A2E;
   display: grid;
   grid-template-columns: 32px 1fr;
   grid-template-areas: "sidebar header" "sidebar content";
@@ -5785,7 +6431,7 @@ body.lui-menu-drawer-open {
 
 .LuiAccordicard-sideBar {
   grid-area: sidebar;
-  background-color: #ea6a2e;
+  background-color: #EA6A2E;
   position: relative;
 }
 
@@ -5936,6 +6582,30 @@ body.lui-menu-drawer-open {
   right: -0.25rem;
 }
 
+.luiSidePanel {
+  position: fixed;
+  right: 0;
+  bottom: 0;
+  background: white;
+  transition: width 0.2s ease;
+  box-shadow: 0px 3px 12px 0px #00000026, 0px 12px 18px 4px #00000040;
+  padding: 0;
+  z-index: 3;
+  overflow: auto;
+}
+
+.luiSidePanel-CloseBtn {
+  position: absolute;
+  right: 0;
+  top: 0.5rem;
+  background-color: transparent;
+  border: none;
+  border-bottom-left-radius: 5px;
+}
+.luiSidePanel-CloseBtn:hover {
+  cursor: pointer;
+}
+
 .LuiTab {
   background: transparent;
   border-radius: 0;
@@ -6053,7 +6723,7 @@ body.lui-menu-drawer-open {
 }
 
 .LuiIcon--warning {
-  fill: #ea6a2e;
+  fill: #EA6A2E;
 }
 
 .LuiIcon--error {