@navikt/ds-css 7.11.0 → 7.12.1

package/dist/darkside/version/{7.11.0 → 7.12.1}/component/form.css

@@ -11,7 +11,7 @@
   }
 
   .navds-fieldset__description {
-    color: var(--ax-text-subtle);
+    color: var(--ax-text-neutral-subtle);
   }
 
   .navds-fieldset > .navds-fieldset__description:not(:empty) {
@@ -52,10 +52,10 @@
     text-align: center;
     width: 100%;
     padding: var(--ax-space-16) var(--ax-space-20);
-    border: 1px dashed var(--ax-border-default);
+    border: 1px dashed var(--ax-border-neutral);
     border-radius: var(--ax-border-radius-xlarge);
     background-color: var(--__axc-dropzone-background);
-    color: var(--ax-text-default);
+    color: var(--ax-text-neutral);
     transition: background-color var(--__axc-dropzone-animation-length-short) var(--__axc-dropzone-animation-ease-out);
     cursor: pointer;
     flex-direction: column;
@@ -79,8 +79,8 @@
   }
 
   .navds-dropzone__area[data-disabled="true"] {
-    --__axc-dropzone-background: var(--ax-bg-soft);
-    border-color: var(--ax-border-subtleA);
+    --__axc-dropzone-background: var(--ax-bg-neutral-soft);
+    border-color: var(--ax-border-neutral-subtleA);
     cursor: default;
   }
 
@@ -89,7 +89,7 @@
   }
 
   .navds-dropzone--dragging > .navds-dropzone__area:after {
-    color: var(--ax-text-accent-strong);
+    color: var(--ax-text-accent);
     background-color: var(--ax-bg-accent-moderateA);
     content: "";
     border: 1px dashed var(--ax-border-accent-strong);
@@ -99,10 +99,7 @@
     animation: akselDropzoneDragoverAnimation var(--__axc-dropzone-animation-length-short) var(--__axc-dropzone-animation-ease-out);
     margin: -1px;
     position: absolute;
-    top: 0;
-    bottom: 0;
-    left: 0;
-    right: 0;
+    inset: 0;
   }
 
   @keyframes akselDropzoneDragoverAnimation {
@@ -146,7 +143,7 @@
   .navds-dropzone__area-release__icon {
     padding: var(--__axc-dropzone-icon-padding);
     border-radius: var(--ax-border-radius-full);
-    background-color: var(--ax-bg-moderateA);
+    background-color: var(--ax-bg-neutral-moderateA);
     transition: background-color .3s var(--__axc-dropzone-animation-ease-out), font-size .3s var(--__axc-dropzone-animation-ease-out);
     font-size: 1.5rem;
     display: grid;
@@ -167,38 +164,20 @@
   }
 
   .navds-dropzone--dragging .navds-dropzone__area-release {
-    color: var(--ax-text-accent);
+    color: var(--ax-text-accent-subtle);
     top: 50%;
     transform: translateY(-50%);
   }
 
   .navds-dropzone__area-disabled {
-    color: var(--ax-text-subtle);
+    color: var(--ax-text-neutral-subtle);
     align-items: center;
     gap: var(--ax-space-8);
     flex-direction: column;
     display: flex;
   }
 
-  li.navds-file-item {
-    margin: 0;
-    padding: 0;
-    list-style: none;
-  }
-
-  .navds-file-upload :-webkit-any(ul, li) {
-    margin: 0;
-    padding: 0;
-    list-style: none;
-  }
-
-  .navds-file-upload :is(ul, li) {
-    margin: 0;
-    padding: 0;
-    list-style: none;
-  }
-
-  ul:has( > li.navds-file-item) {
+  .navds-file-upload :is(ul, li), ul:has( > li.navds-file-item), li.navds-file-item {
     margin: 0;
     padding: 0;
     list-style: none;
@@ -206,7 +185,7 @@
 
   .navds-file-item__inner {
     background-color: var(--ax-bg-raised);
-    border: 1px solid var(--ax-border-subtleA);
+    border: 1px solid var(--ax-border-neutral-subtleA);
     outline-offset: -1px;
     border-radius: var(--ax-border-radius-xlarge);
     padding: var(--ax-space-12) var(--ax-space-16);
@@ -221,8 +200,8 @@
   }
 
   .navds-file-item__icon {
-    background-color: var(--ax-bg-moderateA);
-    color: var(--ax-text-default);
+    background-color: var(--ax-bg-neutral-moderateA);
+    color: var(--ax-text-neutral);
     border-radius: var(--ax-border-radius-full);
     min-width: 2.5rem;
     min-height: 2.5rem;
@@ -270,7 +249,7 @@
   }
 
   .navds-form-field__description {
-    color: var(--ax-text-subtle);
+    color: var(--ax-text-neutral-subtle);
     margin-top: -.375rem;
   }
 
@@ -284,7 +263,7 @@
   }
 
   .navds-form-field__subdescription {
-    color: var(--ax-text-subtle);
+    color: var(--ax-text-neutral-subtle);
   }
 
   .navds-form-field--readonly > :where(.navds-form-field__label) {
@@ -312,11 +291,7 @@
     outline-offset: 3px;
   }
 
-  .navds-error-summary:focus-visible {
-    outline: 3px solid var(--ax-border-focus);
-  }
-
-  .navds-error-summary:has(.navds-error-summary__heading:focus-visible) {
+  .navds-error-summary:focus-visible, .navds-error-summary:has(.navds-error-summary__heading:focus-visible) {
     outline: 3px solid var(--ax-border-focus);
   }
 
@@ -395,27 +370,14 @@
       border-color: orange;
       border-left-style: solid;
       border-left-width: 8px;
+      border-start-start-radius: calc(var(--a-border-radius-medium)  - 1px);
+      border-end-start-radius: calc(var(--a-border-radius-medium)  - 1px);
       height: 100%;
       position: absolute;
       top: 0;
       left: 0;
     }
 
-    .navds-confirmation-panel__inner:not(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)):before {
-      border-top-left-radius: calc(var(--a-border-radius-medium)  - 1px);
-      border-bottom-left-radius: calc(var(--a-border-radius-medium)  - 1px);
-    }
-
-    .navds-confirmation-panel__inner:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)):before {
-      border-top-right-radius: calc(var(--a-border-radius-medium)  - 1px);
-      border-bottom-right-radius: calc(var(--a-border-radius-medium)  - 1px);
-    }
-
-    .navds-confirmation-panel__inner:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)):before {
-      border-top-right-radius: calc(var(--a-border-radius-medium)  - 1px);
-      border-bottom-right-radius: calc(var(--a-border-radius-medium)  - 1px);
-    }
-
     .navds-confirmation-panel--checked .navds-confirmation-panel__inner:before {
       border-color: green;
     }
