@inera/ids-design 6.0.3 → 6.1.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.
Files changed (40) hide show
  1. package/components/box-link/box-link-lit.js +1 -1
  2. package/components/box-link/box-link.css +1 -0
  3. package/components/dialog/dialog-lit.js +1 -1
  4. package/components/dialog/dialog.css +2 -0
  5. package/components/dropdown/dropdown-lit.js +1 -1
  6. package/components/dropdown/dropdown.css +0 -1
  7. package/components/form/error-message/error-message-lit.js +1 -1
  8. package/components/form/error-message/error-message.css +2 -1
  9. package/components/form/select-multiple/select-multiple-lit.js +1 -1
  10. package/components/form/select-multiple/select-multiple.css +35 -15
  11. package/components/header-1177/composite-header-1177.css +5 -5
  12. package/components/header-1177/header-1177-lit.js +1 -1
  13. package/components/header-1177/header-1177.css +5 -5
  14. package/components/mobile-menu/mobile-menu-lit.js +1 -1
  15. package/components/mobile-menu/mobile-menu.css +39 -17
  16. package/components/pagination/list-pagination/list-pagination-lit.js +1 -1
  17. package/components/pagination/list-pagination/list-pagination.css +8 -8
  18. package/components/popover/popover-lit.js +1 -1
  19. package/components/popover/popover.css +1 -0
  20. package/components/progressbar/progressbar-lit.js +1 -1
  21. package/components/progressbar/progressbar.css +7 -1
  22. package/components/side-menu/side-menu-lit.js +1 -1
  23. package/components/side-menu/side-menu.css +4 -2
  24. package/components/side-panel/side-panel-lit.js +1 -1
  25. package/components/side-panel/side-panel.css +0 -13
  26. package/components/stepper/stepper-lit.js +1 -1
  27. package/components/stepper/stepper.css +21 -9
  28. package/components/tabs/tab-lit.js +1 -1
  29. package/components/tabs/tab.css +10 -5
  30. package/components/tabs/tabs-lit.js +1 -1
  31. package/global/global.css +395 -84
  32. package/global/icons/font/Inera-Design-Icons.eot +0 -0
  33. package/global/icons/font/Inera-Design-Icons.svg +171 -3
  34. package/global/icons/font/Inera-Design-Icons.ttf +0 -0
  35. package/global/icons/font/Inera-Design-Icons.woff +0 -0
  36. package/package.json +1 -1
  37. package/themes/1177/1177.css +405 -95
  38. package/themes/1177-pro/1177-pro.css +405 -95
  39. package/themes/inera/inera.css +405 -95
  40. package/themes/inera-admin/inera-admin.css +405 -95
@@ -2488,11 +2488,20 @@ body.ids {
2488
2488
  font-size: 0.875rem;
2489
2489
  }
2490
2490
  .ids-link.ids-link--small.ids-link--start-icon {
2491
- padding-left: 1.25rem;
2491
+ padding-left: 1.125rem;
2492
+ }
2493
+ .ids-link.ids-link--small.ids-link--start-icon:before {
2494
+ font-size: 0.875rem;
2492
2495
  }
2493
2496
  .ids-link.ids-link--small.ids-link--end-icon {
2494
2497
  padding-right: 1.125rem;
2495
2498
  }
2499
+ .ids-link.ids-link--small.ids-link--end-icon:before {
2500
+ font-size: 0.875rem;
2501
+ }
2502
+ .ids-link.ids-link--large {
2503
+ text-decoration: none !important;
2504
+ }
2496
2505
  .ids-link.ids-link--large.ids-link--start-icon, .ids-link.ids-link--large.ids-link--end-icon {
2497
2506
  padding-left: 1.75rem;
2498
2507
  }
@@ -2500,6 +2509,9 @@ body.ids {
2500
2509
  font-size: 1.25rem;
2501
2510
  top: 0.0625rem !important;
2502
2511
  }
