@navikt/ds-css 7.40.0 → 8.0.1

package/dist/darkside/component/form.css

@@ -1,1875 +0,0 @@
-@layer aksel.components {
-  .aksel-fieldset {
-    border: 0;
-    min-width: 0;
-    margin: 0;
-    padding: 0;
-  }
-
-  .aksel-fieldset > :not(:first-child, :empty) {
-    margin-top: var(--ax-space-8);
-  }
-
-  .aksel-fieldset__description {
-    color: var(--ax-text-neutral-subtle);
-  }
-
-  .aksel-fieldset > .aksel-fieldset__description:not(:empty) {
-    margin-top: .125rem;
-  }
-
-  .aksel-fieldset > .aksel-sr-only + :not(:first-child, :empty) {
-    margin-top: 0;
-  }
-
-  .aksel-fieldset__legend {
-    padding: 0;
-  }
-
-  .aksel-fieldset--readonly > :where(.aksel-fieldset__legend) {
-    display: inline-flex;
-  }
-
-  .aksel-fieldset:disabled > .aksel-fieldset__legend, .aksel-fieldset:disabled > .aksel-fieldset__description {
-    opacity: var(--ax-opacity-disabled);
-  }
-
-  @media (forced-colors: active) {
-    .aksel-fieldset:disabled > .aksel-fieldset__legend, .aksel-fieldset:disabled > .aksel-fieldset__description {
-      opacity: 1;
-    }
-  }
-
-  .aksel-dropzone__area {
-    --__axc-dropzone-background: var(--ax-bg-input);
-    --__axc-dropzone-icon-padding: var(--ax-space-8);
-    --__axc-dropzone-animation-length-long: .4s;
-    --__axc-dropzone-animation-length-short: .25s;
-    --__axc-dropzone-animation-ease-out: cubic-bezier(.3, 1, .3, 1);
-    --__axc-dropzone-animation-over-under: cubic-bezier(.3, 1, .3, 1);
-    align-items: center;
-    gap: var(--ax-space-16);
-    text-align: center;
-    width: 100%;
-    padding: var(--ax-space-16) var(--ax-space-20);
-    border: 1px dashed var(--ax-border-neutral);
-    border-radius: var(--ax-radius-12);
-    background-color: var(--__axc-dropzone-background);
-    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;
-    display: flex;
-    position: relative;
-  }
-
-  .aksel-dropzone__area:hover:not([data-disabled="true"]) {
-    border-color: var(--ax-border-strong);
-  }
-
-  .aksel-dropzone__area:hover:not([data-disabled="true"]) > .aksel-dropzone__area-button {
-    background-color: var(--ax-bg-moderate-hover);
-    box-shadow: inset 0 0 0 2px var(--ax-bg-strong-hover);
-  }
-
-  .aksel-dropzone__area:active:not([data-disabled="true"]) > .aksel-dropzone__area-button {
-    background-color: var(--ax-bg-strong-pressed);
-    color: var(--ax-text-contrast);
-    box-shadow: none;
-  }
-
-  .aksel-dropzone__area[data-disabled="true"] {
-    --__axc-dropzone-background: var(--ax-bg-neutral-soft);
-    border-color: var(--ax-border-neutral-subtleA);
-    cursor: default;
-  }
-
-  .aksel-dropzone--dragging > .aksel-dropzone__area {
-    --__axc-dropzone-background: var(--ax-bg-input);
-  }
-
-  .aksel-dropzone--dragging > .aksel-dropzone__area:after {
-    color: var(--ax-text-default);
-    background-color: var(--ax-bg-moderateA);
-    content: "";
-    border: 1px dashed var(--ax-border-strong);
-    -webkit-backdrop-filter: blur(8px);
-    backdrop-filter: blur(8px);
-    border-radius: var(--ax-radius-12);
-    animation: akselDropzoneDragoverAnimation var(--__axc-dropzone-animation-length-short) var(--__axc-dropzone-animation-ease-out);
-    margin: -1px;
-    position: absolute;
-    inset: 0;
-  }
-
-  @keyframes akselDropzoneDragoverAnimation {
-    0% {
-      -webkit-backdrop-filter: blur();
-      backdrop-filter: blur();
-      background-color: rgba(0, 0, 0, 0);
-    }
-
-    70% {
-      -webkit-backdrop-filter: blur(8px);
-      backdrop-filter: blur(8px);
-    }
-
-    100% {
-      background-color: var(--ax-bg-moderateA);
-    }
-  }
-
-  .aksel-dropzone__area-icon {
-    padding: var(--__axc-dropzone-icon-padding);
-    visibility: hidden;
-    display: grid;
-  }
-
-  .aksel-dropzone--error > .aksel-dropzone__area {
-    outline: 2px solid var(--ax-border-danger-strong);
-    outline-offset: -1px;
-    border-color: rgba(0, 0, 0, 0);
-  }
-
-  .aksel-dropzone__area-release {
-    top: var(--ax-space-16);
-    z-index: 1;
-    pointer-events: none;
-    transition: top var(--__axc-dropzone-animation-length-long) var(--__axc-dropzone-animation-over-under), transform var(--__axc-dropzone-animation-length-long) var(--__axc-dropzone-animation-over-under);
-    display: grid;
-    position: absolute;
-  }
-
-  .aksel-dropzone__area-release__icon {
-    padding: var(--__axc-dropzone-icon-padding);
-    border-radius: var(--ax-radius-full);
-    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;
-  }
-
-  .aksel-dropzone--dragging .aksel-dropzone__area-release > .aksel-dropzone__area-release__icon {
-    background-color: rgba(0, 0, 0, 0);
-    font-size: 2rem;
-  }
-
-  .aksel-dropzone__area-release__text {
-    visibility: hidden;
-  }
-
-  .aksel-dropzone--dragging .aksel-dropzone__area-release > .aksel-dropzone__area-release__text {
-    transition: visibility var(--__axc-dropzone-animation-length-long) var(--__axc-dropzone-animation-over-under);
-    visibility: visible;
-  }
-
-  .aksel-dropzone--dragging .aksel-dropzone__area-release {
-    color: var(--ax-text-subtle);
-    top: 50%;
-    transform: translateY(-50%);
-  }
-
-  .aksel-dropzone__area-disabled {
-    color: var(--ax-text-neutral-subtle);
-    align-items: center;
-    gap: var(--ax-space-8);
-    flex-direction: column;
-    display: flex;
-  }
-
-  .aksel-file-upload :is(ul, li), li.aksel-file-item {
-    margin: 0;
-    padding: 0;
-    list-style: none;
-  }
-
-  ul:has( > li.aksel-file-item) {
-    margin: 0;
-    padding: 0;
-    list-style: none;
-  }
-
-  .aksel-file-item__inner {
-    background-color: var(--ax-bg-raised);
-    border: 1px solid var(--ax-border-neutral-subtleA);
-    outline-offset: -1px;
-    border-radius: var(--ax-radius-12);
-    padding: var(--ax-space-16) var(--ax-space-20);
-    gap: var(--ax-space-12);
-    align-items: flex-start;
-    transition: outline-color .25s cubic-bezier(0, .3, .15, 1);
-    display: flex;
-  }
-
-  .aksel-file-item--error > .aksel-file-item__inner {
-    outline: 2px solid var(--ax-border-danger-strong);
-  }
-
-  .aksel-file-item__icon {
-    background-color: var(--ax-bg-neutral-moderateA);
-    color: var(--ax-text-neutral);
-    border-radius: var(--ax-radius-full);
-    min-width: 2.5rem;
-    min-height: 2.5rem;
-    margin-top: var(--ax-space-2);
-    place-content: center;
-    transition: background-color .25s cubic-bezier(0, .3, .15, 1);
-    display: grid;
-  }
-
-  .aksel-file-item__icon > svg {
-    width: 1.5rem;
-    height: 1.5rem;
-  }
-
-  .aksel-file-item__icon--loading {
-    background-color: rgba(0, 0, 0, 0);
-  }
-
-  .aksel-file-item__file-info {
-    overflow-wrap: anywhere;
-  }
-
-  .aksel-file-item__error {
-    grid-template-rows: 0fr;
-    transition-property: grid-template-rows, padding-top;
-    transition-duration: .25s;
-    transition-timing-function: cubic-bezier(0, .3, .15, 1);
-    display: grid;
-    overflow: hidden;
-  }
-
-  .aksel-file-item--error .aksel-file-item__error {
-    padding-top: var(--ax-space-4);
-    grid-template-rows: 1fr;
-  }
-
-  .aksel-form-field {
-    justify-items: start;
-    gap: var(--ax-space-8);
-    display: grid;
-  }
-
-  .aksel-form-field__description {
-    color: var(--ax-text-neutral-subtle);
-    margin-top: -.375rem;
-  }
-
-  .aksel-form-field__description:empty {
-    display: none;
-  }
-
-  .aksel-form-field--disabled {
-    opacity: var(--ax-opacity-disabled);
-    cursor: not-allowed;
-  }
-
-  .aksel-form-field__error:empty {
-    display: none;
-  }
-
-  .aksel-form-field__subdescription {
-    color: var(--ax-text-neutral-subtle);
-  }
-
-  .aksel-form-field--readonly > :where(.aksel-form-field__label) {
-    display: inline-flex;
-  }
-
-  .aksel-form-field__readonly-icon {
-    margin-top: var(--ax-space-2);
-    margin-right: var(--ax-space-4);
-    flex-shrink: 0;
-    align-self: flex-start;
-  }
-
-  @media (forced-colors: active) {
-    .aksel-form-field--disabled {
-      opacity: 1;
-    }
-  }
-
-  .aksel-error-summary {
-    background-color: var(--ax-bg-default);
-    padding: var(--ax-space-16) var(--ax-space-20);
-    border: 4px solid var(--ax-border-danger);
-    border-radius: var(--ax-radius-12);
-    outline-offset: 3px;
-  }
-
-  .aksel-error-summary:focus-visible {
-    outline: 3px solid var(--ax-border-focus);
-  }
-
-  .aksel-error-summary:has(.aksel-error-summary__heading:focus-visible) {
-    outline: 3px solid var(--ax-border-focus);
-  }
-
-  @supports not selector(:focus-visible) {
-    .aksel-error-summary:focus {
-      outline: 3px solid var(--ax-border-focus);
-    }
-  }
-
-  .aksel-error-summary--small {
-    padding: var(--ax-space-12) var(--ax-space-16);
-  }
-
-  .aksel-error-summary--small .aksel-error-summary__heading {
-    scroll-margin-top: var(--ax-space-16);
-  }
-
-  .aksel-error-summary--small > .aksel-error-summary__list {
-    margin: var(--ax-space-8) 0;
-    gap: var(--ax-space-8);
-    padding-left: var(--ax-space-20);
-  }
-
-  .aksel-error-summary__heading {
-    scroll-margin-top: var(--ax-space-24);
-  }
-
-  .aksel-error-summary__heading:focus {
-    outline: none;
-  }
-
-  .aksel-error-summary__list {
-    margin: var(--ax-space-12) 0;
-    gap: var(--ax-space-12);
-    padding-left: var(--ax-space-24);
-    list-style: inherit;
-    flex-direction: column;
-    display: flex;
-  }
-
-  .aksel-confirmation-panel__inner {
-    gap: var(--ax-space-12);
-    padding: var(--ax-space-16);
-    border-radius: var(--ax-radius-8);
-    border: 1px solid var(--ax-border-default);
-    background-color: var(--ax-bg-moderate);
-    flex-direction: column;
-    justify-self: stretch;
-    transition: background-color .1s linear;
-    display: flex;
-    position: relative;
-  }
-
-  .aksel-confirmation-panel__content {
-    max-width: 80ch;
-  }
-
-  @media (forced-colors: active) {
-    .aksel-confirmation-panel__inner:before {
-      content: "";
-      forced-color-adjust: none;
-      border-color: orange;
-      border-left-style: solid;
-      border-left-width: 8px;
-      border-start-start-radius: calc(var(--ax-radius-8)  - 1px);
-      border-end-start-radius: calc(var(--ax-radius-8)  - 1px);
-      height: 100%;
-      position: absolute;
-      top: 0;
-      left: 0;
-    }
-
-    .aksel-confirmation-panel--checked .aksel-confirmation-panel__inner:before {
-      border-color: green;
-    }
-
-    .aksel-confirmation-panel--error .aksel-confirmation-panel__inner:before {
-      border-color: red;
-    }
-  }
-
-  .aksel-checkbox, .aksel-radio {
-    --__axc-radio-checkbox-marker-size: 1.5rem;
-    --__axc-radio-checkbox-marker-target: 2.75rem;
-    gap: var(--ax-space-2) 0;
-    width: fit-content;
-    padding: var(--ax-space-12) 0;
-    grid-template-columns: auto 1fr;
-    display: grid;
-    position: relative;
-  }
-
-  :is(.aksel-checkbox, .aksel-radio):focus-within:after {
-    content: "";
-    inset: var(--ax-space-12) 0;
-    pointer-events: none;
-    border-radius: var(--ax-radius-4);
-    outline: 3px solid var(--ax-border-focus);
-    outline-offset: 3px;
-    position: absolute;
-  }
-
-  .aksel-checkbox--small, .aksel-radio--small {
-    --__axc-radio-checkbox-marker-size: 1.25rem;
-    --__axc-radio-checkbox-marker-target: 2rem;
-    padding: var(--ax-space-6) 0;
-  }
-
-  :is(.aksel-checkbox--small, .aksel-radio--small):focus-within:after {
-    inset: var(--ax-space-6) 0;
-  }
-
-  .aksel-checkbox__label, .aksel-radio__label {
-    cursor: pointer;
-  }
-
-  .aksel-checkbox__description, .aksel-radio__description {
-    grid-column-start: 2;
-  }
-
-  .aksel-checkbox__label, .aksel-radio__label, .aksel-checkbox__description, .aksel-radio__description {
-    padding-left: var(--ax-space-8);
-  }
-
-  .aksel-checkbox__input-wrapper {
-    height: var(--__axc-radio-checkbox-marker-size);
-    position: relative;
-  }
-
-  .aksel-checkbox__input, .aksel-radio__input {
-    --__axc-radio-checkbox-marker-border: 2px;
-    appearance: none;
-    cursor: pointer;
-    width: var(--__axc-radio-checkbox-marker-size);
-    height: var(--__axc-radio-checkbox-marker-size);
-    background-color: var(--ax-bg-input);
-    border: var(--__axc-radio-checkbox-marker-border) solid var(--ax-border-neutral);
-    border-radius: var(--ax-radius-4);
-    outline: none;
-    position: relative;
-  }
-
-  .aksel-checkbox__input:before, .aksel-radio__input:before {
-    content: "";
-    inset: calc(-1 * ( var(--__axc-radio-checkbox-marker-border)  + (var(--__axc-radio-checkbox-marker-target)  - var(--__axc-radio-checkbox-marker-size)) / 2 ));
-    position: absolute;
-  }
-
-  .aksel-radio__input {
-    border-radius: var(--ax-radius-full);
-  }
-
-  .aksel-checkbox__input:indeterminate {
-    justify-content: center;
-    align-items: center;
-    display: flex;
-  }
-
-  .aksel-checkbox__input:indeterminate:after {
-    content: "";
-    background-color: var(--ax-bg-default);
-    border-radius: 1px;
-    width: .75rem;
-    height: .25rem;
-    position: absolute;
-  }
-
-  .aksel-checkbox__input:where(:checked, :indeterminate) {
-    background-color: var(--ax-bg-strong-pressed);
-    border-color: var(--ax-bg-strong-pressed);
-  }
-
-  .aksel-checkbox__input:where(:checked, :indeterminate):not(:disabled):hover {
-    border-color: var(--ax-bg-strong-hover);
-    background-color: var(--ax-bg-strong-hover);
-  }
-
-  .aksel-checkbox__input:where(:not(:checked)) + .aksel-checkbox__icon {
-    display: none;
-  }
-
-  .aksel-checkbox__icon {
-    color: var(--ax-bg-default);
-    pointer-events: none;
-    width: .8125rem;
-    height: var(--__axc-radio-checkbox-marker-size);
-    top: 0;
-    left: var(--ax-space-6);
-    position: absolute;
-  }
-
-  .aksel-checkbox--small .aksel-checkbox__input:checked + .aksel-checkbox__icon {
-    left: var(--ax-space-4);
-  }
-
-  .aksel-radio__input:checked {
-    --__axc-radio-checkbox-marker-border: 8px;
-    border-color: var(--ax-bg-strong-pressed);
-    background-color: var(--ax-bg-input);
-  }
-
-  .aksel-radio--small > .aksel-radio__input:checked {
-    --__axc-radio-checkbox-marker-border: 7px;
-  }
-
-  .aksel-checkbox__input:hover:not(:disabled, :checked, :indeterminate), .aksel-radio__input:hover:not(:disabled, :checked) {
-    border-color: var(--ax-border-strong);
-    background-color: var(--ax-bg-moderate-hoverA);
-  }
-
-  .aksel-checkbox--error .aksel-checkbox__input:not(:disabled, :checked, :indeterminate), .aksel-radio--error > .aksel-radio__input:not(:disabled, :checked) {
-    border-color: var(--ax-border-danger-strong);
-  }
-
-  .aksel-checkbox--disabled, .aksel-radio--disabled {
-    opacity: var(--ax-opacity-disabled);
-  }
-
-  .aksel-checkbox--disabled :where(.aksel-checkbox__input, .aksel-checkbox__label), .aksel-radio--disabled > :where(.aksel-radio__input, .aksel-radio__label) {
-    cursor: not-allowed;
-  }
-
-  .aksel-checkbox--readonly :where(.aksel-checkbox__input, .aksel-checkbox__label), .aksel-radio--readonly > :where(.aksel-radio__input, .aksel-radio__label) {
-    cursor: default;
-  }
-
-  .aksel-checkbox--readonly .aksel-checkbox__input:not(:disabled), .aksel-radio--readonly > .aksel-radio__input:not(:disabled) {
-    background-color: var(--ax-bg-neutral-moderate);
-    border-color: var(--ax-border-neutral-subtle);
-  }
-
-  .aksel-checkbox--readonly .aksel-checkbox__label {
-    display: inline-flex;
-  }
-
-  .aksel-checkbox--readonly .aksel-checkbox__input:checked + .aksel-checkbox__icon {
-    color: var(--ax-text-neutral-subtle);
-  }
-
-  .aksel-checkbox--readonly .aksel-checkbox__input:indeterminate:after {
-    background-color: var(--ax-text-neutral-subtle);
-  }
-
-  .aksel-radio--readonly > .aksel-radio__input:checked {
-    --__axc-radio-checkbox-marker-border: 0px;
-    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);
-  }
-
-  .aksel-radio--small.aksel-radio--readonly > .aksel-radio__input:checked {
-    box-shadow: inset 0 0 0 2px var(--ax-border-neutral-subtle), inset 0 0 0 7px var(--ax-bg-neutral-moderate);
-  }
-
-  @media screen and (forced-colors: active) {
-    :is(.aksel-checkbox, .aksel-checkbox--readonly) .aksel-checkbox__input:indeterminate:after {
-      background-color: fieldtext;
-    }
-
-    .aksel-radio:not(.aksel-radio--readonly) > .aksel-radio__input:hover:not(:disabled) + .aksel-radio__label {
-      color: highlight;
-    }
-
-    .aksel-checkbox:not(.aksel-checkbox--readonly):has(.aksel-checkbox__input:hover:not(:disabled)) > .aksel-checkbox__label {
-      color: highlight;
-    }
-
-    .aksel-checkbox:not(.aksel-checkbox--readonly) .aksel-checkbox__input:hover:not(:disabled), .aksel-radio:not(.aksel-radio--readonly) > .aksel-radio__input:hover:not(:disabled) {
-      border-color: highlight;
-    }
-
-    .aksel-checkbox--readonly .aksel-checkbox__input:checked + .aksel-checkbox__icon {
-      color: var(--ax-bg-default);
-    }
-
-    .aksel-radio--readonly > .aksel-radio__input:checked {
-      --__axc-radio-checkbox-marker-border: 8px;
-    }
-
-    .aksel-radio--small.aksel-radio--readonly > .aksel-radio__input:checked {
-      --__axc-radio-checkbox-marker-border: 7px;
-    }
-
-    .aksel-checkbox--disabled, .aksel-radio--disabled {
-      opacity: 1;
-    }
-
-    .aksel-checkbox--disabled .aksel-checkbox__input, .aksel-radio--disabled .aksel-radio__input {
-      background-color: field;
-      border-color: graytext;
-    }
-
-    .aksel-checkbox--disabled .aksel-checkbox__input:indeterminate:after {
-      background-color: graytext;
-    }
-
-    .aksel-checkbox--disabled :is(.aksel-checkbox__label, .aksel-checkbox__description, .aksel-checkbox__input:checked + .aksel-checkbox__icon), .aksel-radio--disabled :is(.aksel-radio__label, .aksel-radio__description) {
-      color: graytext;
-    }
-  }
-
-  @media print {
-    .aksel-checkbox__input:before, .aksel-radio__input:before {
-      z-index: -1;
-    }
-
-    .aksel-radio__input, .aksel-checkbox__input {
-      border-color: #000 !important;
-    }
-
-    .aksel-radio__input:checked.aksel-radio__input:checked {
-      --__axc-radio-checkbox-marker-border: 7px;
-      border-color: #000;
-    }
-
-    .aksel-checkbox__icon {
-      height: calc(var(--__axc-radio-checkbox-marker-size)  - 4px);
-      top: 2px;
-      bottom: 2px;
-    }
-
-    .aksel-checkbox__input:indeterminate:after {
-      outline-offset: -2px;
-      outline: 2px solid #000;
-    }
-  }
-
-  .aksel-select__input {
-    appearance: none;
-    background-color: var(--ax-bg-input);
-    border-radius: var(--ax-radius-8);
-    border: 1px solid var(--ax-border-neutral);
-    color: var(--ax-text-neutral);
-    box-sizing: border-box;
-    width: 100%;
-    min-height: 3rem;
-    padding: var(--ax-space-8);
-    padding-right: var(--ax-space-40);
-    scroll-margin-block-start: 4rem;
-    display: inline-block;
-    position: relative;
-  }
-
-  .aksel-select__input:hover {
-    border-color: var(--ax-border-strong);
-    cursor: pointer;
-  }
-
-  .aksel-select__input:focus {
-    outline: 3px solid var(--ax-border-focus);
-    outline-offset: 3px;
-    border-color: var(--ax-border-strong);
-  }
-
-  @media (forced-colors: active) {
-    .aksel-select__input {
-      color: buttontext;
-      background-color: buttonface;
-      border-color: buttontext;
-    }
-  }
-
-  .aksel-select__container {
-    width: 100%;
-    color: var(--ax-text-neutral);
-    display: flex;
-    position: relative;
-  }
-
-  .aksel-select__chevron {
-    right: var(--ax-space-8);
-    pointer-events: none;
-    color: var(--ax-text-neutral);
-    align-self: center;
-    font-size: 1.5rem;
-    position: absolute;
-  }
-
-  @media (forced-colors: active) {
-    .aksel-select__chevron {
-      color: buttontext;
-    }
-  }
-
-  .aksel-form-field--small .aksel-select__input {
-    min-height: 2rem;
-    padding-block: 0;
-  }
-
-  .aksel-select--error > * select, .aksel-select--error > * select:hover, .aksel-select--error > * select:focus {
-    box-shadow: 0 0 0 1px var(--ax-border-danger-strong);
-    border-color: var(--ax-border-danger-strong);
-  }
-
-  .aksel-select__input:disabled {
-    background-color: var(--ax-bg-input);
-    border: 1px solid var(--ax-border-neutral);
-    box-shadow: none;
-    cursor: not-allowed;
-    opacity: 1;
-    color: var(--ax-text-neutral);
-  }
-
-  .aksel-select__input:disabled > option {
-    color: var(--ax-text-neutral);
-  }
-
-  @media (forced-colors: active) {
-    .aksel-select__input:disabled + .aksel-select__chevron {
-      color: graytext;
-    }
-  }
-
-  .aksel-select--readonly .aksel-select__input {
-    background-color: var(--ax-bg-neutral-moderate);
-    border-color: var(--ax-border-neutral-subtleA);
-    cursor: default;
-  }
-
-  @media (forced-colors: active) {
-    .aksel-select--readonly .aksel-select__input:is(:hover, :focus) {
-      color: buttontext;
-      background-color: buttonface;
-      border-color: buttontext;
-    }
-  }
-
-  .aksel-select--readonly .aksel-select__chevron {
-    color: var(--ax-text-neutral-subtle);
-  }
-
-  .aksel-switch {
-    width: fit-content;
-    min-height: 3rem;
-    position: relative;
-  }
-
-  .aksel-switch--small {
-    min-height: 2rem;
-  }
-
-  .aksel-switch__input {
-    cursor: pointer;
-    z-index: 1;
-    opacity: 0;
-    width: 3rem;
-    height: 3rem;
-    position: absolute;
-    top: 0;
-  }
-
-  .aksel-switch--small > .aksel-switch__input {
-    width: 2.5rem;
-    height: 2rem;
-    top: 0;
-  }
-
-  .aksel-switch__label-wrapper {
-    cursor: pointer;
-    color: var(--ax-text-neutral);
-  }
-
-  .aksel-switch__content {
-    --__axc-switch-block-padding: .75rem;
-    --__axc-switch-inline-padding: 3.25rem;
-    gap: var(--ax-space-2);
-    padding: var(--__axc-switch-block-padding) 0 var(--__axc-switch-block-padding) var(--__axc-switch-inline-padding);
-    flex-direction: column;
-    display: flex;
-    position: relative;
-  }
-
-  .aksel-switch--right .aksel-switch__content {
-    padding: var(--__axc-switch-block-padding) var(--__axc-switch-inline-padding) var(--__axc-switch-block-padding) 0;
-  }
-
-  .aksel-switch--small .aksel-switch__content {
-    --__axc-switch-block-padding: .375rem;
-    --__axc-switch-inline-padding: 2.75rem;
-  }
-
-  .aksel-switch__content.aksel-switch--with-description {
-    padding-bottom: 0;
-  }
-
-  .aksel-switch__input:focus ~ .aksel-switch__label-wrapper > .aksel-switch__content:after {
-    content: "";
-    width: 100%;
-    height: calc(100% - var(--__axc-switch-block-padding) * 2);
-    border-radius: var(--ax-radius-4);
-    outline: 3px solid var(--ax-border-focus);
-    outline-offset: 3px;
-    pointer-events: none;
-    position: absolute;
-    left: 0;
-  }
-
-  .aksel-switch__input:focus ~ .aksel-switch__label-wrapper > .aksel-switch__content.aksel-switch--with-description:after {
-    height: calc(100% - var(--__axc-switch-block-padding) * 1);
-  }
-
-  .aksel-switch__input:disabled:hover ~ .aksel-switch__label-wrapper {
-    color: inherit;
-  }
-
-  .aksel-switch__track {
-    background-color: var(--ax-bg-input);
-    width: 2.75rem;
-    height: 1.5rem;
-    top: var(--ax-space-12);
-    border-radius: var(--ax-radius-full);
-    border: 2px solid var(--ax-border-neutral);
-    transition-property: background-color, border-color;
-    transition-duration: .1s;
-    transition-timing-function: ease;
-    position: absolute;
-    left: 0;
-  }
-
-  .aksel-switch--small > .aksel-switch__track {
-    top: var(--ax-space-6);
-    width: 2.25rem;
-    height: 1.25rem;
-  }
-
-  .aksel-switch__input:checked ~ .aksel-switch__track {
-    background-color: var(--ax-bg-strong-pressed);
-    border-color: var(--ax-bg-strong-pressed);
-  }
-
-  .aksel-switch__input:hover ~ .aksel-switch__track {
-    background-color: var(--ax-bg-neutral-moderate-hover);
-  }
-
-  .aksel-switch__input:hover:checked ~ .aksel-switch__track {
-    background-color: var(--ax-bg-strong-hover);
-    border-color: var(--ax-bg-strong-hover);
-  }
-
-  .aksel-switch__input:disabled ~ .aksel-switch__track {
-    background-color: var(--ax-bg-input);
-    border-color: var(--ax-border-neutral);
-  }
-
-  .aksel-switch__input:checked:disabled ~ .aksel-switch__track {
-    background-color: var(--ax-bg-strong-pressed);
-    border-color: var(--ax-bg-strong-pressed);
-  }
-
-  .aksel-switch--standalone > .aksel-switch__input:focus ~ .aksel-switch__track {
-    outline: 3px solid var(--ax-border-focus);
-    outline-offset: 3px;
-  }
-
-  .aksel-switch__thumb {
-    background-color: var(--ax-bg-neutral-strong);
-    border-radius: var(--ax-radius-full);
-    justify-content: center;
-    align-items: center;
-    width: 1.125rem;
-    height: 1.125rem;
-    transition: transform .15s cubic-bezier(.4, 0, .2, 1);
-    display: flex;
-    position: absolute;
-    top: .0625rem;
-    left: .0625rem;
-    transform: translateX(0);
-  }
-
-  .aksel-switch--small .aksel-switch__thumb {
-    width: .875rem;
-    height: .875rem;
-  }
-
-  .aksel-switch__input:checked ~ .aksel-switch__track > .aksel-switch__thumb {
-    background-color: var(--ax-bg-raised);
-    color: var(--ax-text-subtle);
-    width: 1.25rem;
-    height: 1.25rem;
-    top: 0;
-    left: 0;
-    transform: translateX(1.25rem);
-  }
-
-  .aksel-switch--small > .aksel-switch__input:checked ~ .aksel-switch__track > .aksel-switch__thumb {
-    width: 1rem;
-    height: 1rem;
-    top: 0;
-    left: 0;
-    transform: translateX(1rem);
-  }
-
-  @media (hover: hover) and (pointer: fine) {
-    .aksel-switch__input:hover:not(:disabled) ~ .aksel-switch__track > .aksel-switch__thumb {
-      transform: translateX(.17rem);
-    }
-
-    .aksel-switch__input:checked:hover:not(:disabled) ~ .aksel-switch__track > .aksel-switch__thumb {
-      transform: translateX(1.1rem);
-    }
-
-    .aksel-switch--small > .aksel-switch__input:checked:hover:not(:disabled) ~ .aksel-switch__track > .aksel-switch__thumb {
-      transform: translateX(.875rem);
-    }
-  }
-
-  .aksel-switch--right {
-    width: auto;
-  }
-
-  .aksel-switch--right .aksel-switch__input, .aksel-switch--right .aksel-switch__track {
-    left: auto;
-    right: 0;
-  }
-
-  .aksel-switch__input:disabled {
-    appearance: none;
-  }
-
-  .aksel-switch--disabled:not(.aksel-switch--loading) {
-    opacity: var(--ax-opacity-disabled);
-  }
-
-  .aksel-switch__input:disabled, .aksel-switch__input:disabled ~ .aksel-switch__label-wrapper {
-    cursor: not-allowed;
-  }
-
-  .aksel-switch--readonly > .aksel-switch__track, .aksel-switch--readonly > .aksel-switch__input:hover ~ .aksel-switch__track, .aksel-switch--readonly > .aksel-switch__input:checked ~ .aksel-switch__track, .aksel-switch--readonly > .aksel-switch__input:checked:hover ~ .aksel-switch__track {
-    background-color: var(--ax-bg-neutral-moderate);
-    border-color: var(--ax-border-neutral-subtleA);
-  }
-
-  .aksel-switch--readonly > .aksel-switch__label-wrapper, .aksel-switch--readonly > .aksel-switch__input {
-    cursor: default;
-  }
-
-  .aksel-switch--readonly .aksel-switch__label {
-    display: inline-flex;
-  }
-
-  .aksel-switch--readonly .aksel-switch__thumb {
-    background-color: var(--ax-bg-neutral-strong);
-  }
-
-  .aksel-switch--readonly > .aksel-switch__input:checked ~ .aksel-switch__track > .aksel-switch__thumb {
-    background-color: var(--ax-bg-neutral-strong);
-    color: var(--ax-text-neutral-contrast);
-  }
-
-  @media (hover: hover) and (pointer: fine) {
-    .aksel-switch--readonly > .aksel-switch__input:hover ~ .aksel-switch__track > .aksel-switch__thumb {
-      transform: translateX(0);
-    }
-
-    .aksel-switch--readonly > .aksel-switch__input:checked:hover ~ .aksel-switch__track > .aksel-switch__thumb {
-      transform: translateX(1.25rem);
-    }
-
-    .aksel-switch--readonly.aksel-switch--small > .aksel-switch__input:checked:hover ~ .aksel-switch__track > .aksel-switch__thumb {
-      transform: translateX(1rem);
-    }
-  }
-
-  @media (forced-colors: active) {
-    .aksel-switch__thumb, .aksel-switch--readonly .aksel-switch__thumb {
-      background-color: fieldtext !important;
-    }
-
-    .aksel-switch__input:checked ~ .aksel-switch__track > .aksel-switch__thumb, .aksel-switch--readonly .aksel-switch__input:checked ~ .aksel-switch__track > .aksel-switch__thumb {
-      color: field;
-    }
-
-    .aksel-switch__input:focus ~ .aksel-switch__label-wrapper > .aksel-switch__content:after, .aksel-switch--standalone > .aksel-switch__input:focus ~ .aksel-switch__track {
-      outline: 3px solid highlight;
-    }
-
-    .aksel-switch--disabled:not(.aksel-switch--loading) {
-      opacity: 1;
-    }
-
-    .aksel-switch--disabled:not(.aksel-switch--loading) .aksel-switch__thumb {
-      background-color: graytext !important;
-    }
-
-    .aksel-switch--disabled:not(.aksel-switch--loading) .aksel-switch__track {
-      border-color: graytext !important;
-    }
-
-    .aksel-switch--disabled:not(.aksel-switch--loading) .aksel-switch__label-wrapper, .aksel-switch--disabled:not(.aksel-switch--loading) .aksel-switch__label-wrapper:hover {
-      color: graytext !important;
-    }
-  }
-
-  .aksel-text-field__input {
-    appearance: none;
-    padding: var(--ax-space-8);
-    background: var(--ax-bg-input);
-    border-radius: var(--ax-radius-8);
-    border: 1px solid var(--ax-border-neutral);
-    width: 100%;
-    min-height: 3rem;
-    color: var(--ax-text-neutral);
-    scroll-margin-block-start: 4rem;
-  }
-
-  .aksel-text-field__input:hover {
-    border-color: var(--ax-border-strong);
-  }
-
-  .aksel-text-field__input:focus-visible {
-    border-color: var(--ax-border-strong);
-    outline: 3px solid var(--ax-border-focus);
-    outline-offset: 3px;
-  }
-
-  .aksel-text-field__input:disabled {
-    background-color: var(--ax-bg-input);
-    border-color: var(--ax-border-neutral);
-    cursor: not-allowed;
-  }
-
-  .aksel-text-field__input::placeholder {
-    color: var(--ax-text-neutral-subtle);
-  }
-
-  .aksel-text-field__input[size] {
-    width: auto;
-  }
-
-  .aksel-form-field--small .aksel-text-field__input {
-    padding: 0 var(--ax-space-8);
-    min-height: 2rem;
-  }
-
-  .aksel-text-field--error .aksel-text-field__input:not(:disabled) {
-    border-color: var(--ax-border-danger-strong);
-    box-shadow: 0 0 0 1px var(--ax-border-danger-strong);
-  }
-
-  .aksel-text-field--readonly .aksel-text-field__input {
-    background-color: var(--ax-bg-neutral-moderate);
-    border-color: var(--ax-border-neutral-subtleA);
-    cursor: default;
-  }
-
-  .aksel-text-field__input[type="search"]::-webkit-search-decoration {
-    -webkit-appearance: none;
-  }
-
-  .aksel-text-field__input[type="search"]::-webkit-search-cancel-button {
-    -webkit-appearance: none;
-  }
-
-  .aksel-text-field__input[type="search"]::-webkit-search-results-button {
-    -webkit-appearance: none;
-  }
-
-  .aksel-text-field__input[type="search"]::-webkit-search-results-decoration {
-    -webkit-appearance: none;
-  }
-
-  @media (forced-colors: active) {
-    .aksel-text-field__input {
-      color: fieldtext;
-      background-color: field;
-    }
-  }
-
-  .aksel-textarea__input {
-    height: var(--__axc-textarea-height);
-    appearance: none;
-    padding: var(--ax-space-8);
-    background-color: var(--ax-bg-input);
-    border-radius: var(--ax-radius-8);
-    border: 1px solid var(--ax-border-neutral);
-    resize: none;
-    width: 100%;
-    color: var(--ax-text-neutral);
-    white-space: break-spaces;
-    scroll-margin-block-start: 4rem;
-    display: block;
-  }
-
-  .aksel-textarea__input::placeholder {
-    color: var(--ax-text-neutral-subtle);
-  }
-
-  .aksel-textarea__input:hover {
-    border-color: var(--ax-border-strong);
-  }
-
-  .aksel-textarea__input:focus-visible {
-    outline: 3px solid var(--ax-border-focus);
-    outline-offset: 3px;
-    border-color: var(--ax-border-strong);
-  }
-
-  .aksel-textarea__input:disabled {
-    background-color: var(--ax-bg-input);
-    border-color: var(--ax-border-neutral);
-    cursor: not-allowed;
-  }
-
-  .aksel-form-field--small .aksel-textarea__input {
-    padding: var(--ax-space-6);
-  }
-
-  .aksel-textarea--readonly .aksel-textarea__input {
-    background-color: var(--ax-bg-neutral-moderate);
-    border-color: var(--ax-border-neutral-subtleA);
-    cursor: default;
-  }
-
-  .aksel-textarea__counter {
-    color: var(--ax-text-neutral-subtle);
-    margin-top: -.25rem;
-  }
-
-  .aksel-textarea__counter--error {
-    color: var(--ax-text-danger-subtle);
-  }
-
-  .aksel-textarea__sr-counter {
-    display: none;
-  }
-
-  .aksel-textarea__input:focus ~ .aksel-textarea__sr-counter {
-    display: initial;
-  }
-
-  .aksel-textarea--resize-both .aksel-textarea__input {
-    resize: both;
-    border-end-end-radius: 0;
-  }
-
-  .aksel-textarea--resize-horizontal .aksel-textarea__input {
-    resize: horizontal;
-    border-end-end-radius: 0;
-  }
-
-  .aksel-textarea--resize-vertical .aksel-textarea__input {
-    resize: vertical;
-    border-end-end-radius: 0;
-  }
-
-  .aksel-textarea--autoscrollbar, .aksel-textarea--autoscrollbar .aksel-textarea__wrapper {
-    flex-direction: column;
-    margin: -3px;
-    padding: 3px;
-    display: flex;
-    overflow: hidden;
-  }
-
-  .aksel-textarea--autoscrollbar .aksel-textarea__input {
-    scrollbar-gutter: stable;
-  }
-
-  .aksel-textarea--error .aksel-textarea__input:not(:disabled) {
-    box-shadow: 0 0 0 1px var(--ax-border-danger-strong);
-    border-color: var(--ax-border-danger-strong);
-  }
-
-  @media (forced-colors: active) {
-    .aksel-textarea__input {
-      color: fieldtext;
-      background-color: field;
-    }
-  }
-
-  .aksel-search {
-    flex-direction: column;
-    width: 100%;
-    display: flex;
-  }
-
-  .aksel-search__wrapper-inner {
-    width: 100%;
-    position: relative;
-  }
-
-  .aksel-search--with-size .aksel-search__wrapper-inner {
-    width: inherit;
-  }
-
-  .aksel-search--with-size .aksel-search__wrapper {
-    width: fit-content;
-  }
-
-  .aksel-search__wrapper {
-    border-radius: var(--ax-radius-8);
-    align-items: center;
-    display: inline-flex;
-  }
-
-  .aksel-search__wrapper:has(.aksel-search__input:focus-visible) {
-    outline: 3px solid var(--ax-border-focus);
-    outline-offset: 3px;
-  }
-
-  .aksel-search__input {
-    padding-right: var(--ax-space-40);
-  }
-
-  .aksel-search__input:focus-visible {
-    outline: none;
-  }
-
-  .aksel-search__input.aksel-search__input--primary, .aksel-search__input.aksel-search__input--secondary {
-    border-right: none;
-    border-top-right-radius: 0;
-    border-bottom-right-radius: 0;
-  }
-
-  .aksel-search__input--simple {
-    padding-left: var(--ax-space-40);
-  }
-
-  .aksel-form-field--small .aksel-search__input {
-    padding-right: var(--ax-space-28);
-  }
-
-  .aksel-form-field--small .aksel-search__input--simple {
-    padding-left: var(--ax-space-28);
-  }
-
-  .aksel-form-field--small .aksel-search__search-icon {
-    left: var(--ax-space-4);
-    font-size: 1.25rem;
-  }
-
-  .aksel-form-field--small .aksel-search__button-clear {
-    right: var(--ax-space-4);
-  }
-
-  .aksel-search__search-icon {
-    color: var(--ax-text-neutral);
-    left: var(--ax-space-8);
-    pointer-events: none;
-    font-size: 1.5rem;
-    position: absolute;
-    top: 50%;
-    transform: translateY(-50%);
-  }
-
-  .aksel-search--disabled .aksel-search__search-icon {
-    opacity: var(--ax-opacity-disabled);
-  }
-
-  .aksel-search__button-clear {
-    right: var(--ax-space-8);
-    position: absolute;
-    top: 50%;
-    transform: translateY(-50%);
-  }
-
-  .aksel-search__button-search {
-    border-radius: 0;
-    border-top-right-radius: var(--ax-radius-8);
-    border-bottom-right-radius: var(--ax-radius-8);
-    flex-shrink: 0;
-  }
-
-  .aksel-search__button-search.aksel-button--secondary {
-    --__axc-button-border-width: 1px;
-    --__axc-button-border-color: var(--ax-border-neutral);
-  }
-
-  .aksel-search__button-search.aksel-button--secondary:not(:hover, :active) {
-    background-color: var(--ax-bg-input);
-  }
-
-  .aksel-search__button-search.aksel-button--secondary:hover:not(:disabled) {
-    --__axc-button-border-color: var(--ax-border-strong);
-  }
-
-  .aksel-search:not(.aksel-search--error, .aksel-search--disabled) .aksel-search__wrapper:has(.aksel-search__input:is(:hover, :focus-visible)) .aksel-search__button-search.aksel-button--secondary:not(:hover, :active) {
-    --__axc-button-border-color: var(--ax-border-strong);
-  }
-
-  .aksel-search--error .aksel-search__input:not(:disabled) {
-    border-color: var(--ax-border-danger-strong);
-    box-shadow: inset -2px 0 0 0 var(--ax-border-danger-strong), inset 0 0 0 1px var(--ax-border-danger-strong);
-  }
-
-  .aksel-search--error .aksel-search__input:not(:disabled).aksel-search__input--simple {
-    box-shadow: inset 0 0 0 1px var(--ax-border-danger-strong);
-  }
-
-  .aksel-search__input:focus-visible, .aksel-search__button-search:focus-visible {
-    z-index: 1;
-  }
-
-  .aksel-search--disabled .aksel-search__input {
-    opacity: var(--ax-opacity-disabled);
-    cursor: not-allowed;
-  }
-
-  .aksel-combobox__wrapper {
-    --__axc-combobox-icon-size: 1.5rem;
-    --__axc-combobox-wrapper-inner-padding: var(--ax-space-8);
-    --__axc-combobox-list-item-padding-block: var(--ax-space-12);
-    --__axc-combobox-list-item-padding-inline: var(--ax-space-12);
-    --__axc-combobox-border-width: 1px;
-    --__axc-combobox-input-height: 2rem;
-    border-radius: var(--ax-radius-8);
-    flex-direction: column;
-    width: 100%;
-    display: flex;
-    position: relative;
-  }
-
-  .aksel-form-field:not(:is(.aksel-combobox--disabled, .aksel-combobox--readonly)) .aksel-combobox__wrapper:hover {
-    border-color: var(--ax-border-strong);
-  }
-
-  .aksel-form-field--small .aksel-combobox__wrapper {
-    --__axc-combobox-icon-size: 1.25rem;
-    --__axc-combobox-wrapper-inner-padding: var(--ax-space-4);
-    --__axc-combobox-list-item-padding-block: var(--ax-space-6);
-    --__axc-combobox-list-item-padding-inline: var(--ax-space-8);
-    --__axc-combobox-input-height: 1.5rem;
-  }
-
-  .aksel-combobox--disabled {
-    opacity: var(--ax-opacity-disabled);
-  }
-
-  .aksel-combobox--disabled .aksel-combobox__wrapper:hover {
-    border-color: var(--ax-border-neutral);
-  }
-
-  .aksel-combobox--disabled .aksel-combobox__wrapper :hover {
-    cursor: not-allowed;
-  }
-
-  .aksel-combobox--disabled .aksel-combobox__selected-options, .aksel-combobox--disabled .aksel-combobox--readonly {
-    pointer-events: none;
-  }
-
-  .aksel-combobox--readonly {
-    pointer-events: none;
-  }
-
-  .aksel-combobox--readonly .aksel-combobox__selected-options .aksel-chips__chip {
-    background-color: var(--ax-bg-neutral-moderateA);
-  }
-
-  .aksel-combobox--readonly .aksel-combobox__button-toggle-list {
-    color: var(--ax-bg-neutral-moderate);
-  }
-
-  .aksel-combobox--readonly .aksel-combobox__wrapper {
-    border-color: var(--ax-border-neutral-subtle);
-    overflow: clip;
-  }
-
-  .aksel-combobox--readonly .aksel-text-field__input, .aksel-combobox--readonly .aksel-combobox__input {
-    background-color: var(--ax-bg-neutral-moderate);
-  }
-
-  .aksel-combobox__button-toggle-list svg, .aksel-combobox__list svg {
-    width: var(--__axc-combobox-icon-size);
-    height: var(--__axc-combobox-icon-size);
-  }
-
-  .aksel-combobox__wrapper-inner {
-    border: 1px solid var(--ax-border-neutral);
-    border-radius: var(--ax-radius-8);
-  }
-
-  .aksel-combobox__wrapper-inner:has(.aksel-combobox__input:focus-visible) {
-    outline: 3px solid var(--ax-border-focus);
-    outline-offset: 3px;
-    border-color: var(--ax-border-strong);
-  }
-
-  .aksel-combobox__wrapper-inner:has(.aksel-combobox__input:focus-visible).aksel-combobox__wrapper-inner--virtually-unfocused {
-    border-color: var(--ax-border-neutral);
-    outline: none;
-  }
-
-  .aksel-combobox__wrapper-inner.aksel-text-field__input {
-    width: 100%;
-    padding-block: calc(var(--__axc-combobox-wrapper-inner-padding)  - var(--__axc-combobox-border-width));
-    padding-inline: var(--__axc-combobox-wrapper-inner-padding);
-    flex-direction: row;
-    justify-content: space-between;
-    align-items: center;
-    display: flex;
-    position: relative;
-  }
-
-  .aksel-combobox__wrapper-inner > :first-child {
-    flex: 2;
-  }
-
-  .aksel-combobox__wrapper-inner:hover {
-    cursor: text;
-  }
-
-  .aksel-combobox--disabled .aksel-combobox__wrapper-inner:hover {
-    border-color: var(--ax-border-neutral);
-  }
-
-  .aksel-combobox--error .aksel-combobox__wrapper-inner {
-    border-color: var(--ax-border-danger-strong);
-    box-shadow: 0 0 0 1px var(--ax-border-danger-strong);
-  }
-
-  .aksel-combobox--error .aksel-combobox__wrapper-inner:has(.aksel-combobox__input:focus-visible) {
-    border-color: var(--ax-border-danger-strong);
-  }
-
-  .aksel-combobox__selected-options {
-    align-items: center;
-    gap: 0;
-  }
-
-  .aksel-combobox__selected-options > li {
-    border-radius: var(--ax-radius-full);
-    margin: auto 0;
-  }
-
-  .aksel-combobox__selected-options > li:last-of-type {
-    flex: 1;
-    display: flex;
-  }
-
-  .aksel-combobox__selected-options[data-type="multiple"] {
-    gap: var(--__axc-combobox-wrapper-inner-padding);
-  }
-
-  .aksel-combobox__selected-options--no-bg {
-    font-family: inherit;
-    font-size: var(--ax-font-size-large);
-    font-weight: var(--ax-font-weight-regular);
-    letter-spacing: 0;
-    line-height: var(--ax-font-line-height-large);
-    margin: 0;
-    padding-left: .25rem;
-  }
-
-  .aksel-combobox__input-wrapper {
-    width: 100%;
-  }
-
-  .aksel-combobox__input {
-    width: 100%;
-    min-width: 10ch;
-    height: var(--__axc-combobox-input-height);
-    background: none;
-    border: none;
-    flex: 1;
-    margin: 0;
-    padding: 0;
-  }
-
-  .aksel-combobox__input:focus-visible {
-    border: none;
-    outline: 0;
-  }
-
-  .aksel-combobox__selected-options > li:only-child > .aksel-combobox__input {
-    margin-left: var(--ax-space-4);
-  }
-
-  .aksel-combobox__selected-options[data-type="single"] .aksel-combobox__input {
-    min-width: auto;
-  }
-
-  .aksel-combobox__input--hide-caret {
-    caret-color: rgba(0, 0, 0, 0);
-  }
-
-  @supports not selector(:focus-visible) {
-    .aksel-combobox__input:focus {
-      border: none;
-      outline: none;
-    }
-
-    .aksel-combobox__wrapper-inner:has(.aksel-combobox__input:focus) {
-      outline: none;
-    }
-
-    .aksel-combobox__wrapper-inner:has(.aksel-combobox__input:focus).aksel-combobox__wrapper-inner--virtually-unfocused {
-      outline: none;
-    }
-  }
-
-  .aksel-combobox__input::-webkit-search-cancel-button {
-    display: none;
-  }
-
-  .aksel-combobox__button-toggle-list {
-    color: var(--ax-text-neutral);
-    cursor: pointer;
-    background: none;
-    border: none;
-    justify-content: center;
-    align-items: center;
-    padding: 0;
-    font-size: 1rem;
-    display: flex;
-  }
-
-  .aksel-combobox__button-toggle-list:hover {
-    color: var(--ax-text-subtle);
-  }
-
-  .aksel-combobox__button-toggle-list:hover:active {
-    color: var(--ax-text-default);
-  }
-
-  .aksel-combobox__list {
-    width: var(--ac-floating-anchor-width);
-    border: 1px solid var(--ax-border-neutral-subtleA);
-    border-radius: var(--ax-radius-8);
-    background-color: var(--ax-bg-raised);
-    color: var(--ax-text-neutral);
-    box-shadow: var(--ax-shadow-dialog);
-    flex-direction: column;
-    display: flex;
-    overflow: clip;
-  }
-
-  .aksel-combobox__list .aksel-combobox__list-options {
-    overflow-y: auto;
-  }
-
-  .aksel-combobox__list--closed {
-    display: none;
-  }
-
-  .aksel-combobox__list-item, .aksel-combobox__list-item--loading, .aksel-combobox__list-item--no-options, .aksel-combobox__list-item--new-option, .aksel-combobox__list-item--max-selected {
-    padding-block: var(--__axc-combobox-list-item-padding-block);
-    padding-inline: var(--__axc-combobox-list-item-padding-inline);
-    border-radius: var(--ax-radius-8);
-    margin-inline: var(--ax-space-8);
-    margin-block: var(--ax-space-2);
-    border: 0;
-    justify-content: space-between;
-    align-items: center;
-    scroll-margin-block: 8px;
-    display: flex;
-  }
-
-  .aksel-combobox__list-item--no-options {
-    margin: 0;
-  }
-
-  .aksel-combobox__list-item--loading {
-    justify-content: center;
-    margin: 0;
-  }
-
-  .aksel-combobox__list-item--max-selected {
-    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;
-    margin: 0;
-  }
-
-  .aksel-combobox__list-options {
-    display: inherit;
-    flex-direction: inherit;
-    gap: inherit;
-    background-color: inherit;
-    padding: 0;
-    padding-block: var(--ax-space-4);
-    align-items: stretch;
-    margin: 0;
-    list-style: none;
-  }
-
-  .aksel-combobox__list-item--focus {
-    cursor: pointer;
-    outline: 2px solid var(--ax-border-focus);
-  }
-
-  .aksel-combobox__list-item--focus, .aksel-combobox__list--with-hover .aksel-combobox__list-item:not([data-no-focus="true"], .aksel-combobox__list-item--new-option):hover {
-    cursor: pointer;
-  }
-
-  .aksel-combobox__list-item {
-    -webkit-user-select: none;
-    user-select: none;
-  }
-
-  .aksel-combobox__list-item[data-no-focus="true"] {
-    cursor: not-allowed;
-    opacity: .4;
-  }
-
-  .aksel-combobox__list-item mark {
-    font-weight: var(--ax-font-weight-bold);
-    color: var(--ax-text-neutral);
-    background-color: rgba(0, 0, 0, 0);
-  }
-
-  .aksel-combobox__list-item svg {
-    color: var(--ax-text-neutral);
-  }
-
-  .aksel-combobox__list-item--selected {
-    background-color: var(--ax-bg-moderate-pressedA);
-  }
-
-  .aksel-combobox__list-item--selected p {
-    font-weight: var(--ax-font-weight-bold);
-  }
-
-  .aksel-combobox__list-item--new-option {
-    border-bottom: 1px solid var(--ax-border-subtleA);
-    background: var(--ax-bg-moderateA);
-    cursor: pointer;
-    margin: 0;
-    border-radius: 0;
-    justify-content: flex-start;
-    gap: .25rem;
-    margin-block-start: calc(var(--ax-space-4) * -1);
-  }
-
-  .aksel-combobox__list-item--new-option svg {
-    color: var(--ax-text-neutral);
-  }
-
-  .aksel-combobox__list-item--new-option:only-child {
-    margin-block: calc(var(--ax-space-4) * -1);
-    border: none;
-  }
-
-  .aksel-combobox__list-item--new-option--focus {
-    border-radius: calc(var(--ax-radius-8)  - 1px) calc(var(--ax-radius-8)  - 1px) 0 0;
-    outline: 2px solid var(--ax-border-focus);
-    outline-offset: -2px;
-  }
-
-  .aksel-combobox__list-item--new-option--focus:only-child {
-    border-radius: calc(var(--ax-radius-8)  - 1px);
-  }
-
-  @media (max-width: 479px) {
-    .aksel-combobox__button-toggle-list {
-      right: .5rem;
-    }
-
-    .aksel-combobox__input {
-      min-width: min-content;
-      padding: .75rem 0;
-    }
-
-    .aksel-combobox__selected-options {
-      gap: var(--ax-space-4);
-    }
-
-    .aksel-combobox__list {
-      overscroll-behavior: contain;
-    }
-  }
-
-  @media (forced-colors: active) {
-    .aksel-combobox__wrapper-inner:has(.aksel-combobox__input:focus-visible) {
-      outline-color: highlight;
-    }
-
-    .aksel-combobox__list-item--focus, .aksel-combobox__list--with-hover .aksel-combobox__list-item:not([data-no-focus="true"], .aksel-combobox__list-item--new-option):hover {
-      color: highlight;
-      border-left-color: highlight;
-    }
-
-    .aksel-combobox__list-item[data-no-focus="true"] {
-      opacity: 1;
-      color: graytext;
-    }
-
-    .aksel-combobox__list-item--selected {
-      color: selecteditemtext;
-      background-color: highlight;
-    }
-
-    .aksel-combobox__list-item--selected * {
-      color: #000;
-    }
-
-    .aksel-combobox__list-item--selected > * {
-      forced-color-adjust: none;
-    }
-
-    .aksel-combobox__list-item--selected.aksel-combobox__list-item--focus, .aksel-combobox__list--with-hover .aksel-combobox__list-item--selected:hover {
-      color: highlight;
-      border-left-color: highlight;
-    }
-
-    .aksel-combobox__list--with-hover .aksel-combobox__list-item--new-option:hover {
-      color: highlight;
-    }
-
-    .aksel-combobox__list-item--new-option--focus {
-      outline-offset: 0;
-      outline: 2px solid highlight;
-    }
-
-    .aksel-combobox--disabled {
-      opacity: 1;
-    }
-
-    .aksel-combobox--disabled * {
-      color: graytext;
-      opacity: 1;
-      border-color: graytext;
-    }
-
-    .aksel-combobox__list-item--new-option svg {
-      color: canvastext;
-    }
-
-    .aksel-combobox__list-item--new-option:hover {
-      color: highlight;
-    }
-
-    .aksel-combobox__list-item--new-option:hover svg {
-      color: highlight;
-    }
-  }
-
-  .aksel-form-summary {
-    border: 1px solid var(--ax-border-neutral-subtleA);
-    border-radius: var(--ax-radius-12);
-    background: var(--ax-bg-raised);
-    overflow: hidden;
-  }
-
-  .aksel-form-summary__header {
-    background: var(--ax-bg-neutral-moderateA);
-    padding: var(--ax-space-16) var(--ax-space-20);
-    justify-content: space-between;
-    gap: 0 var(--ax-space-12);
-    display: flex;
-  }
-
-  @media (max-width: 479px) {
-    .aksel-form-summary__header {
-      padding: var(--ax-space-12) var(--ax-space-16);
-      flex-direction: column;
-    }
-  }
-
-  .aksel-form-summary__header .aksel-form-summary__edit {
-    flex-shrink: 0;
-    align-self: flex-start;
-  }
-
-  .aksel-form-summary > .aksel-form-summary__answers {
-    border-top: 1px solid var(--ax-border-neutral-subtleA);
-  }
-
-  .aksel-form-summary__answers {
-    padding: var(--ax-space-16) var(--ax-space-20) var(--ax-space-20) var(--ax-space-20);
-    margin: 0;
-  }
-
-  @media (max-width: 479px) {
-    .aksel-form-summary__answers {
-      padding: var(--ax-space-12) var(--ax-space-16) var(--ax-space-16) var(--ax-space-16);
-    }
-  }
-
-  .aksel-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-neutral-subtleA);
-  }
-
-  .aksel-form-summary__answer:has(.aksel-form-summary__answer) {
-    padding-bottom: var(--ax-space-24);
-  }
-
-  .aksel-form-summary__answer:has(.aksel-form-summary__answer):last-child {
-    padding-bottom: 0;
-  }
-
-  @media (max-width: 479px) {
-    .aksel-form-summary__answer:not(:last-child) {
-      margin-bottom: var(--ax-space-12);
-      padding-bottom: var(--ax-space-12);
-    }
-
-    .aksel-form-summary__answer:has(.aksel-form-summary__answer) {
-      padding-bottom: var(--ax-space-20);
-    }
-  }
-
-  .aksel-form-summary__value:first-of-type {
-    margin-top: var(--ax-space-4);
-  }
-
-  .aksel-form-summary__value .aksel-form-summary__answers {
-    margin-top: var(--ax-space-8);
-    padding: var(--ax-space-16);
-    background: var(--ax-bg-moderateA);
-    border-radius: var(--ax-radius-8);
-    border: 1px solid var(--ax-border-subtleA);
-  }
-
-  .aksel-form-summary__value .aksel-form-summary__answers .aksel-form-summary__answer {
-    border-color: var(--ax-border-subtleA);
-  }
-
-  .aksel-form-summary__footer {
-    padding: var(--ax-space-16) var(--ax-space-20);
-    background: var(--ax-bg-raised);
-    border-top: 1px solid var(--ax-border-neutral-subtleA);
-    display: flex;
-  }
-
-  @media (max-width: 479px) {
-    .aksel-form-summary__footer {
-      padding: var(--ax-space-12) var(--ax-space-16);
-    }
-  }
-
-  .aksel-form-progress__bar {
-    margin-bottom: var(--ax-space-8);
-  }
-
-  .aksel-form-progress__button:focus-visible {
-    z-index: 1;
-  }
-
-  .aksel-form-progress__button[data-state="open"] svg {
-    transform: rotate(-180deg);
-  }
-
-  .aksel-form-progress__button[data-state="closed"] .aksel-form-progress__btn-txt-hide, .aksel-form-progress__button[data-state="open"] .aksel-form-progress__btn-txt-show {
-    display: none;
-  }
-
-  .aksel-form-progress__collapsible {
-    visibility: hidden;
-    border: 1px solid var(--ax-border-neutral-subtleA);
-    border-radius: var(--ax-radius-12);
-    background: var(--ax-bg-raised);
-    padding-inline: var(--ax-space-20);
-    opacity: .001;
-    grid-template-rows: 0fr;
-    margin-top: -2px;
-    padding-block: 0;
-    transition-property: margin-top, opacity, visibility, padding-block-start, grid-template-rows;
-    transition-duration: .3s;
-    transition-timing-function: cubic-bezier(.2, 0, 0, 1);
-    display: grid;
-    overflow: hidden;
-  }
-
-  .aksel-form-progress__collapsible[hidden] {
-    display: grid;
-  }
-
-  .aksel-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;
-  }
-
-  .aksel-form-progress__collapsible-content {
-    min-height: 0;
-  }
-}