@@ -426,7 +388,6 @@
   }
 
   .navds-checkbox, .navds-radio {
-    width: -webkit-fit-content;
     width: fit-content;
     position: relative;
   }
@@ -446,8 +407,8 @@
     padding: var(--ax-space-12) 0;
     cursor: pointer;
     gap: var(--ax-space-8);
-    --__axc-radio-checkbox-readonly-bg: var(--ax-bg-moderate);
-    --__axc-radio-checkbox-readonly-border: var(--ax-border-subtle);
+    --__axc-radio-checkbox-readonly-bg: var(--ax-bg-neutral-moderate);
+    --__axc-radio-checkbox-readonly-border: var(--ax-border-neutral-subtle);
     display: flex;
   }
 
@@ -455,7 +416,7 @@
     content: "";
     border-radius: var(--ax-border-radius-medium);
     background-color: var(--ax-bg-input);
-    border: 2px solid var(--ax-border-default);
+    border: 2px solid var(--ax-border-neutral);
     flex-shrink: 0;
     width: 1.5rem;
     height: 1.5rem;
@@ -569,8 +530,8 @@
     border-width: 6px;
   }
 
-  .navds-checkbox__input:hover:not(:disabled) + .navds-checkbox__label, .navds-radio__input:hover:not(:disabled) + .navds-radio__label {
-    color: var(--ax-text-accent);
+  .navds-checkbox__input:hover:not(:disabled) + .navds-checkbox__label, .navds-radio__input:hover:not(:disabled, :checked) + .navds-radio__label {
+    color: var(--ax-text-accent-subtle);
   }
 
   .navds-checkbox__input:hover:not(:disabled, :checked, :indeterminate) + .navds-checkbox__label:before, .navds-radio__input:hover:not(:disabled, :checked) + .navds-radio__label:before {
@@ -586,11 +547,6 @@
     background-color: var(--ax-bg-danger-moderate-hoverA);
   }
 
-  .navds-checkbox--error > .navds-checkbox__input:-webkit-any(:checked, :indeterminate):not(:disabled) + .navds-checkbox__label:before {
-    background-color: var(--ax-bg-danger-strong-pressed);
-    border-color: var(--ax-bg-danger-strong-pressed);
-  }
-
   .navds-checkbox--error > .navds-checkbox__input:is(:checked, :indeterminate):not(:disabled) + .navds-checkbox__label:before {
     background-color: var(--ax-bg-danger-strong-pressed);
     border-color: var(--ax-bg-danger-strong-pressed);
@@ -608,11 +564,7 @@
     cursor: not-allowed;
   }
 
-  .navds-checkbox--readonly > :where(.navds-checkbox__input, .navds-checkbox__label) {
-    cursor: default;
-  }
-
-  .navds-radio--readonly > :where(.navds-radio__input, .navds-radio__label) {
+  .navds-checkbox--readonly > :where(.navds-checkbox__input, .navds-checkbox__label), .navds-radio--readonly > :where(.navds-radio__input, .navds-radio__label) {
     cursor: default;
   }
 
@@ -621,7 +573,7 @@
   }
 
   .navds-checkbox--readonly > .navds-checkbox__input:hover + .navds-checkbox__label, .navds-radio--readonly > .navds-radio__input:hover + .navds-radio__label {
-    color: var(--ax-text-default);
+    color: var(--ax-text-neutral);
   }
 
   .navds-checkbox--readonly > .navds-checkbox__input:not(:disabled) + .navds-checkbox__label:before, .navds-checkbox--readonly > .navds-checkbox__input:hover .navds-checkbox__label:before, .navds-radio--readonly > .navds-radio__input:not(:disabled, :checked) + .navds-radio__label:before, .navds-radio--readonly > .navds-radio__input:hover:not(:checked, :focus) + .navds-radio__label:before {
@@ -635,17 +587,17 @@
   }
 
   .navds-checkbox--readonly > .navds-checkbox__input:checked + .navds-checkbox__label > .navds-checkbox__icon {
-    color: var(--ax-text-subtle);
+    color: var(--ax-text-neutral-subtle);
   }
 
   .navds-radio--readonly > .navds-radio__input:checked + .navds-radio__label:before {
-    background-color: var(--ax-bg-strong);
-    box-shadow: inset 0 0 0 2px var(--ax-border-subtle), inset 0 0 0 8px var(--ax-bg-moderate);
+    background-color: var(--ax-bg-neutral-strong);
+    box-shadow: inset 0 0 0 2px var(--ax-border-neutral-subtle), inset 0 0 0 8px var(--ax-bg-neutral-moderate);
     border-width: 0;
   }
 
   .navds-checkbox--readonly > .navds-checkbox__input:indeterminate + .navds-checkbox__label > .navds-checkbox__icon-indeterminate {
-    background-color: var(--ax-text-subtle);
+    background-color: var(--ax-text-neutral-subtle);
   }
 
   @media (forced-colors: active) {
@@ -696,22 +648,17 @@
       --__axc-radio-checkbox-high-contrast-text: graytext;
     }
 
-    :-webkit-any(.navds-checkbox--disabled, .navds-radio--disabled) :-webkit-any(.navds-checkbox__label, .navds-radio__label) {
-      color: graytext;
-    }
-
     :is(.navds-checkbox--disabled, .navds-radio--disabled) :is(.navds-checkbox__label, .navds-radio__label) {
       color: graytext;
     }
   }
 
   .navds-select__input {
-    -webkit-appearance: none;
     appearance: none;
     background-color: var(--ax-bg-input);
     border-radius: var(--ax-border-radius-large);
-    border: 1px solid var(--ax-border-default);
-    color: var(--ax-text-default);
+    border: 1px solid var(--ax-border-neutral);
+    color: var(--ax-text-neutral);
     box-sizing: border-box;
     width: 100%;
     min-height: 3rem;
@@ -742,7 +689,7 @@
 
   .navds-select__container {
     width: 100%;
-    color: var(--ax-text-default);
+    color: var(--ax-text-neutral);
     display: flex;
     position: relative;
   }
@@ -750,7 +697,7 @@
   .navds-select__chevron {
     right: var(--ax-space-8);
     pointer-events: none;
-    color: var(--ax-text-default);
+    color: var(--ax-text-neutral);
     align-self: center;
     font-size: 1.5rem;
     position: absolute;
@@ -764,36 +711,25 @@
 
   .navds-form-field--small .navds-select__input {
     min-height: 2rem;
-    padding-top: 0;
-    padding-bottom: 0;
-  }
-
-  .navds-select--error > * select {
-    box-shadow: 0 0 0 1px var(--ax-border-danger-strong);
-    border-color: var(--ax-border-danger-strong);
+    padding-block: 0;
   }
 
-  .navds-select--error > * select:hover {
-    box-shadow: 0 0 0 1px var(--ax-border-danger-strong);
-    border-color: var(--ax-border-danger-strong);
-  }
-
-  .navds-select--error > * select:focus {
+  .navds-select--error > * select, .navds-select--error > * select:hover, .navds-select--error > * select:focus {
     box-shadow: 0 0 0 1px var(--ax-border-danger-strong);
     border-color: var(--ax-border-danger-strong);
   }
 
   .navds-select__input:disabled {
     background-color: var(--ax-bg-input);
-    border: 1px solid var(--ax-border-default);
+    border: 1px solid var(--ax-border-neutral);
     box-shadow: none;
     cursor: not-allowed;
     opacity: 1;
-    color: var(--ax-text-default);
+    color: var(--ax-text-neutral);
   }
 
   .navds-select__input:disabled > option {
-    color: var(--ax-text-default);
+    color: var(--ax-text-neutral);
   }
 
   @media (forced-colors: active) {
@@ -803,18 +739,12 @@
   }
 
   .navds-select--readonly .navds-select__input {
-    background-color: var(--ax-bg-moderate);
-    border-color: var(--ax-border-subtleA);
+    background-color: var(--ax-bg-neutral-moderate);
+    border-color: var(--ax-border-neutral-subtleA);
     cursor: default;
   }
 
   @media (forced-colors: active) {
-    .navds-select--readonly .navds-select__input:-webkit-any(:hover, :focus) {
-      color: buttontext;
-      background-color: buttonface;
-      border-color: buttontext;
-    }
-
     .navds-select--readonly .navds-select__input:is(:hover, :focus) {
       color: buttontext;
       background-color: buttonface;
@@ -823,11 +753,10 @@
   }
 
   .navds-select--readonly .navds-select__chevron {
-    color: var(--ax-text-subtle);
+    color: var(--ax-text-neutral-subtle);
   }
 
   .navds-switch {
-    width: -webkit-fit-content;
     width: fit-content;
     min-height: 3rem;
     position: relative;
@@ -854,7 +783,7 @@
 
   .navds-switch__label-wrapper {
     cursor: pointer;
-    color: var(--ax-text-default);
+    color: var(--ax-text-neutral);
   }
 
   .navds-switch__content {
@@ -895,7 +824,7 @@
   }
 
   .navds-switch__input:hover ~ .navds-switch__label-wrapper, .navds-switch__label-wrapper:hover {
-    color: var(--ax-text-accent);
+    color: var(--ax-text-accent-subtle);
   }
 
   .navds-switch__input:disabled:hover ~ .navds-switch__label-wrapper {
@@ -908,7 +837,7 @@
     height: 1.5rem;
     top: var(--ax-space-12);
     border-radius: var(--ax-border-radius-full);
-    border: 2px solid var(--ax-border-default);
+    border: 2px solid var(--ax-border-neutral);
     transition-property: background-color, border-color;
     transition-duration: .1s;
     transition-timing-function: cubic-bezier(.4, 0, .2, 1);
@@ -932,7 +861,7 @@
 
   .navds-switch__input:disabled ~ .navds-switch__track {
     background-color: var(--ax-bg-input);
-    border-color: var(--ax-border-default);
+    border-color: var(--ax-border-neutral);
   }
 
   .navds-switch__input:checked:disabled ~ .navds-switch__track {
@@ -946,7 +875,7 @@
   }
 
   .navds-switch__thumb {
-    background-color: var(--ax-bg-strong);
+    background-color: var(--ax-bg-neutral-strong);
     border-radius: var(--ax-border-radius-full);
     justify-content: center;
     align-items: center;
@@ -962,7 +891,7 @@
 
   .navds-switch__input:checked ~ .navds-switch__track > .navds-switch__thumb {
     background-color: var(--ax-bg-raised);
-    color: var(--ax-text-accent);
+    color: var(--ax-text-accent-subtle);
     width: 1.25rem;
     height: 1.25rem;
     top: 0;
@@ -995,18 +924,12 @@
     width: auto;
   }
 
-  .navds-switch--right .navds-switch__input {
-    left: auto;
-    right: 0;
-  }
-
-  .navds-switch--right .navds-switch__track {
+  .navds-switch--right .navds-switch__input, .navds-switch--right .navds-switch__track {
     left: auto;
     right: 0;
   }
 
   .navds-switch__input:disabled {
-    -webkit-appearance: none;
     appearance: none;
   }
 
@@ -1018,40 +941,17 @@
     cursor: not-allowed;
   }
 
-  .navds-switch--readonly > .navds-switch__track {
-    background-color: var(--ax-bg-moderate);
-    border-color: var(--ax-border-subtleA);
-  }
-
-  .navds-switch--readonly > .navds-switch__input:hover ~ .navds-switch__track {
-    background-color: var(--ax-bg-moderate);
-    border-color: var(--ax-border-subtleA);
+  .navds-switch--readonly > .navds-switch__track, .navds-switch--readonly > .navds-switch__input:hover ~ .navds-switch__track, .navds-switch--readonly > .navds-switch__input:checked ~ .navds-switch__track, .navds-switch--readonly > .navds-switch__input:checked:hover ~ .navds-switch__track {
+    background-color: var(--ax-bg-neutral-moderate);
+    border-color: var(--ax-border-neutral-subtleA);
   }
 
-  .navds-switch--readonly > .navds-switch__input:checked ~ .navds-switch__track {
-    background-color: var(--ax-bg-moderate);
-    border-color: var(--ax-border-subtleA);
-  }
-
-  .navds-switch--readonly > .navds-switch__input:checked:hover ~ .navds-switch__track {
-    background-color: var(--ax-bg-moderate);
-    border-color: var(--ax-border-subtleA);
-  }
-
-  .navds-switch--readonly > .navds-switch__label-wrapper {
+  .navds-switch--readonly > .navds-switch__label-wrapper, .navds-switch--readonly > .navds-switch__input {
     cursor: default;
   }
 
-  .navds-switch--readonly > .navds-switch__input {
-    cursor: default;
-  }
-
-  .navds-switch--readonly > .navds-switch__input:hover ~ .navds-switch__label-wrapper {
-    color: var(--ax-text-default);
-  }
-
-  .navds-switch--readonly .navds-switch__label-wrapper:hover {
-    color: var(--ax-text-default);
+  .navds-switch--readonly > .navds-switch__input:hover ~ .navds-switch__label-wrapper, .navds-switch--readonly .navds-switch__label-wrapper:hover {
+    color: var(--ax-text-neutral);
   }
 
   .navds-switch--readonly .navds-switch__label {
@@ -1059,12 +959,12 @@
   }
 
   .navds-switch--readonly .navds-switch__thumb {
-    background-color: var(--ax-bg-strong);
+    background-color: var(--ax-bg-neutral-strong);
   }
 
   .navds-switch--readonly > .navds-switch__input:checked ~ .navds-switch__track > .navds-switch__thumb {
-    background-color: var(--ax-bg-strong);
-    color: var(--ax-text-contrast);
+    background-color: var(--ax-bg-neutral-strong);
+    color: var(--ax-text-neutral-contrast);
   }
 
   @media (hover: hover) and (pointer: fine) {
@@ -1112,15 +1012,14 @@
   }
 
   .navds-text-field__input {
-    -webkit-appearance: none;
     appearance: none;
     padding: var(--ax-space-8);
     background: var(--ax-bg-input);
     border-radius: var(--ax-border-radius-large);
-    border: 1px solid var(--ax-border-default);
+    border: 1px solid var(--ax-border-neutral);
     width: 100%;
     min-height: 3rem;
-    color: var(--ax-text-default);
+    color: var(--ax-text-neutral);
   }
 
   .navds-text-field__input:hover {
@@ -1135,12 +1034,12 @@
 
   .navds-text-field__input:disabled {
     background-color: var(--ax-bg-input);
-    border-color: var(--ax-border-default);
+    border-color: var(--ax-border-neutral);
     cursor: not-allowed;
   }
 
   .navds-text-field__input::placeholder {
-    color: var(--ax-text-subtle);
+    color: var(--ax-text-neutral-subtle);
   }
 
   .navds-text-field__input[size] {
@@ -1158,8 +1057,8 @@
   }
 
   .navds-text-field--readonly .navds-text-field__input {
-    background-color: var(--ax-bg-moderate);
-    border-color: var(--ax-border-subtleA);
+    background-color: var(--ax-bg-neutral-moderate);
+    border-color: var(--ax-border-neutral-subtleA);
     cursor: default;
   }
 
@@ -1188,20 +1087,19 @@
 
   .navds-textarea__input {
     height: var(--__axc-textarea-height);
-    -webkit-appearance: none;
     appearance: none;
     padding: var(--ax-space-8);
     background-color: var(--ax-bg-input);
     border-radius: var(--ax-border-radius-large);
-    border: 1px solid var(--ax-border-default);
+    border: 1px solid var(--ax-border-neutral);
     resize: none;
     width: 100%;
-    color: var(--ax-text-default);
+    color: var(--ax-text-neutral);
     display: block;
   }
 
   .navds-textarea__input::placeholder {
-    color: var(--ax-text-subtle);
+    color: var(--ax-text-neutral-subtle);
   }
 
   .navds-textarea__input:hover {
@@ -1216,7 +1114,7 @@
 
   .navds-textarea__input:disabled {
     background-color: var(--ax-bg-input);
-    border-color: var(--ax-border-default);
+    border-color: var(--ax-border-neutral);
     cursor: not-allowed;
   }
 
@@ -1225,18 +1123,18 @@
   }
 
   .navds-textarea--readonly .navds-textarea__input {
-    background-color: var(--ax-bg-moderate);
-    border-color: var(--ax-border-subtleA);
+    background-color: var(--ax-bg-neutral-moderate);
+    border-color: var(--ax-border-neutral-subtleA);
     cursor: default;
   }
 
   .navds-textarea__counter {
-    color: var(--ax-text-subtle);
+    color: var(--ax-text-neutral-subtle);
     margin-top: -.25rem;
   }
 
   .navds-textarea__counter--error {
-    color: var(--ax-text-danger);
+    color: var(--ax-text-danger-subtle);
   }
 
   .navds-textarea__sr-counter {
@@ -1249,50 +1147,17 @@
 
   .navds-textarea--resize-both .navds-textarea__input {
     resize: both;
-  }
-
-  .navds-textarea--resize-both .navds-textarea__input:not(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
-    border-bottom-right-radius: 0;
-  }
-
-  .navds-textarea--resize-both .navds-textarea__input:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
-    border-bottom-left-radius: 0;
-  }
-
-  .navds-textarea--resize-both .navds-textarea__input:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
-    border-bottom-left-radius: 0;
+    border-end-end-radius: 0;
   }
 
   .navds-textarea--resize-horizontal .navds-textarea__input {
     resize: horizontal;
-  }
-
-  .navds-textarea--resize-horizontal .navds-textarea__input:not(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
-    border-bottom-right-radius: 0;
-  }
-
-  .navds-textarea--resize-horizontal .navds-textarea__input:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
-    border-bottom-left-radius: 0;
-  }
-
-  .navds-textarea--resize-horizontal .navds-textarea__input:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
-    border-bottom-left-radius: 0;
+    border-end-end-radius: 0;
   }
 
   .navds-textarea--resize-vertical .navds-textarea__input {
     resize: vertical;
-  }
-
-  .navds-textarea--resize-vertical .navds-textarea__input:not(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
-    border-bottom-right-radius: 0;
-  }
-
-  .navds-textarea--resize-vertical .navds-textarea__input:-webkit-any(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
-    border-bottom-left-radius: 0;
-  }
-
-  .navds-textarea--resize-vertical .navds-textarea__input:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {
-    border-bottom-left-radius: 0;
+    border-end-end-radius: 0;
   }
 
   .navds-textarea--autoscrollbar, .navds-textarea--autoscrollbar .navds-textarea__wrapper {
@@ -1335,7 +1200,6 @@
   }
 
   .navds-search--with-size .navds-search__wrapper {
-    width: -webkit-fit-content;
     width: fit-content;
   }
 
@@ -1358,13 +1222,7 @@
     outline: none;
   }
 
-  .navds-search__input.navds-search__input--primary {
-    border-right: none;
-    border-top-right-radius: 0;
-    border-bottom-right-radius: 0;
-  }
-
-  .navds-search__input.navds-search__input--secondary {
+  .navds-search__input.navds-search__input--primary, .navds-search__input.navds-search__input--secondary {
     border-right: none;
     border-top-right-radius: 0;
     border-bottom-right-radius: 0;
@@ -1420,7 +1278,7 @@
 
   .navds-search__button-search.navds-button--secondary {
     --__axc-button-border-width: 1px;
-    --__axc-button-border-color: var(--ax-border-default);
+    --__axc-button-border-color: var(--ax-border-neutral);
   }
 
   .navds-search__button-search.navds-button--secondary:not(:hover, :active) {
@@ -1431,14 +1289,6 @@
     --__axc-button-border-color: var(--ax-border-accent-strong);
   }
 
-  .navds-search__button-search.navds-button--secondary:active:not(:disabled) {
-    --__axc-button-border-color: transparent;
-  }
-
-  .navds-search:not(.navds-search--error, .navds-search--disabled) .navds-search__wrapper:has(.navds-search__input:-webkit-any(:hover, :focus-visible)) .navds-search__button-search.navds-button--secondary:not(:hover, :active) {
-    --__axc-button-border-color: var(--ax-border-accent-strong);
-  }
-
   .navds-search:not(.navds-search--error, .navds-search--disabled) .navds-search__wrapper:has(.navds-search__input:is(:hover, :focus-visible)) .navds-search__button-search.navds-button--secondary:not(:hover, :active) {
     --__axc-button-border-color: var(--ax-border-accent-strong);
   }
@@ -1452,11 +1302,7 @@
     box-shadow: inset 0 0 0 1px var(--ax-border-danger-strong);
   }
 
-  .navds-search__input:focus-visible {
-    z-index: 1;
-  }
-
-  .navds-search__button-search:focus-visible {
+  .navds-search__input:focus-visible, .navds-search__button-search:focus-visible {
     z-index: 1;
   }
 
@@ -1479,10 +1325,6 @@
     position: relative;
   }
 
-  .navds-form-field:not(:-webkit-any(.navds-combobox--disabled, .navds-combobox--readonly)) .navds-combobox__wrapper:hover {
-    border-color: var(--ax-border-accent-strong);
-  }
-
   .navds-form-field:not(:is(.navds-combobox--disabled, .navds-combobox--readonly)) .navds-combobox__wrapper:hover {
     border-color: var(--ax-border-accent-strong);
   }
@@ -1500,18 +1342,14 @@
   }
 
   .navds-combobox--disabled .navds-combobox__wrapper:hover {
-    border-color: var(--ax-border-default);
+    border-color: var(--ax-border-neutral);
   }
 
   .navds-combobox--disabled .navds-combobox__wrapper :hover {
     cursor: not-allowed;
   }
 
-  .navds-combobox--disabled .navds-combobox__selected-options {
-    pointer-events: none;
-  }
-
-  .navds-combobox--disabled .navds-combobox--readonly {
+  .navds-combobox--disabled .navds-combobox__selected-options, .navds-combobox--disabled .navds-combobox--readonly {
     pointer-events: none;
   }
 
@@ -1520,24 +1358,20 @@
   }
 
   .navds-combobox--readonly .navds-combobox__selected-options .navds-chips__chip {
-    background-color: var(--ax-bg-moderateA);
+    background-color: var(--ax-bg-neutral-moderateA);
   }
 
   .navds-combobox--readonly .navds-combobox__button-toggle-list {
-    color: var(--ax-bg-moderate);
+    color: var(--ax-bg-neutral-moderate);
   }
 
   .navds-combobox--readonly .navds-combobox__wrapper {
-    border-color: var(--ax-border-subtle);
+    border-color: var(--ax-border-neutral-subtle);
     overflow: clip;
   }
 
-  .navds-combobox--readonly .navds-text-field__input {
-    background-color: var(--ax-bg-moderate);
-  }
-
-  .navds-combobox--readonly .navds-combobox__input {
-    background-color: var(--ax-bg-moderate);
+  .navds-combobox--readonly .navds-text-field__input, .navds-combobox--readonly .navds-combobox__input {
+    background-color: var(--ax-bg-neutral-moderate);
   }
 
   .navds-combobox__button-toggle-list svg, .navds-combobox__list svg {
@@ -1546,7 +1380,7 @@
   }
 
   .navds-combobox__wrapper-inner {
-    border: 1px solid var(--ax-border-default);
+    border: 1px solid var(--ax-border-neutral);
     border-radius: var(--ax-border-radius-large);
   }
 
@@ -1557,7 +1391,7 @@
   }
 
   .navds-combobox__wrapper-inner:has(.navds-combobox__input:focus-visible).navds-combobox__wrapper-inner--virtually-unfocused {
-    border-color: var(--ax-border-default);
+    border-color: var(--ax-border-neutral);
     outline: none;
   }
 
@@ -1586,7 +1420,7 @@
   }
 
   .navds-combobox--disabled .navds-combobox__wrapper-inner:hover {
-    border-color: var(--ax-border-default);
+    border-color: var(--ax-border-neutral);
   }
 
   .navds-combobox--error .navds-combobox__wrapper-inner {
@@ -1661,11 +1495,7 @@
       outline: none;
     }
 
-    .navds-combobox__wrapper-inner:has(.navds-combobox__input:focus) {
-      outline: none;
-    }
-
-    .navds-combobox__wrapper-inner:has(.navds-combobox__input:focus).navds-combobox__wrapper-inner--virtually-unfocused {
+    .navds-combobox__wrapper-inner:has(.navds-combobox__input:focus), .navds-combobox__wrapper-inner:has(.navds-combobox__input:focus).navds-combobox__wrapper-inner--virtually-unfocused {
       outline: none;
     }
   }
@@ -1675,7 +1505,7 @@
   }
 
   .navds-combobox__button-toggle-list {
-    color: var(--ax-text-default);
+    color: var(--ax-text-neutral);
     cursor: pointer;
     background: none;
     border: none;
@@ -1687,11 +1517,11 @@
   }
 
   .navds-combobox__button-toggle-list:hover {
-    color: var(--ax-text-accent);
+    color: var(--ax-text-accent-subtle);
   }
 
   .navds-combobox__button-toggle-list:hover:active {
-    color: var(--ax-text-accent-strong);
+    color: var(--ax-text-accent);
   }
 
   .navds-combobox__list {
@@ -1700,10 +1530,10 @@
     left: 0;
     right: 0;
     top: calc(100% + var(--ax-space-8));
-    border: 1px solid var(--ax-border-subtleA);
+    border: 1px solid var(--ax-border-neutral-subtleA);
     border-radius: var(--ax-border-radius-large);
     background-color: var(--ax-bg-raised);
-    color: var(--ax-text-default);
+    color: var(--ax-text-neutral);
     overscroll-behavior: contain;
     box-shadow: var(--ax-shadow-dialog);
     flex-direction: column;
@@ -1743,8 +1573,8 @@
   }
 
   .navds-combobox__list-item--max-selected {
-    background-color: var(--ax-bg-moderateA);
-    border-bottom: 1px solid var(--ax-border-subtle);
+    background-color: var(--ax-bg-neutral-moderateA);
+    border-bottom: 1px solid var(--ax-border-neutral-subtle);
     padding-block: var(--ax-space-8);
     line-height: var(--ax-font-line-height-large);
     border-radius: 0;
@@ -1780,12 +1610,12 @@
 
   .navds-combobox__list-item mark {
     font-weight: var(--ax-font-weight-bold);
-    color: var(--ax-text-default);
+    color: var(--ax-text-neutral);
     background-color: rgba(0, 0, 0, 0);
   }
 
   .navds-combobox__list-item svg {
-    color: var(--ax-text-default);
+    color: var(--ax-text-neutral);
   }
 
   .navds-combobox__list-item--selected {
@@ -1804,11 +1634,11 @@
     border-radius: 0;
     justify-content: flex-start;
     gap: .25rem;
-    margin-top: calc(var(--ax-space-4) * -1);
+    margin-block-start: calc(var(--ax-space-4) * -1);
   }
 
   .navds-combobox__list-item--new-option svg {
-    color: var(--ax-text-default);
+    color: var(--ax-text-neutral);
   }
 
   .navds-combobox__list-item--new-option:only-child {
@@ -1832,7 +1662,6 @@
     }
 
     .navds-combobox__input {
-      min-width: -webkit-min-content;
       min-width: min-content;
       padding: .75rem 0;
     }
@@ -1908,15 +1737,15 @@
   }
 
   .navds-form-summary {
-    border: 1px solid var(--ax-border-subtleA);
+    border: 1px solid var(--ax-border-neutral-subtleA);
     border-radius: var(--ax-border-radius-xlarge);
     background: var(--ax-bg-raised);
     overflow: hidden;
   }
 
   .navds-form-summary__header {
-    background: var(--ax-bg-moderateA);
-    padding: var(--ax-space-16) var(--ax-space-24);
+    background: var(--ax-bg-neutral-moderateA);
+    padding: var(--ax-space-20) var(--ax-space-20) var(--ax-space-16) var(--ax-space-20);
     justify-content: space-between;
     gap: 0 var(--ax-space-12);
     display: flex;
@@ -1924,7 +1753,7 @@
 
   @media (max-width: 479px) {
     .navds-form-summary__header {
-      padding: var(--ax-space-12) var(--ax-space-16);
+      padding: var(--ax-space-16) var(--ax-space-16) var(--ax-space-12) var(--ax-space-16);
       flex-direction: column;
     }
   }
@@ -1936,24 +1765,24 @@
   }
 
   .navds-form-summary > .navds-form-summary__answers {
-    border-top: 1px solid var(--ax-border-subtleA);
+    border-top: 1px solid var(--ax-border-neutral-subtleA);
   }
 
   .navds-form-summary__answers {
-    padding: var(--ax-space-16) var(--ax-space-20);
+    padding: var(--ax-space-16) var(--ax-space-20) var(--ax-space-20) var(--ax-space-20);
     margin: 0;
   }
 
   @media (max-width: 479px) {
     .navds-form-summary__answers {
-      padding: var(--ax-space-16);
+      padding: var(--ax-space-12) var(--ax-space-16) var(--ax-space-16) var(--ax-space-16);
     }
   }
 
   .navds-form-summary__answer:not(:last-child) {
     margin-bottom: var(--ax-space-16);
     padding-bottom: var(--ax-space-16);
-    border-bottom: 1px solid var(--ax-border-subtleA);
+    border-bottom: 1px solid var(--ax-border-neutral-subtleA);
   }
 
   .navds-form-summary__answer:has(.navds-form-summary__answer) {
@@ -2008,39 +1837,35 @@
   }
 
   .navds-form-progress__collapsible {
+    visibility: hidden;
+    border: 1px solid var(--ax-border-neutral-subtleA);
+    border-radius: var(--ax-border-radius-xlarge);
+    background: var(--ax-bg-raised);
+    padding-inline: var(--ax-space-20);
+    opacity: .001;
     grid-template-rows: 0fr;
-    transition: grid-template-rows .25s cubic-bezier(.2, 0, 0, 1);
+    margin-top: -2px;
+    padding-block: 0;
+    transition-property: margin-top, opacity, visibility, padding-block-start, grid-template-rows;
+    transition-duration: 1s;
+    transition-timing-function: cubic-bezier(.2, 0, 0, 1);
     display: grid;
     overflow: hidden;
   }
 
   .navds-form-progress__collapsible[hidden] {
-    display: grid !important;
+    display: grid;
   }
 
   .navds-form-progress__collapsible[data-state="open"] {
+    margin-top: var(--ax-space-4);
+    visibility: visible;
+    padding-block: var(--ax-space-16);
+    opacity: 1;
     grid-template-rows: 1fr;
   }
 
   .navds-form-progress__collapsible-content {
-    opacity: .01;
-    visibility: hidden;
     min-height: 0;
-    transition-property: opacity, visibility;
-    transition-duration: .25s;
-    transition-timing-function: cubic-bezier(.2, 0, 0, 1);
-  }
-
-  .navds-form-progress__collapsible[data-state="open"] .navds-form-progress__collapsible-content {
-    visibility: visible;
-    opacity: 1;
-  }
-
-  .navds-form-progress__stepper {
-    border: 1px solid var(--ax-border-subtle);
-    border-radius: var(--ax-border-radius-xlarge);
-    padding: var(--ax-space-16) var(--ax-space-20);
-    margin-top: var(--ax-space-4);
-    background: var(--ax-bg-raised);
   }
 }