2512
+ .ids-link.ids-link--large:hover {
2513
+ text-decoration: none !important;
2514
+ }
2503
2515
  .ids-link.ids-link--block {
2504
2516
  display: flex;
2505
2517
  flex-grow: 1;
@@ -2537,6 +2549,12 @@ body.ids {
2537
2549
  .ids-link.ids-link--underlined:has(.ids-icon), .ids-link.ids-link--underlined.ids-link--start-icon, .ids-link.ids-link--underlined.ids-link--end-icon {
2538
2550
  text-decoration: underline !important;
2539
2551
  }
2552
+ .ids-link.ids-link--no-underline {
2553
+ text-decoration: none !important;
2554
+ }
2555
+ .ids-link.ids-link--no-underline:has(.ids-icon), .ids-link.ids-link--no-underline.ids-link--start-icon, .ids-link.ids-link--no-underline.ids-link--end-icon {
2556
+ text-decoration: none !important;
2557
+ }
2540
2558
  .ids-link.ids-link--active-icon {
2541
2559
  text-decoration: none !important;
2542
2560
  }
@@ -2721,10 +2739,16 @@ body.ids {
2721
2739
  -moz-user-select: none;
2722
2740
  -ms-user-select: none;
2723
2741
  }
2724
- .ids .ids-button:hover, .ids .ids-button.ids-button--active,
2742
+ .ids .ids-button:hover,
2725
2743
  .ids-button:hover,
2744
+ .ids button.ids-button:hover {
2745
+ background-color: var(--IDS-BUTTON--ACTIVE__BACKGROUND-COLOR);
2746
+ box-shadow: var(--IDS-BUTTON--ACTIVE__BOX-SHADOW);
2747
+ }
2748
+ .ids .ids-button:active, .ids .ids-button.ids-button--active,
2749
+ .ids-button:active,
2726
2750
  .ids-button.ids-button--active,
2727
- .ids button.ids-button:hover,
2751
+ .ids button.ids-button:active,
2728
2752
  .ids button.ids-button.ids-button--active {
2729
2753
  background-color: var(--IDS-BUTTON--ACTIVE__BACKGROUND-COLOR);
2730
2754
  box-shadow: var(--IDS-BUTTON--ACTIVE__BOX-SHADOW);
@@ -2735,14 +2759,6 @@ body.ids {
2735
2759
  outline: var(--IDS-FOCUS__OUTLINE);
2736
2760
  outline-offset: var(--IDS-FOCUS__OUTLINE-OFFSET) !important;
2737
2761
  }
2738
- .ids .ids-button:active,
2739
- .ids-button:active,
2740
- .ids button.ids-button:active {
2741
- background-color: var(--IDS-BUTTON--ACTIVE__BACKGROUND-COLOR);
2742
- box-shadow: var(--IDS-BUTTON--ACTIVE__BOX-SHADOW);
2743
- outline: var(--IDS-FOCUS__OUTLINE);
2744
- outline-offset: var(--IDS-FOCUS__OUTLINE-OFFSET) !important;
2745
- }
2746
2762
  .ids .ids-button.ids-button--s,
2747
2763
  .ids-button.ids-button--s,
2748
2764
  .ids button.ids-button.ids-button--s {
@@ -2789,14 +2805,12 @@ body.ids {
2789
2805
  background-color: var(--IDS-BUTTON--ACTIVE__BACKGROUND-COLOR);
2790
2806
  color: var(--IDS-COLOR-NEUTRAL-100);
2791
2807
  border: 0.063rem solid var(--IDS-BUTTON--ACTIVE__BACKGROUND-COLOR);
2792
- outline: var(--IDS-FOCUS__OUTLINE);
2793
- outline-offset: var(--IDS-FOCUS__OUTLINE-OFFSET) !important;
2794
2808
  }
2795
- .ids .ids-button.ids-button--secondary:hover, .ids .ids-button.ids-button--secondary.ids-button--active,
2796
- .ids-button.ids-button--secondary:hover,
2809
+ .ids .ids-button.ids-button--secondary.ids-button--active, .ids .ids-button.ids-button--secondary:active,
2797
2810
  .ids-button.ids-button--secondary.ids-button--active,
2798
- .ids button.ids-button.ids-button--secondary:hover,
2799
- .ids button.ids-button.ids-button--secondary.ids-button--active {
2811
+ .ids-button.ids-button--secondary:active,
2812
+ .ids button.ids-button.ids-button--secondary.ids-button--active,
2813
+ .ids button.ids-button.ids-button--secondary:active {
2800
2814
  background-color: var(--IDS-BUTTON--ACTIVE__BACKGROUND-COLOR);
2801
2815
  color: var(--IDS-COLOR-NEUTRAL-100);
2802
2816
  }
@@ -2806,14 +2820,6 @@ body.ids {
2806
2820
  outline: var(--IDS-FOCUS__OUTLINE);
2807
2821
  outline-offset: var(--IDS-FOCUS__OUTLINE-OFFSET) !important;
2808
2822
  }
2809
- .ids .ids-button.ids-button--secondary:active,
2810
- .ids-button.ids-button--secondary:active,
2811
- .ids button.ids-button.ids-button--secondary:active {
2812
- background-color: var(--IDS-BUTTON--ACTIVE__BACKGROUND-COLOR);
2813
- color: var(--IDS-COLOR-NEUTRAL-100);
2814
- outline: var(--IDS-FOCUS__OUTLINE);
2815
- outline-offset: var(--IDS-FOCUS__OUTLINE-OFFSET) !important;
2816
- }
2817
2823
  .ids .ids-button.ids-button--tertiary,
2818
2824
  .ids-button.ids-button--tertiary,
2819
2825
  .ids button.ids-button.ids-button--tertiary {
@@ -2837,29 +2843,27 @@ body.ids {
2837
2843
  line-height: var(--IDS-BUTTON--L__LINE-HEIGHT);
2838
2844
  padding: var(--IDS-BUTTON--L__PADDING);
2839
2845
  }
2840
- .ids .ids-button.ids-button--tertiary:hover, .ids .ids-button.ids-button--tertiary.ids-button--active,
2846
+ .ids .ids-button.ids-button--tertiary:hover,
2841
2847
  .ids-button.ids-button--tertiary:hover,
2842
- .ids-button.ids-button--tertiary.ids-button--active,
2843
- .ids button.ids-button.ids-button--tertiary:hover,
2844
- .ids button.ids-button.ids-button--tertiary.ids-button--active {
2848
+ .ids button.ids-button.ids-button--tertiary:hover {
2845
2849
  background-color: var(--IDS-BUTTON--ACTIVE__BACKGROUND-COLOR);
2846
2850
  color: var(--IDS-COLOR-NEUTRAL-100);
2847
2851
  border-radius: var(--IDS-BUTTON__BORDER-RADIUS);
2848
2852
  border: 0.063rem solid var(--IDS-BUTTON--ACTIVE__BACKGROUND-COLOR);
2849
2853
  }
2850
- .ids .ids-button.ids-button--tertiary:focus,
2851
- .ids-button.ids-button--tertiary:focus,
2852
- .ids button.ids-button.ids-button--tertiary:focus {
2853
- outline: var(--IDS-FOCUS__OUTLINE);
2854
- outline-offset: var(--IDS-FOCUS__OUTLINE-OFFSET) !important;
2855
- }
2856
- .ids .ids-button.ids-button--tertiary:active,
2854
+ .ids .ids-button.ids-button--tertiary:active, .ids .ids-button.ids-button--tertiary.ids-button--active,
2857
2855
  .ids-button.ids-button--tertiary:active,
2858
- .ids button.ids-button.ids-button--tertiary:active {
2856
+ .ids-button.ids-button--tertiary.ids-button--active,
2857
+ .ids button.ids-button.ids-button--tertiary:active,
2858
+ .ids button.ids-button.ids-button--tertiary.ids-button--active {
2859
2859
  background-color: var(--IDS-BUTTON--ACTIVE__BACKGROUND-COLOR);
2860
2860
  color: var(--IDS-COLOR-NEUTRAL-100);
2861
2861
  border-radius: var(--IDS-BUTTON__BORDER-RADIUS);
2862
2862
  border: 0.063rem solid var(--IDS-BUTTON--ACTIVE__BACKGROUND-COLOR);
2863
+ }
2864
+ .ids .ids-button.ids-button--tertiary:focus,
2865
+ .ids-button.ids-button--tertiary:focus,
2866
+ .ids button.ids-button.ids-button--tertiary:focus {
2863
2867
  outline: var(--IDS-FOCUS__OUTLINE);
2864
2868
  outline-offset: var(--IDS-FOCUS__OUTLINE-OFFSET) !important;
2865
2869
  }
@@ -2927,10 +2931,16 @@ body.ids {
2927
2931
  .ids button.ids-button.ids-button--icon.ids-button--secondary {
2928
2932
  background-color: var(--IDS-BUTTON--SECONDARY__ICON-BACKGROUND-COLOR);
2929
2933
  }
2930
- .ids .ids-button.ids-button--icon:hover, .ids .ids-button.ids-button--icon.ids-button--active,
2934
+ .ids .ids-button.ids-button--icon:hover,
2931
2935
  .ids-button.ids-button--icon:hover,
2936
+ .ids button.ids-button.ids-button--icon:hover {
2937
+ background-color: var(--IDS-BUTTON--ACTIVE__BACKGROUND-COLOR);
2938
+ color: var(--IDS-COLOR-NEUTRAL-100);
2939
+ }
2940
+ .ids .ids-button.ids-button--icon:active, .ids .ids-button.ids-button--icon.ids-button--active,
2941
+ .ids-button.ids-button--icon:active,
2932
2942
  .ids-button.ids-button--icon.ids-button--active,
2933
- .ids button.ids-button.ids-button--icon:hover,
2943
+ .ids button.ids-button.ids-button--icon:active,
2934
2944
  .ids button.ids-button.ids-button--icon.ids-button--active {
2935
2945
  background-color: var(--IDS-BUTTON--ACTIVE__BACKGROUND-COLOR);
2936
2946
  color: var(--IDS-COLOR-NEUTRAL-100);
@@ -2941,14 +2951,6 @@ body.ids {
2941
2951
  outline: var(--IDS-FOCUS__OUTLINE);
2942
2952
  outline-offset: var(--IDS-FOCUS__OUTLINE-OFFSET) !important;
2943
2953
  }
2944
- .ids .ids-button.ids-button--icon:active,
2945
- .ids-button.ids-button--icon:active,
2946
- .ids button.ids-button.ids-button--icon:active {
2947
- background-color: var(--IDS-BUTTON--ACTIVE__BACKGROUND-COLOR);
2948
- color: var(--IDS-COLOR-NEUTRAL-100);
2949
- outline: var(--IDS-FOCUS__OUTLINE);
2950
- outline-offset: var(--IDS-FOCUS__OUTLINE-OFFSET) !important;
2951
- }
2952
2954
  .ids .ids-button.ids-button--submit,
2953
2955
  .ids-button.ids-button--submit,
2954
2956
  .ids button.ids-button.ids-button--submit {
@@ -3027,16 +3029,6 @@ body.ids {
3027
3029
  align-items: flex-start;
3028
3030
  gap: 0.5rem;
3029
3031
  margin-bottom: 0.25rem;
3030
- margin-right: 0.25rem;
3031
- }
3032
- .ids-radio .ids-label-tooltip-wrapper {
3033
- margin-bottom: -0.25rem;
3034
- }
3035
- .ids-radio .ids-label-tooltip-wrapper label {
3036
- display: inline;
3037
- top: -0.188rem;
3038
- position: relative;
3039
- margin-right: 0.25rem;
3040
3032
  }
3041
3033
  .ids-radio input,
3042
3034
  .ids-radio input[type=radio] {
@@ -3141,16 +3133,6 @@ body.ids {
3141
3133
  align-items: flex-start;
3142
3134
  gap: 0.5rem;
3143
3135
  margin-bottom: 0.25rem;
3144
- margin-right: 0.25rem;
3145
- }
3146
- .ids-checkbox .ids-label-tooltip-wrapper {
3147
- margin-bottom: -0.25rem;
3148
- }
3149
- .ids-checkbox .ids-label-tooltip-wrapper label {
3150
- display: inline;
3151
- top: -0.188rem;
3152
- position: relative;
3153
- margin-right: 0.25rem;
3154
3136
  }
3155
3137
  .ids-checkbox input[type=checkbox],
3156
3138
  .ids-checkbox input {
@@ -3224,8 +3206,9 @@ input:focus + .ids-checkbox input::before {
3224
3206
  .ids-checkbox input.ids-input--invalid:checked::after {
3225
3207
  color: var(--IDS-ICON--INVALID-COLOR);
3226
3208
  }
3227
- .ids-checkbox input[type=checkbox].ids-input--invalid::before,
3228
- .ids-checkbox input.ids-input--invalid::before {
3209
+ .ids-checkbox input[type=checkbox].ids-input--invalid::before, .ids-checkbox input[type=checkbox][aria-invalid=true]::before,
3210
+ .ids-checkbox input.ids-input--invalid::before,
3211
+ .ids-checkbox input[aria-invalid=true]::before {
3229
3212
  border: var(--IDS-FORM--INVALID__BORDER);
3230
3213
  box-shadow: inset 0 0 0 0.0625rem var(--IDS-FORM--INVALID__BORDER-COLOR);
3231
3214
  background-color: var(--IDS-FORM--INVALID__BACKGROUND-COLOR);
@@ -3234,8 +3217,9 @@ input:focus + .ids-checkbox input::before {
3234
3217
  .ids-checkbox.ids-checkbox--light input::before {
3235
3218
  background-color: var(--IDS-COLOR-NEUTRAL-100);
3236
3219
  }
3237
- .ids-checkbox.ids-checkbox--light input[type=checkbox].ids-input--invalid::before,
3238
- .ids-checkbox.ids-checkbox--light input.ids-input--invalid::before {
3220
+ .ids-checkbox.ids-checkbox--light input[type=checkbox].ids-input--invalid::before, .ids-checkbox.ids-checkbox--light input[type=checkbox][aria-invalid=true]::before,
3221
+ .ids-checkbox.ids-checkbox--light input.ids-input--invalid::before,
3222
+ .ids-checkbox.ids-checkbox--light input[aria-invalid=true]::before {
3239
3223
  background-color: var(--IDS-FORM--INVALID__BACKGROUND-COLOR);
3240
3224
  }
3241
3225
  .ids-checkbox.ids-checkbox--block {
@@ -3576,7 +3560,7 @@ input.ids-range:disabled::-ms-thumb {
3576
3560
  .ids-select.ids-input--light.ids-input--invalid {
3577
3561
  background-color: var(--IDS-FORM--INVALID__BACKGROUND-COLOR);
3578
3562
  }
3579
- .ids-select.ids-input--invalid {
3563
+ .ids-select.ids-input--invalid, .ids-select[aria-invalid=true] {
3580
3564
  background: var(--IDS-FORM--INVALID__BACKGROUND-COLOR);
3581
3565
  border: var(--IDS-FORM--INVALID__BORDER);
3582
3566
  box-shadow: inset 0 0 0 0.0625rem var(--IDS-FORM--INVALID__BORDER-COLOR);
@@ -3584,7 +3568,7 @@ input.ids-range:disabled::-ms-thumb {
3584
3568
  .ids-select.ids-input--light {
3585
3569
  background-color: var(--IDS-COLOR-NEUTRAL-100);
3586
3570
  }
3587
- .ids-select.ids-input--light.ids-input--invalid {
3571
+ .ids-select.ids-input--light.ids-input--invalid, .ids-select.ids-input--light[aria-invalid=true] {
3588
3572
  background: var(--IDS-FORM--INVALID__BACKGROUND-COLOR);
3589
3573
  border: var(--IDS-FORM--INVALID__BORDER);
3590
3574
  box-shadow: inset 0 0 0 0.0625rem var(--IDS-FORM--INVALID__BORDER-COLOR);
@@ -3630,7 +3614,7 @@ input.ids-range:disabled::-ms-thumb {
3630
3614
  transform: translateY(-50%);
3631
3615
  right: var(--IDS-INPUT__ICON-RIGHT);
3632
3616
  }
3633
- .ids-select-wrapper:has(.ids-input--invalid)::after {
3617
+ .ids-select-wrapper:has(.ids-input--invalid)::after, .ids-select-wrapper:has([aria-invalid=true])::after {
3634
3618
  color: var(--IDS-ICON--INVALID-COLOR);
3635
3619
  }
3636
3620
  .ids-select-wrapper:has(select:disabled)::after, .ids-select-wrapper:has([aria-disabled=true])::after {
@@ -3816,16 +3800,6 @@ input.ids-time__input:disabled {
3816
3800
  align-items: flex-start;
3817
3801
  gap: 0.5rem;
3818
3802
  margin-bottom: 0.25rem;
3819
- margin-right: 0;
3820
- }
3821
- .ids-toggle .ids-label-tooltip-wrapper {
3822
- margin-bottom: -0.25rem;
3823
- }
3824
- .ids-toggle .ids-label-tooltip-wrapper label {
3825
- display: inline;
3826
- top: -0.188rem;
3827
- position: relative;
3828
- margin-right: 0;
3829
3803
  }
3830
3804
  .ids-toggle label {
3831
3805
  position: relative;
@@ -3849,6 +3823,7 @@ input.ids-time__input:disabled {
3849
3823
  border: 0.063rem solid transparent;
3850
3824
  border-radius: 6.25rem;
3851
3825
  appearance: none;
3826
+ flex-shrink: 0;
3852
3827
  }
3853
3828
  .ids-toggle input[type=checkbox]:before,
3854
3829
  .ids-toggle input:before {
@@ -4385,6 +4360,342 @@ input:focus + .ids-toggle input:before {
4385
4360
  position: absolute;
4386
4361
  }
4387
4362
 
4363
+ .ids-icon-download-small:before {
4364
+ content: "\e99a";
4365
+ }
4366
+
4367
+ .ids-icon-copy-link:before {
4368
+ content: "\e99b";
4369
+ }
4370
+
4371
+ .ids-icon-activity:before {
4372
+ content: "\e948";
4373
+ }
4374
+
4375
+ .ids-icon-alarm:before {
4376
+ content: "\e949";
4377
+ }
4378
+
4379
+ .ids-icon-archive:before {
4380
+ content: "\e94a";
4381
+ }
4382
+
4383
+ .ids-icon-bookmark:before {
4384
+ content: "\e94b";
4385
+ }
4386
+
4387
+ .ids-icon-call-ongoing:before {
4388
+ content: "\e94c";
4389
+ }
4390
+
4391
+ .ids-icon-call:before {
4392
+ content: "\e94d";
4393
+ }
4394
+
4395
+ .ids-icon-camera-off:before {
4396
+ content: "\e94e";
4397
+ }
4398
+
4399
+ .ids-icon-camera-on:before {
4400
+ content: "\e94f";
4401
+ }
4402
+
4403
+ .ids-icon-camera-switch:before {
4404
+ content: "\e950";
4405
+ }
4406
+
4407
+ .ids-icon-chart-bar:before {
4408
+ content: "\e951";
4409
+ }
4410
+
4411
+ .ids-icon-chart-line:before {
4412
+ content: "\e952";
4413
+ }
4414
+
4415
+ .ids-icon-chat:before {
4416
+ content: "\e953";
4417
+ }
4418
+
4419
+ .ids-icon-clipboard-with-cross:before {
4420
+ content: "\e954";
4421
+ }
4422
+
4423
+ .ids-icon-clipboard-with-text:before {
4424
+ content: "\e955";
4425
+ }
4426
+
4427
+ .ids-icon-clipboard:before {
4428
+ content: "\e956";
4429
+ }
4430
+
4431
+ .ids-icon-copy-file:before {
4432
+ content: "\e957";
4433
+ }
4434
+
4435
+ .ids-icon-denied-small:before {
4436
+ content: "\e958";
4437
+ }
4438
+
4439
+ .ids-icon-denied:before {
4440
+ content: "\e959";
4441
+ }
4442
+
4443
+ .ids-icon-desktop:before {
4444
+ content: "\e95a";
4445
+ }
4446
+
4447
+ .ids-icon-doctors-bag:before {
4448
+ content: "\e95b";
4449
+ }
4450
+
4451
+ .ids-icon-document:before {
4452
+ content: "\e95c";
4453
+ }
4454
+
4455
+ .ids-icon-download:before {
4456
+ content: "\e95d";
4457
+ }
4458
+
4459
+ .ids-icon-e-mail-sent:before {
4460
+ content: "\e95e";
4461
+ }
4462
+
4463
+ .ids-icon-e-mail-unread:before {
4464
+ content: "\e95f";
4465
+ }
4466
+
4467
+ .ids-icon-e-mail:before {
4468
+ content: "\e960";
4469
+ }
4470
+
4471
+ .ids-icon-edit:before {
4472
+ content: "\e961";
4473
+ }
4474
+
4475
+ .ids-icon-error-filled:before {
4476
+ content: "\e962";
4477
+ }
4478
+
4479
+ .ids-icon-error:before {
4480
+ content: "\e963";
4481
+ }
4482
+
4483
+ .ids-icon-file-csv:before {
4484
+ content: "\e964";
4485
+ }
4486
+
4487
+ .ids-icon-file-excel:before {
4488
+ content: "\e965";
4489
+ }
4490
+
4491
+ .ids-icon-file-image:before {
4492
+ content: "\e966";
4493
+ }
4494
+
4495
+ .ids-icon-file-other:before {
4496
+ content: "\e967";
4497
+ }
4498
+
4499
+ .ids-icon-file-pdf:before {
4500
+ content: "\e968";
4501
+ }
4502
+
4503
+ .ids-icon-file-ppt:before {
4504
+ content: "\e969";
4505
+ }
4506
+
4507
+ .ids-icon-file-word:before {
4508
+ content: "\e96a";
4509
+ }
4510
+
4511
+ .ids-icon-find-care:before {
4512
+ content: "\e96b";
4513
+ }
4514
+
4515
+ .ids-icon-flag:before {
4516
+ content: "\e96c";
4517
+ }
4518
+
4519
+ .ids-icon-folder:before {
4520
+ content: "\e96d";
4521
+ }
4522
+
4523
+ .ids-icon-form-numbered-reoccurring:before {
4524
+ content: "\e96e";
4525
+ }
4526
+
4527
+ .ids-icon-form-numbered:before {
4528
+ content: "\e96f";
4529
+ }
4530
+
4531
+ .ids-icon-functions:before {
4532
+ content: "\e970";
4533
+ }
4534
+
4535
+ .ids-icon-headphones:before {
4536
+ content: "\e971";
4537
+ }
4538
+
4539
+ .ids-icon-hourglass-end:before {
4540
+ content: "\e972";
4541
+ }
4542
+
4543
+ .ids-icon-hourglass-start:before {
4544
+ content: "\e973";
4545
+ }
4546
+
4547
+ .ids-icon-hourglass:before {
4548
+ content: "\e974";
4549
+ }
4550
+
4551
+ .ids-icon-house:before {
4552
+ content: "\e975";
4553
+ }
4554
+
4555
+ .ids-icon-id-card-locked:before {
4556
+ content: "\e976";
4557
+ }
4558
+
4559
+ .ids-icon-id-card:before {
4560
+ content: "\e977";
4561
+ }
4562
+
4563
+ .ids-icon-image:before {
4564
+ content: "\e978";
4565
+ }
4566
+
4567
+ .ids-icon-inactivity:before {
4568
+ content: "\e979";
4569
+ }
4570
+
4571
+ .ids-icon-lightbulb:before {
4572
+ content: "\e97a";
4573
+ }
4574
+
4575
+ .ids-icon-list:before {
4576
+ content: "\e97b";
4577
+ }
4578
+
4579
+ .ids-icon-listen:before {
4580
+ content: "\e97c";
4581
+ }
4582
+
4583
+ .ids-icon-locked:before {
4584
+ content: "\e97d";
4585
+ }
4586
+
4587
+ .ids-icon-log-locked:before {
4588
+ content: "\e97e";
4589
+ }
4590
+
4591
+ .ids-icon-log:before {
4592
+ content: "\e97f";
4593
+ }
4594
+
4595
+ .ids-icon-mobile:before {
4596
+ content: "\e980";
4597
+ }
4598
+
4599
+ .ids-icon-moment-start:before {
4600
+ content: "\e981";
4601
+ }
4602
+
4603
+ .ids-icon-moment-stop:before {
4604
+ content: "\e982";
4605
+ }
4606
+
4607
+ .ids-icon-office-building:before {
4608
+ content: "\e983";
4609
+ }
4610
+
4611
+ .ids-icon-organization:before {
4612
+ content: "\e984";
4613
+ }
4614
+
4615
+ .ids-icon-prescription:before {
4616
+ content: "\e985";
4617
+ }
4618
+
4619
+ .ids-icon-print:before {
4620
+ content: "\e986";
4621
+ }
4622
+
4623
+ .ids-icon-settings:before {
4624
+ content: "\e987";
4625
+ }
4626
+
4627
+ .ids-icon-shield-locked-filled:before {
4628
+ content: "\e988";
4629
+ }
4630
+
4631
+ .ids-icon-shield-locked-outlined:before {
4632
+ content: "\e989";
4633
+ }
4634
+
4635
+ .ids-icon-social-facebook:before {
4636
+ content: "\e98a";
4637
+ }
4638
+
4639
+ .ids-icon-social-linkedin:before {
4640
+ content: "\e98b";
4641
+ }
4642
+
4643
+ .ids-icon-social-x:before {
4644
+ content: "\e98c";
4645
+ }
4646
+
4647
+ .ids-icon-switch-person:before {
4648
+ content: "\e98d";
4649
+ }
4650
+
4651
+ .ids-icon-toggle-card-view:before {
4652
+ content: "\e98e";
4653
+ }
4654
+
4655
+ .ids-icon-toggle-list-view:before {
4656
+ content: "\e98f";
4657
+ }
4658
+
4659
+ .ids-icon-trash-can:before {
4660
+ content: "\e990";
4661
+ }
4662
+
4663
+ .ids-icon-tube-analysis:before {
4664
+ content: "\e991";
4665
+ }
4666
+
4667
+ .ids-icon-tube-empty:before {
4668
+ content: "\e992";
4669
+ }
4670
+
4671
+ .ids-icon-tube-filled:before {
4672
+ content: "\e993";
4673
+ }
4674
+
4675
+ .ids-icon-unlocked:before {
4676
+ content: "\e994";
4677
+ }
4678
+
4679
+ .ids-icon-video-off:before {
4680
+ content: "\e995";
4681
+ }
4682
+
4683
+ .ids-icon-video-on:before {
4684
+ content: "\e996";
4685
+ }
4686
+
4687
+ .ids-icon-video-switch:before {
4688
+ content: "\e997";
4689
+ }
4690
+
4691
+ .ids-icon-visibility-off:before {
4692
+ content: "\e998";
4693
+ }
4694
+
4695
+ .ids-icon-visibility:before {
4696
+ content: "\e999";
4697
+ }
4698
+
4388
4699
  .ids-icon-arrow-link:before {
4389
4700
  content: "\e947";
4390
4701
  }
@@ -4910,7 +5221,6 @@ input[type=search]::-webkit-search-results-decoration {
4910
5221
  --IDS-FORM-INERA__BORDER-RADIUS: 0.188rem;
4911
5222
  /* Error message */
4912
5223
  --IDS-ERROR-MESSAGE__COLOR: var(--IDS-COLOR-ERROR-40);
4913
- --IDS-ERROR-MESSAGE__MARGIN-TOP: 0.8rem;
4914
5224
  --IDS-ERROR-MESSAGE__BACKGROUND-COLOR: var(--IDS-COLOR-NEUTRAL-100);
4915
5225
  --IDS-ERROR-MESSAGE__BORDER-COLOR: var(--IDS-COLOR-ERROR-40);
4916
5226
  --IDS-ERROR-MESSAGE__BORDER: 0.063rem solid var(--IDS-ERROR-MESSAGE__BORDER-COLOR);
@@ -5410,7 +5720,6 @@ ids-input input[type=search]::-webkit-search-results-decoration {
5410
5720
  }
5411
5721
 
5412
5722
  .ids-label {
5413
- display: inline-block;
5414
5723
  color: var(--IDS-FORM-LABEL__COLOR);
5415
5724
  font-family: var(--IDS-FORM-LABEL__FONT-FAMILY);
5416
5725
  font-size: var(--IDS-FORM-LABEL__FONT-SIZE);
@@ -5423,7 +5732,7 @@ ids-input input[type=search]::-webkit-search-results-decoration {
5423
5732
  margin-bottom: 0.25rem;
5424
5733
  }
5425
5734
  .ids-label.ids-label--clickable {
5426
- cursor: pointer;
5735
+ cursor: pointer !important;
5427
5736
  }
5428
5737
  .ids-label.ids-label--disabled {
5429
5738
  font-style: italic;
@@ -5434,21 +5743,22 @@ ids-input input[type=search]::-webkit-search-results-decoration {
5434
5743
  display: none;
5435
5744
  }
5436
5745
 
5437
- .ids-label-wrapper {
5746
+ .ids-label-tooltip-wrapper {
5438
5747
  display: inline-flex;
5439
5748
  align-items: flex-start;
5440
5749
  gap: 0.5rem;
5441
- margin-bottom: 0.25rem;
5442
- margin-right: 0.25rem;
5443
5750
  }
5444
- .ids-label-wrapper .ids-label-tooltip-wrapper {
5445
- margin-bottom: -0.25rem;
5751
+ .ids-label-tooltip-wrapper.ids-label-tooltip-wrapper--block {
5752
+ width: 100%;
5753
+ }
5754
+ .ids-label-tooltip-wrapper.ids-label-tooltip-wrapper--inline {
5755
+ display: inline;
5446
5756
  }
5447
- .ids-label-wrapper .ids-label-tooltip-wrapper label {
5757
+ .ids-label-tooltip-wrapper.ids-label-tooltip-wrapper--inline label {
5448
5758
  display: inline;
5449
- top: -0.188rem;
5759
+ margin-right: 0.5rem;
5450
5760
  position: relative;
5451
- margin-right: 0.25rem;
5761
+ top: -0.1875rem;
5452
5762
  }
5453
5763
 
5454
5764
  .ids-show-inera {