@navikt/ds-css 4.5.0 → 4.6.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,11 @@
1
1
  # @navikt/ds-css
2
2
 
3
+ ## 4.6.0
4
+
5
+ ### Minor Changes
6
+
7
+ - Skjema: De fleste skjemakomponenter har nå styling for `readOnly`-state ([#2080](https://github.com/navikt/aksel/pull/2080))
8
+
3
9
  ## 4.5.0
4
10
 
5
11
  ### Minor Changes
package/date.css CHANGED
@@ -282,3 +282,9 @@
282
282
  .navds-date__popover:where(.navds-popover) {
283
283
  border: none;
284
284
  }
285
+
286
+ /* Readonly */
287
+
288
+ .navds-date__field--readonly .navds-date__field-button {
289
+ cursor: default;
290
+ }
@@ -285,3 +285,9 @@
285
285
  .navds-date__popover:where(.navds-popover) {
286
286
  border: none;
287
287
  }
288
+
289
+ /* Readonly */
290
+
291
+ .navds-date__field--readonly .navds-date__field-button {
292
+ cursor: default;
293
+ }
@@ -1 +1 @@
1
- .navds-date{padding:var(--a-spacing-3)}.navds-date .rdp-day_range_middle.rdp-day_disabled{background:var(--ac-date-middle-bg,var(--a-surface-action-selected));color:var(--ac-date-middle-text,var(--a-text-on-action))}.navds-date .rdp-month,.navds-date.rdp-month{display:grid;gap:var(--a-spacing-5)}.navds-date__caption-label{text-transform:capitalize}.navds-date .rdp-head_cell{font-size:var(--a-font-size-small);text-transform:capitalize}.navds-date .rdp-weeknumber{align-items:center;background:var(--ac-date-week-bg,var(--a-surface-neutral));border-radius:var(--a-border-radius-small);color:var(--ac-date-week-text,var(--a-text-on-neutral));display:flex;font-size:var(--a-font-size-small);justify-content:center;padding:var(--a-spacing-05) var(--a-spacing-1)}.navds-date__caption-dropdown{align-items:center;display:flex;gap:var(--a-spacing-2);justify-content:space-between}.navds-date__caption__month-wrapper{align-items:center;display:flex;gap:var(--a-spacing-2);justify-content:center}.navds-date__caption__month .navds-select__container select{text-transform:capitalize}.navds-date .rdp-button{all:unset;border-radius:var(--a-border-radius-medium);height:2.5rem;text-align:center;width:2.5rem}.navds-date .rdp-day_range_start{border-radius:var(--a-border-radius-xlarge) var(--a-border-radius-small) var(--a-border-radius-small) var(--a-border-radius-xlarge)}.navds-date .rdp-day_range_end:not(.rdp-day_range_start){border-radius:var(--a-border-radius-small) var(--a-border-radius-xlarge) var(--a-border-radius-xlarge) var(--a-border-radius-small)}.navds-date .rdp-day_range_start.rdp-day_range_end{border-radius:var(--a-border-radius-xlarge)}.navds-date .navds-date__month-button:not(.rdp-day_selected):not([disabled]):focus-visible,.navds-date .rdp-button:not(.rdp-day_selected):not([disabled]):focus-visible{box-shadow:var(--a-shadow-focus)}@supports not selector(:focus-visible){.navds-date .navds-date__month-button:not(.rdp-day_selected):not([disabled]):focus,.navds-date .rdp-button:not(.rdp-day_selected):not([disabled]):focus{box-shadow:var(--a-shadow-focus)}}.navds-date .navds-date__month-button.rdp-day_selected:not([disabled]):focus-visible,.navds-date .rdp-button.rdp-day_selected:not([disabled]):focus-visible{box-shadow:inset 0 0 0 1px var(--a-surface-default),var(--a-shadow-focus)}@supports not selector(:focus-visible){.navds-date .navds-date__month-button.rdp-day_selected:not([disabled]):focus,.navds-date .rdp-button.rdp-day_selected:not([disabled]):focus{box-shadow:inset 0 0 0 1px var(--a-surface-default),var(--a-shadow-focus)}}.navds-date__month-button{all:unset;border-radius:var(--a-border-radius-medium);cursor:pointer;height:2.75rem;text-align:center;text-transform:capitalize;width:3rem}.navds-date__month-button:focus-visible,.navds-monthpicker__caption-button:focus-visible{box-shadow:var(--a-shadow-focus);z-index:1}@supports not selector(:focus-visible){.navds-date__month-button:focus,.navds-monthpicker__caption-button:focus{box-shadow:var(--a-shadow-focus);z-index:1}}.navds-date__year-label{align-items:center;display:flex}.navds-date__standalone-wrapper,.navds-date__wrapper{height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.navds-date .navds-date__field{display:flex;flex-direction:column;position:relative;width:100%}.navds-date__field-wrapper{align-items:center;display:inline-flex;position:relative;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.navds-date__field-button,.navds-date__field-input:focus-visible{z-index:1}@supports not selector(:focus-visible){.navds-date__field-input:focus{z-index:1}}.navds-date .rdp-day_selected,.navds-monthpicker__month--selected{background:var(--ac-date-selected-bg,var(--a-surface-action-selected));color:var(--ac-date-selected-text,var(--a-text-on-action));cursor:pointer}.navds-date .rdp-day_disabled{background-color:var(--ac-date-disabled-bg,var(--a-surface-neutral-subtle));color:var(--ac-date-disabled-text,var(--a-text-subtle));cursor:not-allowed;text-decoration:line-through}.navds-date .rdp-button:where(:not(.rdp-day_selected):not([disabled])):hover,.navds-date__month-button:where(:not(.rdp-day_selected):not([disabled])):hover{background:var(--ac-date-hover-bg,var(--a-surface-action-subtle-hover));cursor:pointer}.navds-date .rdp-day_today{box-shadow:0 0 0 1px var(--ac-date-today-border,var(--a-border-action-selected));text-decoration:underline}.navds-date__caption{align-items:center;display:flex;gap:var(--a-spacing-2);justify-content:space-between}.navds-date__caption-button,.navds-date__caption-button:disabled,.navds-date__caption-button:disabled:hover{color:var(--ac-date-caption-text,var(--a-text-default))}.navds-date__field-input{padding-right:var(--a-spacing-14)}.navds-form-field--small .navds-date__field-input{padding-right:var(--a-spacing-10)}.navds-date__field--error .navds-date__field-input:not(:hover):not(:disabled){border-color:var(--ac-date-input-error-border,var(--a-border-danger));box-shadow:inset 0 0 0 1px var(--ac-date-input-error-border,var(--a-border-danger))}.navds-date__field--error .navds-date__field-input:focus-visible:not(:hover):not(:disabled){box-shadow:inset 0 0 0 1px var(--ac-date-input-error-border,var(--a-border-danger)),var(--a-shadow-focus)}@supports not selector(:focus-visible){.navds-date__field--error .navds-date__field-input:focus:not(:hover):not(:disabled){box-shadow:inset 0 0 0 1px var(--ac-date-input-error-border,var(--a-border-danger)),var(--a-shadow-focus)}}.navds-date__field-button{align-items:center;background:none;border:none;border-end-start-radius:0;border-radius:3px;border-start-start-radius:0;color:var(--ac-date-input-button-text,var(--a-text-default));cursor:pointer;display:inline-flex;font-size:1.5rem;height:calc(100% - 2px);justify-content:center;margin:0;padding:var(--a-spacing-3);position:absolute;right:1px;text-decoration:none;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.navds-form-field--small .navds-date__field-button{padding:var(--a-spacing-1)}.navds-date__field-button:hover:where(:not([disabled])){background-color:var(--ac-date-input-button-hover-bg,var(--a-surface-action-subtle-hover));color:var(--ac-date-input-button-hover-text,var(--a-text-action-on-action-subtle))}.navds-form-field--disabled .navds-date__field-button{cursor:not-allowed;opacity:1}.navds-date__field-button:focus-visible{border-radius:var(--a-border-radius-medium);box-shadow:var(--a-shadow-focus);outline:none}@supports not selector(:focus-visible){.navds-date__field-button:focus{box-shadow:var(--a-shadow-focus);outline:none}}.navds-date__caption__year{width:5rem}.navds-date .rdp-day_outside{pointer-events:none;visibility:hidden}.navds-date__popover:where(.navds-popover){border:none}
1
+ .navds-date{padding:var(--a-spacing-3)}.navds-date .rdp-day_range_middle.rdp-day_disabled{background:var(--ac-date-middle-bg,var(--a-surface-action-selected));color:var(--ac-date-middle-text,var(--a-text-on-action))}.navds-date .rdp-month,.navds-date.rdp-month{display:grid;gap:var(--a-spacing-5)}.navds-date__caption-label{text-transform:capitalize}.navds-date .rdp-head_cell{font-size:var(--a-font-size-small);text-transform:capitalize}.navds-date .rdp-weeknumber{align-items:center;background:var(--ac-date-week-bg,var(--a-surface-neutral));border-radius:var(--a-border-radius-small);color:var(--ac-date-week-text,var(--a-text-on-neutral));display:flex;font-size:var(--a-font-size-small);justify-content:center;padding:var(--a-spacing-05) var(--a-spacing-1)}.navds-date__caption-dropdown{align-items:center;display:flex;gap:var(--a-spacing-2);justify-content:space-between}.navds-date__caption__month-wrapper{align-items:center;display:flex;gap:var(--a-spacing-2);justify-content:center}.navds-date__caption__month .navds-select__container select{text-transform:capitalize}.navds-date .rdp-button{all:unset;border-radius:var(--a-border-radius-medium);height:2.5rem;text-align:center;width:2.5rem}.navds-date .rdp-day_range_start{border-radius:var(--a-border-radius-xlarge) var(--a-border-radius-small) var(--a-border-radius-small) var(--a-border-radius-xlarge)}.navds-date .rdp-day_range_end:not(.rdp-day_range_start){border-radius:var(--a-border-radius-small) var(--a-border-radius-xlarge) var(--a-border-radius-xlarge) var(--a-border-radius-small)}.navds-date .rdp-day_range_start.rdp-day_range_end{border-radius:var(--a-border-radius-xlarge)}.navds-date .navds-date__month-button:not(.rdp-day_selected):not([disabled]):focus-visible,.navds-date .rdp-button:not(.rdp-day_selected):not([disabled]):focus-visible{box-shadow:var(--a-shadow-focus)}@supports not selector(:focus-visible){.navds-date .navds-date__month-button:not(.rdp-day_selected):not([disabled]):focus,.navds-date .rdp-button:not(.rdp-day_selected):not([disabled]):focus{box-shadow:var(--a-shadow-focus)}}.navds-date .navds-date__month-button.rdp-day_selected:not([disabled]):focus-visible,.navds-date .rdp-button.rdp-day_selected:not([disabled]):focus-visible{box-shadow:inset 0 0 0 1px var(--a-surface-default),var(--a-shadow-focus)}@supports not selector(:focus-visible){.navds-date .navds-date__month-button.rdp-day_selected:not([disabled]):focus,.navds-date .rdp-button.rdp-day_selected:not([disabled]):focus{box-shadow:inset 0 0 0 1px var(--a-surface-default),var(--a-shadow-focus)}}.navds-date__month-button{all:unset;border-radius:var(--a-border-radius-medium);cursor:pointer;height:2.75rem;text-align:center;text-transform:capitalize;width:3rem}.navds-date__month-button:focus-visible,.navds-monthpicker__caption-button:focus-visible{box-shadow:var(--a-shadow-focus);z-index:1}@supports not selector(:focus-visible){.navds-date__month-button:focus,.navds-monthpicker__caption-button:focus{box-shadow:var(--a-shadow-focus);z-index:1}}.navds-date__year-label{align-items:center;display:flex}.navds-date__standalone-wrapper,.navds-date__wrapper{height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.navds-date .navds-date__field{display:flex;flex-direction:column;position:relative;width:100%}.navds-date__field-wrapper{align-items:center;display:inline-flex;position:relative;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.navds-date__field-button,.navds-date__field-input:focus-visible{z-index:1}@supports not selector(:focus-visible){.navds-date__field-input:focus{z-index:1}}.navds-date .rdp-day_selected,.navds-monthpicker__month--selected{background:var(--ac-date-selected-bg,var(--a-surface-action-selected));color:var(--ac-date-selected-text,var(--a-text-on-action));cursor:pointer}.navds-date .rdp-day_disabled{background-color:var(--ac-date-disabled-bg,var(--a-surface-neutral-subtle));color:var(--ac-date-disabled-text,var(--a-text-subtle));cursor:not-allowed;text-decoration:line-through}.navds-date .rdp-button:where(:not(.rdp-day_selected):not([disabled])):hover,.navds-date__month-button:where(:not(.rdp-day_selected):not([disabled])):hover{background:var(--ac-date-hover-bg,var(--a-surface-action-subtle-hover));cursor:pointer}.navds-date .rdp-day_today{box-shadow:0 0 0 1px var(--ac-date-today-border,var(--a-border-action-selected));text-decoration:underline}.navds-date__caption{align-items:center;display:flex;gap:var(--a-spacing-2);justify-content:space-between}.navds-date__caption-button,.navds-date__caption-button:disabled,.navds-date__caption-button:disabled:hover{color:var(--ac-date-caption-text,var(--a-text-default))}.navds-date__field-input{padding-right:var(--a-spacing-14)}.navds-form-field--small .navds-date__field-input{padding-right:var(--a-spacing-10)}.navds-date__field--error .navds-date__field-input:not(:hover):not(:disabled){border-color:var(--ac-date-input-error-border,var(--a-border-danger));box-shadow:inset 0 0 0 1px var(--ac-date-input-error-border,var(--a-border-danger))}.navds-date__field--error .navds-date__field-input:focus-visible:not(:hover):not(:disabled){box-shadow:inset 0 0 0 1px var(--ac-date-input-error-border,var(--a-border-danger)),var(--a-shadow-focus)}@supports not selector(:focus-visible){.navds-date__field--error .navds-date__field-input:focus:not(:hover):not(:disabled){box-shadow:inset 0 0 0 1px var(--ac-date-input-error-border,var(--a-border-danger)),var(--a-shadow-focus)}}.navds-date__field-button{align-items:center;background:none;border:none;border-end-start-radius:0;border-radius:3px;border-start-start-radius:0;color:var(--ac-date-input-button-text,var(--a-text-default));cursor:pointer;display:inline-flex;font-size:1.5rem;height:calc(100% - 2px);justify-content:center;margin:0;padding:var(--a-spacing-3);position:absolute;right:1px;text-decoration:none;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.navds-form-field--small .navds-date__field-button{padding:var(--a-spacing-1)}.navds-date__field-button:hover:where(:not([disabled])){background-color:var(--ac-date-input-button-hover-bg,var(--a-surface-action-subtle-hover));color:var(--ac-date-input-button-hover-text,var(--a-text-action-on-action-subtle))}.navds-form-field--disabled .navds-date__field-button{cursor:not-allowed;opacity:1}.navds-date__field-button:focus-visible{border-radius:var(--a-border-radius-medium);box-shadow:var(--a-shadow-focus);outline:none}@supports not selector(:focus-visible){.navds-date__field-button:focus{box-shadow:var(--a-shadow-focus);outline:none}}.navds-date__caption__year{width:5rem}.navds-date .rdp-day_outside{pointer-events:none;visibility:hidden}.navds-date__popover:where(.navds-popover){border:none}.navds-date__field--readonly .navds-date__field-button{cursor:default}
@@ -78,6 +78,11 @@
78
78
  .navds-form-field__subdescription {
79
79
  color: var(--ac-form-subdescription, var(--a-text-subtle));
80
80
  }
81
+ .navds-form-field__readonly-icon {
82
+ margin-right: var(--a-spacing-2);
83
+ vertical-align: middle;
84
+ margin-bottom: 3px;
85
+ }
81
86
  .navds-error-summary {
82
87
  background-color: var(--ac-error-summary-bg, var(--a-surface-default));
83
88
  padding: var(--a-spacing-5);
@@ -156,6 +161,9 @@
156
161
  cursor: pointer;
157
162
  display: flex;
158
163
  gap: var(--a-spacing-2);
164
+
165
+ --__ac-radio-checkbox-readonly-bg: var(--a-surface-subtle);
166
+ --__ac-radio-checkbox-readonly-border: var(--a-border-subtle);
159
167
  }
160
168
  .navds-checkbox__label::before,
161
169
  .navds-radio__label::before {
@@ -224,7 +232,7 @@
224
232
  background-color: var(--ac-radio-checkbox-bg, var(--a-surface-default));
225
233
  width: 0.75rem;
226
234
  height: 0.25rem;
227
- border-radius: 1px; /* Custom value OK */
235
+ border-radius: 1px;
228
236
  flex-shrink: 0;
229
237
  }
230
238
  .navds-checkbox--small .navds-checkbox__input:indeterminate + .navds-checkbox__label::after {
@@ -346,6 +354,48 @@
346
354
  .navds-radio--disabled > .navds-radio__label {
347
355
  cursor: not-allowed;
348
356
  }
357
+ /* Readonly */
358
+ .navds-checkbox--readonly > :where(.navds-checkbox__input, .navds-checkbox__label),
359
+ .navds-radio--readonly > :where(.navds-radio__input, .navds-radio__label) {
360
+ cursor: default;
361
+ }
362
+ .navds-checkbox--readonly > .navds-checkbox__input:hover + .navds-checkbox__label,
363
+ .navds-radio--readonly > .navds-radio__input:hover + .navds-radio__label {
364
+ color: var(--a-text-default);
365
+ }
366
+ .navds-checkbox--readonly
367
+ > .navds-checkbox__input:not(:disabled):not(:checked):not(:indeterminate)
368
+ + .navds-checkbox__label::before,
369
+ .navds-checkbox--readonly
370
+ > .navds-checkbox__input:hover:not(:checked):not(:indeterminate):not(:focus-visible)
371
+ + .navds-checkbox__label::before,
372
+ .navds-radio--readonly > .navds-radio__input:not(:disabled):not(:checked):not(:indeterminate) + .navds-radio__label::before,
373
+ .navds-radio--readonly
374
+ > .navds-radio__input:hover:not(:checked):not(:indeterminate):not(:focus-visible)
375
+ + .navds-radio__label::before {
376
+ background-color: var(--__ac-radio-checkbox-readonly-bg);
377
+ box-shadow: inset 0 0 0 2px var(--__ac-radio-checkbox-readonly-border);
378
+ }
379
+ .navds-checkbox--readonly > .navds-checkbox__input:focus-visible + .navds-checkbox__label::before,
380
+ .navds-radio--readonly > .navds-radio__input:focus-visible + .navds-radio__label::before {
381
+ --__ac-radio-checkbox-readonly-border: var(--a-border-subtle), var(--a-shadow-focus);
382
+ }
383
+ .navds-checkbox--readonly > .navds-checkbox__input:checked + .navds-checkbox__label::before {
384
+ background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMyAxMCI+ICAgIDxnPiAgICA8cGF0aCBmaWxsPSJyZ2JhKDAsIDAsIDAsIDAuNjUpIiBkPSJNNCwxMGMtMC40LDAtMC44LTAuMS0xLjEtMC40TDAuNCw3LjFDMC4xLDYuOCwwLDYuNCwwLDZzMC4yLTAuOCwwLjUtMS4xQzEsNC40LDIsNC40LDIuNSw0LjlMNCw2LjRsNi40LTYgICAgQzEwLjgsMC4xLDExLjEsMCwxMS41LDBjMC40LDAsMC44LDAuMiwxLDAuNWMwLjYsMC42LDAuNSwxLjYtMC4xLDIuMXYwTDUsOS42QzQuNyw5LjksNC40LDEwLDQsMTB6IE0xMS44LDEuOUwxMS44LDEuOSAgICBDMTEuOCwxLjksMTEuOCwxLjksMTEuOCwxLjl6IE0xMS4yLDEuMUMxMS4yLDEuMSwxMS4yLDEuMSwxMS4yLDEuMUwxMS4yLDEuMXoiLz4gICAgPC9nPjwvc3ZnPg==);
385
+ box-shadow: inset 0 0 0 2px var(--__ac-radio-checkbox-readonly-border);
386
+ background-color: var(--__ac-radio-checkbox-readonly-bg);
387
+ }
388
+ .navds-radio--readonly > .navds-radio__input:checked + .navds-radio__label::before {
389
+ box-shadow: inset 0 0 0 2px var(--__ac-radio-checkbox-readonly-border), inset 0 0 0 4px var(--__ac-radio-checkbox-readonly-bg);
390
+ background-color: var(--a-icon-subtle);
391
+ }
392
+ .navds-checkbox--readonly > .navds-checkbox__input:indeterminate + .navds-checkbox__label::before {
393
+ box-shadow: inset 0 0 0 2px var(--__ac-radio-checkbox-readonly-border);
394
+ background-color: var(--__ac-radio-checkbox-readonly-bg);
395
+ }
396
+ .navds-checkbox--readonly > .navds-checkbox__input:indeterminate + .navds-checkbox__label::after {
397
+ background-color: var(--a-icon-subtle);
398
+ }
349
399
  .navds-select__input {
350
400
  appearance: none;
351
401
  background-color: var(--ac-select-bg, var(--a-surface-default));
@@ -417,6 +467,11 @@
417
467
  .navds-select__input:disabled > option {
418
468
  color: var(--a-text-default);
419
469
  }
470
+ .navds-select--readonly .navds-select__input {
471
+ background-color: var(--a-surface-subtle);
472
+ border-color: var(--a-border-subtle);
473
+ cursor: default;
474
+ }
420
475
  .navds-switch {
421
476
  position: relative;
422
477
  min-height: 48px;
@@ -566,6 +621,37 @@
566
621
  .navds-switch__input:disabled ~ .navds-switch__label-wrapper {
567
622
  cursor: not-allowed;
568
623
  }
624
+ /* Readonly */
625
+ .navds-switch--readonly > .navds-switch__track,
626
+ .navds-switch--readonly > .navds-switch__input:hover ~ .navds-switch__track,
627
+ .navds-switch--readonly > .navds-switch__input:checked ~ .navds-switch__track,
628
+ .navds-switch--readonly > .navds-switch__input:checked:hover ~ .navds-switch__track {
629
+ background-color: var(--a-surface-neutral-moderate);
630
+ }
631
+ .navds-switch--readonly > .navds-switch__label-wrapper,
632
+ .navds-switch--readonly > .navds-switch__input {
633
+ cursor: default;
634
+ }
635
+ .navds-switch--readonly > .navds-switch__input:hover ~ .navds-switch__label-wrapper,
636
+ .navds-switch--readonly .navds-switch__label-wrapper:hover {
637
+ color: var(--a-text-default);
638
+ }
639
+ .navds-switch--readonly .navds-switch__thumb {
640
+ background-color: var(--a-surface-subtle);
641
+ box-shadow: 0 0 0 2px var(--a-border-default);
642
+ }
643
+ .navds-switch--readonly > .navds-switch__input:checked ~ .navds-switch__track > .navds-switch__thumb {
644
+ color: var(--a-icon-subtle);
645
+ }
646
+ @media (hover: hover) and (pointer: fine) {
647
+ .navds-switch--readonly > .navds-switch__input:hover ~ .navds-switch__track > .navds-switch__thumb {
648
+ transform: translateX(0);
649
+ }
650
+
651
+ .navds-switch--readonly > .navds-switch__input:checked:hover ~ .navds-switch__track > .navds-switch__thumb {
652
+ transform: translateX(20px);
653
+ }
654
+ }
569
655
  .navds-text-field__input {
570
656
  appearance: none;
571
657
  padding: var(--a-spacing-2);
@@ -621,11 +707,10 @@
621
707
  box-shadow: none;
622
708
  cursor: not-allowed;
623
709
  }
624
- .navds-text-field__input[readonly] {
625
- background-color: var(--ac-textfield-bg, var(--a-surface-default));
626
- border-color: var(--ac-textfield-border, var(--a-border-default));
627
- box-shadow: none;
628
- cursor: not-allowed;
710
+ .navds-text-field--readonly .navds-text-field__input {
711
+ background-color: var(--a-surface-subtle);
712
+ border-color: var(--a-border-subtle);
713
+ cursor: default;
629
714
  }
630
715
  /**
631
716
  * Removes default search icon
@@ -711,11 +796,10 @@
711
796
  box-shadow: none;
712
797
  cursor: not-allowed;
713
798
  }
714
- .navds-textarea__input[readonly] {
715
- background-color: var(--ac-textarea-bg, var(--a-surface-default));
716
- border-color: var(--ac-textarea-border, var(--a-border-default));
717
- box-shadow: none;
718
- cursor: not-allowed;
799
+ .navds-textarea--readonly .navds-textarea__input {
800
+ background-color: var(--a-surface-subtle);
801
+ border-color: var(--a-border-subtle);
802
+ cursor: default;
719
803
  }
720
804
  .navds-search {
721
805
  display: flex;
@@ -1 +1 @@
1
- [data-theme=dark]{--ac-form-description:var(--a-text-on-inverted);--ac-textfield-text:var(--a-text-on-inverted);--ac-textfield-bg:var(--a-surface-inverted);--ac-textfield-border:var(--a-border-on-inverted);--ac-textfield-hover-border:var(--a-blue-200);--ac-textfield-placeholder:var(--a-gray-500);--ac-textfield-error-border:var(--a-red-300);--ac-textarea-text:var(--a-text-on-inverted);--ac-textarea-bg:var(--a-transparent);--ac-textarea-border:var(--a-border-on-inverted);--ac-textarea-hover-border:var(--a-blue-200);--ac-textarea-placeholder:var(--a-gray-500);--ac-textarea-error-border:var(--a-red-300);--ac-textarea-counter-text:var(--a-gray-300);--ac-textarea-counter-error-text:var(--a-red-300);--ac-search-button-border:var(--a-border-on-inverted);--ac-search-button-border-hover:var(--a-blue-200);--ac-search-clear-icon:var(--a-white);--ac-search-clear-icon-hover:var(--a-blue-200);--ac-search-error-border:var(--a-red-300)}.navds-fieldset{border:0;margin:0;min-width:0;padding:0}.navds-fieldset>:not(:first-child):not(:empty){margin-top:var(--a-spacing-2)}.navds-fieldset__description{color:var(--ac-form-description,var(--a-text-subtle))}.navds-fieldset>.navds-fieldset__description:not(:empty){margin-top:.125rem}.navds-fieldset>.navds-sr-only+:not(:first-child):not(:empty){margin-top:0}.navds-fieldset__legend{padding:0}.navds-fieldset:disabled>.navds-fieldset__description,.navds-fieldset:disabled>.navds-fieldset__legend{opacity:.3}.navds-form-field{display:grid;gap:var(--a-spacing-2);justify-items:start}.navds-form-field__description{color:var(--ac-form-description,var(--a-text-subtle));margin-top:-6px}.navds-fieldset .navds-error-message,.navds-form-field .navds-error-message{display:flex;gap:var(--a-spacing-2)}.navds-fieldset .navds-error-message:before,.navds-form-field .navds-error-message:before{content:"•"}.navds-form-field--disabled{cursor:not-allowed;opacity:.3}.navds-form-field__error:empty{display:none}.navds-form-field__subdescription{color:var(--ac-form-subdescription,var(--a-text-subtle))}.navds-error-summary{background-color:var(--ac-error-summary-bg,var(--a-surface-default));border:4px solid var(--ac-error-summary-border,var(--a-border-danger));padding:var(--a-spacing-5)}.navds-error-summary--small{padding:var(--a-spacing-3)}.navds-error-summary:focus-visible{box-shadow:var(--a-shadow-focus);outline:none}@supports not selector(:focus-visible){.navds-error-summary:focus{box-shadow:var(--a-shadow-focus);outline:none}}.navds-error-summary__list{display:flex;flex-direction:column;gap:var(--a-spacing-3);list-style:inherit;margin:var(--a-spacing-3) 0;padding-left:var(--a-spacing-6)}.navds-error-summary__list>*{color:var(--ac-error-summary-list-dot,var(--a-text-action))}.navds-error-summary--small>.navds-error-summary__list{gap:var(--a-spacing-2);margin:var(--a-spacing-2) 0;padding-left:var(--a-spacing-5)}.navds-confirmation-panel__inner{background-color:var(--ac-confirmation-panel-bg,var(--a-surface-warning-subtle));border:1px solid var(--ac-confirmation-panel-border,var(--a-border-warning));border-radius:var(--a-border-radius-medium);display:flex;flex-direction:column;gap:var(--a-spacing-3);justify-self:stretch;padding:var(--a-spacing-4);transition:background-color .1s linear}.navds-confirmation-panel__content{max-width:80ch}.navds-confirmation-panel--checked .navds-confirmation-panel__inner{background-color:var(--ac-confirmation-panel-checked-bg,var(--a-surface-success-subtle));border-color:var(--ac-confirmation-panel-checked-border,var(--a-border-success))}.navds-confirmation-panel--error .navds-confirmation-panel__inner{background-color:var(--ac-confirmation-panel-error-bg,var(--a-surface-danger-subtle));border-color:var(--ac-confirmation-panel-error-border,var(--a-border-danger))}.navds-checkbox,.navds-radio{position:relative;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.navds-checkbox__input,.navds-radio__input{cursor:pointer;height:48px;left:-12px;opacity:0;position:absolute;top:0;width:48px;z-index:1}.navds-checkbox__label,.navds-radio__label{cursor:pointer;display:flex;gap:var(--a-spacing-2);padding:var(--a-spacing-3) 0}.navds-checkbox__label:before,.navds-radio__label:before{background-color:var(--ac-radio-checkbox-bg,var(--a-surface-default));border-radius:var(--a-border-radius-medium);box-shadow:inset 0 0 0 2px var(--ac-radio-checkbox-border,var(--a-border-default));content:"";flex-shrink:0;height:1.5rem;width:1.5rem}.navds-radio__label:before{border-radius:var(--a-border-radius-full)}.navds-checkbox__content,.navds-radio__content{display:flex;flex-direction:column;gap:.125rem}.navds-checkbox--small>.navds-checkbox__input,.navds-radio--small>.navds-radio__input{height:32px;left:-6px;top:0;width:32px}.navds-checkbox--small>.navds-checkbox__label,.navds-radio--small>.navds-radio__label{padding:6px 0}.navds-checkbox--small>.navds-checkbox__label:before,.navds-radio--small>.navds-radio__label:before{height:1.25rem;width:1.25rem}.navds-checkbox__input:focus-visible+.navds-checkbox__label:before,.navds-radio__input:focus-visible+.navds-radio__label:before{box-shadow:inset 0 0 0 2px var(--ac-radio-checkbox-border,var(--a-border-default)),var(--a-shadow-focus)}@supports not selector(:focus-visible){.navds-checkbox__input:focus+.navds-checkbox__label:before,.navds-radio__input:focus+.navds-radio__label:before{box-shadow:inset 0 0 0 2px var(--ac-radio-checkbox-border,var(--a-border-default)),var(--a-shadow-focus)}}.navds-checkbox__input:hover:focus-visible+.navds-checkbox__label:before,.navds-radio__input:hover:focus-visible+.navds-radio__label:before{box-shadow:inset 0 0 0 2px var(--ac-radio-checkbox-action,var(--a-surface-action)),var(--a-shadow-focus)}@supports not selector(:focus-visible){.navds-checkbox__input:hover:focus+.navds-checkbox__label:before,.navds-radio__input:hover:focus+.navds-radio__label:before{box-shadow:inset 0 0 0 2px var(--ac-radio-checkbox-action,var(--a-surface-action)),var(--a-shadow-focus)}}.navds-checkbox__input:indeterminate+.navds-checkbox__label:before{background-color:var(--ac-radio-checkbox-action,var(--a-surface-action));box-shadow:none}.navds-checkbox__input:indeterminate+.navds-checkbox__label:after{background-color:var(--ac-radio-checkbox-bg,var(--a-surface-default));border-radius:1px;content:"";flex-shrink:0;height:.25rem;position:absolute;top:50%;-webkit-transform:translate(.375rem,-50%);transform:translate(.375rem,-50%);width:.75rem}.navds-checkbox--small .navds-checkbox__input:indeterminate+.navds-checkbox__label:after{-webkit-transform:translate(.25rem,-50%);transform:translate(.25rem,-50%)}.navds-checkbox__input:checked+.navds-checkbox__label:before{background-color:var(--ac-radio-checkbox-action,var(--a-surface-action));background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMyAxMCI+PHBhdGggZmlsbD0iI0ZGRiIgZD0iTTQgMTBjLS40IDAtLjgtLjEtMS4xLS40TC40IDcuMUMuMSA2LjggMCA2LjQgMCA2cy4yLS44LjUtMS4xYy41LS41IDEuNS0uNSAyIDBMNCA2LjRsNi40LTZjLjQtLjMuNy0uNCAxLjEtLjQuNCAwIC44LjIgMSAuNS42LjYuNSAxLjYtLjEgMi4xTDUgOS42Yy0uMy4zLS42LjQtMSAuNHptNy44LTguMXptLS42LS44eiIvPjwvc3ZnPg==);background-position:6px;background-repeat:no-repeat;background-size:13px;box-shadow:none}.navds-checkbox--small>.navds-checkbox__input:checked+.navds-checkbox__label:before{background-position:4px}.navds-checkbox__input:checked:focus-visible+.navds-checkbox__label:before,.navds-checkbox__input:indeterminate:focus-visible+.navds-checkbox__label:before{box-shadow:inset 0 0 0 1px var(--ac-radio-checkbox-bg,var(--a-surface-default)),var(--a-shadow-focus)}@supports not selector(:focus-visible){.navds-checkbox__input:checked:focus+.navds-checkbox__label:before,.navds-checkbox__input:indeterminate:focus+.navds-checkbox__label:before{box-shadow:inset 0 0 0 1px var(--ac-radio-checkbox-bg,var(--a-surface-default)),var(--a-shadow-focus)}}.navds-radio__input:checked+.navds-radio__label:before{background-color:var(--ac-radio-checkbox-action,var(--a-surface-action));box-shadow:inset 0 0 0 2px var(--ac-radio-checkbox-action,var(--a-surface-action)),inset 0 0 0 4px var(--ac-radio-checkbox-bg,var(--a-surface-default))}.navds-radio__input:checked:focus-visible+.navds-radio__label:before{box-shadow:inset 0 0 0 2px var(--ac-radio-checkbox-action,var(--a-surface-action)),inset 0 0 0 4px var(--ac-radio-checkbox-bg,var(--a-surface-default)),var(--a-shadow-focus)}@supports not selector(:focus-visible){.navds-radio__input:checked:focus+.navds-radio__label:before{box-shadow:inset 0 0 0 2px var(--ac-radio-checkbox-action,var(--a-surface-action)),inset 0 0 0 4px var(--ac-radio-checkbox-bg,var(--a-surface-default)),var(--a-shadow-focus)}}.navds-checkbox__input:hover:not(:disabled)+.navds-checkbox__label,.navds-radio__input:hover:not(:disabled)+.navds-radio__label{color:var(--ac-radio-checkbox-action,var(--a-surface-action))}.navds-checkbox__input:hover:not(:disabled):not(:checked):not(:indeterminate):not(:focus-visible)+.navds-checkbox__label:before,.navds-radio__input:hover:not(:disabled):not(:checked):not(:focus-visible)+.navds-radio__label:before{box-shadow:inset 0 0 0 2px var(--ac-radio-checkbox-action,var(--a-surface-action))}@supports not selector(:focus-visible){.navds-checkbox__input:hover:not(:disabled):not(:checked):not(:indeterminate):not(:focus)+.navds-checkbox__label:before,.navds-radio__input:hover:not(:disabled):not(:checked):not(:focus)+.navds-radio__label:before{box-shadow:inset 0 0 0 2px var(--ac-radio-checkbox-action,var(--a-surface-action))}}.navds-checkbox__input:hover:not(:disabled):not(:checked):not(:indeterminate)+.navds-checkbox__label:before,.navds-radio__input:hover:not(:disabled):not(:checked)+.navds-radio__label:before{background-color:var(--ac-radio-checkbox-action-hover-bg,var(--a-surface-action-subtle))}.navds-checkbox--error>.navds-checkbox__input:not(:hover):not(:disabled):not(:checked):not(:indeterminate)+.navds-checkbox__label:before,.navds-radio--error>.navds-radio__input:not(:hover):not(:disabled):not(:checked)+.navds-radio__label:before{box-shadow:inset 0 0 0 2px var(--ac-radio-checkbox-error-border,var(--a-border-danger))}.navds-checkbox--error>.navds-checkbox__input:focus-visible:not(:hover):not(:disabled):not(:checked):not(:indeterminate)+.navds-checkbox__label:before,.navds-radio--error>.navds-radio__input:focus-visible:not(:hover):not(:disabled):not(:checked)+.navds-radio__label:before{box-shadow:inset 0 0 0 2px var(--ac-radio-checkbox-error-border,var(--a-border-danger)),var(--a-shadow-focus)}@supports not selector(:focus-visible){.navds-checkbox--error>.navds-checkbox__input:focus:not(:hover):not(:disabled):not(:checked):not(:indeterminate)+.navds-checkbox__label:before,.navds-radio--error>.navds-radio__input:focus:not(:hover):not(:disabled):not(:checked)+.navds-radio__label:before{box-shadow:inset 0 0 0 2px var(--ac-radio-checkbox-error-border,var(--a-border-danger)),var(--a-shadow-focus)}}.navds-checkbox--error>.navds-checkbox__input:hover:not(:disabled):not(:checked):not(:indeterminate):not(:focus-visible)+.navds-checkbox__label:before,.navds-radio--error>.navds-radio__input:hover:not(:disabled):not(:checked):not(:focus-visible)+.navds-radio__label:before{background-color:var(--ac-radio-checkbox-error-hover-bg,var(--a-surface-danger-subtle));box-shadow:inset 0 0 0 2px var(--ac-radio-checkbox-error-border,var(--a-border-danger))}.navds-checkbox--error>.navds-checkbox__input:focus-visible:hover:not(:disabled):not(:checked):not(:indeterminate)+.navds-checkbox__label:before,.navds-radio--error>.navds-radio__input:focus-visible:hover:not(:disabled):not(:checked)+.navds-radio__label:before{background-color:var(--ac-radio-checkbox-error-hover-bg,var(--a-surface-danger-subtle));box-shadow:inset 0 0 0 2px var(--ac-radio-checkbox-error-border,var(--a-border-danger)),var(--a-shadow-focus)}@supports not selector(:focus-visible){.navds-checkbox--error>.navds-checkbox__input:hover:not(:disabled):not(:checked):not(:indeterminate):not(:focus)+.navds-checkbox__label:before,.navds-radio--error>.navds-radio__input:hover:not(:disabled):not(:checked):not(:focus)+.navds-radio__label:before{background-color:var(--ac-radio-checkbox-error-hover-bg,var(--a-surface-danger-subtle));box-shadow:inset 0 0 0 2px var(--ac-radio-checkbox-error-border,var(--a-border-danger))}.navds-checkbox--error>.navds-checkbox__input:focus:hover:not(:disabled):not(:checked):not(:indeterminate)+.navds-checkbox__label:before,.navds-radio--error>.navds-radio__input:focus:hover:not(:disabled):not(:checked)+.navds-radio__label:before{background-color:var(--ac-radio-checkbox-error-hover-bg,var(--a-surface-danger-subtle));box-shadow:inset 0 0 0 2px var(--ac-radio-checkbox-error-border,var(--a-border-danger)),var(--a-shadow-focus)}}.navds-checkbox--disabled,.navds-radio--disabled{opacity:.3}.navds-checkbox--disabled>.navds-checkbox__input,.navds-checkbox--disabled>.navds-checkbox__label,.navds-radio--disabled>.navds-radio__input,.navds-radio--disabled>.navds-radio__label{cursor:not-allowed}.navds-select__input{-webkit-appearance:none;appearance:none;background-color:var(--ac-select-bg,var(--a-surface-default));border:1px solid var(--ac-select-border,var(--a-border-default));border-radius:var(--a-border-radius-medium);box-sizing:border-box;color:var(--ac-select-text,var(--a-text-default));display:inline-block;min-height:48px;padding:.5rem 2rem .5rem .5rem;position:relative;width:100%}.navds-select__input:hover{border-color:var(--ac-select-hover-bg,var(--a-border-action))}.navds-select__input:focus-visible{box-shadow:var(--a-shadow-focus);outline:none}@supports not selector(:focus-visible){.navds-select__input:focus{box-shadow:var(--a-shadow-focus);outline:none}}.navds-select__container{color:var(--a-text-default);display:flex;position:relative;width:100%}.navds-select__chevron{align-self:center;font-size:1.5rem;pointer-events:none;position:absolute;right:var(--a-spacing-2)}.navds-form-field--small .navds-select__input{min-height:32px;padding:0 2rem 0 .25rem}.navds-form-field--small .navds-select__chevron{right:.375rem}.navds-select--error>* select:not(:hover):not(:focus):not(:disabled){border-color:var(--ac-select-error-border,var(--a-surface-danger));box-shadow:0 0 0 1px var(--ac-select-error-border,var(--a-surface-danger))}.navds-select__input:disabled{background-color:var(--ac-select-bg,var(--a-surface-default));border:1px solid var(--ac-select-border,var(--a-border-default));box-shadow:none;color:var(--a-text-default);cursor:not-allowed;opacity:1}.navds-select__input:disabled>option{color:var(--a-text-default)}.navds-switch{min-height:48px;position:relative;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.navds-switch--right{width:auto}.navds-switch--small{min-height:32px;position:relative}.navds-switch__input{cursor:pointer;height:48px;opacity:0;position:absolute;top:0;width:48px;z-index:1}.navds-switch--small>.navds-switch__input{height:32px;top:0}.navds-switch__label-wrapper{color:var(--a-text-default);cursor:pointer}.navds-switch__content{display:flex;flex-direction:column;gap:.125rem;padding:.75rem 0 .75rem 3.25rem}.navds-switch--right>.navds-switch__label-wrapper>.navds-switch__content{padding:.75rem 3.25rem .75rem 0}.navds-switch--small>.navds-switch__label-wrapper>.navds-switch__content{padding:calc(var(--a-spacing-2) - 2px) 0 calc(var(--a-spacing-2) - 2px) 3.25rem}.navds-switch--right.navds-switch--small>.navds-switch__label-wrapper>.navds-switch__content{padding:calc(var(--a-spacing-2) - 2px) 3.25rem calc(var(--a-spacing-2) - 2px) 0}.navds-switch--small>.navds-switch__label-wrapper>.navds-switch--with-description,.navds-switch--with-description{padding-bottom:0}.navds-switch__input:hover~.navds-switch__label-wrapper,.navds-switch__label-wrapper:hover{color:var(--ac-switch-action,var(--a-surface-action))}.navds-switch__input:disabled:hover~.navds-switch__label-wrapper{color:inherit}.navds-switch__track{background-color:var(--ac-switch-bg,var(--a-surface-neutral));border-radius:var(--a-border-radius-full);height:24px;left:0;position:absolute;top:var(--a-spacing-3);transition:background-color .25s cubic-bezier(.4,0,.2,1);width:44px}.navds-switch--small>.navds-switch__track{top:var(--a-spacing-1)}.navds-switch--right>.navds-switch__input,.navds-switch--right>.navds-switch__track{left:auto;right:0}.navds-switch__input:checked~.navds-switch__track{background-color:var(--ac-switch-checked-bg,var(--a-surface-success))}.navds-switch__input:hover~.navds-switch__track{background-color:var(--ac-switch-hover-bg,var(--a-surface-neutral-hover))}.navds-switch__input:hover:checked~.navds-switch__track{background-color:var(--ac-switch-checked-hover-bg,var(--a-surface-success-hover))}.navds-switch__input:disabled~.navds-switch__track{background-color:var(--ac-switch-bg,var(--a-surface-neutral))}.navds-switch__input:checked:disabled~.navds-switch__track{background-color:var(--ac-switch-checked-bg,var(--a-border-success))}.navds-switch__input:focus-visible~.navds-switch__track{box-shadow:0 0 0 1px var(--a-surface-default),var(--a-shadow-focus)}@supports not selector(:focus-visible){.navds-switch__input:focus~.navds-switch__track{box-shadow:0 0 0 1px var(--a-surface-default),var(--a-shadow-focus)}}.navds-switch__thumb{align-items:center;background-color:var(--ac-switch-thumb-bg,var(--a-surface-default));border-radius:var(--a-border-radius-full);color:var(--ac-switch-thumb-icon,var(--a-icon-subtle));display:flex;height:20px;justify-content:center;left:2px;position:absolute;top:2px;-webkit-transform:translateX(0);transform:translateX(0);transition:-webkit-transform .25s cubic-bezier(.4,0,.2,1);transition:transform .25s cubic-bezier(.4,0,.2,1);transition:transform .25s cubic-bezier(.4,0,.2,1),-webkit-transform .25s cubic-bezier(.4,0,.2,1);width:20px}.navds-switch__input:checked~.navds-switch__track>.navds-switch__thumb{color:var(--ac-switch-thumb-icon-checked,var(--a-icon-success));-webkit-transform:translateX(20px);transform:translateX(20px)}@media (hover:hover) and (pointer:fine){.navds-switch__input:hover~.navds-switch__track>.navds-switch__thumb{-webkit-transform:translateX(2px);transform:translateX(2px)}.navds-switch__input:checked:hover~.navds-switch__track>.navds-switch__thumb{-webkit-transform:translateX(18px);transform:translateX(18px)}}.navds-switch__input:disabled:hover~.navds-switch__track>.navds-switch__thumb{-webkit-transform:translateX(0);transform:translateX(0)}.navds-switch__input:checked:disabled:hover~.navds-switch__track>.navds-switch__thumb{-webkit-transform:translateX(20px);transform:translateX(20px)}.navds-switch__input:checked~.navds-switch__track>.navds-switch__thumb .navds-loader__foreground{stroke:var(--ac-switch-thumb-icon-checked,var(--a-icon-success))}.navds-switch__input:disabled{-webkit-appearance:none;appearance:none}.navds-switch--disabled:not(.navds-switch--loading){opacity:.3}.navds-switch__input:disabled,.navds-switch__input:disabled~.navds-switch__label-wrapper{cursor:not-allowed}.navds-text-field__input{-webkit-appearance:none;appearance:none;background-color:var(--ac-textfield-bg,var(--a-surface-default));border:1px solid var(--ac-textfield-border,var(--a-border-default));border-radius:var(--a-border-radius-medium);color:var(--ac-textfield-text,var(--a-text-default));min-height:48px;padding:var(--a-spacing-2);width:100%}.navds-text-field__input[size]{width:auto}.navds-text-field__input::-webkit-input-placeholder{color:var(--ac-textfield-placeholder,var(--a-text-subtle))}.navds-text-field__input::placeholder{color:var(--ac-textfield-placeholder,var(--a-text-subtle))}.navds-form-field--small .navds-text-field__input{min-height:32px;padding:0 .5rem}.navds-text-field__input:hover{border-color:var(--ac-textfield-hover-border,var(--a-border-action))}.navds-text-field__input:focus-visible{box-shadow:var(--a-shadow-focus);outline:none}@supports not selector(:focus-visible){.navds-text-field__input:focus{box-shadow:var(--a-shadow-focus);outline:none}}.navds-text-field--error>.navds-text-field__input:not(:hover):not(:disabled){border-color:var(--ac-textfield-error-border,var(--a-border-danger));box-shadow:0 0 0 1px var(--ac-textfield-error-border,var(--a-border-danger))}.navds-text-field--error>.navds-text-field__input:focus-visible:not(:hover):not(:disabled){box-shadow:0 0 0 1px var(--a-border-danger),var(--a-shadow-focus)}@supports not selector(:focus-visible){.navds-text-field--error>.navds-text-field__input:focus:not(:hover):not(:disabled){box-shadow:0 0 0 1px var(--a-border-danger),var(--a-shadow-focus)}}.navds-text-field__input:disabled,.navds-text-field__input[readonly]{background-color:var(--ac-textfield-bg,var(--a-surface-default));border-color:var(--ac-textfield-border,var(--a-border-default));box-shadow:none;cursor:not-allowed}.navds-text-field__input[type=search]::-webkit-search-cancel-button,.navds-text-field__input[type=search]::-webkit-search-decoration,.navds-text-field__input[type=search]::-webkit-search-results-button,.navds-text-field__input[type=search]::-webkit-search-results-decoration{-webkit-appearance:none}.navds-textarea__wrapper{position:relative;width:100%}.navds-textarea__input{-webkit-appearance:none;appearance:none;background-color:var(--ac-textarea-bg,var(--a-surface-default));border:1px solid var(--ac-textarea-border,var(--a-border-default));border-radius:var(--a-border-radius-medium);color:var(--ac-textarea-text,var(--a-text-default));display:block;padding:var(--a-spacing-2);resize:none;width:100%}.navds-textarea--counter{padding-bottom:var(--a-spacing-8)}.navds-textarea__input::-webkit-input-placeholder{color:var(--ac-textarea-placeholder,var(--a-text-subtle))}.navds-textarea__input::placeholder{color:var(--ac-textarea-placeholder,var(--a-text-subtle))}.navds-textarea__input:hover{border-color:var(--ac-textarea-hover-border,var(--a-border-action))}.navds-textarea__input:focus-visible{box-shadow:var(--a-shadow-focus);outline:none}@supports not selector(:focus-visible){.navds-textarea__input:focus{box-shadow:var(--a-shadow-focus);outline:none}}.navds-form-field--small .navds-textarea__input{padding:6px}.navds-form-field--small .navds-textarea--counter.navds-textarea__input{padding-bottom:var(--a-spacing-7)}.navds-textarea__counter{bottom:1px;color:var(--ac-textarea-counter-text,var(--a-text-subtle));font-style:italic;left:1px;padding:var(--a-spacing-1) var(--a-spacing-2);pointer-events:none;position:absolute;text-align:left}.navds-textarea__counter--error{color:var(--ac-textarea-counter-error-text,var(--a-text-danger))}.navds-textarea--resize .navds-textarea__input{resize:both}.navds-textarea--error .navds-textarea__input:not(:hover):not(:focus-visible):not(:disabled){border-color:var(--ac-textarea-error-border,var(--a-border-danger));box-shadow:0 0 0 1px var(--ac-textarea-error-border,var(--a-border-danger))}@supports not selector(:focus-visible){.navds-textarea--error .navds-textarea__input:not(:hover):not(:focus):not(:disabled){border-color:var(--ac-textarea-error-border,var(--a-border-danger));box-shadow:0 0 0 1px var(--ac-textarea-error-border,var(--a-border-danger))}}.navds-textarea__input:disabled,.navds-textarea__input[readonly]{background-color:var(--ac-textarea-bg,var(--a-surface-default));border-color:var(--ac-textarea-border,var(--a-border-default));box-shadow:none;cursor:not-allowed}.navds-search{display:flex;flex-direction:column;width:100%}.navds-search__wrapper-inner{position:relative;width:100%}.navds-search--with-size :where(.navds-search__wrapper-inner){width:inherit}.navds-search__wrapper{align-items:center;display:inline-flex}.navds-search__input{padding-right:var(--a-spacing-10)}.navds-form-field--small .navds-search__input{padding-right:var(--a-spacing-8)}.navds-search__input--simple{padding-left:var(--a-spacing-11)}.navds-form-field--small .navds-search__input--simple{padding-left:var(--a-spacing-7)}.navds-search__input:not(.navds-search__input--simple){border-bottom-right-radius:0;border-top-right-radius:0}.navds-search__search-icon{font-size:1.5rem;left:var(--a-spacing-3);pointer-events:none;position:absolute;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.navds-form-field--small .navds-search__search-icon{font-size:1rem;left:var(--a-spacing-2)}.navds-search__button-clear{align-items:center;background:none;border:none;border-radius:var(--a-border-radius-medium);color:var(--ac-search-clear-icon,var(--a-text-default));cursor:pointer;display:flex;font-size:1.25rem;height:32px;justify-content:center;padding:0;position:absolute;right:.75rem;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);width:32px}.navds-form-field--small .navds-search__button-clear{height:24px;right:.5rem;width:24px}.navds-search__button-clear:hover{color:var(--ac-search-clear-icon-hover,var(--a-text-action))}.navds-search__button-clear:focus-visible{box-shadow:var(--a-shadow-focus);outline:none}@supports not selector(:focus-visible){.navds-search__button-clear:focus{box-shadow:var(--a-shadow-focus);outline:none}}.navds-search__button-search{border-radius:0;border-bottom-right-radius:var(--a-border-radius-medium);border-top-right-radius:var(--a-border-radius-medium);flex-shrink:0;min-height:32px;min-width:64px}.navds-form-field--small .navds-search__button-search svg{font-size:1rem}.navds-form-field--small .navds-search__button-search{min-width:40px}.navds-search__button-search.navds-button--secondary{box-shadow:-1px 0 0 0 var(--ac-search-button-border,var(--a-border-default)) inset,0 1px 0 0 var(--ac-search-button-border,var(--a-border-default)) inset,0 -1px 0 0 var(--ac-search-button-border,var(--a-border-default)) inset}.navds-search__button-search.navds-button--secondary:hover{box-shadow:-1px 0 0 0 var(--ac-search-button-border-hover,var(--a-border-action)) inset,0 1px 0 0 var(--ac-search-button-border-hover,var(--a-border-action)) inset,0 -1px 0 0 var(--ac-search-button-border-hover,var(--a-border-action)) inset,-1px 0 0 0 var(--ac-search-button-border-hover,var(--a-border-action));z-index:1}.navds-search__wrapper-inner:focus-within+.navds-search__button-search.navds-button--secondary:hover{z-index:auto}.navds-search__button-search.navds-button--secondary:focus-visible{box-shadow:0 0 0 1px var(--ac-search-button-border,var(--a-border-default)) inset,var(--a-shadow-focus)}.navds-search__button-search.navds-button--secondary:focus-visible:hover{box-shadow:0 0 0 1px var(--ac-search-button-border-hover,var(--a-border-action)) inset,var(--a-shadow-focus)}.navds-search__button-search.navds-button--secondary:focus-visible:active{box-shadow:0 0 0 1px var(--ac-search-button-focus-active-border,var(--a-surface-default)) inset,var(--a-shadow-focus)}@supports not selector(:focus-visible){.navds-search__button-search.navds-button--secondary:focus{box-shadow:0 0 0 1px var(--ac-search-button-border,var(--a-border-default)) inset,var(--a-shadow-focus)}.navds-search__button-search.navds-button--secondary:focus:hover{box-shadow:0 0 0 1px var(--ac-search-button-border-hover,var(--a-border-action)) inset,var(--a-shadow-focus)}.navds-search__button-search.navds-button--secondary:focus:active{box-shadow:0 0 0 1px var(--ac-search-button-focus-active-border,var(--a-surface-default)) inset,var(--a-shadow-focus)}}.navds-search--error .navds-search__input:not(:hover):not(:disabled){border-color:var(--ac-search-error-border,var(--a-border-danger));box-shadow:inset 0 0 0 1px var(--ac-search-error-border,var(--a-border-danger))}.navds-search--error .navds-search__input:focus-visible:not(:hover):not(:disabled){box-shadow:inset 0 0 0 1px var(--ac-search-error-border,var(--a-border-danger)),var(--a-shadow-focus)}.navds-search__button-clear,.navds-search__button-search:focus-visible,.navds-search__input:focus-visible{z-index:1}@supports not selector(:focus-visible){.navds-search--error .navds-search__input:focus:not(:hover):not(:disabled){box-shadow:inset 0 0 0 1px var(--ac-search-error-border,var(--a-border-danger)),var(--a-shadow-focus)}.navds-search__button-search:focus,.navds-search__input:focus{z-index:1}}
1
+ [data-theme=dark]{--ac-form-description:var(--a-text-on-inverted);--ac-textfield-text:var(--a-text-on-inverted);--ac-textfield-bg:var(--a-surface-inverted);--ac-textfield-border:var(--a-border-on-inverted);--ac-textfield-hover-border:var(--a-blue-200);--ac-textfield-placeholder:var(--a-gray-500);--ac-textfield-error-border:var(--a-red-300);--ac-textarea-text:var(--a-text-on-inverted);--ac-textarea-bg:var(--a-transparent);--ac-textarea-border:var(--a-border-on-inverted);--ac-textarea-hover-border:var(--a-blue-200);--ac-textarea-placeholder:var(--a-gray-500);--ac-textarea-error-border:var(--a-red-300);--ac-textarea-counter-text:var(--a-gray-300);--ac-textarea-counter-error-text:var(--a-red-300);--ac-search-button-border:var(--a-border-on-inverted);--ac-search-button-border-hover:var(--a-blue-200);--ac-search-clear-icon:var(--a-white);--ac-search-clear-icon-hover:var(--a-blue-200);--ac-search-error-border:var(--a-red-300)}.navds-fieldset{border:0;margin:0;min-width:0;padding:0}.navds-fieldset>:not(:first-child):not(:empty){margin-top:var(--a-spacing-2)}.navds-fieldset__description{color:var(--ac-form-description,var(--a-text-subtle))}.navds-fieldset>.navds-fieldset__description:not(:empty){margin-top:.125rem}.navds-fieldset>.navds-sr-only+:not(:first-child):not(:empty){margin-top:0}.navds-fieldset__legend{padding:0}.navds-fieldset:disabled>.navds-fieldset__description,.navds-fieldset:disabled>.navds-fieldset__legend{opacity:.3}.navds-form-field{display:grid;gap:var(--a-spacing-2);justify-items:start}.navds-form-field__description{color:var(--ac-form-description,var(--a-text-subtle));margin-top:-6px}.navds-fieldset .navds-error-message,.navds-form-field .navds-error-message{display:flex;gap:var(--a-spacing-2)}.navds-fieldset .navds-error-message:before,.navds-form-field .navds-error-message:before{content:"•"}.navds-form-field--disabled{cursor:not-allowed;opacity:.3}.navds-form-field__error:empty{display:none}.navds-form-field__subdescription{color:var(--ac-form-subdescription,var(--a-text-subtle))}.navds-form-field__readonly-icon{margin-bottom:3px;margin-right:var(--a-spacing-2);vertical-align:middle}.navds-error-summary{background-color:var(--ac-error-summary-bg,var(--a-surface-default));border:4px solid var(--ac-error-summary-border,var(--a-border-danger));padding:var(--a-spacing-5)}.navds-error-summary--small{padding:var(--a-spacing-3)}.navds-error-summary:focus-visible{box-shadow:var(--a-shadow-focus);outline:none}@supports not selector(:focus-visible){.navds-error-summary:focus{box-shadow:var(--a-shadow-focus);outline:none}}.navds-error-summary__list{display:flex;flex-direction:column;gap:var(--a-spacing-3);list-style:inherit;margin:var(--a-spacing-3) 0;padding-left:var(--a-spacing-6)}.navds-error-summary__list>*{color:var(--ac-error-summary-list-dot,var(--a-text-action))}.navds-error-summary--small>.navds-error-summary__list{gap:var(--a-spacing-2);margin:var(--a-spacing-2) 0;padding-left:var(--a-spacing-5)}.navds-confirmation-panel__inner{background-color:var(--ac-confirmation-panel-bg,var(--a-surface-warning-subtle));border:1px solid var(--ac-confirmation-panel-border,var(--a-border-warning));border-radius:var(--a-border-radius-medium);display:flex;flex-direction:column;gap:var(--a-spacing-3);justify-self:stretch;padding:var(--a-spacing-4);transition:background-color .1s linear}.navds-confirmation-panel__content{max-width:80ch}.navds-confirmation-panel--checked .navds-confirmation-panel__inner{background-color:var(--ac-confirmation-panel-checked-bg,var(--a-surface-success-subtle));border-color:var(--ac-confirmation-panel-checked-border,var(--a-border-success))}.navds-confirmation-panel--error .navds-confirmation-panel__inner{background-color:var(--ac-confirmation-panel-error-bg,var(--a-surface-danger-subtle));border-color:var(--ac-confirmation-panel-error-border,var(--a-border-danger))}.navds-checkbox,.navds-radio{position:relative;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.navds-checkbox__input,.navds-radio__input{cursor:pointer;height:48px;left:-12px;opacity:0;position:absolute;top:0;width:48px;z-index:1}.navds-checkbox__label,.navds-radio__label{--__ac-radio-checkbox-readonly-bg:var(--a-surface-subtle);--__ac-radio-checkbox-readonly-border:var(--a-border-subtle);cursor:pointer;display:flex;gap:var(--a-spacing-2);padding:var(--a-spacing-3) 0}.navds-checkbox__label:before,.navds-radio__label:before{background-color:var(--ac-radio-checkbox-bg,var(--a-surface-default));border-radius:var(--a-border-radius-medium);box-shadow:inset 0 0 0 2px var(--ac-radio-checkbox-border,var(--a-border-default));content:"";flex-shrink:0;height:1.5rem;width:1.5rem}.navds-radio__label:before{border-radius:var(--a-border-radius-full)}.navds-checkbox__content,.navds-radio__content{display:flex;flex-direction:column;gap:.125rem}.navds-checkbox--small>.navds-checkbox__input,.navds-radio--small>.navds-radio__input{height:32px;left:-6px;top:0;width:32px}.navds-checkbox--small>.navds-checkbox__label,.navds-radio--small>.navds-radio__label{padding:6px 0}.navds-checkbox--small>.navds-checkbox__label:before,.navds-radio--small>.navds-radio__label:before{height:1.25rem;width:1.25rem}.navds-checkbox__input:focus-visible+.navds-checkbox__label:before,.navds-radio__input:focus-visible+.navds-radio__label:before{box-shadow:inset 0 0 0 2px var(--ac-radio-checkbox-border,var(--a-border-default)),var(--a-shadow-focus)}@supports not selector(:focus-visible){.navds-checkbox__input:focus+.navds-checkbox__label:before,.navds-radio__input:focus+.navds-radio__label:before{box-shadow:inset 0 0 0 2px var(--ac-radio-checkbox-border,var(--a-border-default)),var(--a-shadow-focus)}}.navds-checkbox__input:hover:focus-visible+.navds-checkbox__label:before,.navds-radio__input:hover:focus-visible+.navds-radio__label:before{box-shadow:inset 0 0 0 2px var(--ac-radio-checkbox-action,var(--a-surface-action)),var(--a-shadow-focus)}@supports not selector(:focus-visible){.navds-checkbox__input:hover:focus+.navds-checkbox__label:before,.navds-radio__input:hover:focus+.navds-radio__label:before{box-shadow:inset 0 0 0 2px var(--ac-radio-checkbox-action,var(--a-surface-action)),var(--a-shadow-focus)}}.navds-checkbox__input:indeterminate+.navds-checkbox__label:before{background-color:var(--ac-radio-checkbox-action,var(--a-surface-action));box-shadow:none}.navds-checkbox__input:indeterminate+.navds-checkbox__label:after{background-color:var(--ac-radio-checkbox-bg,var(--a-surface-default));border-radius:1px;content:"";flex-shrink:0;height:.25rem;position:absolute;top:50%;-webkit-transform:translate(.375rem,-50%);transform:translate(.375rem,-50%);width:.75rem}.navds-checkbox--small .navds-checkbox__input:indeterminate+.navds-checkbox__label:after{-webkit-transform:translate(.25rem,-50%);transform:translate(.25rem,-50%)}.navds-checkbox__input:checked+.navds-checkbox__label:before{background-color:var(--ac-radio-checkbox-action,var(--a-surface-action));background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMyAxMCI+PHBhdGggZmlsbD0iI0ZGRiIgZD0iTTQgMTBjLS40IDAtLjgtLjEtMS4xLS40TC40IDcuMUMuMSA2LjggMCA2LjQgMCA2cy4yLS44LjUtMS4xYy41LS41IDEuNS0uNSAyIDBMNCA2LjRsNi40LTZjLjQtLjMuNy0uNCAxLjEtLjQuNCAwIC44LjIgMSAuNS42LjYuNSAxLjYtLjEgMi4xTDUgOS42Yy0uMy4zLS42LjQtMSAuNHptNy44LTguMXptLS42LS44eiIvPjwvc3ZnPg==);background-position:6px;background-repeat:no-repeat;background-size:13px;box-shadow:none}.navds-checkbox--small>.navds-checkbox__input:checked+.navds-checkbox__label:before{background-position:4px}.navds-checkbox__input:checked:focus-visible+.navds-checkbox__label:before,.navds-checkbox__input:indeterminate:focus-visible+.navds-checkbox__label:before{box-shadow:inset 0 0 0 1px var(--ac-radio-checkbox-bg,var(--a-surface-default)),var(--a-shadow-focus)}@supports not selector(:focus-visible){.navds-checkbox__input:checked:focus+.navds-checkbox__label:before,.navds-checkbox__input:indeterminate:focus+.navds-checkbox__label:before{box-shadow:inset 0 0 0 1px var(--ac-radio-checkbox-bg,var(--a-surface-default)),var(--a-shadow-focus)}}.navds-radio__input:checked+.navds-radio__label:before{background-color:var(--ac-radio-checkbox-action,var(--a-surface-action));box-shadow:inset 0 0 0 2px var(--ac-radio-checkbox-action,var(--a-surface-action)),inset 0 0 0 4px var(--ac-radio-checkbox-bg,var(--a-surface-default))}.navds-radio__input:checked:focus-visible+.navds-radio__label:before{box-shadow:inset 0 0 0 2px var(--ac-radio-checkbox-action,var(--a-surface-action)),inset 0 0 0 4px var(--ac-radio-checkbox-bg,var(--a-surface-default)),var(--a-shadow-focus)}@supports not selector(:focus-visible){.navds-radio__input:checked:focus+.navds-radio__label:before{box-shadow:inset 0 0 0 2px var(--ac-radio-checkbox-action,var(--a-surface-action)),inset 0 0 0 4px var(--ac-radio-checkbox-bg,var(--a-surface-default)),var(--a-shadow-focus)}}.navds-checkbox__input:hover:not(:disabled)+.navds-checkbox__label,.navds-radio__input:hover:not(:disabled)+.navds-radio__label{color:var(--ac-radio-checkbox-action,var(--a-surface-action))}.navds-checkbox__input:hover:not(:disabled):not(:checked):not(:indeterminate):not(:focus-visible)+.navds-checkbox__label:before,.navds-radio__input:hover:not(:disabled):not(:checked):not(:focus-visible)+.navds-radio__label:before{box-shadow:inset 0 0 0 2px var(--ac-radio-checkbox-action,var(--a-surface-action))}@supports not selector(:focus-visible){.navds-checkbox__input:hover:not(:disabled):not(:checked):not(:indeterminate):not(:focus)+.navds-checkbox__label:before,.navds-radio__input:hover:not(:disabled):not(:checked):not(:focus)+.navds-radio__label:before{box-shadow:inset 0 0 0 2px var(--ac-radio-checkbox-action,var(--a-surface-action))}}.navds-checkbox__input:hover:not(:disabled):not(:checked):not(:indeterminate)+.navds-checkbox__label:before,.navds-radio__input:hover:not(:disabled):not(:checked)+.navds-radio__label:before{background-color:var(--ac-radio-checkbox-action-hover-bg,var(--a-surface-action-subtle))}.navds-checkbox--error>.navds-checkbox__input:not(:hover):not(:disabled):not(:checked):not(:indeterminate)+.navds-checkbox__label:before,.navds-radio--error>.navds-radio__input:not(:hover):not(:disabled):not(:checked)+.navds-radio__label:before{box-shadow:inset 0 0 0 2px var(--ac-radio-checkbox-error-border,var(--a-border-danger))}.navds-checkbox--error>.navds-checkbox__input:focus-visible:not(:hover):not(:disabled):not(:checked):not(:indeterminate)+.navds-checkbox__label:before,.navds-radio--error>.navds-radio__input:focus-visible:not(:hover):not(:disabled):not(:checked)+.navds-radio__label:before{box-shadow:inset 0 0 0 2px var(--ac-radio-checkbox-error-border,var(--a-border-danger)),var(--a-shadow-focus)}@supports not selector(:focus-visible){.navds-checkbox--error>.navds-checkbox__input:focus:not(:hover):not(:disabled):not(:checked):not(:indeterminate)+.navds-checkbox__label:before,.navds-radio--error>.navds-radio__input:focus:not(:hover):not(:disabled):not(:checked)+.navds-radio__label:before{box-shadow:inset 0 0 0 2px var(--ac-radio-checkbox-error-border,var(--a-border-danger)),var(--a-shadow-focus)}}.navds-checkbox--error>.navds-checkbox__input:hover:not(:disabled):not(:checked):not(:indeterminate):not(:focus-visible)+.navds-checkbox__label:before,.navds-radio--error>.navds-radio__input:hover:not(:disabled):not(:checked):not(:focus-visible)+.navds-radio__label:before{background-color:var(--ac-radio-checkbox-error-hover-bg,var(--a-surface-danger-subtle));box-shadow:inset 0 0 0 2px var(--ac-radio-checkbox-error-border,var(--a-border-danger))}.navds-checkbox--error>.navds-checkbox__input:focus-visible:hover:not(:disabled):not(:checked):not(:indeterminate)+.navds-checkbox__label:before,.navds-radio--error>.navds-radio__input:focus-visible:hover:not(:disabled):not(:checked)+.navds-radio__label:before{background-color:var(--ac-radio-checkbox-error-hover-bg,var(--a-surface-danger-subtle));box-shadow:inset 0 0 0 2px var(--ac-radio-checkbox-error-border,var(--a-border-danger)),var(--a-shadow-focus)}@supports not selector(:focus-visible){.navds-checkbox--error>.navds-checkbox__input:hover:not(:disabled):not(:checked):not(:indeterminate):not(:focus)+.navds-checkbox__label:before,.navds-radio--error>.navds-radio__input:hover:not(:disabled):not(:checked):not(:focus)+.navds-radio__label:before{background-color:var(--ac-radio-checkbox-error-hover-bg,var(--a-surface-danger-subtle));box-shadow:inset 0 0 0 2px var(--ac-radio-checkbox-error-border,var(--a-border-danger))}.navds-checkbox--error>.navds-checkbox__input:focus:hover:not(:disabled):not(:checked):not(:indeterminate)+.navds-checkbox__label:before,.navds-radio--error>.navds-radio__input:focus:hover:not(:disabled):not(:checked)+.navds-radio__label:before{background-color:var(--ac-radio-checkbox-error-hover-bg,var(--a-surface-danger-subtle));box-shadow:inset 0 0 0 2px var(--ac-radio-checkbox-error-border,var(--a-border-danger)),var(--a-shadow-focus)}}.navds-checkbox--disabled,.navds-radio--disabled{opacity:.3}.navds-checkbox--disabled>.navds-checkbox__input,.navds-checkbox--disabled>.navds-checkbox__label,.navds-radio--disabled>.navds-radio__input,.navds-radio--disabled>.navds-radio__label{cursor:not-allowed}.navds-checkbox--readonly>:where(.navds-checkbox__input,.navds-checkbox__label),.navds-radio--readonly>:where(.navds-radio__input,.navds-radio__label){cursor:default}.navds-checkbox--readonly>.navds-checkbox__input:hover+.navds-checkbox__label,.navds-radio--readonly>.navds-radio__input:hover+.navds-radio__label{color:var(--a-text-default)}.navds-checkbox--readonly>.navds-checkbox__input:hover:not(:checked):not(:indeterminate):not(:focus-visible)+.navds-checkbox__label:before,.navds-checkbox--readonly>.navds-checkbox__input:not(:disabled):not(:checked):not(:indeterminate)+.navds-checkbox__label:before,.navds-radio--readonly>.navds-radio__input:hover:not(:checked):not(:indeterminate):not(:focus-visible)+.navds-radio__label:before,.navds-radio--readonly>.navds-radio__input:not(:disabled):not(:checked):not(:indeterminate)+.navds-radio__label:before{background-color:var(--__ac-radio-checkbox-readonly-bg);box-shadow:inset 0 0 0 2px var(--__ac-radio-checkbox-readonly-border)}.navds-checkbox--readonly>.navds-checkbox__input:focus-visible+.navds-checkbox__label:before,.navds-radio--readonly>.navds-radio__input:focus-visible+.navds-radio__label:before{--__ac-radio-checkbox-readonly-border:var(--a-border-subtle),var(--a-shadow-focus)}.navds-checkbox--readonly>.navds-checkbox__input:checked+.navds-checkbox__label:before{background-color:var(--__ac-radio-checkbox-readonly-bg);background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMyAxMCI+PHBhdGggZmlsbD0icmdiYSgwLCAwLCAwLCAwLjY1KSIgZD0iTTQgMTBjLS40IDAtLjgtLjEtMS4xLS40TC40IDcuMUMuMSA2LjggMCA2LjQgMCA2cy4yLS44LjUtMS4xYy41LS41IDEuNS0uNSAyIDBMNCA2LjRsNi40LTZjLjQtLjMuNy0uNCAxLjEtLjQuNCAwIC44LjIgMSAuNS42LjYuNSAxLjYtLjEgMi4xTDUgOS42Yy0uMy4zLS42LjQtMSAuNHptNy44LTguMXptLS42LS44eiIvPjwvc3ZnPg==);box-shadow:inset 0 0 0 2px var(--__ac-radio-checkbox-readonly-border)}.navds-radio--readonly>.navds-radio__input:checked+.navds-radio__label:before{background-color:var(--a-icon-subtle);box-shadow:inset 0 0 0 2px var(--__ac-radio-checkbox-readonly-border),inset 0 0 0 4px var(--__ac-radio-checkbox-readonly-bg)}.navds-checkbox--readonly>.navds-checkbox__input:indeterminate+.navds-checkbox__label:before{background-color:var(--__ac-radio-checkbox-readonly-bg);box-shadow:inset 0 0 0 2px var(--__ac-radio-checkbox-readonly-border)}.navds-checkbox--readonly>.navds-checkbox__input:indeterminate+.navds-checkbox__label:after{background-color:var(--a-icon-subtle)}.navds-select__input{-webkit-appearance:none;appearance:none;background-color:var(--ac-select-bg,var(--a-surface-default));border:1px solid var(--ac-select-border,var(--a-border-default));border-radius:var(--a-border-radius-medium);box-sizing:border-box;color:var(--ac-select-text,var(--a-text-default));display:inline-block;min-height:48px;padding:.5rem 2rem .5rem .5rem;position:relative;width:100%}.navds-select__input:hover{border-color:var(--ac-select-hover-bg,var(--a-border-action))}.navds-select__input:focus-visible{box-shadow:var(--a-shadow-focus);outline:none}@supports not selector(:focus-visible){.navds-select__input:focus{box-shadow:var(--a-shadow-focus);outline:none}}.navds-select__container{color:var(--a-text-default);display:flex;position:relative;width:100%}.navds-select__chevron{align-self:center;font-size:1.5rem;pointer-events:none;position:absolute;right:var(--a-spacing-2)}.navds-form-field--small .navds-select__input{min-height:32px;padding:0 2rem 0 .25rem}.navds-form-field--small .navds-select__chevron{right:.375rem}.navds-select--error>* select:not(:hover):not(:focus):not(:disabled){border-color:var(--ac-select-error-border,var(--a-surface-danger));box-shadow:0 0 0 1px var(--ac-select-error-border,var(--a-surface-danger))}.navds-select__input:disabled{background-color:var(--ac-select-bg,var(--a-surface-default));border:1px solid var(--ac-select-border,var(--a-border-default));box-shadow:none;color:var(--a-text-default);cursor:not-allowed;opacity:1}.navds-select__input:disabled>option{color:var(--a-text-default)}.navds-select--readonly .navds-select__input{background-color:var(--a-surface-subtle);border-color:var(--a-border-subtle);cursor:default}.navds-switch{min-height:48px;position:relative;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.navds-switch--right{width:auto}.navds-switch--small{min-height:32px;position:relative}.navds-switch__input{cursor:pointer;height:48px;opacity:0;position:absolute;top:0;width:48px;z-index:1}.navds-switch--small>.navds-switch__input{height:32px;top:0}.navds-switch__label-wrapper{color:var(--a-text-default);cursor:pointer}.navds-switch__content{display:flex;flex-direction:column;gap:.125rem;padding:.75rem 0 .75rem 3.25rem}.navds-switch--right>.navds-switch__label-wrapper>.navds-switch__content{padding:.75rem 3.25rem .75rem 0}.navds-switch--small>.navds-switch__label-wrapper>.navds-switch__content{padding:calc(var(--a-spacing-2) - 2px) 0 calc(var(--a-spacing-2) - 2px) 3.25rem}.navds-switch--right.navds-switch--small>.navds-switch__label-wrapper>.navds-switch__content{padding:calc(var(--a-spacing-2) - 2px) 3.25rem calc(var(--a-spacing-2) - 2px) 0}.navds-switch--small>.navds-switch__label-wrapper>.navds-switch--with-description,.navds-switch--with-description{padding-bottom:0}.navds-switch__input:hover~.navds-switch__label-wrapper,.navds-switch__label-wrapper:hover{color:var(--ac-switch-action,var(--a-surface-action))}.navds-switch__input:disabled:hover~.navds-switch__label-wrapper{color:inherit}.navds-switch__track{background-color:var(--ac-switch-bg,var(--a-surface-neutral));border-radius:var(--a-border-radius-full);height:24px;left:0;position:absolute;top:var(--a-spacing-3);transition:background-color .25s cubic-bezier(.4,0,.2,1);width:44px}.navds-switch--small>.navds-switch__track{top:var(--a-spacing-1)}.navds-switch--right>.navds-switch__input,.navds-switch--right>.navds-switch__track{left:auto;right:0}.navds-switch__input:checked~.navds-switch__track{background-color:var(--ac-switch-checked-bg,var(--a-surface-success))}.navds-switch__input:hover~.navds-switch__track{background-color:var(--ac-switch-hover-bg,var(--a-surface-neutral-hover))}.navds-switch__input:hover:checked~.navds-switch__track{background-color:var(--ac-switch-checked-hover-bg,var(--a-surface-success-hover))}.navds-switch__input:disabled~.navds-switch__track{background-color:var(--ac-switch-bg,var(--a-surface-neutral))}.navds-switch__input:checked:disabled~.navds-switch__track{background-color:var(--ac-switch-checked-bg,var(--a-border-success))}.navds-switch__input:focus-visible~.navds-switch__track{box-shadow:0 0 0 1px var(--a-surface-default),var(--a-shadow-focus)}@supports not selector(:focus-visible){.navds-switch__input:focus~.navds-switch__track{box-shadow:0 0 0 1px var(--a-surface-default),var(--a-shadow-focus)}}.navds-switch__thumb{align-items:center;background-color:var(--ac-switch-thumb-bg,var(--a-surface-default));border-radius:var(--a-border-radius-full);color:var(--ac-switch-thumb-icon,var(--a-icon-subtle));display:flex;height:20px;justify-content:center;left:2px;position:absolute;top:2px;-webkit-transform:translateX(0);transform:translateX(0);transition:-webkit-transform .25s cubic-bezier(.4,0,.2,1);transition:transform .25s cubic-bezier(.4,0,.2,1);transition:transform .25s cubic-bezier(.4,0,.2,1),-webkit-transform .25s cubic-bezier(.4,0,.2,1);width:20px}.navds-switch__input:checked~.navds-switch__track>.navds-switch__thumb{color:var(--ac-switch-thumb-icon-checked,var(--a-icon-success));-webkit-transform:translateX(20px);transform:translateX(20px)}@media (hover:hover) and (pointer:fine){.navds-switch__input:hover~.navds-switch__track>.navds-switch__thumb{-webkit-transform:translateX(2px);transform:translateX(2px)}.navds-switch__input:checked:hover~.navds-switch__track>.navds-switch__thumb{-webkit-transform:translateX(18px);transform:translateX(18px)}}.navds-switch__input:disabled:hover~.navds-switch__track>.navds-switch__thumb{-webkit-transform:translateX(0);transform:translateX(0)}.navds-switch__input:checked:disabled:hover~.navds-switch__track>.navds-switch__thumb{-webkit-transform:translateX(20px);transform:translateX(20px)}.navds-switch__input:checked~.navds-switch__track>.navds-switch__thumb .navds-loader__foreground{stroke:var(--ac-switch-thumb-icon-checked,var(--a-icon-success))}.navds-switch__input:disabled{-webkit-appearance:none;appearance:none}.navds-switch--disabled:not(.navds-switch--loading){opacity:.3}.navds-switch__input:disabled,.navds-switch__input:disabled~.navds-switch__label-wrapper{cursor:not-allowed}.navds-switch--readonly>.navds-switch__input:checked:hover~.navds-switch__track,.navds-switch--readonly>.navds-switch__input:checked~.navds-switch__track,.navds-switch--readonly>.navds-switch__input:hover~.navds-switch__track,.navds-switch--readonly>.navds-switch__track{background-color:var(--a-surface-neutral-moderate)}.navds-switch--readonly>.navds-switch__input,.navds-switch--readonly>.navds-switch__label-wrapper{cursor:default}.navds-switch--readonly .navds-switch__label-wrapper:hover,.navds-switch--readonly>.navds-switch__input:hover~.navds-switch__label-wrapper{color:var(--a-text-default)}.navds-switch--readonly .navds-switch__thumb{background-color:var(--a-surface-subtle);box-shadow:0 0 0 2px var(--a-border-default)}.navds-switch--readonly>.navds-switch__input:checked~.navds-switch__track>.navds-switch__thumb{color:var(--a-icon-subtle)}@media (hover:hover) and (pointer:fine){.navds-switch--readonly>.navds-switch__input:hover~.navds-switch__track>.navds-switch__thumb{-webkit-transform:translateX(0);transform:translateX(0)}.navds-switch--readonly>.navds-switch__input:checked:hover~.navds-switch__track>.navds-switch__thumb{-webkit-transform:translateX(20px);transform:translateX(20px)}}.navds-text-field__input{-webkit-appearance:none;appearance:none;background-color:var(--ac-textfield-bg,var(--a-surface-default));border:1px solid var(--ac-textfield-border,var(--a-border-default));border-radius:var(--a-border-radius-medium);color:var(--ac-textfield-text,var(--a-text-default));min-height:48px;padding:var(--a-spacing-2);width:100%}.navds-text-field__input[size]{width:auto}.navds-text-field__input::-webkit-input-placeholder{color:var(--ac-textfield-placeholder,var(--a-text-subtle))}.navds-text-field__input::placeholder{color:var(--ac-textfield-placeholder,var(--a-text-subtle))}.navds-form-field--small .navds-text-field__input{min-height:32px;padding:0 .5rem}.navds-text-field__input:hover{border-color:var(--ac-textfield-hover-border,var(--a-border-action))}.navds-text-field__input:focus-visible{box-shadow:var(--a-shadow-focus);outline:none}@supports not selector(:focus-visible){.navds-text-field__input:focus{box-shadow:var(--a-shadow-focus);outline:none}}.navds-text-field--error>.navds-text-field__input:not(:hover):not(:disabled){border-color:var(--ac-textfield-error-border,var(--a-border-danger));box-shadow:0 0 0 1px var(--ac-textfield-error-border,var(--a-border-danger))}.navds-text-field--error>.navds-text-field__input:focus-visible:not(:hover):not(:disabled){box-shadow:0 0 0 1px var(--a-border-danger),var(--a-shadow-focus)}@supports not selector(:focus-visible){.navds-text-field--error>.navds-text-field__input:focus:not(:hover):not(:disabled){box-shadow:0 0 0 1px var(--a-border-danger),var(--a-shadow-focus)}}.navds-text-field__input:disabled{background-color:var(--ac-textfield-bg,var(--a-surface-default));border-color:var(--ac-textfield-border,var(--a-border-default));box-shadow:none;cursor:not-allowed}.navds-text-field--readonly .navds-text-field__input{background-color:var(--a-surface-subtle);border-color:var(--a-border-subtle);cursor:default}.navds-text-field__input[type=search]::-webkit-search-cancel-button,.navds-text-field__input[type=search]::-webkit-search-decoration,.navds-text-field__input[type=search]::-webkit-search-results-button,.navds-text-field__input[type=search]::-webkit-search-results-decoration{-webkit-appearance:none}.navds-textarea__wrapper{position:relative;width:100%}.navds-textarea__input{-webkit-appearance:none;appearance:none;background-color:var(--ac-textarea-bg,var(--a-surface-default));border:1px solid var(--ac-textarea-border,var(--a-border-default));border-radius:var(--a-border-radius-medium);color:var(--ac-textarea-text,var(--a-text-default));display:block;padding:var(--a-spacing-2);resize:none;width:100%}.navds-textarea--counter{padding-bottom:var(--a-spacing-8)}.navds-textarea__input::-webkit-input-placeholder{color:var(--ac-textarea-placeholder,var(--a-text-subtle))}.navds-textarea__input::placeholder{color:var(--ac-textarea-placeholder,var(--a-text-subtle))}.navds-textarea__input:hover{border-color:var(--ac-textarea-hover-border,var(--a-border-action))}.navds-textarea__input:focus-visible{box-shadow:var(--a-shadow-focus);outline:none}@supports not selector(:focus-visible){.navds-textarea__input:focus{box-shadow:var(--a-shadow-focus);outline:none}}.navds-form-field--small .navds-textarea__input{padding:6px}.navds-form-field--small .navds-textarea--counter.navds-textarea__input{padding-bottom:var(--a-spacing-7)}.navds-textarea__counter{bottom:1px;color:var(--ac-textarea-counter-text,var(--a-text-subtle));font-style:italic;left:1px;padding:var(--a-spacing-1) var(--a-spacing-2);pointer-events:none;position:absolute;text-align:left}.navds-textarea__counter--error{color:var(--ac-textarea-counter-error-text,var(--a-text-danger))}.navds-textarea--resize .navds-textarea__input{resize:both}.navds-textarea--error .navds-textarea__input:not(:hover):not(:focus-visible):not(:disabled){border-color:var(--ac-textarea-error-border,var(--a-border-danger));box-shadow:0 0 0 1px var(--ac-textarea-error-border,var(--a-border-danger))}@supports not selector(:focus-visible){.navds-textarea--error .navds-textarea__input:not(:hover):not(:focus):not(:disabled){border-color:var(--ac-textarea-error-border,var(--a-border-danger));box-shadow:0 0 0 1px var(--ac-textarea-error-border,var(--a-border-danger))}}.navds-textarea__input:disabled{background-color:var(--ac-textarea-bg,var(--a-surface-default));border-color:var(--ac-textarea-border,var(--a-border-default));box-shadow:none;cursor:not-allowed}.navds-textarea--readonly .navds-textarea__input{background-color:var(--a-surface-subtle);border-color:var(--a-border-subtle);cursor:default}.navds-search{display:flex;flex-direction:column;width:100%}.navds-search__wrapper-inner{position:relative;width:100%}.navds-search--with-size :where(.navds-search__wrapper-inner){width:inherit}.navds-search__wrapper{align-items:center;display:inline-flex}.navds-search__input{padding-right:var(--a-spacing-10)}.navds-form-field--small .navds-search__input{padding-right:var(--a-spacing-8)}.navds-search__input--simple{padding-left:var(--a-spacing-11)}.navds-form-field--small .navds-search__input--simple{padding-left:var(--a-spacing-7)}.navds-search__input:not(.navds-search__input--simple){border-bottom-right-radius:0;border-top-right-radius:0}.navds-search__search-icon{font-size:1.5rem;left:var(--a-spacing-3);pointer-events:none;position:absolute;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.navds-form-field--small .navds-search__search-icon{font-size:1rem;left:var(--a-spacing-2)}.navds-search__button-clear{align-items:center;background:none;border:none;border-radius:var(--a-border-radius-medium);color:var(--ac-search-clear-icon,var(--a-text-default));cursor:pointer;display:flex;font-size:1.25rem;height:32px;justify-content:center;padding:0;position:absolute;right:.75rem;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);width:32px}.navds-form-field--small .navds-search__button-clear{height:24px;right:.5rem;width:24px}.navds-search__button-clear:hover{color:var(--ac-search-clear-icon-hover,var(--a-text-action))}.navds-search__button-clear:focus-visible{box-shadow:var(--a-shadow-focus);outline:none}@supports not selector(:focus-visible){.navds-search__button-clear:focus{box-shadow:var(--a-shadow-focus);outline:none}}.navds-search__button-search{border-radius:0;border-bottom-right-radius:var(--a-border-radius-medium);border-top-right-radius:var(--a-border-radius-medium);flex-shrink:0;min-height:32px;min-width:64px}.navds-form-field--small .navds-search__button-search svg{font-size:1rem}.navds-form-field--small .navds-search__button-search{min-width:40px}.navds-search__button-search.navds-button--secondary{box-shadow:-1px 0 0 0 var(--ac-search-button-border,var(--a-border-default)) inset,0 1px 0 0 var(--ac-search-button-border,var(--a-border-default)) inset,0 -1px 0 0 var(--ac-search-button-border,var(--a-border-default)) inset}.navds-search__button-search.navds-button--secondary:hover{box-shadow:-1px 0 0 0 var(--ac-search-button-border-hover,var(--a-border-action)) inset,0 1px 0 0 var(--ac-search-button-border-hover,var(--a-border-action)) inset,0 -1px 0 0 var(--ac-search-button-border-hover,var(--a-border-action)) inset,-1px 0 0 0 var(--ac-search-button-border-hover,var(--a-border-action));z-index:1}.navds-search__wrapper-inner:focus-within+.navds-search__button-search.navds-button--secondary:hover{z-index:auto}.navds-search__button-search.navds-button--secondary:focus-visible{box-shadow:0 0 0 1px var(--ac-search-button-border,var(--a-border-default)) inset,var(--a-shadow-focus)}.navds-search__button-search.navds-button--secondary:focus-visible:hover{box-shadow:0 0 0 1px var(--ac-search-button-border-hover,var(--a-border-action)) inset,var(--a-shadow-focus)}.navds-search__button-search.navds-button--secondary:focus-visible:active{box-shadow:0 0 0 1px var(--ac-search-button-focus-active-border,var(--a-surface-default)) inset,var(--a-shadow-focus)}@supports not selector(:focus-visible){.navds-search__button-search.navds-button--secondary:focus{box-shadow:0 0 0 1px var(--ac-search-button-border,var(--a-border-default)) inset,var(--a-shadow-focus)}.navds-search__button-search.navds-button--secondary:focus:hover{box-shadow:0 0 0 1px var(--ac-search-button-border-hover,var(--a-border-action)) inset,var(--a-shadow-focus)}.navds-search__button-search.navds-button--secondary:focus:active{box-shadow:0 0 0 1px var(--ac-search-button-focus-active-border,var(--a-surface-default)) inset,var(--a-shadow-focus)}}.navds-search--error .navds-search__input:not(:hover):not(:disabled){border-color:var(--ac-search-error-border,var(--a-border-danger));box-shadow:inset 0 0 0 1px var(--ac-search-error-border,var(--a-border-danger))}.navds-search--error .navds-search__input:focus-visible:not(:hover):not(:disabled){box-shadow:inset 0 0 0 1px var(--ac-search-error-border,var(--a-border-danger)),var(--a-shadow-focus)}.navds-search__button-clear,.navds-search__button-search:focus-visible,.navds-search__input:focus-visible{z-index:1}@supports not selector(:focus-visible){.navds-search--error .navds-search__input:focus:not(:hover):not(:disabled){box-shadow:inset 0 0 0 1px var(--ac-search-error-border,var(--a-border-danger)),var(--a-shadow-focus)}.navds-search__button-search:focus,.navds-search__input:focus{z-index:1}}
@@ -1,7 +1,7 @@
1
1
  @charset "UTF-8";
2
2
  /**
3
3
  * Do not edit directly
4
- * Generated on Thu, 29 Jun 2023 13:36:21 GMT
4
+ * Generated on Mon, 03 Jul 2023 11:26:04 GMT
5
5
  */
6
6
  :root, :host {
7
7
  --a-spacing-05: 0.125rem;
@@ -2416,6 +2416,11 @@ body,
2416
2416
  .navds-form-field__subdescription {
2417
2417
  color: var(--ac-form-subdescription, var(--a-text-subtle));
2418
2418
  }
2419
+ .navds-form-field__readonly-icon {
2420
+ margin-right: var(--a-spacing-2);
2421
+ vertical-align: middle;
2422
+ margin-bottom: 3px;
2423
+ }
2419
2424
  .navds-error-summary {
2420
2425
  background-color: var(--ac-error-summary-bg, var(--a-surface-default));
2421
2426
  padding: var(--a-spacing-5);
@@ -2494,6 +2499,9 @@ body,
2494
2499
  cursor: pointer;
2495
2500
  display: flex;
2496
2501
  gap: var(--a-spacing-2);
2502
+
2503
+ --__ac-radio-checkbox-readonly-bg: var(--a-surface-subtle);
2504
+ --__ac-radio-checkbox-readonly-border: var(--a-border-subtle);
2497
2505
  }
2498
2506
  .navds-checkbox__label::before,
2499
2507
  .navds-radio__label::before {
@@ -2562,7 +2570,7 @@ body,
2562
2570
  background-color: var(--ac-radio-checkbox-bg, var(--a-surface-default));
2563
2571
  width: 0.75rem;
2564
2572
  height: 0.25rem;
2565
- border-radius: 1px; /* Custom value OK */
2573
+ border-radius: 1px;
2566
2574
  flex-shrink: 0;
2567
2575
  }
2568
2576
  .navds-checkbox--small .navds-checkbox__input:indeterminate + .navds-checkbox__label::after {
@@ -2684,6 +2692,48 @@ body,
2684
2692
  .navds-radio--disabled > .navds-radio__label {
2685
2693
  cursor: not-allowed;
2686
2694
  }
2695
+ /* Readonly */
2696
+ .navds-checkbox--readonly > :where(.navds-checkbox__input, .navds-checkbox__label),
2697
+ .navds-radio--readonly > :where(.navds-radio__input, .navds-radio__label) {
2698
+ cursor: default;
2699
+ }
2700
+ .navds-checkbox--readonly > .navds-checkbox__input:hover + .navds-checkbox__label,
2701
+ .navds-radio--readonly > .navds-radio__input:hover + .navds-radio__label {
2702
+ color: var(--a-text-default);
2703
+ }
2704
+ .navds-checkbox--readonly
2705
+ > .navds-checkbox__input:not(:disabled):not(:checked):not(:indeterminate)
2706
+ + .navds-checkbox__label::before,
2707
+ .navds-checkbox--readonly
2708
+ > .navds-checkbox__input:hover:not(:checked):not(:indeterminate):not(:focus-visible)
2709
+ + .navds-checkbox__label::before,
2710
+ .navds-radio--readonly > .navds-radio__input:not(:disabled):not(:checked):not(:indeterminate) + .navds-radio__label::before,
2711
+ .navds-radio--readonly
2712
+ > .navds-radio__input:hover:not(:checked):not(:indeterminate):not(:focus-visible)
2713
+ + .navds-radio__label::before {
2714
+ background-color: var(--__ac-radio-checkbox-readonly-bg);
2715
+ box-shadow: inset 0 0 0 2px var(--__ac-radio-checkbox-readonly-border);
2716
+ }
2717
+ .navds-checkbox--readonly > .navds-checkbox__input:focus-visible + .navds-checkbox__label::before,
2718
+ .navds-radio--readonly > .navds-radio__input:focus-visible + .navds-radio__label::before {
2719
+ --__ac-radio-checkbox-readonly-border: var(--a-border-subtle), var(--a-shadow-focus);
2720
+ }
2721
+ .navds-checkbox--readonly > .navds-checkbox__input:checked + .navds-checkbox__label::before {
2722
+ background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMyAxMCI+ICAgIDxnPiAgICA8cGF0aCBmaWxsPSJyZ2JhKDAsIDAsIDAsIDAuNjUpIiBkPSJNNCwxMGMtMC40LDAtMC44LTAuMS0xLjEtMC40TDAuNCw3LjFDMC4xLDYuOCwwLDYuNCwwLDZzMC4yLTAuOCwwLjUtMS4xQzEsNC40LDIsNC40LDIuNSw0LjlMNCw2LjRsNi40LTYgICAgQzEwLjgsMC4xLDExLjEsMCwxMS41LDBjMC40LDAsMC44LDAuMiwxLDAuNWMwLjYsMC42LDAuNSwxLjYtMC4xLDIuMXYwTDUsOS42QzQuNyw5LjksNC40LDEwLDQsMTB6IE0xMS44LDEuOUwxMS44LDEuOSAgICBDMTEuOCwxLjksMTEuOCwxLjksMTEuOCwxLjl6IE0xMS4yLDEuMUMxMS4yLDEuMSwxMS4yLDEuMSwxMS4yLDEuMUwxMS4yLDEuMXoiLz4gICAgPC9nPjwvc3ZnPg==);
2723
+ box-shadow: inset 0 0 0 2px var(--__ac-radio-checkbox-readonly-border);
2724
+ background-color: var(--__ac-radio-checkbox-readonly-bg);
2725
+ }
2726
+ .navds-radio--readonly > .navds-radio__input:checked + .navds-radio__label::before {
2727
+ box-shadow: inset 0 0 0 2px var(--__ac-radio-checkbox-readonly-border), inset 0 0 0 4px var(--__ac-radio-checkbox-readonly-bg);
2728
+ background-color: var(--a-icon-subtle);
2729
+ }
2730
+ .navds-checkbox--readonly > .navds-checkbox__input:indeterminate + .navds-checkbox__label::before {
2731
+ box-shadow: inset 0 0 0 2px var(--__ac-radio-checkbox-readonly-border);
2732
+ background-color: var(--__ac-radio-checkbox-readonly-bg);
2733
+ }
2734
+ .navds-checkbox--readonly > .navds-checkbox__input:indeterminate + .navds-checkbox__label::after {
2735
+ background-color: var(--a-icon-subtle);
2736
+ }
2687
2737
  .navds-select__input {
2688
2738
  appearance: none;
2689
2739
  background-color: var(--ac-select-bg, var(--a-surface-default));
@@ -2755,6 +2805,11 @@ body,
2755
2805
  .navds-select__input:disabled > option {
2756
2806
  color: var(--a-text-default);
2757
2807
  }
2808
+ .navds-select--readonly .navds-select__input {
2809
+ background-color: var(--a-surface-subtle);
2810
+ border-color: var(--a-border-subtle);
2811
+ cursor: default;
2812
+ }
2758
2813
  .navds-switch {
2759
2814
  position: relative;
2760
2815
  min-height: 48px;
@@ -2904,6 +2959,37 @@ body,
2904
2959
  .navds-switch__input:disabled ~ .navds-switch__label-wrapper {
2905
2960
  cursor: not-allowed;
2906
2961
  }
2962
+ /* Readonly */
2963
+ .navds-switch--readonly > .navds-switch__track,
2964
+ .navds-switch--readonly > .navds-switch__input:hover ~ .navds-switch__track,
2965
+ .navds-switch--readonly > .navds-switch__input:checked ~ .navds-switch__track,
2966
+ .navds-switch--readonly > .navds-switch__input:checked:hover ~ .navds-switch__track {
2967
+ background-color: var(--a-surface-neutral-moderate);
2968
+ }
2969
+ .navds-switch--readonly > .navds-switch__label-wrapper,
2970
+ .navds-switch--readonly > .navds-switch__input {
2971
+ cursor: default;
2972
+ }
2973
+ .navds-switch--readonly > .navds-switch__input:hover ~ .navds-switch__label-wrapper,
2974
+ .navds-switch--readonly .navds-switch__label-wrapper:hover {
2975
+ color: var(--a-text-default);
2976
+ }
2977
+ .navds-switch--readonly .navds-switch__thumb {
2978
+ background-color: var(--a-surface-subtle);
2979
+ box-shadow: 0 0 0 2px var(--a-border-default);
2980
+ }
2981
+ .navds-switch--readonly > .navds-switch__input:checked ~ .navds-switch__track > .navds-switch__thumb {
2982
+ color: var(--a-icon-subtle);
2983
+ }
2984
+ @media (hover: hover) and (pointer: fine) {
2985
+ .navds-switch--readonly > .navds-switch__input:hover ~ .navds-switch__track > .navds-switch__thumb {
2986
+ transform: translateX(0);
2987
+ }
2988
+
2989
+ .navds-switch--readonly > .navds-switch__input:checked:hover ~ .navds-switch__track > .navds-switch__thumb {
2990
+ transform: translateX(20px);
2991
+ }
2992
+ }
2907
2993
  .navds-text-field__input {
2908
2994
  appearance: none;
2909
2995
  padding: var(--a-spacing-2);
@@ -2959,11 +3045,10 @@ body,
2959
3045
  box-shadow: none;
2960
3046
  cursor: not-allowed;
2961
3047
  }
2962
- .navds-text-field__input[readonly] {
2963
- background-color: var(--ac-textfield-bg, var(--a-surface-default));
2964
- border-color: var(--ac-textfield-border, var(--a-border-default));
2965
- box-shadow: none;
2966
- cursor: not-allowed;
3048
+ .navds-text-field--readonly .navds-text-field__input {
3049
+ background-color: var(--a-surface-subtle);
3050
+ border-color: var(--a-border-subtle);
3051
+ cursor: default;
2967
3052
  }
2968
3053
  /**
2969
3054
  * Removes default search icon
@@ -3049,11 +3134,10 @@ body,
3049
3134
  box-shadow: none;
3050
3135
  cursor: not-allowed;
3051
3136
  }
3052
- .navds-textarea__input[readonly] {
3053
- background-color: var(--ac-textarea-bg, var(--a-surface-default));
3054
- border-color: var(--ac-textarea-border, var(--a-border-default));
3055
- box-shadow: none;
3056
- cursor: not-allowed;
3137
+ .navds-textarea--readonly .navds-textarea__input {
3138
+ background-color: var(--a-surface-subtle);
3139
+ border-color: var(--a-border-subtle);
3140
+ cursor: default;
3057
3141
  }
3058
3142
  .navds-search {
3059
3143
  display: flex;
@@ -3881,6 +3965,10 @@ button.navds-internalheader__title:active,
3881
3965
  .navds-date__popover:where(.navds-popover) {
3882
3966
  border: none;
3883
3967
  }
3968
+ /* Readonly */
3969
+ .navds-date__field--readonly .navds-date__field-button {
3970
+ cursor: default;
3971
+ }
3884
3972
  .navds-tag {
3885
3973
  border: 1px solid;
3886
3974
  border-radius: var(--a-border-radius-small);