@geotab/zenith 3.16.0 → 3.17.0-beta.0

package/dist/index.css

@@ -1926,6 +1926,20 @@ html:lang(ar) .mobile-data-s-drive {
   --data--categorical-yellow: #f5bd60;
   --data--categorical-red: #e56a6a;
   --data--categorical-grey: #8a94a2;
+  --data--sequential-1: #8cb6f9;
+  --data--sequential-2: #6ca1f8;
+  --data--sequential-3: #428aff;
+  --data--sequential-4: #2e76ea;
+  --data--sequential-5: #1862d5;
+  --data--sequential-6: #0d51b7;
+  --data--sequential-7: #084197;
+  --data--diverging-1: #782c0e;
+  --data--diverging-2: #cb591f;
+  --data--diverging-3: #f98c41;
+  --data--diverging-4: #f5bd60;
+  --data--diverging-5: #428aff;
+  --data--diverging-6: #1862d5;
+  --data--diverging-7: #084197;
 }
 .zen-dark {
   color: var(--text-primary);
@@ -2245,18 +2259,27 @@ html:lang(ar) .zen-button--mobile {
   outline: none;
   text-decoration: none;
 }
-.zen-button:disabled,
-.zen-button--disabled {
+.zen-button:disabled {
   pointer-events: none;
   cursor: default;
 }
-.zen-button:hover {
+.zen-button--disabled {
+  cursor: default;
+}
+.zen-button--disabled:not(.zen-button--disabled-focusable) {
+  pointer-events: none;
+}
+.zen-button:focus-visible {
+  outline: 1px solid var(--borders-form-field--active);
+  outline-offset: 2px;
+}
+.zen-button:hover:not(.zen-button--disabled) {
   color: var(--text-primary);
   fill: var(--text-primary);
   border-color: var(--borders-form-field--reverse);
   background-color: var(--backgrounds-hover);
 }
-.zen-button:focus-visible {
+.zen-button:focus-visible:not(.zen-button--disabled) {
   color: var(--text-primary);
   fill: var(--text-primary);
   border-color: var(--borders-form-field--reverse);
@@ -2264,8 +2287,8 @@ html:lang(ar) .zen-button--mobile {
   outline: 1px solid var(--borders-form-field--active);
   outline-offset: 2px;
 }
-.zen-button:active,
-.zen-button--active {
+.zen-button:active:not(.zen-button--disabled),
+.zen-button--active:not(.zen-button--disabled) {
   color: var(--text-primary);
   fill: var(--text-primary);
   border-color: var(--borders-form-field--reverse);
@@ -2285,13 +2308,13 @@ html:lang(ar) .zen-button--mobile {
   border-color: var(--borders-form-field--active);
   background-color: var(--action-primary--default);
 }
-.zen-button--primary:hover {
+.zen-button--primary:hover:not(.zen-button--disabled) {
   color: var(--text-reverse-primary);
   fill: var(--text-reverse-primary);
   border-color: var(--action-primary--hover);
   background-color: var(--action-primary--hover);
 }
-.zen-button--primary:focus-visible {
+.zen-button--primary:focus-visible:not(.zen-button--disabled) {
   color: var(--text-reverse-primary);
   fill: var(--text-reverse-primary);
   border-color: var(--action-primary--hover);
@@ -2299,7 +2322,7 @@ html:lang(ar) .zen-button--mobile {
   outline: 1px solid var(--borders-form-field--active);
   outline-offset: 2px;
 }
-.zen-button--primary:active {
+.zen-button--primary:active:not(.zen-button--disabled) {
   color: var(--text-reverse-primary);
   fill: var(--text-reverse-primary);
   border-color: var(--action-primary--active);
@@ -2319,13 +2342,13 @@ html:lang(ar) .zen-button--mobile {
   border-color: transparent;
   background-color: transparent;
 }
-.zen-button--tertiary:hover {
+.zen-button--tertiary:hover:not(.zen-button--disabled) {
   color: var(--text-hyperlink);
   fill: var(--text-hyperlink);
   border: 1px solid var(--backgrounds-content-1);
   background-color: var(--backgrounds-content-1);
 }
-.zen-button--tertiary:focus-visible {
+.zen-button--tertiary:focus-visible:not(.zen-button--disabled) {
   color: var(--text-hyperlink);
   fill: var(--text-hyperlink);
   border-color: var(--backgrounds-content-1);
@@ -2333,7 +2356,7 @@ html:lang(ar) .zen-button--mobile {
   outline: 1px solid var(--borders-form-field--active);
   outline-offset: 2px;
 }
-.zen-button--tertiary:active {
+.zen-button--tertiary:active:not(.zen-button--disabled) {
   color: var(--text-hyperlink);
   fill: var(--text-hyperlink);
   border-color: var(--action-tertiary--hover);
@@ -2353,13 +2376,13 @@ html:lang(ar) .zen-button--mobile {
   border-color: var(--action-destructive--default);
   background-color: var(--action-destructive--default);
 }
-.zen-button--destructive:hover {
+.zen-button--destructive:hover:not(.zen-button--disabled) {
   color: var(--text-reverse-primary);
   fill: var(--text-reverse-primary);
   border-color: var(--action-destructive--hover);
   background-color: var(--action-destructive--hover);
 }
-.zen-button--destructive:focus-visible {
+.zen-button--destructive:focus-visible:not(.zen-button--disabled) {
   color: var(--text-reverse-primary);
   fill: var(--text-reverse-primary);
   border-color: var(--action-destructive--hover);
@@ -2367,7 +2390,7 @@ html:lang(ar) .zen-button--mobile {
   outline: 1px solid var(--borders-form-field--active);
   outline-offset: 2px;
 }
-.zen-button--destructive:active {
+.zen-button--destructive:active:not(.zen-button--disabled) {
   color: var(--text-reverse-primary);
   fill: var(--text-reverse-primary);
   border-color: var(--action-destructive--active);
@@ -2384,9 +2407,9 @@ html:lang(ar) .zen-button--mobile {
 .zen-button--separate {
   border-color: var(--backgrounds-main);
 }
-.zen-button--separate:hover,
-.zen-button--separate:focus,
-.zen-button--separate:active {
+.zen-button--separate:hover:not(.zen-button--disabled),
+.zen-button--separate:focus:not(.zen-button--disabled),
+.zen-button--separate:active:not(.zen-button--disabled) {
   border-color: var(--backgrounds-main);
 }
 .zen-button--icon {
@@ -2405,13 +2428,13 @@ html:lang(ar) .zen-button--mobile {
   border-color: transparent;
   background-color: transparent;
 }
-.zen-button--tertiary-black:hover {
+.zen-button--tertiary-black:hover:not(.zen-button--disabled) {
   color: var(--text-primary);
   fill: var(--text-primary);
   border: 1px solid var(--backgrounds-content-1);
   background-color: var(--backgrounds-content-1);
 }
-.zen-button--tertiary-black:focus-visible {
+.zen-button--tertiary-black:focus-visible:not(.zen-button--disabled) {
   color: var(--text-primary);
   fill: var(--text-primary);
   border-color: var(--backgrounds-content-1);
@@ -2419,7 +2442,7 @@ html:lang(ar) .zen-button--mobile {
   outline: 1px solid var(--borders-form-field--active);
   outline-offset: 2px;
 }
-.zen-button--tertiary-black:active {
+.zen-button--tertiary-black:active:not(.zen-button--disabled) {
   color: var(--text-primary);
   fill: var(--text-primary);
   border-color: var(--action-tertiary--hover);
@@ -2439,13 +2462,13 @@ html:lang(ar) .zen-button--mobile {
   border-color: transparent;
   background-color: transparent;
 }
-.zen-button--tertiary-destructive:hover {
+.zen-button--tertiary-destructive:hover:not(.zen-button--disabled) {
   color: var(--text-error-message);
   fill: var(--text-error-message);
   border: 1px solid var(--backgrounds-content-1);
   background-color: var(--backgrounds-content-1);
 }
-.zen-button--tertiary-destructive:focus-visible {
+.zen-button--tertiary-destructive:focus-visible:not(.zen-button--disabled) {
   color: var(--text-error-message);
   fill: var(--text-error-message);
   border-color: var(--backgrounds-content-1);
@@ -2453,7 +2476,7 @@ html:lang(ar) .zen-button--mobile {
   outline: 1px solid var(--borders-form-field--active);
   outline-offset: 2px;
 }
-.zen-button--tertiary-destructive:active {
+.zen-button--tertiary-destructive:active:not(.zen-button--disabled) {
   color: var(--text-error-message);
   fill: var(--text-error-message);
   border-color: var(--accents-error--main);
@@ -2473,12 +2496,12 @@ html:lang(ar) .zen-button--mobile {
   border-color: transparent;
   background-color: transparent;
 }
-.zen-button--light:hover,
-.zen-button--light:focus {
+.zen-button--light:hover:not(.zen-button--disabled),
+.zen-button--light:focus:not(.zen-button--disabled) {
   border: 1px solid var(--backgrounds-hover);
   background-color: var(--backgrounds-hover);
 }
-.zen-button--light:active {
+.zen-button--light:active:not(.zen-button--disabled) {
   color: var(--action-primary--hover);
   fill: var(--action-primary--hover);
   border-color: var(--action-primary--default);
@@ -2797,7 +2820,7 @@ html:lang(ar) .zen-accordion {
 }
 .zen-accordion__header-button .zen-accordion__header-arrow {
   fill: var(--action-secondary--default);
-  margin-left: auto;
+  margin-inline-start: auto;
 }
 .zen-accordion__header-button .zen-accordion__header-arrow--rotated {
   transform: rotate(180deg);
@@ -3968,8 +3991,14 @@ html:lang(ar) .zen-card__date--mobile {
   height: 100%;
   border: 0;
   border-radius: 0;
-  color: var(--text-primary);
-  fill: var(--text-secondary);
+  --zen-menu-action-color: var(--text-primary);
+  --zen-menu-action-fill: var(--text-secondary);
+  --zen-menu-action-hover-background: var(--backgrounds-hover);
+  --zen-menu-action-active-color: var(--text-reverse-primary);
+  --zen-menu-action-active-background: var(--action-primary--default);
+  --zen-menu-action-active-hover-background: var(--action-primary--hover);
+  color: var(--zen-menu-action-color);
+  fill: var(--zen-menu-action-fill);
 }
 html:lang(ar) .zen-menu-button__action {
   font-family: "Noto Sans Arabic", Roboto, "Segoe UI", Segoe, "Helvetica Neue", Helvetica, sans-serif;
@@ -3978,21 +4007,21 @@ html:lang(ar) .zen-menu-button__action {
   padding-block: 0.75rem;
   padding-inline: 1rem 0.5rem;
 }
-.zen-menu-button__action:focus,
-.zen-menu-button__action:focus-visible,
+.zen-menu-button__action:focus:not(.zen-menu-button__action--disabled),
+.zen-menu-button__action:focus-visible:not(.zen-menu-button__action--disabled),
 .zen-menu-button__action:hover:not(.zen-menu-button__action--disabled):not(.zen-menu-button__action--selected):not(.zen-menu-button__action--active) {
-  color: var(--text-primary);
-  fill: var(--text-secondary);
+  color: var(--zen-menu-action-color);
+  fill: var(--zen-menu-action-fill);
   border-color: var(--borders-form-field--hover);
-  background-color: var(--backgrounds-hover);
+  background-color: var(--zen-menu-action-hover-background);
 }
 .zen-menu-button__action:active:not(.zen-menu-button__action--disabled),
 .zen-menu-button__action--active:not(.zen-menu-button__action--disabled),
 .zen-menu-button__action--selected {
-  color: var(--text-reverse-primary);
-  fill: var(--text-reverse-primary);
+  color: var(--zen-menu-action-active-color);
+  fill: var(--zen-menu-action-active-color);
   border-color: var(--borders-form-field--active);
-  background-color: var(--action-primary--default);
+  background-color: var(--zen-menu-action-active-background);
 }
 .zen-menu-button__action:active:not(.zen-menu-button__action--disabled):hover,
 .zen-menu-button__action--active:not(.zen-menu-button__action--disabled):hover,
@@ -4000,9 +4029,9 @@ html:lang(ar) .zen-menu-button__action {
 .zen-menu-button__action:active:not(.zen-menu-button__action--disabled):focus,
 .zen-menu-button__action--active:not(.zen-menu-button__action--disabled):focus,
 .zen-menu-button__action--selected:focus {
-  background-color: var(--action-primary--hover);
-  color: var(--text-reverse-primary);
-  fill: var(--text-reverse-primary);
+  background-color: var(--zen-menu-action-active-hover-background);
+  color: var(--zen-menu-action-active-color);
+  fill: var(--zen-menu-action-active-color);
 }
 .zen-menu-button__action:disabled,
 .zen-menu-button__action--disabled {
@@ -4011,6 +4040,21 @@ html:lang(ar) .zen-menu-button__action {
   background-color: transparent;
   cursor: default;
 }
+.zen-menu-button__action--destructive {
+  --zen-menu-action-color: var(--action-destructive--default);
+  --zen-menu-action-fill: var(--action-destructive--default);
+  --zen-menu-action-active-color: var(--text-error-message);
+  --zen-menu-action-active-background: var(--accents-error--main);
+  --zen-menu-action-active-hover-background: var(--accents-error--main);
+}
+.zen-menu-button__action--destructive:active {
+  --zen-menu-action-hover-background: var(--accents-error--main);
+}
+.zen-menu-button__action--destructive:disabled,
+.zen-menu-button__action--destructive.zen-menu-button__action--disabled {
+  color: var(--accents-error--main);
+  fill: var(--text-button-disabled);
+}
 .zen-menu-button__action-text {
   overflow: hidden;
   text-overflow: ellipsis;
@@ -4039,6 +4083,10 @@ html:lang(ar) .zen-menu-button__action {
 .zen-menu-button__action.zen-menu-button__action {
   outline: none;
 }
+.zen-menu-button__action--disabled:focus-visible {
+  outline: 1px solid var(--borders-form-field--active);
+  outline-offset: -2px;
+}
 .zen-menu-button__icon {
   flex: 0 0 auto;
 }
@@ -4046,6 +4094,10 @@ html:lang(ar) .zen-menu-button__action {
   flex: 0 0 auto;
   margin-inline-start: 0.5rem;
 }
+.zen-menu-button__icon-after {
+  flex: 0 0 auto;
+  margin-inline-start: 0.5rem;
+}
 .zen-menu-item {
   box-sizing: border-box;
   padding: 0;
@@ -4879,6 +4931,9 @@ html:lang(ar) .zen-mobile-sheet__title {
   gap: 1.5rem;
   height: 100%;
 }
+.zen-form-section .zen-form-field-label--top + .zen-form-control {
+  margin-block-start: -1.25rem;
+}
 .zen-form-section--desktop.zen-form-section--one-column {
   grid-template-columns: repeat(8, 1fr);
 }
@@ -4951,6 +5006,37 @@ html:lang(ar) .zen-data-feed {
 .zen-data-feed--empty .zen-data-feed__feed {
   display: none;
 }
+.zen-show-more__link {
+  box-sizing: border-box;
+  font-family: Roboto, "Segoe UI", Segoe, "Helvetica Neue", Helvetica, sans-serif;
+  font-size: 0.875rem;
+  font-style: normal;
+  font-weight: 400;
+  letter-spacing: 0rem;
+  line-height: 1rem;
+  text-transform: none;
+  background-color: transparent;
+  border: none;
+  padding: 0;
+  cursor: pointer;
+  text-decoration: none;
+  color: var(--text-hyperlink);
+  fill: var(--text-hyperlink);
+}
+.zen-show-more__link * {
+  box-sizing: border-box;
+}
+html:lang(ar) .zen-show-more__link {
+  font-family: "Noto Sans Arabic", Roboto, "Segoe UI", Segoe, "Helvetica Neue", Helvetica, sans-serif;
+}
+.zen-show-more__link:hover {
+  text-decoration: underline;
+}
+.zen-show-more__link:focus-visible {
+  outline: 1px solid var(--borders-form-field--active);
+  outline-offset: 2px;
+  border-radius: var(--border-radius-default);
+}
 :root {
   --grid-header-height: 3.25rem;
 }
@@ -5030,7 +5116,6 @@ html:lang(ar) .zen-data-feed {
 }
 .zen-data-grid__header-cell--first .zen-data-grid__header-cell-content {
   border-inline-start: none;
-  font-weight: bold;
 }
 .zen-data-grid__header-cell-content {
   font-family: Roboto, "Segoe UI", Segoe, "Helvetica Neue", Helvetica, sans-serif;
@@ -5123,6 +5208,11 @@ html:lang(ar) .zen-data-grid__row-cell {
   background-color: var(--backgrounds-content-0);
   border-block-start: none;
 }
+.zen-data-grid__row-cell--show-more {
+  background-color: var(--backgrounds-content-0);
+  border-block-start: none;
+  padding-block: 0.5rem;
+}
 .zen-data-grid__row-cell--clickable {
   cursor: pointer;
 }
@@ -5620,6 +5710,15 @@ html:lang(ar) .zen-checkbox__label-text {
 html:lang(ar) .zen-select-item {
   font-family: "Noto Sans Arabic", Roboto, "Segoe UI", Segoe, "Helvetica Neue", Helvetica, sans-serif;
 }
+.zen-select-item--divider::after {
+  content: "";
+  position: absolute;
+  inset-block-end: 0;
+  inset-inline-start: 0;
+  inset-inline-end: 0;
+  height: var(--border-width-default);
+  background-color: var(--borders-general);
+}
 .zen-select-item:hover > .zen-select-item__wrapper {
   background-color: var(--backgrounds-hover);
 }
@@ -5652,6 +5751,37 @@ html:lang(ar) .zen-select-item {
 .zen-select-item--focused.zen-select-item--with-checkbox:focus > .zen-select-item__wrapper {
   background-color: var(--backgrounds-hover);
 }
+.zen-select-item.zen-select-item--destructive > .zen-select-item__wrapper {
+  color: var(--text-error-message);
+  fill: var(--text-error-message);
+}
+.zen-select-item.zen-select-item--destructive:not(.zen-select-item--with-checkbox):hover > .zen-select-item__wrapper {
+  color: var(--text-error-message);
+  fill: var(--text-error-message);
+  background-color: var(--backgrounds-hover);
+}
+.zen-select-item.zen-select-item--destructive:not(.zen-select-item--with-checkbox):hover[aria-disabled="true"] > .zen-select-item__wrapper {
+  background-color: transparent;
+}
+.zen-select-item.zen-select-item--destructive:not(.zen-select-item--with-checkbox):active > .zen-select-item__wrapper {
+  color: var(--text-error-message);
+  fill: var(--text-error-message);
+  background-color: var(--accents-error--main);
+}
+.zen-select-item.zen-select-item--destructive:not(.zen-select-item--with-checkbox)[aria-selected="true"] > .zen-select-item__wrapper {
+  color: var(--text-error-message);
+  fill: var(--text-error-message);
+  background-color: var(--accents-error--main);
+}
+.zen-select-item.zen-select-item--destructive:not(.zen-select-item--with-checkbox)[aria-disabled="true"] > .zen-select-item__wrapper {
+  color: var(--accents-error--main);
+  fill: var(--accents-error--main);
+}
+.zen-select-item.zen-select-item--destructive:not(.zen-select-item--with-checkbox)[aria-selected="true"][aria-disabled="true"] > .zen-select-item__wrapper {
+  color: var(--accents-error--main);
+  fill: var(--accents-error--main);
+  background-color: transparent;
+}
 .zen-select-item .zen-select-item__wrapper--with-arrow {
   display: flex;
   justify-content: space-between;
@@ -5815,6 +5945,82 @@ html:lang(ar) .zen-link-column__groups {
   fill: var(--text-button-disabled);
   background-color: transparent;
 }
+.zen-svg-image {
+  box-sizing: border-box;
+  display: inline;
+}
+.zen-svg-image * {
+  box-sizing: border-box;
+}
+.zen-svg-image:hover,
+.zen-svg-image:focus {
+  outline: none;
+}
+.zen-svg-image > use {
+  pointer-events: none;
+}
+.zen-lazy-loading-end {
+  box-sizing: border-box;
+  width: 100%;
+  border-block-start: 1px solid var(--borders-general);
+  background-color: var(--backgrounds-main);
+}
+.zen-lazy-loading-end * {
+  box-sizing: border-box;
+}
+.zen-lazy-loading-end__sticky {
+  box-sizing: border-box;
+  position: sticky;
+  inset-inline-start: 0;
+  width: var(--zen-end-of-list-viewport-width, 100%);
+  max-width: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 0.75rem;
+  padding: 0.75rem 1rem;
+}
+.zen-lazy-loading-end__sticky * {
+  box-sizing: border-box;
+}
+.zen-lazy-loading-end__image {
+  width: 2.5rem;
+  height: 2.5rem;
+  flex: 0 0 auto;
+}
+.zen-lazy-loading-end__content {
+  display: flex;
+  flex-direction: column;
+  gap: 0.125rem;
+}
+.zen-lazy-loading-end__title {
+  font-family: Roboto, "Segoe UI", Segoe, "Helvetica Neue", Helvetica, sans-serif;
+  font-size: 0.75rem;
+  font-style: normal;
+  font-weight: 700;
+  letter-spacing: 0.02rem;
+  line-height: 1rem;
+  text-transform: none;
+  text-decoration: none;
+  color: var(--text-primary);
+}
+html:lang(ar) .zen-lazy-loading-end__title {
+  font-family: "Noto Sans Arabic", Roboto, "Segoe UI", Segoe, "Helvetica Neue", Helvetica, sans-serif;
+}
+.zen-lazy-loading-end__description {
+  font-family: Roboto, "Segoe UI", Segoe, "Helvetica Neue", Helvetica, sans-serif;
+  font-size: 0.75rem;
+  font-style: normal;
+  font-weight: 400;
+  letter-spacing: 0.02rem;
+  line-height: 1rem;
+  text-transform: none;
+  text-decoration: none;
+  color: var(--text-secondary);
+}
+html:lang(ar) .zen-lazy-loading-end__description {
+  font-family: "Noto Sans Arabic", Roboto, "Segoe UI", Segoe, "Helvetica Neue", Helvetica, sans-serif;
+}
 .zen-selectable-column {
   box-sizing: border-box;
   display: flex;
@@ -6247,20 +6453,6 @@ html:lang(ar) .zen-empty-state__header {
 html:lang(ar) .zen-empty-state__description {
   font-family: "Noto Sans Arabic", Roboto, "Segoe UI", Segoe, "Helvetica Neue", Helvetica, sans-serif;
 }
-.zen-svg-image {
-  box-sizing: border-box;
-  display: inline;
-}
-.zen-svg-image * {
-  box-sizing: border-box;
-}
-.zen-svg-image:hover,
-.zen-svg-image:focus {
-  outline: none;
-}
-.zen-svg-image > use {
-  pointer-events: none;
-}
 .zen-data-grid-actions {
   box-sizing: border-box;
   width: 100%;
@@ -8236,14 +8428,14 @@ html:lang(ar) .zen-form-field__length {
   display: flex;
   flex-direction: row;
   align-items: center;
-  gap: 0.5rem;
+  gap: 0.25rem;
 }
 .zen-form-field--label-top {
   display: flex;
   flex-direction: column;
   align-items: start;
   justify-content: start;
-  gap: 0.5rem;
+  gap: 0.25rem;
 }
 .zen-dropdown {
   box-sizing: border-box;
@@ -8346,6 +8538,18 @@ html:lang(ar) .zen-checkbox-list-with-action__title {
   padding-bottom: 0.75rem;
   padding-top: 0.75rem;
 }
+.zen-checkbox-list-with-action__action-item--divider {
+  position: relative;
+}
+.zen-checkbox-list-with-action__action-item--divider::after {
+  content: "";
+  position: absolute;
+  inset-block-end: 0;
+  inset-inline-start: 0;
+  inset-inline-end: 0;
+  height: var(--border-width-default);
+  background-color: var(--borders-general);
+}
 .zen-checkbox-list-with-action__singled {
   font-weight: 700;
 }
@@ -8958,7 +9162,8 @@ html:lang(ar) .zen-chip__quantity {
   outline: none;
 }
 .zen-chip.zen-chip--trigger .zen-chip__trigger--with-icon {
-  padding: 0.4375rem 0 0.4375rem 0.4375rem;
+  padding: 0.4375rem 0;
+  padding-inline-start: 0.4375rem;
 }
 .zen-chip.zen-chip--trigger .zen-chip__close-button {
   height: 30px;
@@ -8990,7 +9195,8 @@ html:lang(ar) .zen-chip__quantity {
 }
 .zen-chip.zen-chip--drive.zen-chip--trigger .zen-chip__trigger--with-icon,
 .zen-chip.zen-chip--drive-tablet.zen-chip--trigger .zen-chip__trigger--with-icon {
-  padding: 0.1875rem 0 0.1875rem 0.75rem;
+  padding: 0.1875rem 0;
+  padding-inline-start: 0.75rem;
 }
 .zen-chip.zen-chip--drive.zen-chip--trigger .zen-chip__close-button,
 .zen-chip.zen-chip--drive-tablet.zen-chip--trigger .zen-chip__close-button {
@@ -9071,7 +9277,8 @@ html:lang(ar) .zen-chip--mobile {
   padding: 0.75rem 0.5rem;
 }
 .zen-chip--mobile.zen-chip--trigger .zen-chip__trigger--with-icon {
-  padding: 0.6875rem 0 0.6875rem 0.5rem;
+  padding: 0.6875rem 0;
+  padding-inline-start: 0.5rem;
 }
 .zen-chip--mobile.zen-chip--trigger .zen-chip__close-button {
   width: 38px;
@@ -9135,6 +9342,24 @@ html:lang(ar) .zen-filter-button__quantity {
   height: 1rem;
   margin-inline-start: 0.375rem;
 }
+.zen-filter-button--primary .zen-filter-button__quantity {
+  background-color: var(--text-reverse-primary);
+  color: var(--action-primary--default);
+}
+.zen-filter-button--primary .zen-filter-button__icon {
+  color: var(--text-reverse-primary);
+  fill: var(--text-reverse-primary);
+  background-color: transparent;
+}
+.zen-filter-button--destructive .zen-filter-button__quantity {
+  background-color: var(--text-reverse-primary);
+  color: var(--action-destructive--default);
+}
+.zen-filter-button--destructive .zen-filter-button__icon {
+  color: var(--text-reverse-primary);
+  fill: var(--text-reverse-primary);
+  background-color: transparent;
+}
 .zen-filter-button--secondary .zen-filter-button__quantity {
   background-color: var(--action-primary--default);
   color: var(--text-reverse-primary);
@@ -9161,6 +9386,15 @@ html:lang(ar) .zen-filter-button__quantity {
   fill: var(--text-primary);
   background-color: transparent;
 }
+.zen-filter-button--tertiary-destructive .zen-filter-button__quantity {
+  background-color: var(--action-destructive--default);
+  color: var(--text-reverse-primary);
+}
+.zen-filter-button--tertiary-destructive .zen-filter-button__icon {
+  color: var(--action-destructive--default);
+  fill: var(--action-destructive--default);
+  background-color: transparent;
+}
 .zen-filter-button:disabled .zen-filter-button__icon {
   fill: var(--text-button-disabled);
 }
@@ -10528,7 +10762,7 @@ html:lang(ar) .zen-status-pill__container {
   border-color: var(--borders-form-field--active);
 }
 .zen-status-pill__text {
-  margin-right: 4px;
+  margin-inline-end: 4px;
   color: var(--text-primary);
   flex-shrink: 1;
   min-width: 0;
@@ -10552,11 +10786,11 @@ html:lang(ar) .zen-status-pill__container {
   color: var(--text-reverse-primary);
 }
 .zen-status-pill__text--centered {
-  margin-right: 0;
+  margin-inline-end: 0;
 }
 .zen-status-pill__expand-button {
   padding: 0;
-  margin-left: auto;
+  margin-inline-start: auto;
   flex-shrink: 0;
 }
 .zen-status-pill__expand-button--default {
@@ -10587,7 +10821,7 @@ html:lang(ar) .zen-status-pill__container {
   display: flex;
   align-items: center;
   height: 12px;
-  margin-right: 4px;
+  margin-inline-end: 4px;
   flex-shrink: 0;
 }
 .zen-status-pill__icon--large {
@@ -10618,7 +10852,7 @@ html:lang(ar) .zen-status-pill__container {
   color: var(--text-reverse-primary);
 }
 .zen-status-pill__icon--standalone {
-  margin-right: 0;
+  margin-inline-end: 0;
 }
 .zen-absolute:has(.zen-status-pill-popup) {
   overflow: visible;
@@ -13073,7 +13307,7 @@ html:lang(ar) .zen-radio__wrapper--mobile .zen-radio__label {
   bottom: 0;
   left: 0;
   right: 0;
-  overflow: hidden;
+  overflow: visible;
   pointer-events: auto;
   z-index: 10005;
 }
@@ -13085,6 +13319,13 @@ html:lang(ar) .zen-radio__wrapper--mobile .zen-radio__label {
   width: 2.5rem;
   height: 2.5rem;
 }
+.zen-waiting__coverage {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  height: 100%;
+}
 .zen-waiting__spinner-text {
   font-family: Roboto, "Segoe UI", Segoe, "Helvetica Neue", Helvetica, sans-serif;
   font-size: 1.25rem;
@@ -13137,8 +13378,10 @@ html:lang(ar) .zen-waiting__spinner-text {
 }
 .zen-waiting__spinner-container {
   display: flex;
+  position: sticky;
+  top: 0;
   min-height: 1.25rem;
-  height: 100%;
+  height: min(100%, 100vh);
   width: 100%;
   justify-content: center;
   align-items: center;
@@ -15425,6 +15668,7 @@ html:lang(ar) .zen-page-header--mobile .zen-page-header__page-name {
   -ms-overflow-style: none;
   padding-block-start: 0.0625rem;
   padding-inline: 0.0625rem;
+  scroll-padding-inline: 4.5rem;
 }
 .zen-tabs__scrollable::-webkit-scrollbar {
   display: none;
@@ -15522,6 +15766,9 @@ html:lang(ar) .zen-page-header--mobile .zen-page-header__page-name {
   width: 2.875rem;
   height: 2.875rem;
 }
+.zen-tabs.zen-tabs--mobile .zen-tabs__scrollable {
+  scroll-padding-inline: 5.625rem;
+}
 .zen-tabs .zen-tabs__gradient.zen-tabs__gradient--mobile.zen-tabs__gradient--left::after {
   position: absolute;
   content: "";
@@ -15555,6 +15802,10 @@ html:lang(ar) .zen-page-header--mobile .zen-page-header__page-name {
   width: 3rem;
   height: 3rem;
 }
+.zen-tabs.zen-tabs--drive .zen-tabs__scrollable,
+.zen-tabs.zen-tabs--drive-tablet .zen-tabs__scrollable {
+  scroll-padding-inline: 5.875rem;
+}
 .zen-tabs .zen-tabs__gradient.zen-tabs__gradient--drive.zen-tabs__gradient--left::after,
 .zen-tabs .zen-tabs__gradient.zen-tabs__gradient--drive-tablet.zen-tabs__gradient--left::after {
   position: absolute;