@iress-oss/ids-components 6.0.0-alpha.18 → 6.0.0-alpha.19

package/dist/patterns/Shadow/Shadow.js

@@ -228,25 +228,25 @@ const z = `@layer reset, base, tokens, recipes, utilities;
   :where(:root, :host) {
     --borders-alert: 1px solid currentColor;
     --borders-divider: 1px solid var(--iress-colour-neutral-30, #E2E6EA);
-    --borders-input: 1px solid var(--iress-colour-neutral-70, #5D6C7E);
+    --borders-input: 1px solid var(--iress-colour-neutral-70, #6D7278);
     --borders-placeholder: 1.5px solid var(--iress-colour-neutral-30, #E2E6EA);
-    --borders-hover: 1px solid var(--iress-colour-primary-fill, #1D1F4B);
+    --borders-hover: 1px solid var(--iress-colour-primary-fill, #003271);
     --borders-table: 1px solid var(--iress-colour-neutral-40, #CFD5DA);
-    --colors-colour\\.primary\\.fill: var(--iress-colour-primary-fill, #1D1F4B);
-    --colors-colour\\.primary\\.fill-hover: var(--iress-colour-primary-fill-hover, #0D0E24);
+    --colors-colour\\.primary\\.fill: var(--iress-colour-primary-fill, #003271);
+    --colors-colour\\.primary\\.fill-hover: var(--iress-colour-primary-fill-hover, #002352);
     --colors-colour\\.primary\\.on-fill: var(--iress-colour-primary-on-fill, #FFFFFF);
-    --colors-colour\\.primary\\.surface: var(--iress-colour-primary-surface, #E9E9ED);
-    --colors-colour\\.primary\\.surface-hover: var(--iress-colour-primary-surface-hover, #D2D2DB);
-    --colors-colour\\.primary\\.text: var(--iress-colour-primary-text, #141F4D);
+    --colors-colour\\.primary\\.surface: var(--iress-colour-primary-surface, #EBF3FF);
+    --colors-colour\\.primary\\.surface-hover: var(--iress-colour-primary-surface-hover, #DCEAFE);
+    --colors-colour\\.primary\\.text: var(--iress-colour-primary-text, #003271);
     --colors-colour\\.neutral\\.10: var(--iress-colour-neutral-10, #FFFFFF);
     --colors-colour\\.neutral\\.20: var(--iress-colour-neutral-20, #F5F6F8);
     --colors-colour\\.neutral\\.30: var(--iress-colour-neutral-30, #E2E6EA);
     --colors-colour\\.neutral\\.40: var(--iress-colour-neutral-40, #CFD5DA);
     --colors-colour\\.neutral\\.50: var(--iress-colour-neutral-50, #A8B2BB);
     --colors-colour\\.neutral\\.60: var(--iress-colour-neutral-60, #828F9D);
-    --colors-colour\\.neutral\\.70: var(--iress-colour-neutral-70, #5D6C7E);
+    --colors-colour\\.neutral\\.70: var(--iress-colour-neutral-70, #6D7278);
     --colors-colour\\.neutral\\.80: var(--iress-colour-neutral-80, #384666);
-    --colors-colour\\.neutral\\.90: var(--iress-colour-neutral-90, #13213F);
+    --colors-colour\\.neutral\\.90: var(--iress-colour-neutral-90, #141F4D);
     --colors-colour\\.accent\\.1: var(--iress-colour-accent-1, #C26EF4);
     --colors-colour\\.accent\\.2: var(--iress-colour-accent-2, #7599F9);
     --colors-colour\\.system\\.success\\.fill: var(--iress-colour-system-success-fill, #37C49C);
@@ -254,26 +254,26 @@ const z = `@layer reset, base, tokens, recipes, utilities;
     --colors-colour\\.system\\.success\\.on-fill: var(--iress-colour-system-success-on-fill, #0A2E25);
     --colors-colour\\.system\\.success\\.surface: var(--iress-colour-system-success-surface, #EBF9F5);
     --colors-colour\\.system\\.success\\.surface-hover: var(--iress-colour-system-success-surface-hover, #D7F3EB);
-    --colors-colour\\.system\\.success\\.text: var(--iress-colour-system-success-text, #0A2E25);
+    --colors-colour\\.system\\.success\\.text: var(--iress-colour-system-success-text, #124d3d);
     --colors-colour\\.system\\.danger\\.fill: var(--iress-colour-system-danger-fill, #C32F2F);
     --colors-colour\\.system\\.danger\\.fill-hover: var(--iress-colour-system-danger-fill-hover, #B32727);
     --colors-colour\\.system\\.danger\\.on-fill: var(--iress-colour-system-danger-on-fill, #FFF4F3);
     --colors-colour\\.system\\.danger\\.surface: var(--iress-colour-system-danger-surface, #FFEDEC);
     --colors-colour\\.system\\.danger\\.surface-hover: var(--iress-colour-system-danger-surface-hover, #FFD9D6);
-    --colors-colour\\.system\\.danger\\.text: var(--iress-colour-system-danger-text, #2D0909);
+    --colors-colour\\.system\\.danger\\.text: var(--iress-colour-system-danger-text, #8a1f1f);
     --colors-colour\\.system\\.warning\\.fill: var(--iress-colour-system-warning-fill, #F0AD03);
     --colors-colour\\.system\\.warning\\.on-fill: var(--iress-colour-system-warning-on-fill, #2B1F00);
     --colors-colour\\.system\\.warning\\.fill-hover: var(--iress-colour-system-warning-fill-hover, #DA9D00);
     --colors-colour\\.system\\.warning\\.surface: var(--iress-colour-system-warning-surface, #FFF8E6);
-    --colors-colour\\.system\\.warning\\.text: var(--iress-colour-system-warning-text, #2B1F00);
+    --colors-colour\\.system\\.warning\\.text: var(--iress-colour-system-warning-text, #6b4700);
     --colors-colour\\.system\\.warning\\.surface-hover: var(--iress-colour-system-warning-surface-hover, #FFEAA0);
     --colors-colour\\.system\\.info\\.fill: var(--iress-colour-system-info-fill, #669AFF);
     --colors-colour\\.system\\.info\\.on-fill: var(--iress-colour-system-info-on-fill, #121D33);
     --colors-colour\\.system\\.info\\.fill-hover: var(--iress-colour-system-info-fill-hover, #5685E1);
     --colors-colour\\.system\\.info\\.surface: var(--iress-colour-system-info-surface, #E5EEFF);
-    --colors-colour\\.system\\.info\\.text: var(--iress-colour-system-info-text, #121D33);
+    --colors-colour\\.system\\.info\\.text: var(--iress-colour-system-info-text, #203a75);
     --colors-colour\\.system\\.info\\.surface-hover: var(--iress-colour-system-info-surface-hover, #CCDEFF);
-    --colors-colour\\.system\\.backdrop\\.fill: var(--iress-colour-system-backdrop-fill, #393F46CC);
+    --colors-colour\\.system\\.backdrop\\.fill: var(--iress-colour-system-backdrop-fill, #61656bcc);
     --colors-colour\\.data\\.subtle\\.10: var(--iress-colour-data-subtle-10, #FFE6F2);
     --colors-colour\\.data\\.subtle\\.20: var(--iress-colour-data-subtle-20, #FEEAFF);
     --colors-colour\\.data\\.subtle\\.30: var(--iress-colour-data-subtle-30, #F1E6FF);
@@ -295,7 +295,7 @@ const z = `@layer reset, base, tokens, recipes, utilities;
     --colors-transparent: rgba(0, 0, 0, 0);
     --colors-page: var(--iress-colour-neutral-10, #FFFFFF);
     --colors-alt: var(--iress-colour-neutral-20, #F5F6F8);
-    --colors-muted: var(--iress-colour-neutral-70, #5D6C7E);
+    --colors-muted: var(--iress-colour-neutral-70, #6D7278);
     --colors-text: var(--iress-colour-neutral-80, #384666);
     --radii-radius\\.000: var(--iress-radius-000, 0px);
     --radii-radius\\.025: var(--iress-radius-025, calc(0.25 * var(--iress-radius-100, 1rem)));
@@ -1420,6 +1420,11 @@ const z = `@layer reset, base, tokens, recipes, utilities;
       font: var(--iress-typography-heading-4, 500 calc(var(--iress-typography-base-size, .875rem) * (14 / 14)) / 1.42 var(--iress-typography-base-heading-font, Ubuntu, Helvetica, sans-serif));
 }
 
+    .layerStyle_elevation\\.overflow {
+      border: var(--iress-elevation-overflow-border, 0px solid transparent);
+      box-shadow: var(--iress-elevation-overflow-shadow, inset -13px 0px 18.8px #091E420D);
+}
+
     .animationStyle_loading-fade-next {
       animation-name: loadingFadeNext;
       animation-duration: 0.6s;
@@ -1449,11 +1454,6 @@ const z = `@layer reset, base, tokens, recipes, utilities;
       animation-fill-mode: forwards;
 }
 
-    .layerStyle_elevation\\.overflow {
-      border: var(--iress-elevation-overflow-border, 0px solid transparent);
-      box-shadow: var(--iress-elevation-overflow-shadow, inset 7px 0px 5px #091E4215);
-}
-
     .layerStyle_elevation\\.focus {
       border-color: var(--iress-elevation-focus-border-color, #0066FF) !important;
       box-shadow: var(--iress-elevation-focus-shadow, 0px 0px 0px 1.5px var(--iress-colour-neutral-10, #FFFFFF), 0px 0px 0px 3.5px #0066FF);
@@ -1619,6 +1619,11 @@ const z = `@layer reset, base, tokens, recipes, utilities;
       box-shadow: var(--iress-elevation-focus-shadow, 0px 0px 0px 1.5px var(--iress-colour-neutral-10, #FFFFFF), 0px 0px 0px 3.5px #0066FF);
 }
 
+    .focusVisible\\:layerStyle_elevation\\.focusCompact:is(:focus-visible, [data-focus-visible]) {
+      border-color: var(--iress-elevation-focus-compact-border-color, #0066FF);
+      box-shadow: var(--iress-elevation-focus-compact-shadow, inset 0px -2px 0px 0px #0066FF);
+}
+
     .active\\:layerStyle_elevation\\.focus:is(:active, [data-active]) {
       border-color: var(--iress-elevation-focus-border-color, #0066FF) !important;
       box-shadow: var(--iress-elevation-focus-shadow, 0px 0px 0px 1.5px var(--iress-colour-neutral-10, #FFFFFF), 0px 0px 0px 3.5px #0066FF);
@@ -1640,7 +1645,7 @@ const z = `@layer reset, base, tokens, recipes, utilities;
 }
       .xs\\:layerStyle_elevation\\.overflow {
         border: var(--iress-elevation-overflow-border, 0px solid transparent);
-        box-shadow: var(--iress-elevation-overflow-shadow, inset 7px 0px 5px #091E4215);
+        box-shadow: var(--iress-elevation-overflow-shadow, inset -13px 0px 18.8px #091E420D);
 }
       .xs\\:layerStyle_elevation\\.focus {
         border-color: var(--iress-elevation-focus-border-color, #0066FF) !important;
@@ -1741,7 +1746,7 @@ const z = `@layer reset, base, tokens, recipes, utilities;
 }
       .sm\\:layerStyle_elevation\\.overflow {
         border: var(--iress-elevation-overflow-border, 0px solid transparent);
-        box-shadow: var(--iress-elevation-overflow-shadow, inset 7px 0px 5px #091E4215);
+        box-shadow: var(--iress-elevation-overflow-shadow, inset -13px 0px 18.8px #091E420D);
 }
       .sm\\:layerStyle_elevation\\.focus {
         border-color: var(--iress-elevation-focus-border-color, #0066FF) !important;
@@ -1842,7 +1847,7 @@ const z = `@layer reset, base, tokens, recipes, utilities;
 }
       .md\\:layerStyle_elevation\\.overflow {
         border: var(--iress-elevation-overflow-border, 0px solid transparent);
-        box-shadow: var(--iress-elevation-overflow-shadow, inset 7px 0px 5px #091E4215);
+        box-shadow: var(--iress-elevation-overflow-shadow, inset -13px 0px 18.8px #091E420D);
 }
       .md\\:layerStyle_elevation\\.focus {
         border-color: var(--iress-elevation-focus-border-color, #0066FF) !important;
@@ -1943,7 +1948,7 @@ const z = `@layer reset, base, tokens, recipes, utilities;
 }
       .lg\\:layerStyle_elevation\\.overflow {
         border: var(--iress-elevation-overflow-border, 0px solid transparent);
-        box-shadow: var(--iress-elevation-overflow-shadow, inset 7px 0px 5px #091E4215);
+        box-shadow: var(--iress-elevation-overflow-shadow, inset -13px 0px 18.8px #091E420D);
 }
       .lg\\:layerStyle_elevation\\.focus {
         border-color: var(--iress-elevation-focus-border-color, #0066FF) !important;
@@ -2044,7 +2049,7 @@ const z = `@layer reset, base, tokens, recipes, utilities;
 }
       .xl\\:layerStyle_elevation\\.overflow {
         border: var(--iress-elevation-overflow-border, 0px solid transparent);
-        box-shadow: var(--iress-elevation-overflow-shadow, inset 7px 0px 5px #091E4215);
+        box-shadow: var(--iress-elevation-overflow-shadow, inset -13px 0px 18.8px #091E420D);
 }
       .xl\\:layerStyle_elevation\\.focus {
         border-color: var(--iress-elevation-focus-border-color, #0066FF) !important;
@@ -2145,7 +2150,7 @@ const z = `@layer reset, base, tokens, recipes, utilities;
 }
       .xxl\\:layerStyle_elevation\\.overflow {
         border: var(--iress-elevation-overflow-border, 0px solid transparent);
-        box-shadow: var(--iress-elevation-overflow-shadow, inset 7px 0px 5px #091E4215);
+        box-shadow: var(--iress-elevation-overflow-shadow, inset -13px 0px 18.8px #091E420D);
 }
       .xxl\\:layerStyle_elevation\\.focus {
         border-color: var(--iress-elevation-focus-border-color, #0066FF) !important;
@@ -2516,10 +2521,6 @@ const z = `@layer reset, base, tokens, recipes, utilities;
     margin: var(--spacing-lg);
 }
 
-  .bg_colour\\.primary\\.text {
-    background: var(--colors-colour\\.primary\\.text);
-}
-
   .p_spacing\\.7 {
     padding: var(--spacing-spacing\\.7);
 }
@@ -2688,6 +2689,10 @@ const z = `@layer reset, base, tokens, recipes, utilities;
     background: var(--colors-colour\\.primary\\.on-fill);
 }
 
+  .bg_colour\\.primary\\.text {
+    background: var(--colors-colour\\.primary\\.text);
+}
+
   .bg_colour\\.neutral\\.60 {
     background: var(--colors-colour\\.neutral\\.60);
 }
@@ -3248,8 +3253,12 @@ const z = `@layer reset, base, tokens, recipes, utilities;
     gap: var(--spacing-spacing\\.3);
 }
 
-  .bd-b_divider {
-    border-bottom: var(--borders-divider);
+  .scrs-t_\\[x_proximity\\] {
+    scroll-snap-type: x proximity;
+}
+
+  .bdr_radius\\.075 {
+    border-radius: var(--radii-radius\\.075);
 }
 
   .bd-e_table {
@@ -3350,10 +3359,6 @@ const z = `@layer reset, base, tokens, recipes, utilities;
     margin-block: var(--spacing-spacing\\.1);
 }
 
-  .bdr_radius\\.075 {
-    border-radius: var(--radii-radius\\.075);
-}
-
   .bdr_none {
     border-radius: var(--radii-none);
 }
@@ -3839,34 +3844,6 @@ const z = `@layer reset, base, tokens, recipes, utilities;
     justify-content: center;
 }
 
-  .pos_absolute {
-    position: absolute;
-}
-
-  .inset-bs_spacing\\.0 {
-    inset-block-start: var(--spacing-spacing\\.0);
-}
-
-  .inset-e_spacing\\.0 {
-    inset-inline-end: var(--spacing-spacing\\.0);
-}
-
-  .z_100 {
-    z-index: var(--z-index-100);
-}
-
-  .trf-o_100\\%_0 {
-    transform-origin: 100% 0;
-}
-
-  .trf_translate\\(50\\%\\,_-50\\%\\) {
-    transform: translate(50%, -50%);
-}
-
-  .pos_relative {
-    position: relative;
-}
-
   .c_colour\\.neutral\\.60 {
     color: var(--colors-colour\\.neutral\\.60);
 }
@@ -3918,6 +3895,10 @@ const z = `@layer reset, base, tokens, recipes, utilities;
     contain: layout style;
 }
 
+  .pos_relative {
+    position: relative;
+}
+
   .ta_start {
     text-align: start;
 }
@@ -4225,6 +4206,10 @@ const z = `@layer reset, base, tokens, recipes, utilities;
     position: static;
 }
 
+  .pos_absolute {
+    position: absolute;
+}
+
   .fs_inherit {
     font-size: inherit;
 }
@@ -4236,7 +4221,7 @@ const z = `@layer reset, base, tokens, recipes, utilities;
     top: 50%;
     inset-inline-end: calc(var(--iress-spacing-2, calc(2 * var(--iress-spacing-100, .25rem))) + calc(0.25 * var(--iress-spacing-2, calc(2 * var(--iress-spacing-100, .25rem)))));
     position: absolute;
-    border: 1px solid var(--iress-colour-neutral-70, #5D6C7E);
+    border: 1px solid var(--iress-colour-neutral-70, #6D7278);
     border-block-start: none;
     border-inline-start: none;
     transform: translateY(-50%) rotate(45deg);
@@ -4327,6 +4312,10 @@ const z = `@layer reset, base, tokens, recipes, utilities;
     flex-grow: 1;
 }
 
+  .ai_end {
+    align-items: end;
+}
+
   .fw_300 {
     font-weight: 300;
 }
@@ -4359,7 +4348,7 @@ const z = `@layer reset, base, tokens, recipes, utilities;
 }
 
   .scrollable_y::-webkit-scrollbar-thumb:hover {
-    background-color: var(--iress-colour-primary-fill, #1D1F4B);
+    background-color: var(--iress-colour-primary-fill, #003271);
 }
 
   .scrollable_y::-webkit-scrollbar-corner {
@@ -4491,6 +4480,10 @@ const z = `@layer reset, base, tokens, recipes, utilities;
     background-color: var(--colors-colour\\.neutral\\.30);
 }
 
+  .z_100 {
+    z-index: var(--z-index-100);
+}
+
   .trf_\\[translateX\\(-50\\%\\)_translateY\\(-125\\%\\)\\] {
     transform: translateX(-50%) translateY(-125%);
 }
@@ -4499,10 +4492,18 @@ const z = `@layer reset, base, tokens, recipes, utilities;
     position: fixed;
 }
 
+  .inset-bs_spacing\\.0 {
+    inset-block-start: var(--spacing-spacing\\.0);
+}
+
   .z_300 {
     z-index: var(--z-index-300);
 }
 
+  .inset-e_spacing\\.0 {
+    inset-inline-end: var(--spacing-spacing\\.0);
+}
+
   .bdr-ss_radius\\.050 {
     border-start-start-radius: var(--radii-radius\\.050);
 }
@@ -4575,10 +4576,56 @@ const z = `@layer reset, base, tokens, recipes, utilities;
     margin-inline-start: var(--iress-tick-label-width);
 }
 
-  .pointer-events_none {
+  .scrollable_x {
+    overflow-x: auto;
+}
+
+  .scrollable_x::-webkit-scrollbar {
+    width: var(--iress-typography-base-size, .875rem);
+    height: var(--iress-typography-base-size, .875rem);
+}
+
+  .scrollable_x::-webkit-scrollbar-track {
+    background: var(--iress-colour-neutral-10, #FFFFFF);
+    border-radius: var(--iress-radius-100, 1rem);
+}
+
+  .scrollable_x::-webkit-scrollbar-thumb {
+    background-color: var(--iress-colour-neutral-60, #828F9D);
+    border-radius: var(--iress-radius-025, calc(0.25 * var(--iress-radius-100, 1rem)));
+}
+
+  .scrollable_x::-webkit-scrollbar-thumb:hover {
+    background-color: var(--iress-colour-primary-fill, #003271);
+}
+
+  .scrollable_x::-webkit-scrollbar-corner {
+    background: rgba(0, 0, 0, 0);
+}
+
+  .scrollable_x {
+    scrollbar-width: thin;
+    scrollbar-color: var(--iress-colour-neutral-60, #828F9D) var(--iress-colour-neutral-10, #FFFFFF);
+}
+
+  .bdr-b_none {
+    border-bottom-left-radius: var(--radii-none);
+    border-bottom-right-radius: var(--radii-none);
+}
+
+  .pointer-events_none,.pointer-events_\\[none\\] {
     pointer-events: none;
 }
 
+  .msk-i_\\[linear-gradient\\(to_right\\,_transparent_30\\%\\,_black_100\\%\\)\\] {
+    mask-image: linear-gradient(to right, transparent 30%, black 100%);
+    -webkit-mask-image: linear-gradient(to right, transparent 30%, black 100%);
+}
+
+  .trf_\\[rotate\\(180deg\\)\\] {
+    transform: rotate(180deg);
+}
+
   .ta_justify {
     text-align: justify;
 }
@@ -5287,38 +5334,6 @@ const z = `@layer reset, base, tokens, recipes, utilities;
     box-shadow: var(--iress-elevation-focus-shadow, 0px 0px 0px 1.5px var(--iress-colour-neutral-10, #FFFFFF), 0px 0px 0px 3.5px #0066FF);
 }
 
-  .scrollable_x {
-    overflow-x: auto;
-}
-
-  .scrollable_x::-webkit-scrollbar {
-    width: var(--iress-typography-base-size, .875rem);
-    height: var(--iress-typography-base-size, .875rem);
-}
-
-  .scrollable_x::-webkit-scrollbar-track {
-    background: var(--iress-colour-neutral-20, #F5F6F8);
-    border-radius: var(--iress-radius-100, 1rem);
-}
-
-  .scrollable_x::-webkit-scrollbar-thumb {
-    background-color: var(--iress-colour-neutral-60, #828F9D);
-    border-radius: var(--iress-radius-025, calc(0.25 * var(--iress-radius-100, 1rem)));
-}
-
-  .scrollable_x::-webkit-scrollbar-thumb:hover {
-    background-color: var(--iress-colour-primary-fill, #1D1F4B);
-}
-
-  .scrollable_x::-webkit-scrollbar-corner {
-    background: rgba(0, 0, 0, 0);
-}
-
-  .scrollable_x {
-    scrollbar-width: thin;
-    scrollbar-color: var(--iress-colour-neutral-60, #828F9D) var(--iress-colour-neutral-20, #F5F6F8);
-}
-
   .scrollable_true {
     overflow: auto;
 }
@@ -5339,7 +5354,7 @@ const z = `@layer reset, base, tokens, recipes, utilities;
 }
 
   .scrollable_true::-webkit-scrollbar-thumb:hover {
-    background-color: var(--iress-colour-primary-fill, #1D1F4B);
+    background-color: var(--iress-colour-primary-fill, #003271);
 }
 
   .scrollable_true::-webkit-scrollbar-corner {
@@ -5419,12 +5434,8 @@ const z = `@layer reset, base, tokens, recipes, utilities;
     min-height: 1.35em;
 }
 
-  .min-w_\\[1\\.35em\\] {
-    min-width: 1.35em;
-}
-
-  .h_auto {
-    height: auto;
+  .min-w_\\[1\\.5em\\] {
+    min-width: 1.5em;
 }
 
   .w_\\[100\\%\\] {
@@ -5467,6 +5478,10 @@ const z = `@layer reset, base, tokens, recipes, utilities;
     height: 100%;
 }
 
+  .h_auto {
+    height: auto;
+}
+
   .w_auto {
     width: auto;
 }
@@ -5807,28 +5822,44 @@ const z = `@layer reset, base, tokens, recipes, utilities;
     margin-bottom: var(--spacing-spacing\\.3);
 }
 
+  .ml_xs {
+    margin-left: var(--spacing-xs);
+}
+
+  .ov-y_visible {
+    overflow-y: visible;
+}
+
+  .ov-x_clip {
+    overflow-x: clip;
+}
+
+  .pt_spacing\\.2 {
+    padding-top: var(--spacing-spacing\\.2);
+}
+
   .pt_md {
     padding-top: var(--spacing-md);
 }
 
-  .bottom_\\[0\\] {
-    bottom: 0;
+  .top_spacing\\.1 {
+    top: var(--spacing-spacing\\.1);
 }
 
-  .left_\\[0\\] {
-    left: 0;
+  .bottom_spacing\\.1 {
+    bottom: var(--spacing-spacing\\.1);
 }
 
-  .h_\\[2px\\] {
-    height: 2px;
+  .left_\\[0\\] {
+    left: 0;
 }
 
   .left_\\[100\\%\\] {
     left: 100%;
 }
 
-  .bottom_spacing\\.2 {
-    bottom: var(--spacing-spacing\\.2);
+  .top_spacing\\.0 {
+    top: var(--spacing-spacing\\.0);
 }
 
   .h_\\[calc\\(\\{sizes\\.input\\.height\\}_-_\\{spacing\\.spacing\\.2\\}_-_2px\\)\\] {
@@ -5875,6 +5906,10 @@ const z = `@layer reset, base, tokens, recipes, utilities;
     right: 0;
 }
 
+  .bottom_\\[0\\] {
+    bottom: 0;
+}
+
   .w_\\[fit-content\\] {
     width: fit-content;
 }
@@ -5895,10 +5930,6 @@ const z = `@layer reset, base, tokens, recipes, utilities;
     bottom: 100%;
 }
 
-  .top_spacing\\.0 {
-    top: var(--spacing-spacing\\.0);
-}
-
   .pl_spacing\\.6 {
     padding-left: var(--spacing-spacing\\.6);
 }
@@ -5919,10 +5950,6 @@ const z = `@layer reset, base, tokens, recipes, utilities;
     height: 1em;
 }
 
-  .top_spacing\\.1 {
-    top: var(--spacing-spacing\\.1);
-}
-
   .right_\\[100\\%\\] {
     right: 100%;
 }
@@ -6255,10 +6282,6 @@ const z = `@layer reset, base, tokens, recipes, utilities;
     margin-left: var(--spacing-none);
 }
 
-  .ml_xs {
-    margin-left: var(--spacing-xs);
-}
-
   .ml_sm {
     margin-left: var(--spacing-sm);
 }
@@ -6467,10 +6490,6 @@ const z = `@layer reset, base, tokens, recipes, utilities;
     padding-top: var(--spacing-spacing\\.1);
 }
 
-  .pt_spacing\\.2 {
-    padding-top: var(--spacing-spacing\\.2);
-}
-
   .pt_spacing\\.4 {
     padding-top: var(--spacing-spacing\\.4);
 }
@@ -7171,6 +7190,10 @@ const z = `@layer reset, base, tokens, recipes, utilities;
     padding: var(--spacing-spacing\\.0);
 }
 
+  .after\\:bg_colour\\.primary\\.text::after {
+    background: var(--colors-colour\\.primary\\.text);
+}
+
   .\\[\\&_button\\]\\:p_spacing\\.1 button {
     padding: var(--spacing-spacing\\.1);
 }
@@ -7303,6 +7326,12 @@ const z = `@layer reset, base, tokens, recipes, utilities;
     margin-block: var(--spacing-spacing\\.0);
 }
 
+  .after\\:trs_all::after {
+    transition-property: var(--transition-prop, all);
+    transition-timing-function: var(--transition-easing, cubic-bezier(0.4, 0, 0.2, 1));
+    transition-duration: var(--transition-duration, 150ms);
+}
+
   .before\\:bdr_\\[\\{sizes\\.toggle\\.thumb\\}\\]::before {
     border-radius: var(--sizes-toggle\\.thumb);
 }
@@ -7379,10 +7408,6 @@ const z = `@layer reset, base, tokens, recipes, utilities;
     display: inline-block;
 }
 
-  :where([dir=rtl], :dir(rtl)) .rtl\\:trf_translate\\(-50\\%\\,_-50\\%\\) {
-    transform: translate(-50%, -50%);
-}
-
   .after\\:content_\\"\\"::after {
     content: "";
 }
@@ -7443,7 +7468,7 @@ const z = `@layer reset, base, tokens, recipes, utilities;
     top: 50%;
     inset-inline-end: calc(var(--iress-spacing-2, calc(2 * var(--iress-spacing-100, .25rem))) + calc(0.25 * var(--iress-spacing-4, calc(4 * var(--iress-spacing-100, .25rem)))));
     position: absolute;
-    border: 1px solid var(--iress-colour-neutral-70, #5D6C7E);
+    border: 1px solid var(--iress-colour-neutral-70, #6D7278);
     border-block-start: none;
     border-inline-start: none;
     transform: translateY(-50%) rotate(-45deg);
@@ -7546,7 +7571,7 @@ const z = `@layer reset, base, tokens, recipes, utilities;
     border-radius: calc(calc(var(--iress-typography-base-size, .875rem) * 2) / 2);
     border-style: solid;
     border-width: 1.5px;
-    background-color: var(--iress-colour-primary-fill, #1D1F4B);
+    background-color: var(--iress-colour-primary-fill, #003271);
     position: relative;
     z-index: 200;
 }
@@ -7565,7 +7590,7 @@ const z = `@layer reset, base, tokens, recipes, utilities;
     border-radius: calc(calc(var(--iress-typography-base-size, .875rem) * 2) / 2);
     border-style: solid;
     border-width: 1.5px;
-    background-color: var(--iress-colour-primary-fill, #1D1F4B);
+    background-color: var(--iress-colour-primary-fill, #003271);
     position: relative;
     z-index: 200;
 }
@@ -7598,6 +7623,14 @@ const z = `@layer reset, base, tokens, recipes, utilities;
     animation-delay: 0.4s;
 }
 
+  .after\\:pointer-events_none::after {
+    pointer-events: none;
+}
+
+  .after\\:z_\\[2\\]::after {
+    z-index: 2;
+}
+
   .\\[\\&\\&\\]\\:ta_end.\\[\\&\\&\\]\\:ta_end {
     text-align: end;
 }
@@ -7814,8 +7847,12 @@ const z = `@layer reset, base, tokens, recipes, utilities;
     left: 50%;
 }
 
-  .\\[\\&_\\>_\\:has\\(\\.ids-badge\\)\\]\\:mr_spacing\\.4 > :has(.ids-badge) {
-    margin-right: var(--spacing-spacing\\.4);
+  .after\\:bottom_spacing\\.1::after {
+    bottom: var(--spacing-spacing\\.1);
+}
+
+  .after\\:h_\\[2px\\]::after {
+    height: 2px;
 }
 
   .\\[\\&_button\\]\\:min-w_\\[0\\] button {