@entur/form 9.0.1 → 9.0.2-beta.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 (2) hide show
  1. package/dist/styles.css +2035 -1703
  2. package/package.json +6 -6
package/dist/styles.css CHANGED
@@ -1,1777 +1,2109 @@
1
- /* DO NOT CHANGE!*/
2
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
3
- /* DO NOT CHANGE!*/
4
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
5
- /* DO NOT CHANGE!*/
6
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
7
1
  [data-color-mode=light],
8
- :root {
9
- --components-form-baseform-contrast-border-default: #8284ab;
10
- --components-form-baseform-contrast-border-interactive: #aeb7e2;
11
- --components-form-baseform-contrast-border-negative: #ff9494;
12
- --components-form-baseform-contrast-border-success: #5ac39a;
13
- --components-form-baseform-contrast-fill-default: #ffffff;
14
- --components-form-baseform-contrast-fill-disabled: rgba(207, 210, 212, 0.1490196078);
15
- --components-form-baseform-contrast-fill-readonly: rgba(255, 255, 255, 0);
16
- --components-form-baseform-contrast-icon: #181c56;
17
- --components-form-baseform-contrast-iconbeta: #ffffff;
18
- --components-form-baseform-contrast-icon-disabled: #6e6f73;
19
- --components-form-baseform-contrast-icon-disabledbeta: #b6b8ba;
20
- --components-form-baseform-contrast-text-content: #181c56;
21
- --components-form-baseform-contrast-text-content-readonly: #ffffff;
22
- --components-form-baseform-contrast-text-description: #ffffff;
23
- --components-form-baseform-contrast-text-label: #626493;
24
- --components-form-baseform-contrast-text-labelbeta: #ffffff;
25
- --components-form-baseform-contrast-text-disabled: #6e6f73;
26
- --components-form-baseform-contrast-text-disabledbeta: #b6b8ba;
27
- --components-form-baseform-standard-border-default: #8284ab;
28
- --components-form-baseform-standard-border-interactive: #181c56;
29
- --components-form-baseform-standard-border-negative: #d31b1b;
30
- --components-form-baseform-standard-border-success: #1a8e60;
31
- --components-form-baseform-standard-fill-default: #ffffff;
32
- --components-form-baseform-standard-fill-disabled: #cfd2d4;
33
- --components-form-baseform-standard-fill-readonly: rgba(255, 255, 255, 0);
34
- --components-form-baseform-standard-icon: #181c56;
35
- --components-form-baseform-standard-icon-disabled: #6e6f73;
36
- --components-form-baseform-standard-text-content: #181c56;
37
- --components-form-baseform-standard-text-description: #181c56;
38
- --components-form-baseform-standard-text-label: #626493;
39
- --components-form-baseform-standard-text-labelbeta: #181c56;
40
- --components-form-baseform-standard-text-disabled: #6e6f73;
41
- --components-form-basemenu-border: #8284ab;
42
- --components-form-basemenu-fill-default: #f2f5f7;
43
- --components-form-basemenu-fill-hover: #d9ddf2;
44
- --components-form-basemenu-fill-selected: #aeb7e2;
45
- --components-form-basemenu-icon: #181c56;
46
- --components-form-basemenu-icon-disabled: #6e6f73;
47
- --components-form-basemenu-text: #181c56;
48
- --components-form-basemenu-text-disabled: #6e6f73;
49
- --components-form-basepanel-contrast-border-default: #8284ab;
50
- --components-form-basepanel-contrast-border-disabled: #949699;
51
- --components-form-basepanel-contrast-border-selected: #aeb7e2;
52
- --components-form-basepanel-contrast-fill-default: rgba(255, 255, 255, 0);
53
- --components-form-basepanel-contrast-fill-disabled: rgba(207, 210, 212, 0.1490196078);
54
- --components-form-basepanel-contrast-fill-expired: rgba(255, 148, 148, 0.2);
55
- --components-form-basepanel-contrast-fill-hover: #54568c;
56
- --components-form-basepanel-contrast-fill-selected: #393d79;
57
- --components-form-basepanel-contrast-text-accent: #ffffff;
58
- --components-form-basepanel-contrast-text-disabled: #b6b8ba;
59
- --components-form-basepanel-contrast-text-rebate: #5ac39a;
60
- --components-form-basepanel-contrast-text-subdued: #d9dae8;
61
- --components-form-basepanel-standard-border-default: #8284ab;
62
- --components-form-basepanel-standard-border-disabled: #949699;
63
- --components-form-basepanel-standard-border-selected: #181c56;
64
- --components-form-basepanel-standard-fill-default: rgba(255, 255, 255, 0);
65
- --components-form-basepanel-standard-fill-disabled: #cfd2d4;
66
- --components-form-basepanel-standard-fill-expired: rgba(255, 148, 148, 0.2);
67
- --components-form-basepanel-standard-fill-hover: #eaeaf1;
68
- --components-form-basepanel-standard-fill-selected: #f6f6f9;
69
- --components-form-basepanel-standard-text-accent: #181c56;
70
- --components-form-basepanel-standard-text-disabled: #6e6f73;
71
- --components-form-basepanel-standard-text-rebate: #1a8e60;
72
- --components-form-basepanel-standard-text-subdued: #626493;
73
- --components-form-checkbox-contrast-border: #aeb7e2;
74
- --components-form-checkbox-contrast-border-disabled: #6e6f73;
75
- --components-form-checkbox-contrast-border-negative: #ff9494;
76
- --components-form-checkbox-contrast-border-readonly: #6e6f73;
77
- --components-form-checkbox-contrast-fill-default: rgba(255, 255, 255, 0);
78
- --components-form-checkbox-contrast-fill-disabled: rgba(207, 210, 212, 0.1490196078);
79
- --components-form-checkbox-contrast-fill-hover: #626493;
80
- --components-form-checkbox-contrast-fill-selected: #aeb7e2;
81
- --components-form-checkbox-contrast-fill-selectedhover: #c7cdeb;
82
- --components-form-checkbox-contrast-icon: #181c56;
83
- --components-form-checkbox-contrast-icon-disabled: #949699;
84
- --components-form-checkbox-contrast-icon-readonly: #ffffff;
85
- --components-form-checkbox-contrast-text: #ffffff;
86
- --components-form-checkbox-contrast-text-disabled: #949699;
87
- --components-form-checkbox-standard-border: #181c56;
88
- --components-form-checkbox-standard-border-disabled: #e3e6e8;
89
- --components-form-checkbox-standard-border-negative: #d31b1b;
90
- --components-form-checkbox-standard-border-readonly: #e3e6e8;
91
- --components-form-checkbox-standard-fill-default: rgba(255, 255, 255, 0);
92
- --components-form-checkbox-standard-fill-disabled: rgba(207, 210, 212, 0.1490196078);
93
- --components-form-checkbox-standard-fill-hover: #d9ddf2;
94
- --components-form-checkbox-standard-fill-selected: #181c56;
95
- --components-form-checkbox-standard-fill-selectedhover: #393d79;
96
- --components-form-checkbox-standard-icon: #ffffff;
97
- --components-form-checkbox-standard-icon-disabled: #b6b8ba;
98
- --components-form-checkbox-standard-icon-readonly: #181c56;
99
- --components-form-checkbox-standard-text: #181c56;
100
- --components-form-checkbox-standard-text-disabled: #b6b8ba;
101
- --components-form-feedbacktext-information-contrast-icon-fill: #64b3e7;
102
- --components-form-feedbacktext-information-contrast-icon-symbol: #181c56;
103
- --components-form-feedbacktext-information-contrast-stroke: #181c56;
104
- --components-form-feedbacktext-information-contrast-text: #ffffff;
105
- --components-form-feedbacktext-information-standard-icon-fill: #067eb2;
106
- --components-form-feedbacktext-information-standard-icon-symbol: #ffffff;
107
- --components-form-feedbacktext-information-standard-stroke: #ffffff;
108
- --components-form-feedbacktext-information-standard-text: #181c56;
109
- --components-form-feedbacktext-negative-contrast-icon-fill: #ff9494;
110
- --components-form-feedbacktext-negative-contrast-icon-symbol: #181c56;
111
- --components-form-feedbacktext-negative-contrast-stroke: #181c56;
112
- --components-form-feedbacktext-negative-contrast-text: #ffffff;
113
- --components-form-feedbacktext-negative-standard-icon-fill: #d31b1b;
114
- --components-form-feedbacktext-negative-standard-stroke: #ffffff;
115
- --components-form-feedbacktext-negative-standard-symbol: #ffffff;
116
- --components-form-feedbacktext-negative-standard-text: #181c56;
117
- --components-form-feedbacktext-success-contrast-icon-fill: #5ac39a;
118
- --components-form-feedbacktext-success-contrast-icon-stroke: #181c56;
119
- --components-form-feedbacktext-success-contrast-icon-symbol: #181c56;
120
- --components-form-feedbacktext-success-contrast-text: #ffffff;
121
- --components-form-feedbacktext-success-standard-icon-fill: #1a8e60;
122
- --components-form-feedbacktext-success-standard-icon-stroke: #ffffff;
123
- --components-form-feedbacktext-success-standard-icon-symbol: #ffffff;
124
- --components-form-feedbacktext-success-standard-text: #181c56;
125
- --components-form-feedbacktext-warning-contrast-icon: #ffe082;
126
- --components-form-feedbacktext-warning-contrast-icon-symbol: #181c56;
127
- --components-form-feedbacktext-warning-contrast-stroke: #181c56;
128
- --components-form-feedbacktext-warning-contrast-text: #ffffff;
129
- --components-form-feedbacktext-warning-standard-icon-fill: #ffca28;
130
- --components-form-feedbacktext-warning-standard-icon-symbol: #181c56;
131
- --components-form-feedbacktext-warning-standard-stroke: #ffffff;
132
- --components-form-feedbacktext-warning-standard-text: #181c56;
133
- --components-form-radio-contrast-border: #aeb7e2;
134
- --components-form-radio-contrast-border-disabled: #6e6f73;
135
- --components-form-radio-contrast-border-negative: #ff9494;
136
- --components-form-radio-contrast-border-readonly: #6e6f73;
137
- --components-form-radio-contrast-fill-default: rgba(255, 255, 255, 0);
138
- --components-form-radio-contrast-fill-disabled: rgba(207, 210, 212, 0.1490196078);
139
- --components-form-radio-contrast-fill-hover: #626493;
140
- --components-form-radio-contrast-fill-selected: #aeb7e2;
141
- --components-form-radio-contrast-fill-selectedhover: #c7cdeb;
142
- --components-form-radio-contrast-icon: #ffffff;
143
- --components-form-radio-contrast-icon-disabled: #949699;
144
- --components-form-radio-contrast-icon-readonly: #ffffff;
145
- --components-form-radio-contrast-text: #ffffff;
146
- --components-form-radio-contrast-text-disabled: #949699;
147
- --components-form-radio-standard-border: #181c56;
148
- --components-form-radio-standard-border-disabled: #e3e6e8;
149
- --components-form-radio-standard-border-negative: #d31b1b;
150
- --components-form-radio-standard-border-readonly: #e3e6e8;
151
- --components-form-radio-standard-fill-default: rgba(255, 255, 255, 0);
152
- --components-form-radio-standard-fill-disabled: rgba(207, 210, 212, 0.1490196078);
153
- --components-form-radio-standard-fill-hover: #d9ddf2;
154
- --components-form-radio-standard-fill-selected: #181c56;
155
- --components-form-radio-standard-icon: #181c56;
156
- --components-form-radio-standard-icon-disabled: #b6b8ba;
157
- --components-form-radio-standard-icon-readonly: #181c56;
158
- --components-form-radio-standard-selectedhover: #393d79;
159
- --components-form-radio-standard-text: #181c56;
160
- --components-form-radio-standard-text-disabled: #b6b8ba;
161
- --components-form-segmentedcontrol-contrast-background: #393d79;
162
- --components-form-segmentedcontrol-contrast-fill-hover: #626493;
163
- --components-form-segmentedcontrol-contrast-fill-selected: #ffffff;
164
- --components-form-segmentedcontrol-contrast-fill-unselected: rgba(255, 255, 255, 0);
165
- --components-form-segmentedcontrol-contrast-icon-selected: #181c56;
166
- --components-form-segmentedcontrol-contrast-icon-unselected: #ffffff;
167
- --components-form-segmentedcontrol-contrast-text-selected: #181c56;
168
- --components-form-segmentedcontrol-contrast-text-unselected: #ffffff;
169
- --components-form-segmentedcontrol-standard-background: #d9dae8;
170
- --components-form-segmentedcontrol-standard-fill-hover: #eaeaf1;
171
- --components-form-segmentedcontrol-standard-fill-selected: #ffffff;
172
- --components-form-segmentedcontrol-standard-fill-unselected: rgba(255, 255, 255, 0);
173
- --components-form-segmentedcontrol-standard-icon-selected: #181c56;
174
- --components-form-segmentedcontrol-standard-icon-unselected: #181c56;
175
- --components-form-segmentedcontrol-standard-text-selected: #181c56;
176
- --components-form-segmentedcontrol-standard-text-unselected: #181c56;
177
- --components-form-switch-contrast-fill-false: #9ea0bd;
178
- --components-form-switch-contrast-fill-true: #5ac39a;
179
- --components-form-switch-contrast-icon-false: #626493;
180
- --components-form-switch-contrast-icon-true: #181c56;
181
- --components-form-switch-contrast-switch: #ffffff;
182
- --components-form-switch-contrast-text: #ffffff;
183
- --components-form-switch-standard-fill-false: #949699;
184
- --components-form-switch-standard-fill-true: #1a8e60;
185
- --components-form-switch-standard-icon-false: #6e6f73;
186
- --components-form-switch-standard-icon-true: #181c56;
187
- --components-form-switch-standard-switch: #ffffff;
188
- --components-form-switch-standard-text: #181c56;
2
+ :root{
3
+ --components-form-baseform-contrast-border-default:#8284ab;
4
+ --components-form-baseform-contrast-border-interactive:#aeb7e2;
5
+ --components-form-baseform-contrast-border-negative:#ff9494;
6
+ --components-form-baseform-contrast-border-success:#5ac39a;
7
+ --components-form-baseform-contrast-fill-default:#ffffff;
8
+ --components-form-baseform-contrast-fill-disabled:rgba(207, 210, 212, 0.1490196078);
9
+ --components-form-baseform-contrast-fill-readonly:rgba(255, 255, 255, 0);
10
+ --components-form-baseform-contrast-icon:#181c56;
11
+ --components-form-baseform-contrast-iconbeta:#ffffff;
12
+ --components-form-baseform-contrast-icon-disabled:#6e6f73;
13
+ --components-form-baseform-contrast-icon-disabledbeta:#b6b8ba;
14
+ --components-form-baseform-contrast-text-content:#181c56;
15
+ --components-form-baseform-contrast-text-content-readonly:#ffffff;
16
+ --components-form-baseform-contrast-text-description:#ffffff;
17
+ --components-form-baseform-contrast-text-label:#626493;
18
+ --components-form-baseform-contrast-text-labelbeta:#ffffff;
19
+ --components-form-baseform-contrast-text-disabled:#6e6f73;
20
+ --components-form-baseform-contrast-text-disabledbeta:#b6b8ba;
21
+ --components-form-baseform-standard-border-default:#8284ab;
22
+ --components-form-baseform-standard-border-interactive:#181c56;
23
+ --components-form-baseform-standard-border-negative:#d31b1b;
24
+ --components-form-baseform-standard-border-success:#1a8e60;
25
+ --components-form-baseform-standard-fill-default:#ffffff;
26
+ --components-form-baseform-standard-fill-disabled:#cfd2d4;
27
+ --components-form-baseform-standard-fill-readonly:rgba(255, 255, 255, 0);
28
+ --components-form-baseform-standard-icon:#181c56;
29
+ --components-form-baseform-standard-icon-disabled:#6e6f73;
30
+ --components-form-baseform-standard-text-content:#181c56;
31
+ --components-form-baseform-standard-text-description:#181c56;
32
+ --components-form-baseform-standard-text-label:#626493;
33
+ --components-form-baseform-standard-text-labelbeta:#181c56;
34
+ --components-form-baseform-standard-text-disabled:#6e6f73;
35
+ --components-form-basemenu-border:#8284ab;
36
+ --components-form-basemenu-fill-default:#f2f5f7;
37
+ --components-form-basemenu-fill-hover:#d9ddf2;
38
+ --components-form-basemenu-fill-selected:#aeb7e2;
39
+ --components-form-basemenu-icon:#181c56;
40
+ --components-form-basemenu-icon-disabled:#6e6f73;
41
+ --components-form-basemenu-text:#181c56;
42
+ --components-form-basemenu-text-disabled:#6e6f73;
43
+ --components-form-basepanel-contrast-border-default:#8284ab;
44
+ --components-form-basepanel-contrast-border-disabled:#949699;
45
+ --components-form-basepanel-contrast-border-selected:#aeb7e2;
46
+ --components-form-basepanel-contrast-fill-default:rgba(255, 255, 255, 0);
47
+ --components-form-basepanel-contrast-fill-disabled:rgba(207, 210, 212, 0.1490196078);
48
+ --components-form-basepanel-contrast-fill-expired:rgba(255, 148, 148, 0.2);
49
+ --components-form-basepanel-contrast-fill-hover:#54568c;
50
+ --components-form-basepanel-contrast-fill-selected:#393d79;
51
+ --components-form-basepanel-contrast-text-accent:#ffffff;
52
+ --components-form-basepanel-contrast-text-disabled:#b6b8ba;
53
+ --components-form-basepanel-contrast-text-rebate:#5ac39a;
54
+ --components-form-basepanel-contrast-text-subdued:#d9dae8;
55
+ --components-form-basepanel-standard-border-default:#8284ab;
56
+ --components-form-basepanel-standard-border-disabled:#949699;
57
+ --components-form-basepanel-standard-border-selected:#181c56;
58
+ --components-form-basepanel-standard-fill-default:rgba(255, 255, 255, 0);
59
+ --components-form-basepanel-standard-fill-disabled:#cfd2d4;
60
+ --components-form-basepanel-standard-fill-expired:rgba(255, 148, 148, 0.2);
61
+ --components-form-basepanel-standard-fill-hover:#eaeaf1;
62
+ --components-form-basepanel-standard-fill-selected:#f6f6f9;
63
+ --components-form-basepanel-standard-text-accent:#181c56;
64
+ --components-form-basepanel-standard-text-disabled:#6e6f73;
65
+ --components-form-basepanel-standard-text-rebate:#1a8e60;
66
+ --components-form-basepanel-standard-text-subdued:#626493;
67
+ --components-form-checkbox-contrast-border:#aeb7e2;
68
+ --components-form-checkbox-contrast-border-disabled:#6e6f73;
69
+ --components-form-checkbox-contrast-border-negative:#ff9494;
70
+ --components-form-checkbox-contrast-border-readonly:#6e6f73;
71
+ --components-form-checkbox-contrast-fill-default:rgba(255, 255, 255, 0);
72
+ --components-form-checkbox-contrast-fill-disabled:rgba(207, 210, 212, 0.1490196078);
73
+ --components-form-checkbox-contrast-fill-hover:#626493;
74
+ --components-form-checkbox-contrast-fill-selected:#aeb7e2;
75
+ --components-form-checkbox-contrast-fill-selectedhover:#c7cdeb;
76
+ --components-form-checkbox-contrast-icon:#181c56;
77
+ --components-form-checkbox-contrast-icon-disabled:#949699;
78
+ --components-form-checkbox-contrast-icon-readonly:#ffffff;
79
+ --components-form-checkbox-contrast-text:#ffffff;
80
+ --components-form-checkbox-contrast-text-disabled:#949699;
81
+ --components-form-checkbox-standard-border:#181c56;
82
+ --components-form-checkbox-standard-border-disabled:#e3e6e8;
83
+ --components-form-checkbox-standard-border-negative:#d31b1b;
84
+ --components-form-checkbox-standard-border-readonly:#e3e6e8;
85
+ --components-form-checkbox-standard-fill-default:rgba(255, 255, 255, 0);
86
+ --components-form-checkbox-standard-fill-disabled:rgba(207, 210, 212, 0.1490196078);
87
+ --components-form-checkbox-standard-fill-hover:#d9ddf2;
88
+ --components-form-checkbox-standard-fill-selected:#181c56;
89
+ --components-form-checkbox-standard-fill-selectedhover:#393d79;
90
+ --components-form-checkbox-standard-icon:#ffffff;
91
+ --components-form-checkbox-standard-icon-disabled:#b6b8ba;
92
+ --components-form-checkbox-standard-icon-readonly:#181c56;
93
+ --components-form-checkbox-standard-text:#181c56;
94
+ --components-form-checkbox-standard-text-disabled:#b6b8ba;
95
+ --components-form-feedbacktext-information-contrast-icon-fill:#64b3e7;
96
+ --components-form-feedbacktext-information-contrast-icon-symbol:#181c56;
97
+ --components-form-feedbacktext-information-contrast-stroke:#181c56;
98
+ --components-form-feedbacktext-information-contrast-text:#ffffff;
99
+ --components-form-feedbacktext-information-standard-icon-fill:#067eb2;
100
+ --components-form-feedbacktext-information-standard-icon-symbol:#ffffff;
101
+ --components-form-feedbacktext-information-standard-stroke:#ffffff;
102
+ --components-form-feedbacktext-information-standard-text:#181c56;
103
+ --components-form-feedbacktext-negative-contrast-icon-fill:#ff9494;
104
+ --components-form-feedbacktext-negative-contrast-icon-symbol:#181c56;
105
+ --components-form-feedbacktext-negative-contrast-stroke:#181c56;
106
+ --components-form-feedbacktext-negative-contrast-text:#ffffff;
107
+ --components-form-feedbacktext-negative-standard-icon-fill:#d31b1b;
108
+ --components-form-feedbacktext-negative-standard-stroke:#ffffff;
109
+ --components-form-feedbacktext-negative-standard-symbol:#ffffff;
110
+ --components-form-feedbacktext-negative-standard-text:#181c56;
111
+ --components-form-feedbacktext-success-contrast-icon-fill:#5ac39a;
112
+ --components-form-feedbacktext-success-contrast-icon-stroke:#181c56;
113
+ --components-form-feedbacktext-success-contrast-icon-symbol:#181c56;
114
+ --components-form-feedbacktext-success-contrast-text:#ffffff;
115
+ --components-form-feedbacktext-success-standard-icon-fill:#1a8e60;
116
+ --components-form-feedbacktext-success-standard-icon-stroke:#ffffff;
117
+ --components-form-feedbacktext-success-standard-icon-symbol:#ffffff;
118
+ --components-form-feedbacktext-success-standard-text:#181c56;
119
+ --components-form-feedbacktext-warning-contrast-icon:#ffe082;
120
+ --components-form-feedbacktext-warning-contrast-icon-symbol:#181c56;
121
+ --components-form-feedbacktext-warning-contrast-stroke:#181c56;
122
+ --components-form-feedbacktext-warning-contrast-text:#ffffff;
123
+ --components-form-feedbacktext-warning-standard-icon-fill:#ffca28;
124
+ --components-form-feedbacktext-warning-standard-icon-symbol:#181c56;
125
+ --components-form-feedbacktext-warning-standard-stroke:#ffffff;
126
+ --components-form-feedbacktext-warning-standard-text:#181c56;
127
+ --components-form-radio-contrast-border:#aeb7e2;
128
+ --components-form-radio-contrast-border-disabled:#6e6f73;
129
+ --components-form-radio-contrast-border-negative:#ff9494;
130
+ --components-form-radio-contrast-border-readonly:#6e6f73;
131
+ --components-form-radio-contrast-fill-default:rgba(255, 255, 255, 0);
132
+ --components-form-radio-contrast-fill-disabled:rgba(207, 210, 212, 0.1490196078);
133
+ --components-form-radio-contrast-fill-hover:#626493;
134
+ --components-form-radio-contrast-fill-selected:#aeb7e2;
135
+ --components-form-radio-contrast-fill-selectedhover:#c7cdeb;
136
+ --components-form-radio-contrast-icon:#ffffff;
137
+ --components-form-radio-contrast-icon-disabled:#949699;
138
+ --components-form-radio-contrast-icon-readonly:#ffffff;
139
+ --components-form-radio-contrast-text:#ffffff;
140
+ --components-form-radio-contrast-text-disabled:#949699;
141
+ --components-form-radio-standard-border:#181c56;
142
+ --components-form-radio-standard-border-disabled:#e3e6e8;
143
+ --components-form-radio-standard-border-negative:#d31b1b;
144
+ --components-form-radio-standard-border-readonly:#e3e6e8;
145
+ --components-form-radio-standard-fill-default:rgba(255, 255, 255, 0);
146
+ --components-form-radio-standard-fill-disabled:rgba(207, 210, 212, 0.1490196078);
147
+ --components-form-radio-standard-fill-hover:#d9ddf2;
148
+ --components-form-radio-standard-fill-selected:#181c56;
149
+ --components-form-radio-standard-icon:#181c56;
150
+ --components-form-radio-standard-icon-disabled:#b6b8ba;
151
+ --components-form-radio-standard-icon-readonly:#181c56;
152
+ --components-form-radio-standard-selectedhover:#393d79;
153
+ --components-form-radio-standard-text:#181c56;
154
+ --components-form-radio-standard-text-disabled:#b6b8ba;
155
+ --components-form-segmentedcontrol-contrast-background:#393d79;
156
+ --components-form-segmentedcontrol-contrast-fill-hover:#626493;
157
+ --components-form-segmentedcontrol-contrast-fill-selected:#ffffff;
158
+ --components-form-segmentedcontrol-contrast-fill-unselected:rgba(255, 255, 255, 0);
159
+ --components-form-segmentedcontrol-contrast-icon-selected:#181c56;
160
+ --components-form-segmentedcontrol-contrast-icon-unselected:#ffffff;
161
+ --components-form-segmentedcontrol-contrast-text-selected:#181c56;
162
+ --components-form-segmentedcontrol-contrast-text-unselected:#ffffff;
163
+ --components-form-segmentedcontrol-standard-background:#d9dae8;
164
+ --components-form-segmentedcontrol-standard-fill-hover:#eaeaf1;
165
+ --components-form-segmentedcontrol-standard-fill-selected:#ffffff;
166
+ --components-form-segmentedcontrol-standard-fill-unselected:rgba(255, 255, 255, 0);
167
+ --components-form-segmentedcontrol-standard-icon-selected:#181c56;
168
+ --components-form-segmentedcontrol-standard-icon-unselected:#181c56;
169
+ --components-form-segmentedcontrol-standard-text-selected:#181c56;
170
+ --components-form-segmentedcontrol-standard-text-unselected:#181c56;
171
+ --components-form-switch-contrast-fill-false:#9ea0bd;
172
+ --components-form-switch-contrast-fill-true:#5ac39a;
173
+ --components-form-switch-contrast-icon-false:#626493;
174
+ --components-form-switch-contrast-icon-true:#181c56;
175
+ --components-form-switch-contrast-switch:#ffffff;
176
+ --components-form-switch-contrast-text:#ffffff;
177
+ --components-form-switch-standard-fill-false:#949699;
178
+ --components-form-switch-standard-fill-true:#1a8e60;
179
+ --components-form-switch-standard-icon-false:#6e6f73;
180
+ --components-form-switch-standard-icon-true:#181c56;
181
+ --components-form-switch-standard-switch:#ffffff;
182
+ --components-form-switch-standard-text:#181c56;
189
183
  }
190
184
 
191
- [data-color-mode=dark] {
192
- --components-form-baseform-contrast-border-default: #8284ab;
193
- --components-form-baseform-contrast-border-interactive: #aeb7e2;
194
- --components-form-baseform-contrast-border-negative: #ff9494;
195
- --components-form-baseform-contrast-border-success: #5ac39a;
196
- --components-form-baseform-contrast-fill-default: rgba(255, 255, 255, 0);
197
- --components-form-baseform-contrast-fill-disabled: rgba(207, 210, 212, 0.1490196078);
198
- --components-form-baseform-contrast-fill-readonly: rgba(255, 255, 255, 0);
199
- --components-form-baseform-contrast-icon: #e5e5e9;
200
- --components-form-baseform-contrast-iconbeta: #e5e5e9;
201
- --components-form-baseform-contrast-icon-disabled: #6e6f73;
202
- --components-form-baseform-contrast-icon-disabledbeta: #b6b8ba;
203
- --components-form-baseform-contrast-text-content: #e5e5e9;
204
- --components-form-baseform-contrast-text-content-readonly: #e5e5e9;
205
- --components-form-baseform-contrast-text-description: #e5e5e9;
206
- --components-form-baseform-contrast-text-label: #b3b4bd;
207
- --components-form-baseform-contrast-text-labelbeta: #e5e5e9;
208
- --components-form-baseform-contrast-text-disabled: #6e6f73;
209
- --components-form-baseform-contrast-text-disabledbeta: #b6b8ba;
210
- --components-form-baseform-standard-border-default: #8284ab;
211
- --components-form-baseform-standard-border-interactive: #aeb7e2;
212
- --components-form-baseform-standard-border-negative: #ff9494;
213
- --components-form-baseform-standard-border-success: #5ac39a;
214
- --components-form-baseform-standard-fill-default: rgba(255, 255, 255, 0);
215
- --components-form-baseform-standard-fill-disabled: rgba(207, 210, 212, 0.1490196078);
216
- --components-form-baseform-standard-fill-readonly: rgba(255, 255, 255, 0);
217
- --components-form-baseform-standard-icon: #e5e5e9;
218
- --components-form-baseform-standard-icon-disabled: #6e6f73;
219
- --components-form-baseform-standard-text-content: #e5e5e9;
220
- --components-form-baseform-standard-text-description: #e5e5e9;
221
- --components-form-baseform-standard-text-label: #b3b4bd;
222
- --components-form-baseform-standard-text-labelbeta: #e5e5e9;
223
- --components-form-baseform-standard-text-disabled: #6e6f73;
224
- --components-form-basemenu-border: rgba(255, 255, 255, 0);
225
- --components-form-basemenu-fill-default: #464755;
226
- --components-form-basemenu-fill-hover: #626493;
227
- --components-form-basemenu-fill-selected: #8794d4;
228
- --components-form-basemenu-icon: #e5e5e9;
229
- --components-form-basemenu-icon-disabled: #949699;
230
- --components-form-basemenu-text: #e5e5e9;
231
- --components-form-basemenu-text-disabled: #949699;
232
- --components-form-basepanel-contrast-border-default: #81828f;
233
- --components-form-basepanel-contrast-border-disabled: #949699;
234
- --components-form-basepanel-contrast-border-selected: #aeb7e2;
235
- --components-form-basepanel-contrast-fill-default: rgba(255, 255, 255, 0);
236
- --components-form-basepanel-contrast-fill-disabled: rgba(207, 210, 212, 0.1490196078);
237
- --components-form-basepanel-contrast-fill-expired: rgba(255, 148, 148, 0.2);
238
- --components-form-basepanel-contrast-fill-hover: #393a49;
239
- --components-form-basepanel-contrast-fill-selected: rgba(229, 229, 233, 0.1490196078);
240
- --components-form-basepanel-contrast-text-accent: #e5e5e9;
241
- --components-form-basepanel-contrast-text-disabled: #b6b8ba;
242
- --components-form-basepanel-contrast-text-rebate: #5ac39a;
243
- --components-form-basepanel-contrast-text-subdued: #b3b4bd;
244
- --components-form-basepanel-standard-border-default: #81828f;
245
- --components-form-basepanel-standard-border-disabled: #949699;
246
- --components-form-basepanel-standard-border-selected: #aeb7e2;
247
- --components-form-basepanel-standard-fill-default: rgba(255, 255, 255, 0);
248
- --components-form-basepanel-standard-fill-disabled: rgba(207, 210, 212, 0.1490196078);
249
- --components-form-basepanel-standard-fill-expired: rgba(255, 148, 148, 0.2);
250
- --components-form-basepanel-standard-fill-hover: #393a49;
251
- --components-form-basepanel-standard-fill-selected: rgba(229, 229, 233, 0.1490196078);
252
- --components-form-basepanel-standard-text-accent: #e5e5e9;
253
- --components-form-basepanel-standard-text-disabled: #b6b8ba;
254
- --components-form-basepanel-standard-text-rebate: #5ac39a;
255
- --components-form-basepanel-standard-text-subdued: #b3b4bd;
256
- --components-form-checkbox-contrast-border: #aeb7e2;
257
- --components-form-checkbox-contrast-border-disabled: #6e6f73;
258
- --components-form-checkbox-contrast-border-negative: #ff9494;
259
- --components-form-checkbox-contrast-border-readonly: #6e6f73;
260
- --components-form-checkbox-contrast-fill-default: rgba(255, 255, 255, 0);
261
- --components-form-checkbox-contrast-fill-disabled: rgba(204, 205, 212, 0.3019607843);
262
- --components-form-checkbox-contrast-fill-hover: #626493;
263
- --components-form-checkbox-contrast-fill-selected: #aeb7e2;
264
- --components-form-checkbox-contrast-fill-selectedhover: #c7cdeb;
265
- --components-form-checkbox-contrast-icon: #181c56;
266
- --components-form-checkbox-contrast-icon-disabled: #6e6f73;
267
- --components-form-checkbox-contrast-icon-readonly: #e5e5e9;
268
- --components-form-checkbox-contrast-text: #e5e5e9;
269
- --components-form-checkbox-contrast-text-disabled: #6e6f73;
270
- --components-form-checkbox-standard-border: #aeb7e2;
271
- --components-form-checkbox-standard-border-disabled: #6e6f73;
272
- --components-form-checkbox-standard-border-negative: #ff9494;
273
- --components-form-checkbox-standard-border-readonly: #6e6f73;
274
- --components-form-checkbox-standard-fill-default: rgba(255, 255, 255, 0);
275
- --components-form-checkbox-standard-fill-disabled: rgba(207, 210, 212, 0.1490196078);
276
- --components-form-checkbox-standard-fill-hover: #626493;
277
- --components-form-checkbox-standard-fill-selected: #aeb7e2;
278
- --components-form-checkbox-standard-fill-selectedhover: #c7cdeb;
279
- --components-form-checkbox-standard-icon: #181c56;
280
- --components-form-checkbox-standard-icon-disabled: #6e6f73;
281
- --components-form-checkbox-standard-icon-readonly: #e5e5e9;
282
- --components-form-checkbox-standard-text: #e5e5e9;
283
- --components-form-checkbox-standard-text-disabled: #6e6f73;
284
- --components-form-feedbacktext-information-contrast-icon-fill: #64b3e7;
285
- --components-form-feedbacktext-information-contrast-icon-symbol: #08091c;
286
- --components-form-feedbacktext-information-contrast-stroke: #08091c;
287
- --components-form-feedbacktext-information-contrast-text: #e5e5e9;
288
- --components-form-feedbacktext-information-standard-icon-fill: #64b3e7;
289
- --components-form-feedbacktext-information-standard-icon-symbol: #08091c;
290
- --components-form-feedbacktext-information-standard-stroke: #08091c;
291
- --components-form-feedbacktext-information-standard-text: #e5e5e9;
292
- --components-form-feedbacktext-negative-contrast-icon-fill: #ff9494;
293
- --components-form-feedbacktext-negative-contrast-icon-symbol: #08091c;
294
- --components-form-feedbacktext-negative-contrast-stroke: #08091c;
295
- --components-form-feedbacktext-negative-contrast-text: #e5e5e9;
296
- --components-form-feedbacktext-negative-standard-icon-fill: #ff9494;
297
- --components-form-feedbacktext-negative-standard-stroke: #08091c;
298
- --components-form-feedbacktext-negative-standard-symbol: #08091c;
299
- --components-form-feedbacktext-negative-standard-text: #e5e5e9;
300
- --components-form-feedbacktext-success-contrast-icon-fill: #5ac39a;
301
- --components-form-feedbacktext-success-contrast-icon-stroke: #08091c;
302
- --components-form-feedbacktext-success-contrast-icon-symbol: #08091c;
303
- --components-form-feedbacktext-success-contrast-text: #e5e5e9;
304
- --components-form-feedbacktext-success-standard-icon-fill: #5ac39a;
305
- --components-form-feedbacktext-success-standard-icon-stroke: #08091c;
306
- --components-form-feedbacktext-success-standard-icon-symbol: #08091c;
307
- --components-form-feedbacktext-success-standard-text: #e5e5e9;
308
- --components-form-feedbacktext-warning-contrast-icon: #ffe082;
309
- --components-form-feedbacktext-warning-contrast-icon-symbol: #08091c;
310
- --components-form-feedbacktext-warning-contrast-stroke: #08091c;
311
- --components-form-feedbacktext-warning-contrast-text: #e5e5e9;
312
- --components-form-feedbacktext-warning-standard-icon-fill: #ffe082;
313
- --components-form-feedbacktext-warning-standard-icon-symbol: #08091c;
314
- --components-form-feedbacktext-warning-standard-stroke: #08091c;
315
- --components-form-feedbacktext-warning-standard-text: #e5e5e9;
316
- --components-form-radio-contrast-border: #aeb7e2;
317
- --components-form-radio-contrast-border-disabled: #6e6f73;
318
- --components-form-radio-contrast-border-negative: #ff9494;
319
- --components-form-radio-contrast-border-readonly: #6e6f73;
320
- --components-form-radio-contrast-fill-default: rgba(255, 255, 255, 0);
321
- --components-form-radio-contrast-fill-disabled: rgba(204, 205, 212, 0.3019607843);
322
- --components-form-radio-contrast-fill-hover: #626493;
323
- --components-form-radio-contrast-fill-selected: #aeb7e2;
324
- --components-form-radio-contrast-fill-selectedhover: #c7cdeb;
325
- --components-form-radio-contrast-icon: #e5e5e9;
326
- --components-form-radio-contrast-icon-disabled: #6e6f73;
327
- --components-form-radio-contrast-icon-readonly: #e5e5e9;
328
- --components-form-radio-contrast-text: #e5e5e9;
329
- --components-form-radio-contrast-text-disabled: #6e6f73;
330
- --components-form-radio-standard-border: #aeb7e2;
331
- --components-form-radio-standard-border-disabled: #6e6f73;
332
- --components-form-radio-standard-border-negative: #ff9494;
333
- --components-form-radio-standard-border-readonly: #6e6f73;
334
- --components-form-radio-standard-fill-default: rgba(255, 255, 255, 0);
335
- --components-form-radio-standard-fill-disabled: rgba(207, 210, 212, 0.1490196078);
336
- --components-form-radio-standard-fill-hover: #626493;
337
- --components-form-radio-standard-fill-selected: #aeb7e2;
338
- --components-form-radio-standard-icon: #e5e5e9;
339
- --components-form-radio-standard-icon-disabled: #6e6f73;
340
- --components-form-radio-standard-icon-readonly: #e5e5e9;
341
- --components-form-radio-standard-selectedhover: #c7cdeb;
342
- --components-form-radio-standard-text: #e5e5e9;
343
- --components-form-radio-standard-text-disabled: #6e6f73;
344
- --components-form-segmentedcontrol-contrast-background: rgba(229, 229, 233, 0.1490196078);
345
- --components-form-segmentedcontrol-contrast-fill-hover: rgba(229, 229, 233, 0.1490196078);
346
- --components-form-segmentedcontrol-contrast-fill-selected: #e5e5e9;
347
- --components-form-segmentedcontrol-contrast-fill-unselected: rgba(255, 255, 255, 0);
348
- --components-form-segmentedcontrol-contrast-icon-selected: #08091c;
349
- --components-form-segmentedcontrol-contrast-icon-unselected: #e5e5e9;
350
- --components-form-segmentedcontrol-contrast-text-selected: #08091c;
351
- --components-form-segmentedcontrol-contrast-text-unselected: #e5e5e9;
352
- --components-form-segmentedcontrol-standard-background: rgba(229, 229, 233, 0.1490196078);
353
- --components-form-segmentedcontrol-standard-fill-hover: rgba(229, 229, 233, 0.1490196078);
354
- --components-form-segmentedcontrol-standard-fill-selected: #e5e5e9;
355
- --components-form-segmentedcontrol-standard-fill-unselected: rgba(255, 255, 255, 0);
356
- --components-form-segmentedcontrol-standard-icon-selected: #08091c;
357
- --components-form-segmentedcontrol-standard-icon-unselected: #e5e5e9;
358
- --components-form-segmentedcontrol-standard-text-selected: #08091c;
359
- --components-form-segmentedcontrol-standard-text-unselected: #e5e5e9;
360
- --components-form-switch-contrast-fill-false: rgba(229, 229, 233, 0.3490196078);
361
- --components-form-switch-contrast-fill-true: #5ac39a;
362
- --components-form-switch-contrast-icon-false: #b3b4bd;
363
- --components-form-switch-contrast-icon-true: #e5e5e9;
364
- --components-form-switch-contrast-switch: #08091c;
365
- --components-form-switch-contrast-text: #e5e5e9;
366
- --components-form-switch-standard-fill-false: rgba(229, 229, 233, 0.3490196078);
367
- --components-form-switch-standard-fill-true: #5ac39a;
368
- --components-form-switch-standard-icon-false: #b3b4bd;
369
- --components-form-switch-standard-icon-true: #e5e5e9;
370
- --components-form-switch-standard-switch: #08091c;
371
- --components-form-switch-standard-text: #e5e5e9;
185
+ [data-color-mode=dark]{
186
+ --components-form-baseform-contrast-border-default:#8284ab;
187
+ --components-form-baseform-contrast-border-interactive:#aeb7e2;
188
+ --components-form-baseform-contrast-border-negative:#ff9494;
189
+ --components-form-baseform-contrast-border-success:#5ac39a;
190
+ --components-form-baseform-contrast-fill-default:rgba(255, 255, 255, 0);
191
+ --components-form-baseform-contrast-fill-disabled:rgba(207, 210, 212, 0.1490196078);
192
+ --components-form-baseform-contrast-fill-readonly:rgba(255, 255, 255, 0);
193
+ --components-form-baseform-contrast-icon:#e5e5e9;
194
+ --components-form-baseform-contrast-iconbeta:#e5e5e9;
195
+ --components-form-baseform-contrast-icon-disabled:#6e6f73;
196
+ --components-form-baseform-contrast-icon-disabledbeta:#b6b8ba;
197
+ --components-form-baseform-contrast-text-content:#e5e5e9;
198
+ --components-form-baseform-contrast-text-content-readonly:#e5e5e9;
199
+ --components-form-baseform-contrast-text-description:#e5e5e9;
200
+ --components-form-baseform-contrast-text-label:#b3b4bd;
201
+ --components-form-baseform-contrast-text-labelbeta:#e5e5e9;
202
+ --components-form-baseform-contrast-text-disabled:#6e6f73;
203
+ --components-form-baseform-contrast-text-disabledbeta:#b6b8ba;
204
+ --components-form-baseform-standard-border-default:#8284ab;
205
+ --components-form-baseform-standard-border-interactive:#aeb7e2;
206
+ --components-form-baseform-standard-border-negative:#ff9494;
207
+ --components-form-baseform-standard-border-success:#5ac39a;
208
+ --components-form-baseform-standard-fill-default:rgba(255, 255, 255, 0);
209
+ --components-form-baseform-standard-fill-disabled:rgba(207, 210, 212, 0.1490196078);
210
+ --components-form-baseform-standard-fill-readonly:rgba(255, 255, 255, 0);
211
+ --components-form-baseform-standard-icon:#e5e5e9;
212
+ --components-form-baseform-standard-icon-disabled:#6e6f73;
213
+ --components-form-baseform-standard-text-content:#e5e5e9;
214
+ --components-form-baseform-standard-text-description:#e5e5e9;
215
+ --components-form-baseform-standard-text-label:#b3b4bd;
216
+ --components-form-baseform-standard-text-labelbeta:#e5e5e9;
217
+ --components-form-baseform-standard-text-disabled:#6e6f73;
218
+ --components-form-basemenu-border:rgba(255, 255, 255, 0);
219
+ --components-form-basemenu-fill-default:#464755;
220
+ --components-form-basemenu-fill-hover:#626493;
221
+ --components-form-basemenu-fill-selected:#8794d4;
222
+ --components-form-basemenu-icon:#e5e5e9;
223
+ --components-form-basemenu-icon-disabled:#949699;
224
+ --components-form-basemenu-text:#e5e5e9;
225
+ --components-form-basemenu-text-disabled:#949699;
226
+ --components-form-basepanel-contrast-border-default:#81828f;
227
+ --components-form-basepanel-contrast-border-disabled:#949699;
228
+ --components-form-basepanel-contrast-border-selected:#aeb7e2;
229
+ --components-form-basepanel-contrast-fill-default:rgba(255, 255, 255, 0);
230
+ --components-form-basepanel-contrast-fill-disabled:rgba(207, 210, 212, 0.1490196078);
231
+ --components-form-basepanel-contrast-fill-expired:rgba(255, 148, 148, 0.2);
232
+ --components-form-basepanel-contrast-fill-hover:#393a49;
233
+ --components-form-basepanel-contrast-fill-selected:rgba(229, 229, 233, 0.1490196078);
234
+ --components-form-basepanel-contrast-text-accent:#e5e5e9;
235
+ --components-form-basepanel-contrast-text-disabled:#b6b8ba;
236
+ --components-form-basepanel-contrast-text-rebate:#5ac39a;
237
+ --components-form-basepanel-contrast-text-subdued:#b3b4bd;
238
+ --components-form-basepanel-standard-border-default:#81828f;
239
+ --components-form-basepanel-standard-border-disabled:#949699;
240
+ --components-form-basepanel-standard-border-selected:#aeb7e2;
241
+ --components-form-basepanel-standard-fill-default:rgba(255, 255, 255, 0);
242
+ --components-form-basepanel-standard-fill-disabled:rgba(207, 210, 212, 0.1490196078);
243
+ --components-form-basepanel-standard-fill-expired:rgba(255, 148, 148, 0.2);
244
+ --components-form-basepanel-standard-fill-hover:#393a49;
245
+ --components-form-basepanel-standard-fill-selected:rgba(229, 229, 233, 0.1490196078);
246
+ --components-form-basepanel-standard-text-accent:#e5e5e9;
247
+ --components-form-basepanel-standard-text-disabled:#b6b8ba;
248
+ --components-form-basepanel-standard-text-rebate:#5ac39a;
249
+ --components-form-basepanel-standard-text-subdued:#b3b4bd;
250
+ --components-form-checkbox-contrast-border:#aeb7e2;
251
+ --components-form-checkbox-contrast-border-disabled:#6e6f73;
252
+ --components-form-checkbox-contrast-border-negative:#ff9494;
253
+ --components-form-checkbox-contrast-border-readonly:#6e6f73;
254
+ --components-form-checkbox-contrast-fill-default:rgba(255, 255, 255, 0);
255
+ --components-form-checkbox-contrast-fill-disabled:rgba(204, 205, 212, 0.3019607843);
256
+ --components-form-checkbox-contrast-fill-hover:#626493;
257
+ --components-form-checkbox-contrast-fill-selected:#aeb7e2;
258
+ --components-form-checkbox-contrast-fill-selectedhover:#c7cdeb;
259
+ --components-form-checkbox-contrast-icon:#181c56;
260
+ --components-form-checkbox-contrast-icon-disabled:#6e6f73;
261
+ --components-form-checkbox-contrast-icon-readonly:#e5e5e9;
262
+ --components-form-checkbox-contrast-text:#e5e5e9;
263
+ --components-form-checkbox-contrast-text-disabled:#6e6f73;
264
+ --components-form-checkbox-standard-border:#aeb7e2;
265
+ --components-form-checkbox-standard-border-disabled:#6e6f73;
266
+ --components-form-checkbox-standard-border-negative:#ff9494;
267
+ --components-form-checkbox-standard-border-readonly:#6e6f73;
268
+ --components-form-checkbox-standard-fill-default:rgba(255, 255, 255, 0);
269
+ --components-form-checkbox-standard-fill-disabled:rgba(207, 210, 212, 0.1490196078);
270
+ --components-form-checkbox-standard-fill-hover:#626493;
271
+ --components-form-checkbox-standard-fill-selected:#aeb7e2;
272
+ --components-form-checkbox-standard-fill-selectedhover:#c7cdeb;
273
+ --components-form-checkbox-standard-icon:#181c56;
274
+ --components-form-checkbox-standard-icon-disabled:#6e6f73;
275
+ --components-form-checkbox-standard-icon-readonly:#e5e5e9;
276
+ --components-form-checkbox-standard-text:#e5e5e9;
277
+ --components-form-checkbox-standard-text-disabled:#6e6f73;
278
+ --components-form-feedbacktext-information-contrast-icon-fill:#64b3e7;
279
+ --components-form-feedbacktext-information-contrast-icon-symbol:#08091c;
280
+ --components-form-feedbacktext-information-contrast-stroke:#08091c;
281
+ --components-form-feedbacktext-information-contrast-text:#e5e5e9;
282
+ --components-form-feedbacktext-information-standard-icon-fill:#64b3e7;
283
+ --components-form-feedbacktext-information-standard-icon-symbol:#08091c;
284
+ --components-form-feedbacktext-information-standard-stroke:#08091c;
285
+ --components-form-feedbacktext-information-standard-text:#e5e5e9;
286
+ --components-form-feedbacktext-negative-contrast-icon-fill:#ff9494;
287
+ --components-form-feedbacktext-negative-contrast-icon-symbol:#08091c;
288
+ --components-form-feedbacktext-negative-contrast-stroke:#08091c;
289
+ --components-form-feedbacktext-negative-contrast-text:#e5e5e9;
290
+ --components-form-feedbacktext-negative-standard-icon-fill:#ff9494;
291
+ --components-form-feedbacktext-negative-standard-stroke:#08091c;
292
+ --components-form-feedbacktext-negative-standard-symbol:#08091c;
293
+ --components-form-feedbacktext-negative-standard-text:#e5e5e9;
294
+ --components-form-feedbacktext-success-contrast-icon-fill:#5ac39a;
295
+ --components-form-feedbacktext-success-contrast-icon-stroke:#08091c;
296
+ --components-form-feedbacktext-success-contrast-icon-symbol:#08091c;
297
+ --components-form-feedbacktext-success-contrast-text:#e5e5e9;
298
+ --components-form-feedbacktext-success-standard-icon-fill:#5ac39a;
299
+ --components-form-feedbacktext-success-standard-icon-stroke:#08091c;
300
+ --components-form-feedbacktext-success-standard-icon-symbol:#08091c;
301
+ --components-form-feedbacktext-success-standard-text:#e5e5e9;
302
+ --components-form-feedbacktext-warning-contrast-icon:#ffe082;
303
+ --components-form-feedbacktext-warning-contrast-icon-symbol:#08091c;
304
+ --components-form-feedbacktext-warning-contrast-stroke:#08091c;
305
+ --components-form-feedbacktext-warning-contrast-text:#e5e5e9;
306
+ --components-form-feedbacktext-warning-standard-icon-fill:#ffe082;
307
+ --components-form-feedbacktext-warning-standard-icon-symbol:#08091c;
308
+ --components-form-feedbacktext-warning-standard-stroke:#08091c;
309
+ --components-form-feedbacktext-warning-standard-text:#e5e5e9;
310
+ --components-form-radio-contrast-border:#aeb7e2;
311
+ --components-form-radio-contrast-border-disabled:#6e6f73;
312
+ --components-form-radio-contrast-border-negative:#ff9494;
313
+ --components-form-radio-contrast-border-readonly:#6e6f73;
314
+ --components-form-radio-contrast-fill-default:rgba(255, 255, 255, 0);
315
+ --components-form-radio-contrast-fill-disabled:rgba(204, 205, 212, 0.3019607843);
316
+ --components-form-radio-contrast-fill-hover:#626493;
317
+ --components-form-radio-contrast-fill-selected:#aeb7e2;
318
+ --components-form-radio-contrast-fill-selectedhover:#c7cdeb;
319
+ --components-form-radio-contrast-icon:#e5e5e9;
320
+ --components-form-radio-contrast-icon-disabled:#6e6f73;
321
+ --components-form-radio-contrast-icon-readonly:#e5e5e9;
322
+ --components-form-radio-contrast-text:#e5e5e9;
323
+ --components-form-radio-contrast-text-disabled:#6e6f73;
324
+ --components-form-radio-standard-border:#aeb7e2;
325
+ --components-form-radio-standard-border-disabled:#6e6f73;
326
+ --components-form-radio-standard-border-negative:#ff9494;
327
+ --components-form-radio-standard-border-readonly:#6e6f73;
328
+ --components-form-radio-standard-fill-default:rgba(255, 255, 255, 0);
329
+ --components-form-radio-standard-fill-disabled:rgba(207, 210, 212, 0.1490196078);
330
+ --components-form-radio-standard-fill-hover:#626493;
331
+ --components-form-radio-standard-fill-selected:#aeb7e2;
332
+ --components-form-radio-standard-icon:#e5e5e9;
333
+ --components-form-radio-standard-icon-disabled:#6e6f73;
334
+ --components-form-radio-standard-icon-readonly:#e5e5e9;
335
+ --components-form-radio-standard-selectedhover:#c7cdeb;
336
+ --components-form-radio-standard-text:#e5e5e9;
337
+ --components-form-radio-standard-text-disabled:#6e6f73;
338
+ --components-form-segmentedcontrol-contrast-background:rgba(229, 229, 233, 0.1490196078);
339
+ --components-form-segmentedcontrol-contrast-fill-hover:rgba(229, 229, 233, 0.1490196078);
340
+ --components-form-segmentedcontrol-contrast-fill-selected:#e5e5e9;
341
+ --components-form-segmentedcontrol-contrast-fill-unselected:rgba(255, 255, 255, 0);
342
+ --components-form-segmentedcontrol-contrast-icon-selected:#08091c;
343
+ --components-form-segmentedcontrol-contrast-icon-unselected:#e5e5e9;
344
+ --components-form-segmentedcontrol-contrast-text-selected:#08091c;
345
+ --components-form-segmentedcontrol-contrast-text-unselected:#e5e5e9;
346
+ --components-form-segmentedcontrol-standard-background:rgba(229, 229, 233, 0.1490196078);
347
+ --components-form-segmentedcontrol-standard-fill-hover:rgba(229, 229, 233, 0.1490196078);
348
+ --components-form-segmentedcontrol-standard-fill-selected:#e5e5e9;
349
+ --components-form-segmentedcontrol-standard-fill-unselected:rgba(255, 255, 255, 0);
350
+ --components-form-segmentedcontrol-standard-icon-selected:#08091c;
351
+ --components-form-segmentedcontrol-standard-icon-unselected:#e5e5e9;
352
+ --components-form-segmentedcontrol-standard-text-selected:#08091c;
353
+ --components-form-segmentedcontrol-standard-text-unselected:#e5e5e9;
354
+ --components-form-switch-contrast-fill-false:rgba(229, 229, 233, 0.3490196078);
355
+ --components-form-switch-contrast-fill-true:#5ac39a;
356
+ --components-form-switch-contrast-icon-false:#b3b4bd;
357
+ --components-form-switch-contrast-icon-true:#e5e5e9;
358
+ --components-form-switch-contrast-switch:#08091c;
359
+ --components-form-switch-contrast-text:#e5e5e9;
360
+ --components-form-switch-standard-fill-false:rgba(229, 229, 233, 0.3490196078);
361
+ --components-form-switch-standard-fill-true:#5ac39a;
362
+ --components-form-switch-standard-icon-false:#b3b4bd;
363
+ --components-form-switch-standard-icon-true:#e5e5e9;
364
+ --components-form-switch-standard-switch:#08091c;
365
+ --components-form-switch-standard-text:#e5e5e9;
372
366
  }
373
-
374
- /* DO NOT CHANGE!*/
375
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
376
- /* DO NOT CHANGE!*/
377
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
378
367
  [data-color-mode=light],
379
- :root {
380
- --basecolors-frame-contrast: #181c56;
381
- --basecolors-frame-contrastalt: #393d79;
382
- --basecolors-frame-contrastalt-2: #292b6a;
383
- --basecolors-frame-default: #ffffff;
384
- --basecolors-frame-elevated: #ffffff;
385
- --basecolors-frame-elevatedalt: #f6f6f9;
386
- --basecolors-frame-subdued: #d9dae8;
387
- --basecolors-frame-tint: #f6f6f9;
388
- --basecolors-shape-accent: #181c56;
389
- --basecolors-shape-bicycle-contrast: #00db9b;
390
- --basecolors-shape-bicycle-default: #33826b;
391
- --basecolors-shape-bus-contrast: #ff6392;
392
- --basecolors-shape-bus-default: #c5044e;
393
- --basecolors-shape-cableway-contrast: #b482fb;
394
- --basecolors-shape-cableway-default: #78469a;
395
- --basecolors-shape-disabled: #6e6f73;
396
- --basecolors-shape-disabledalt: #b6b8ba;
397
- --basecolors-shape-ferry-contrast: #6fdfff;
398
- --basecolors-shape-ferry-default: #0c6693;
399
- --basecolors-shape-funicular-contrast: #b482fb;
400
- --basecolors-shape-funicular-default: #78469a;
401
- --basecolors-shape-helicopter-contrast: #fbafea;
402
- --basecolors-shape-helicopter-default: #800664;
403
- --basecolors-shape-highlight: #ff5959;
404
- --basecolors-shape-light: #ffffff;
405
- --basecolors-shape-mask: #ffffff;
406
- --basecolors-shape-maskalt: #ffffff;
407
- --basecolors-shape-metro-contrast: #f08901;
408
- --basecolors-shape-metro-default: #bf5826;
409
- --basecolors-shape-mobility-contrast: #00db9b;
410
- --basecolors-shape-mobility-default: #33826b;
411
- --basecolors-shape-plane-contrast: #fbafea;
412
- --basecolors-shape-plane-default: #800664;
413
- --basecolors-shape-subdued: #626493;
414
- --basecolors-shape-subduedalt: #d9dae8;
415
- --basecolors-shape-taxi-contrast: #ffe082;
416
- --basecolors-shape-taxi-default: #3d3e40;
417
- --basecolors-shape-train-contrast: #42a5f5;
418
- --basecolors-shape-train-default: #00367f;
419
- --basecolors-shape-tram-contrast: #b482fb;
420
- --basecolors-shape-tram-default: #78469a;
421
- --basecolors-shape-walk-contrast: #8284ab;
422
- --basecolors-shape-walk-default: #8d8e9c;
423
- --basecolors-shape-airportlinkbus-contrast: #fbafea;
424
- --basecolors-shape-airportlinkbus-default: #800664;
425
- --basecolors-shape-airportlinkrail-contrast: #fbafea;
426
- --basecolors-shape-airportlinkrail-default: #800664;
427
- --basecolors-stroke-contrast: #aeb7e2;
428
- --basecolors-stroke-default: #181c56;
429
- --basecolors-stroke-disabled: #949699;
430
- --basecolors-stroke-focus-contrast: #aeb7e2;
431
- --basecolors-stroke-focus-standard: #181c56;
432
- --basecolors-stroke-highlight: #ff5959;
433
- --basecolors-stroke-light: #ffffff;
434
- --basecolors-stroke-subdued: #8284ab;
435
- --basecolors-stroke-subduedalt: #e3e6e8;
436
- --basecolors-text-accent: #181c56;
437
- --basecolors-text-disabled: #6e6f73;
438
- --basecolors-text-disabledalt: #b6b8ba;
439
- --basecolors-text-highlight: #ff5959;
440
- --basecolors-text-light: #ffffff;
441
- --basecolors-text-subdued: #626493;
442
- --basecolors-text-subduedalt: #d9dae8;
443
- }
444
-
445
- [data-color-mode=dark] {
446
- --basecolors-frame-contrast: #212233;
447
- --basecolors-frame-contrastalt: #141527;
448
- --basecolors-frame-contrastalt-2: #08091c;
449
- --basecolors-frame-default: #08091c;
450
- --basecolors-frame-elevated: rgba(229, 229, 233, 0.1490196078);
451
- --basecolors-frame-elevatedalt: #464755;
452
- --basecolors-frame-subdued: #2d2e3e;
453
- --basecolors-frame-tint: #141527;
454
- --basecolors-shape-accent: #e5e5e9;
455
- --basecolors-shape-bicycle-contrast: #4db295;
456
- --basecolors-shape-bicycle-default: #4db295;
457
- --basecolors-shape-bus-contrast: #ef7398;
458
- --basecolors-shape-bus-default: #ef7398;
459
- --basecolors-shape-cableway-contrast: #b898e5;
460
- --basecolors-shape-cableway-default: #b898e5;
461
- --basecolors-shape-disabled: #b6b8ba;
462
- --basecolors-shape-disabledalt: #b3b4bd;
463
- --basecolors-shape-ferry-contrast: #8ccfe2;
464
- --basecolors-shape-ferry-default: #8ccfe2;
465
- --basecolors-shape-funicular-contrast: #b898e5;
466
- --basecolors-shape-funicular-default: #b898e5;
467
- --basecolors-shape-helicopter-contrast: #f2b8e5;
468
- --basecolors-shape-helicopter-default: #f2b8e5;
469
- --basecolors-shape-highlight: #ff9494;
470
- --basecolors-shape-light: #e5e5e9;
471
- --basecolors-shape-mask: #2d2e3e;
472
- --basecolors-shape-maskalt: #393a49;
473
- --basecolors-shape-metro-contrast: #dd973c;
474
- --basecolors-shape-metro-default: #dd973c;
475
- --basecolors-shape-mobility-contrast: #4db295;
476
- --basecolors-shape-mobility-default: #4db295;
477
- --basecolors-shape-plane-contrast: #f2b8e5;
478
- --basecolors-shape-plane-default: #f2b8e5;
479
- --basecolors-shape-subdued: #b3b4bd;
480
- --basecolors-shape-subduedalt: #b3b4bd;
481
- --basecolors-shape-taxi-contrast: #ffe082;
482
- --basecolors-shape-taxi-default: #ffe082;
483
- --basecolors-shape-train-contrast: #60a2d7;
484
- --basecolors-shape-train-default: #60a2d7;
485
- --basecolors-shape-tram-contrast: #b898e5;
486
- --basecolors-shape-tram-default: #b898e5;
487
- --basecolors-shape-walk-contrast: #8d8e9c;
488
- --basecolors-shape-walk-default: #8d8e9c;
489
- --basecolors-shape-airportlinkbus-contrast: #f2b8e5;
490
- --basecolors-shape-airportlinkbus-default: #f2b8e5;
491
- --basecolors-shape-airportlinkrail-contrast: #f2b8e5;
492
- --basecolors-shape-airportlinkrail-default: #f2b8e5;
493
- --basecolors-stroke-contrast: #aeb7e2;
494
- --basecolors-stroke-default: #b3b4bd;
495
- --basecolors-stroke-disabled: #e3e6e8;
496
- --basecolors-stroke-focus-contrast: #aeb7e2;
497
- --basecolors-stroke-focus-standard: #aeb7e2;
498
- --basecolors-stroke-highlight: #ff9494;
499
- --basecolors-stroke-light: #b3b4bd;
500
- --basecolors-stroke-subdued: #81828f;
501
- --basecolors-stroke-subduedalt: #949699;
502
- --basecolors-text-accent: #e5e5e9;
503
- --basecolors-text-disabled: #b6b8ba;
504
- --basecolors-text-disabledalt: #b6b8ba;
505
- --basecolors-text-highlight: #ff9494;
506
- --basecolors-text-light: #e5e5e9;
507
- --basecolors-text-subdued: #b3b4bd;
508
- --basecolors-text-subduedalt: #b3b4bd;
368
+ :root{
369
+ --basecolors-frame-contrast:#181c56;
370
+ --basecolors-frame-contrastalt:#393d79;
371
+ --basecolors-frame-contrastalt-2:#292b6a;
372
+ --basecolors-frame-default:#ffffff;
373
+ --basecolors-frame-elevated:#ffffff;
374
+ --basecolors-frame-elevatedalt:#f6f6f9;
375
+ --basecolors-frame-subdued:#d9dae8;
376
+ --basecolors-frame-tint:#f6f6f9;
377
+ --basecolors-shape-accent:#181c56;
378
+ --basecolors-shape-bicycle-contrast:#00db9b;
379
+ --basecolors-shape-bicycle-default:#33826b;
380
+ --basecolors-shape-bus-contrast:#ff6392;
381
+ --basecolors-shape-bus-default:#c5044e;
382
+ --basecolors-shape-cableway-contrast:#b482fb;
383
+ --basecolors-shape-cableway-default:#78469a;
384
+ --basecolors-shape-disabled:#6e6f73;
385
+ --basecolors-shape-disabledalt:#b6b8ba;
386
+ --basecolors-shape-ferry-contrast:#6fdfff;
387
+ --basecolors-shape-ferry-default:#0c6693;
388
+ --basecolors-shape-funicular-contrast:#b482fb;
389
+ --basecolors-shape-funicular-default:#78469a;
390
+ --basecolors-shape-helicopter-contrast:#fbafea;
391
+ --basecolors-shape-helicopter-default:#800664;
392
+ --basecolors-shape-highlight:#ff5959;
393
+ --basecolors-shape-light:#ffffff;
394
+ --basecolors-shape-mask:#ffffff;
395
+ --basecolors-shape-maskalt:#ffffff;
396
+ --basecolors-shape-metro-contrast:#f08901;
397
+ --basecolors-shape-metro-default:#bf5826;
398
+ --basecolors-shape-mobility-contrast:#00db9b;
399
+ --basecolors-shape-mobility-default:#33826b;
400
+ --basecolors-shape-plane-contrast:#fbafea;
401
+ --basecolors-shape-plane-default:#800664;
402
+ --basecolors-shape-subdued:#626493;
403
+ --basecolors-shape-subduedalt:#d9dae8;
404
+ --basecolors-shape-taxi-contrast:#ffe082;
405
+ --basecolors-shape-taxi-default:#3d3e40;
406
+ --basecolors-shape-train-contrast:#42a5f5;
407
+ --basecolors-shape-train-default:#00367f;
408
+ --basecolors-shape-tram-contrast:#b482fb;
409
+ --basecolors-shape-tram-default:#78469a;
410
+ --basecolors-shape-walk-contrast:#8284ab;
411
+ --basecolors-shape-walk-default:#8d8e9c;
412
+ --basecolors-shape-airportlinkbus-contrast:#fbafea;
413
+ --basecolors-shape-airportlinkbus-default:#800664;
414
+ --basecolors-shape-airportlinkrail-contrast:#fbafea;
415
+ --basecolors-shape-airportlinkrail-default:#800664;
416
+ --basecolors-stroke-contrast:#aeb7e2;
417
+ --basecolors-stroke-default:#181c56;
418
+ --basecolors-stroke-disabled:#949699;
419
+ --basecolors-stroke-focus-contrast:#aeb7e2;
420
+ --basecolors-stroke-focus-standard:#181c56;
421
+ --basecolors-stroke-highlight:#ff5959;
422
+ --basecolors-stroke-light:#ffffff;
423
+ --basecolors-stroke-subdued:#8284ab;
424
+ --basecolors-stroke-subduedalt:#e3e6e8;
425
+ --basecolors-text-accent:#181c56;
426
+ --basecolors-text-disabled:#6e6f73;
427
+ --basecolors-text-disabledalt:#b6b8ba;
428
+ --basecolors-text-highlight:#ff5959;
429
+ --basecolors-text-light:#ffffff;
430
+ --basecolors-text-subdued:#626493;
431
+ --basecolors-text-subduedalt:#d9dae8;
509
432
  }
510
433
 
511
- /* DO NOT CHANGE!*/
512
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
513
- :root {
514
- --contrast-bicycle: #00db9b;
515
- --contrast-bus: #ff6392;
516
- --contrast-bus-transparent: #ff639226;
517
- --contrast-cableway: #b482fb;
518
- --contrast-cableway-transparent: #b482fb26;
519
- --contrast-carferry: #6fdfff;
520
- --contrast-carferry-transparent: #6fdfff26;
521
- --contrast-citybike: #00db9b;
522
- --contrast-ferry: #6fdfff;
523
- --contrast-ferry-transparent: #6fdfff26;
524
- --contrast-funicular: #b482fb;
525
- --contrast-funicular-transparent: #b482fb26;
526
- --contrast-helicopter: #fbafea;
527
- --contrast-helicopter-transparent: #fbafea26;
528
- --contrast-metro: #f08901;
529
- --contrast-metro-transparent: #f0890126;
530
- --contrast-mobility: #00db9b;
531
- --contrast-neutral: #ffffff;
532
- --contrast-plane: #fbafea;
533
- --contrast-plane-transparent: #fbafea26;
534
- --contrast-taxi: #ffe082;
535
- --contrast-taxi-transparent: #ffe08226;
536
- --contrast-train: #42a5f5;
537
- --contrast-train-transparent: #42a5f526;
538
- --contrast-tram: #b482fb;
539
- --contrast-tram-transparent: #b482fb26;
540
- --contrast-walk: #8284ab;
541
- --contrast-airportlinkbus: #fbafea;
542
- --contrast-airportlinkbus-transparent: #fbafea26;
543
- --contrast-airportlinkrail: #fbafea;
544
- --contrast-airportlinkrail-transparent: #fbafea26;
545
- --dark-bicycle: #4db295;
546
- --dark-bus: #ef7398;
547
- --dark-bus-transparent: #ef739826;
548
- --dark-cableway: #b898e5;
549
- --dark-cableway-transparent: #b898e526;
550
- --dark-carferry: #8ccfe2;
551
- --dark-carferry-transparent: #8ccfe226;
552
- --dark-citybike: #4db295;
553
- --dark-ferry: #8ccfe2;
554
- --dark-ferry-transparent: #8ccfe226;
555
- --dark-funicular: #b898e5;
556
- --dark-funicular-transparent: #b898e526;
557
- --dark-helicopter: #f2b8e5;
558
- --dark-helicopter-transparent: #f2b8e526;
559
- --dark-metro: #dd973c;
560
- --dark-metro-transparent: #dd973c26;
561
- --dark-mobility: #4db295;
562
- --dark-neutral: #e5e5e9;
563
- --dark-plane: #f2b8e5;
564
- --dark-plane-transparent: #f2b8e526;
565
- --dark-taxi: #ffe082;
566
- --dark-taxi-transparent: #ffe08226;
567
- --dark-train: #60a2d7;
568
- --dark-train-transparent: #60a2d726;
569
- --dark-tram: #b898e5;
570
- --dark-tram-transparent: #b898e526;
571
- --dark-walk: #8d8e9c;
572
- --dark-airportlinkbus: #f2b8e5;
573
- --dark-airportlinkbus-transparent: #f2b8e526;
574
- --dark-airportlinkrail: #f2b8e5;
575
- --dark-airportlinkrail-transparent: #f2b8e526;
576
- --standard-bicycle: #33826b;
577
- --standard-bus: #c5044e;
578
- --standard-bus-transparent: #c5044e26;
579
- --standard-cableway: #78469a;
580
- --standard-cableway-transparent: #78469a26;
581
- --standard-carferry: #0c6693;
582
- --standard-carferry-transparent: #0c669326;
583
- --standard-citybike: #33826b;
584
- --standard-ferry: #0c6693;
585
- --standard-ferry-transparent: #0c669326;
586
- --standard-funicular: #78469a;
587
- --standard-funicular-transparent: #78469a26;
588
- --standard-helicopter: #800664;
589
- --standard-helicopter-transparent: #80066426;
590
- --standard-metro: #bf5826;
591
- --standard-metro-transparent: #bf582626;
592
- --standard-mobility: #33826b;
593
- --standard-neutral: #181c56;
594
- --standard-plane: #800664;
595
- --standard-plane-transparent: #80066426;
596
- --standard-taxi: #3d3e40;
597
- --standard-taxi-transparent: #3d3e4026;
598
- --standard-train: #00367f;
599
- --standard-train-transparent: #00367f26;
600
- --standard-tram: #78469a;
601
- --standard-tram-transparent: #78469a26;
602
- --standard-walk: #8d8e9c;
603
- --standard-airportlinkbus: #800664;
604
- --standard-airportlinkbus-transparent: #80066426;
605
- --standard-airportlinkrail: #800664;
606
- --standard-airportlinkrail-transparent: #80066426;
434
+ [data-color-mode=dark]{
435
+ --basecolors-frame-contrast:#212233;
436
+ --basecolors-frame-contrastalt:#141527;
437
+ --basecolors-frame-contrastalt-2:#08091c;
438
+ --basecolors-frame-default:#08091c;
439
+ --basecolors-frame-elevated:rgba(229, 229, 233, 0.1490196078);
440
+ --basecolors-frame-elevatedalt:#464755;
441
+ --basecolors-frame-subdued:#2d2e3e;
442
+ --basecolors-frame-tint:#141527;
443
+ --basecolors-shape-accent:#e5e5e9;
444
+ --basecolors-shape-bicycle-contrast:#4db295;
445
+ --basecolors-shape-bicycle-default:#4db295;
446
+ --basecolors-shape-bus-contrast:#ef7398;
447
+ --basecolors-shape-bus-default:#ef7398;
448
+ --basecolors-shape-cableway-contrast:#b898e5;
449
+ --basecolors-shape-cableway-default:#b898e5;
450
+ --basecolors-shape-disabled:#b6b8ba;
451
+ --basecolors-shape-disabledalt:#b3b4bd;
452
+ --basecolors-shape-ferry-contrast:#8ccfe2;
453
+ --basecolors-shape-ferry-default:#8ccfe2;
454
+ --basecolors-shape-funicular-contrast:#b898e5;
455
+ --basecolors-shape-funicular-default:#b898e5;
456
+ --basecolors-shape-helicopter-contrast:#f2b8e5;
457
+ --basecolors-shape-helicopter-default:#f2b8e5;
458
+ --basecolors-shape-highlight:#ff9494;
459
+ --basecolors-shape-light:#e5e5e9;
460
+ --basecolors-shape-mask:#2d2e3e;
461
+ --basecolors-shape-maskalt:#393a49;
462
+ --basecolors-shape-metro-contrast:#dd973c;
463
+ --basecolors-shape-metro-default:#dd973c;
464
+ --basecolors-shape-mobility-contrast:#4db295;
465
+ --basecolors-shape-mobility-default:#4db295;
466
+ --basecolors-shape-plane-contrast:#f2b8e5;
467
+ --basecolors-shape-plane-default:#f2b8e5;
468
+ --basecolors-shape-subdued:#b3b4bd;
469
+ --basecolors-shape-subduedalt:#b3b4bd;
470
+ --basecolors-shape-taxi-contrast:#ffe082;
471
+ --basecolors-shape-taxi-default:#ffe082;
472
+ --basecolors-shape-train-contrast:#60a2d7;
473
+ --basecolors-shape-train-default:#60a2d7;
474
+ --basecolors-shape-tram-contrast:#b898e5;
475
+ --basecolors-shape-tram-default:#b898e5;
476
+ --basecolors-shape-walk-contrast:#8d8e9c;
477
+ --basecolors-shape-walk-default:#8d8e9c;
478
+ --basecolors-shape-airportlinkbus-contrast:#f2b8e5;
479
+ --basecolors-shape-airportlinkbus-default:#f2b8e5;
480
+ --basecolors-shape-airportlinkrail-contrast:#f2b8e5;
481
+ --basecolors-shape-airportlinkrail-default:#f2b8e5;
482
+ --basecolors-stroke-contrast:#aeb7e2;
483
+ --basecolors-stroke-default:#b3b4bd;
484
+ --basecolors-stroke-disabled:#e3e6e8;
485
+ --basecolors-stroke-focus-contrast:#aeb7e2;
486
+ --basecolors-stroke-focus-standard:#aeb7e2;
487
+ --basecolors-stroke-highlight:#ff9494;
488
+ --basecolors-stroke-light:#b3b4bd;
489
+ --basecolors-stroke-subdued:#81828f;
490
+ --basecolors-stroke-subduedalt:#949699;
491
+ --basecolors-text-accent:#e5e5e9;
492
+ --basecolors-text-disabled:#b6b8ba;
493
+ --basecolors-text-disabledalt:#b6b8ba;
494
+ --basecolors-text-highlight:#ff9494;
495
+ --basecolors-text-light:#e5e5e9;
496
+ --basecolors-text-subdued:#b3b4bd;
497
+ --basecolors-text-subduedalt:#b3b4bd;
498
+ }
499
+ :root{
500
+ --contrast-bicycle:#00db9b;
501
+ --contrast-bus:#ff6392;
502
+ --contrast-bus-transparent:rgba(255,99,146,0.14902);
503
+ --contrast-cableway:#b482fb;
504
+ --contrast-cableway-transparent:rgba(180,130,251,0.14902);
505
+ --contrast-carferry:#6fdfff;
506
+ --contrast-carferry-transparent:rgba(111,223,255,0.14902);
507
+ --contrast-citybike:#00db9b;
508
+ --contrast-ferry:#6fdfff;
509
+ --contrast-ferry-transparent:rgba(111,223,255,0.14902);
510
+ --contrast-funicular:#b482fb;
511
+ --contrast-funicular-transparent:rgba(180,130,251,0.14902);
512
+ --contrast-helicopter:#fbafea;
513
+ --contrast-helicopter-transparent:rgba(251,175,234,0.14902);
514
+ --contrast-metro:#f08901;
515
+ --contrast-metro-transparent:rgba(240,137,1,0.14902);
516
+ --contrast-mobility:#00db9b;
517
+ --contrast-neutral:#ffffff;
518
+ --contrast-plane:#fbafea;
519
+ --contrast-plane-transparent:rgba(251,175,234,0.14902);
520
+ --contrast-taxi:#ffe082;
521
+ --contrast-taxi-transparent:rgba(255,224,130,0.14902);
522
+ --contrast-train:#42a5f5;
523
+ --contrast-train-transparent:rgba(66,165,245,0.14902);
524
+ --contrast-tram:#b482fb;
525
+ --contrast-tram-transparent:rgba(180,130,251,0.14902);
526
+ --contrast-walk:#8284ab;
527
+ --contrast-airportlinkbus:#fbafea;
528
+ --contrast-airportlinkbus-transparent:rgba(251,175,234,0.14902);
529
+ --contrast-airportlinkrail:#fbafea;
530
+ --contrast-airportlinkrail-transparent:rgba(251,175,234,0.14902);
531
+ --dark-bicycle:#4db295;
532
+ --dark-bus:#ef7398;
533
+ --dark-bus-transparent:rgba(239,115,152,0.14902);
534
+ --dark-cableway:#b898e5;
535
+ --dark-cableway-transparent:rgba(184,152,229,0.14902);
536
+ --dark-carferry:#8ccfe2;
537
+ --dark-carferry-transparent:rgba(140,207,226,0.14902);
538
+ --dark-citybike:#4db295;
539
+ --dark-ferry:#8ccfe2;
540
+ --dark-ferry-transparent:rgba(140,207,226,0.14902);
541
+ --dark-funicular:#b898e5;
542
+ --dark-funicular-transparent:rgba(184,152,229,0.14902);
543
+ --dark-helicopter:#f2b8e5;
544
+ --dark-helicopter-transparent:rgba(242,184,229,0.14902);
545
+ --dark-metro:#dd973c;
546
+ --dark-metro-transparent:rgba(221,151,60,0.14902);
547
+ --dark-mobility:#4db295;
548
+ --dark-neutral:#e5e5e9;
549
+ --dark-plane:#f2b8e5;
550
+ --dark-plane-transparent:rgba(242,184,229,0.14902);
551
+ --dark-taxi:#ffe082;
552
+ --dark-taxi-transparent:rgba(255,224,130,0.14902);
553
+ --dark-train:#60a2d7;
554
+ --dark-train-transparent:rgba(96,162,215,0.14902);
555
+ --dark-tram:#b898e5;
556
+ --dark-tram-transparent:rgba(184,152,229,0.14902);
557
+ --dark-walk:#8d8e9c;
558
+ --dark-airportlinkbus:#f2b8e5;
559
+ --dark-airportlinkbus-transparent:rgba(242,184,229,0.14902);
560
+ --dark-airportlinkrail:#f2b8e5;
561
+ --dark-airportlinkrail-transparent:rgba(242,184,229,0.14902);
562
+ --standard-bicycle:#33826b;
563
+ --standard-bus:#c5044e;
564
+ --standard-bus-transparent:rgba(197,4,78,0.14902);
565
+ --standard-cableway:#78469a;
566
+ --standard-cableway-transparent:rgba(120,70,154,0.14902);
567
+ --standard-carferry:#0c6693;
568
+ --standard-carferry-transparent:rgba(12,102,147,0.14902);
569
+ --standard-citybike:#33826b;
570
+ --standard-ferry:#0c6693;
571
+ --standard-ferry-transparent:rgba(12,102,147,0.14902);
572
+ --standard-funicular:#78469a;
573
+ --standard-funicular-transparent:rgba(120,70,154,0.14902);
574
+ --standard-helicopter:#800664;
575
+ --standard-helicopter-transparent:rgba(128,6,100,0.14902);
576
+ --standard-metro:#bf5826;
577
+ --standard-metro-transparent:rgba(191,88,38,0.14902);
578
+ --standard-mobility:#33826b;
579
+ --standard-neutral:#181c56;
580
+ --standard-plane:#800664;
581
+ --standard-plane-transparent:rgba(128,6,100,0.14902);
582
+ --standard-taxi:#3d3e40;
583
+ --standard-taxi-transparent:rgba(61,62,64,0.14902);
584
+ --standard-train:#00367f;
585
+ --standard-train-transparent:rgba(0,54,127,0.14902);
586
+ --standard-tram:#78469a;
587
+ --standard-tram-transparent:rgba(120,70,154,0.14902);
588
+ --standard-walk:#8d8e9c;
589
+ --standard-airportlinkbus:#800664;
590
+ --standard-airportlinkbus-transparent:rgba(128,6,100,0.14902);
591
+ --standard-airportlinkrail:#800664;
592
+ --standard-airportlinkrail-transparent:rgba(128,6,100,0.14902);
607
593
  }
608
594
 
609
- :root {
610
- --eds-form: 1;
611
- }/* DO NOT CHANGE!*/
612
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
613
- .eds-feedback-text {
614
- display: flex;
615
- align-items: center;
616
- margin-top: 0.25rem;
617
- }
618
- .eds-feedback-text--info, .eds-feedback-text--information {
619
- padding-left: calc(1rem + 0.125rem);
620
- }
621
- .eds-feedback-text__text {
622
- color: var(--components-form-feedbacktext-information-standard-text);
623
- }
624
- .eds-contrast .eds-feedback-text__text {
625
- color: var(--components-form-feedbacktext-information-contrast-text);
595
+ :root{
596
+ --eds-form:1;
597
+ }.eds-feedback-text{
598
+ display:-webkit-box;
599
+ display:-webkit-flex;
600
+ display:-moz-box;
601
+ display:flex;
602
+ -webkit-box-align:center;
603
+ -webkit-align-items:center;
604
+ -moz-box-align:center;
605
+ align-items:center;
606
+ margin-top:0.25rem;
607
+ }
608
+ .eds-feedback-text--info, .eds-feedback-text--information{
609
+ padding-left:-webkit-calc(1rem + 0.125rem);
610
+ padding-left:-moz-calc(1rem + 0.125rem);
611
+ padding-left:calc(1rem + 0.125rem);
612
+ }
613
+ .eds-feedback-text__text{
614
+ color:var(--components-form-feedbacktext-information-standard-text);
615
+ }
616
+ .eds-contrast .eds-feedback-text__text{
617
+ color:var(--components-form-feedbacktext-information-contrast-text);
626
618
  }
627
619
 
628
- .eds-feedback-text__icon {
629
- font-size: 1.5rem;
630
- min-height: 1.5rem;
631
- min-width: 1.5rem;
632
- padding-right: 0.5rem;
633
- position: relative;
634
- top: -0.1rem;
635
- }
636
- .eds-feedback-text__icon--success {
637
- color: var(--components-form-feedbacktext-success-standard-icon-fill);
638
- }
639
- .eds-feedback-text__icon--success circle {
640
- fill: var(--components-form-feedbacktext-success-standard-icon-symbol);
641
- }
642
- .eds-contrast .eds-feedback-text__icon--success {
643
- color: var(--components-form-feedbacktext-success-contrast-icon-fill);
644
- }
645
- .eds-contrast .eds-feedback-text__icon--success circle {
646
- fill: var(--components-form-feedbacktext-success-contrast-icon-symbol);
647
- }
648
- .eds-feedback-text__icon--error, .eds-feedback-text__icon--negative {
649
- color: var(--components-form-feedbacktext-negative-standard-icon-fill);
650
- }
651
- .eds-feedback-text__icon--error circle, .eds-feedback-text__icon--negative circle {
652
- fill: var(--components-form-feedbacktext-negative-standard-icon-symbol);
653
- }
654
- .eds-contrast .eds-feedback-text__icon--error, .eds-contrast .eds-feedback-text__icon--negative {
655
- color: var(--components-form-feedbacktext-negative-contrast-icon-fill);
656
- }
657
- .eds-contrast .eds-feedback-text__icon--error circle, .eds-contrast .eds-feedback-text__icon--negative circle {
658
- fill: var(--components-form-feedbacktext-negative-contrast-icon-symbol);
659
- }
660
- .eds-feedback-text__icon--info, .eds-feedback-text__icon--information {
661
- color: var(--components-form-feedbacktext-information-standard-icon-fill);
662
- }
663
- .eds-feedback-text__icon--info circle, .eds-feedback-text__icon--information circle {
664
- fill: var(--components-form-feedbacktext-information-standard-icon-symbol);
665
- }
666
- .eds-contrast .eds-feedback-text__icon--info, .eds-contrast .eds-feedback-text__icon--information {
667
- color: var(--components-form-feedbacktext-information-contrast-icon-fill);
668
- }
669
- .eds-contrast .eds-feedback-text__icon--info circle, .eds-contrast .eds-feedback-text__icon--information circle {
670
- fill: var(--components-form-feedbacktext-information-contrast-icon-symbol);
671
- }
672
- .eds-feedback-text__icon--warning {
673
- color: var(--components-form-feedbacktext-warning-standard-icon-fill);
674
- }
675
- .eds-feedback-text__icon--warning .svg-exclamation {
676
- fill: var(--components-form-feedbacktext-warning-standard-icon-symbol);
677
- }
678
- .eds-contrast .eds-feedback-text__icon--warning {
679
- color: var(--components-form-feedbacktext-warning-contrast-icon-fill);
680
- }
681
- .eds-contrast .eds-feedback-text__icon--warning circle {
682
- fill: var(--components-form-feedbacktext-warning-contrast-icon-symbol);
683
- }/* DO NOT CHANGE!*/
684
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
685
- .eds-input-group {
686
- color: inherit;
687
- display: block;
688
- position: relative;
689
- }
690
- .eds-input-group__label {
691
- color: var(--components-form-baseform-standard-text-label);
692
- display: flex;
693
- font-size: 1rem;
694
- position: absolute;
695
- line-height: 1rem;
696
- height: 3rem;
697
- padding-left: 0;
698
- top: 1rem;
699
- transition: top 0.2s ease-in-out, font-size 0.2s ease-in-out, padding 0.2s ease-in-out, line-height ease-in-out 0.2s;
700
- user-select: none;
701
- pointer-events: none;
702
- }
703
- .eds-form-control-wrapper--is-filled .eds-input-group__label {
704
- top: 0.375rem;
705
- font-size: 0.75rem;
706
- line-height: 0.75rem;
707
- height: 10px;
708
- padding: 0;
709
- }
710
- .eds-textarea__label .eds-form-control-wrapper--is-filled .eds-input-group__label {
711
- box-shadow: 0px -2px 0px 4px var(--textarea-label-background);
712
- background: var(--textarea-label-background);
713
- width: calc(100% - 1rem - 1rem - 4px);
714
- }
715
- .eds-form-control-wrapper--is-filled.eds-form-control-wrapper--size-large .eds-input-group__label {
716
- top: 0.5rem;
717
- font-size: 0.875rem;
718
- line-height: 1rem;
719
- padding: 0;
720
- }
721
- .eds-form-control-wrapper--size-large .eds-input-group__label {
722
- top: 0.75rem;
723
- font-size: 1.5rem;
724
- line-height: 2.25rem;
725
- }
726
- .eds-input-group__label--filled {
727
- top: 0.375rem;
728
- font-size: 0.75rem;
729
- line-height: 0.75rem;
730
- height: 10px;
731
- padding: 0;
732
- }
733
- .eds-textarea__label .eds-input-group__label--filled {
734
- box-shadow: 0px -2px 0px 4px var(--textarea-label-background);
735
- background: var(--textarea-label-background);
736
- width: calc(100% - 1rem - 1rem - 4px);
737
- }
738
- .eds-form-control-wrapper--size-large .eds-input-group__label--filled {
739
- top: 0.5rem;
740
- font-size: 0.875rem;
741
- line-height: 1rem;
742
- padding: 0;
620
+ .eds-feedback-text__icon{
621
+ font-size:1.5rem;
622
+ min-height:1.5rem;
623
+ min-width:1.5rem;
624
+ padding-right:0.5rem;
625
+ position:relative;
626
+ top:-0.1rem;
627
+ }
628
+ .eds-feedback-text__icon--success{
629
+ color:var(--components-form-feedbacktext-success-standard-icon-fill);
630
+ }
631
+ .eds-feedback-text__icon--success circle{
632
+ fill:var(--components-form-feedbacktext-success-standard-icon-symbol);
633
+ }
634
+ .eds-contrast .eds-feedback-text__icon--success{
635
+ color:var(--components-form-feedbacktext-success-contrast-icon-fill);
636
+ }
637
+ .eds-contrast .eds-feedback-text__icon--success circle{
638
+ fill:var(--components-form-feedbacktext-success-contrast-icon-symbol);
639
+ }
640
+ .eds-feedback-text__icon--error, .eds-feedback-text__icon--negative{
641
+ color:var(--components-form-feedbacktext-negative-standard-icon-fill);
642
+ }
643
+ .eds-feedback-text__icon--error circle, .eds-feedback-text__icon--negative circle{
644
+ fill:var(--components-form-feedbacktext-negative-standard-icon-symbol);
645
+ }
646
+ .eds-contrast .eds-feedback-text__icon--error, .eds-contrast .eds-feedback-text__icon--negative{
647
+ color:var(--components-form-feedbacktext-negative-contrast-icon-fill);
648
+ }
649
+ .eds-contrast .eds-feedback-text__icon--error circle, .eds-contrast .eds-feedback-text__icon--negative circle{
650
+ fill:var(--components-form-feedbacktext-negative-contrast-icon-symbol);
651
+ }
652
+ .eds-feedback-text__icon--info, .eds-feedback-text__icon--information{
653
+ color:var(--components-form-feedbacktext-information-standard-icon-fill);
654
+ }
655
+ .eds-feedback-text__icon--info circle, .eds-feedback-text__icon--information circle{
656
+ fill:var(--components-form-feedbacktext-information-standard-icon-symbol);
657
+ }
658
+ .eds-contrast .eds-feedback-text__icon--info, .eds-contrast .eds-feedback-text__icon--information{
659
+ color:var(--components-form-feedbacktext-information-contrast-icon-fill);
660
+ }
661
+ .eds-contrast .eds-feedback-text__icon--info circle, .eds-contrast .eds-feedback-text__icon--information circle{
662
+ fill:var(--components-form-feedbacktext-information-contrast-icon-symbol);
663
+ }
664
+ .eds-feedback-text__icon--warning{
665
+ color:var(--components-form-feedbacktext-warning-standard-icon-fill);
666
+ }
667
+ .eds-feedback-text__icon--warning .svg-exclamation{
668
+ fill:var(--components-form-feedbacktext-warning-standard-icon-symbol);
669
+ }
670
+ .eds-contrast .eds-feedback-text__icon--warning{
671
+ color:var(--components-form-feedbacktext-warning-contrast-icon-fill);
672
+ }
673
+ .eds-contrast .eds-feedback-text__icon--warning circle{
674
+ fill:var(--components-form-feedbacktext-warning-contrast-icon-symbol);
675
+ }.eds-input-group{
676
+ color:inherit;
677
+ display:block;
678
+ position:relative;
679
+ }
680
+ .eds-input-group__label{
681
+ color:var(--components-form-baseform-standard-text-label);
682
+ display:-webkit-box;
683
+ display:-webkit-flex;
684
+ display:-moz-box;
685
+ display:flex;
686
+ font-size:1rem;
687
+ position:absolute;
688
+ line-height:1rem;
689
+ height:3rem;
690
+ padding-left:0;
691
+ top:1rem;
692
+ -webkit-transition:top 0.2s ease-in-out, font-size 0.2s ease-in-out, padding 0.2s ease-in-out, line-height ease-in-out 0.2s;
693
+ -o-transition:top 0.2s ease-in-out, font-size 0.2s ease-in-out, padding 0.2s ease-in-out, line-height ease-in-out 0.2s;
694
+ -moz-transition:top 0.2s ease-in-out, font-size 0.2s ease-in-out, padding 0.2s ease-in-out, line-height ease-in-out 0.2s;
695
+ transition:top 0.2s ease-in-out, font-size 0.2s ease-in-out, padding 0.2s ease-in-out, line-height ease-in-out 0.2s;
696
+ -webkit-user-select:none;
697
+ -moz-user-select:none;
698
+ -ms-user-select:none;
699
+ user-select:none;
700
+ pointer-events:none;
701
+ }
702
+ .eds-form-control-wrapper--is-filled .eds-input-group__label{
703
+ top:0.375rem;
704
+ font-size:0.75rem;
705
+ line-height:0.75rem;
706
+ height:10px;
707
+ padding:0;
708
+ }
709
+ .eds-textarea__label .eds-form-control-wrapper--is-filled .eds-input-group__label{
710
+ -webkit-box-shadow:0px -2px 0px 4px var(--textarea-label-background);
711
+ -moz-box-shadow:0px -2px 0px 4px var(--textarea-label-background);
712
+ box-shadow:0px -2px 0px 4px var(--textarea-label-background);
713
+ background:var(--textarea-label-background);
714
+ width:-webkit-calc(100% - 1rem - 1rem - 4px);
715
+ width:-moz-calc(100% - 1rem - 1rem - 4px);
716
+ width:calc(100% - 1rem - 1rem - 4px);
717
+ }
718
+ .eds-form-control-wrapper--is-filled.eds-form-control-wrapper--size-large .eds-input-group__label{
719
+ top:0.5rem;
720
+ font-size:0.875rem;
721
+ line-height:1rem;
722
+ padding:0;
723
+ }
724
+ .eds-form-control-wrapper--size-large .eds-input-group__label{
725
+ top:0.75rem;
726
+ font-size:1.5rem;
727
+ line-height:2.25rem;
728
+ }
729
+ .eds-input-group__label--filled{
730
+ top:0.375rem;
731
+ font-size:0.75rem;
732
+ line-height:0.75rem;
733
+ height:10px;
734
+ padding:0;
735
+ }
736
+ .eds-textarea__label .eds-input-group__label--filled{
737
+ -webkit-box-shadow:0px -2px 0px 4px var(--textarea-label-background);
738
+ -moz-box-shadow:0px -2px 0px 4px var(--textarea-label-background);
739
+ box-shadow:0px -2px 0px 4px var(--textarea-label-background);
740
+ background:var(--textarea-label-background);
741
+ width:-webkit-calc(100% - 1rem - 1rem - 4px);
742
+ width:-moz-calc(100% - 1rem - 1rem - 4px);
743
+ width:calc(100% - 1rem - 1rem - 4px);
744
+ }
745
+ .eds-form-control-wrapper--size-large .eds-input-group__label--filled{
746
+ top:0.5rem;
747
+ font-size:0.875rem;
748
+ line-height:1rem;
749
+ padding:0;
743
750
  }
744
751
 
745
- .eds-form-control-wrapper:focus-within :not(.eds-input-group-label-wrapper--controlled-label-position) .eds-input-group__label {
746
- top: 0.375rem;
747
- font-size: 0.75rem;
748
- line-height: 0.75rem;
749
- height: 10px;
750
- padding: 0;
751
- }
752
- .eds-textarea__label .eds-form-control-wrapper:focus-within :not(.eds-input-group-label-wrapper--controlled-label-position) .eds-input-group__label {
753
- box-shadow: 0px -2px 0px 4px var(--textarea-label-background);
754
- background: var(--textarea-label-background);
755
- width: calc(100% - 1rem - 1rem - 4px);
756
- }
757
- .eds-form-control-wrapper--size-large:focus-within :not(.eds-input-group-label-wrapper--controlled-label-position) .eds-input-group__label {
758
- top: 0.5rem;
759
- font-size: 0.875rem;
760
- line-height: 1rem;
761
- padding: 0;
762
- }
763
- .eds-form-control-wrapper--disabled:focus-within .eds-input-group__label {
764
- top: 1rem;
765
- font-size: 1rem;
766
- height: 3rem;
767
- line-height: 1rem;
768
- }/* DO NOT CHANGE!*/
769
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
770
- .eds-form-control__field-and-feedback-text {
771
- display: flex;
772
- flex-direction: column;
773
- height: fit-content;
774
- width: 100%;
775
- }
776
- .eds-form-control__field-and-feedback-text--has-tooltip {
777
- padding-right: 2rem;
778
- }
779
- .eds-form-control__field-and-feedback-text:has(.eds-form-control-wrapper--disabled):not(:has(.eds-form-control-wrapper--readonly)) {
780
- cursor: not-allowed;
781
- }
782
- .eds-form-control-wrapper {
783
- display: flex;
784
- align-items: center;
785
- position: relative;
786
- flex: 1;
787
- min-height: 3rem;
788
- padding-inline: 1rem;
789
- background-color: var(--components-form-baseform-standard-fill-default);
790
- border-radius: 0.25rem;
791
- border: 0.125rem solid var(--components-form-baseform-standard-border-default);
792
- box-shadow: 0 0 0 transparent;
793
- color: var(--components-form-baseform-standard-text-content);
794
- transition: border-color 0.1s ease-in-out;
795
- }
796
- .eds-form-control-wrapper:hover {
797
- border-color: var(--components-form-baseform-standard-border-interactive);
798
- }
799
- .eds-contrast .eds-form-control-wrapper:hover {
800
- border-color: var(--components-form-baseform-contrast-border-interactive);
801
- }
802
- .eds-form-control-wrapper:focus-within:not(.eds-form-control-wrapper--readonly) {
803
- border-color: var(--components-form-baseform-standard-border-interactive);
804
- outline: 2px solid var(--components-form-baseform-standard-border-interactive);
805
- }
806
- .eds-contrast .eds-form-control-wrapper:focus-within:not(.eds-form-control-wrapper--readonly) {
807
- border-color: var(--components-form-baseform-contrast-border-interactive);
808
- outline-color: var(--components-form-baseform-contrast-border-interactive);
809
- }
810
- .eds-form-control-wrapper ::placeholder {
811
- color: var(--components-form-baseform-standard-text-label);
812
- }
813
- .eds-form-control-wrapper--disabled {
814
- border-color: transparent;
815
- background-color: var(--components-form-baseform-standard-fill-disabled);
816
- pointer-events: none;
817
- color: var(--components-form-baseform-standard-text-disabled);
818
- }
819
- .eds-form-control-wrapper--disabled .eds-input-group__label {
820
- color: var(--components-form-baseform-standard-text-disabled);
821
- }
822
- .eds-contrast .eds-form-control-wrapper--disabled {
823
- border-color: transparent;
824
- background-color: var(--components-form-baseform-contrast-fill-disabled);
825
- color: var(--components-form-baseform-contrast-text-disabled);
826
- }
827
- .eds-contrast .eds-form-control-wrapper--disabled .eds-input-group__label {
828
- color: var(--components-form-baseform-contrast-text-disabled);
829
- }
830
- .eds-form-control-wrapper--disabled::before, .eds-form-control-wrapper--disabled::after {
831
- display: none;
832
- }
833
- .eds-form-control-wrapper--disabled:focus-within {
834
- border-color: transparent;
835
- outline: none;
836
- }
837
- .eds-contrast .eds-form-control-wrapper--disabled:focus-within {
838
- border-color: transparent;
839
- outline: none;
840
- }
841
- .eds-form-control-wrapper--readonly {
842
- border-color: transparent;
843
- cursor: default;
844
- background: var(--components-form-baseform-standard-fill-readonly);
845
- border: var(--components-form-baseform-standard-fill-readonly);
846
- }
847
- .eds-form-control-wrapper--readonly:focus-visible {
848
- outline: none;
849
- }
850
- .eds-contrast .eds-form-control-wrapper--readonly {
851
- background: var(--components-form-baseform-contrast-fill-readonly);
852
- border: var(--components-form-baseform-contrast-fill-readonly);
853
- color: var(--components-form-baseform-contrast-text-description);
854
- }
855
- .eds-contrast .eds-form-control-wrapper--readonly .eds-form-control {
856
- color: var(--components-form-baseform-contrast-text-description);
857
- }
858
- .eds-contrast .eds-form-control-wrapper--readonly .eds-input-group__label {
859
- color: var(--components-form-baseform-contrast-text-description);
860
- }
861
- .eds-form-control-wrapper--readonly::before, .eds-form-control-wrapper--readonly::after {
862
- display: none;
752
+ .eds-form-control-wrapper:focus-within :not(.eds-input-group-label-wrapper--controlled-label-position) .eds-input-group__label{
753
+ top:0.375rem;
754
+ font-size:0.75rem;
755
+ line-height:0.75rem;
756
+ height:10px;
757
+ padding:0;
758
+ }
759
+ .eds-textarea__label .eds-form-control-wrapper:focus-within :not(.eds-input-group-label-wrapper--controlled-label-position) .eds-input-group__label{
760
+ -webkit-box-shadow:0px -2px 0px 4px var(--textarea-label-background);
761
+ -moz-box-shadow:0px -2px 0px 4px var(--textarea-label-background);
762
+ box-shadow:0px -2px 0px 4px var(--textarea-label-background);
763
+ background:var(--textarea-label-background);
764
+ width:-webkit-calc(100% - 1rem - 1rem - 4px);
765
+ width:-moz-calc(100% - 1rem - 1rem - 4px);
766
+ width:calc(100% - 1rem - 1rem - 4px);
767
+ }
768
+ .eds-form-control-wrapper--size-large:focus-within :not(.eds-input-group-label-wrapper--controlled-label-position) .eds-input-group__label{
769
+ top:0.5rem;
770
+ font-size:0.875rem;
771
+ line-height:1rem;
772
+ padding:0;
773
+ }
774
+ .eds-form-control-wrapper--disabled:focus-within .eds-input-group__label{
775
+ top:1rem;
776
+ font-size:1rem;
777
+ height:3rem;
778
+ line-height:1rem;
779
+ }.eds-form-control__field-and-feedback-text{
780
+ display:-webkit-box;
781
+ display:-webkit-flex;
782
+ display:-moz-box;
783
+ display:flex;
784
+ -webkit-box-orient:vertical;
785
+ -webkit-box-direction:normal;
786
+ -webkit-flex-direction:column;
787
+ -moz-box-orient:vertical;
788
+ -moz-box-direction:normal;
789
+ flex-direction:column;
790
+ height:-webkit-fit-content;
791
+ height:-moz-fit-content;
792
+ height:fit-content;
793
+ width:100%;
794
+ }
795
+ .eds-form-control__field-and-feedback-text--has-tooltip{
796
+ padding-right:2rem;
797
+ }
798
+ .eds-form-control__field-and-feedback-text:has(.eds-form-control-wrapper--disabled):not(:has(.eds-form-control-wrapper--readonly)){
799
+ cursor:not-allowed;
800
+ }
801
+ .eds-form-control-wrapper{
802
+ display:-webkit-box;
803
+ display:-webkit-flex;
804
+ display:-moz-box;
805
+ display:flex;
806
+ -webkit-box-align:center;
807
+ -webkit-align-items:center;
808
+ -moz-box-align:center;
809
+ align-items:center;
810
+ position:relative;
811
+ -webkit-box-flex:1;
812
+ -webkit-flex:1;
813
+ -moz-box-flex:1;
814
+ flex:1;
815
+ min-height:3rem;
816
+ padding-inline:1rem;
817
+ background-color:var(--components-form-baseform-standard-fill-default);
818
+ -webkit-border-radius:0.25rem;
819
+ -moz-border-radius:0.25rem;
820
+ border-radius:0.25rem;
821
+ border:0.125rem solid var(--components-form-baseform-standard-border-default);
822
+ -webkit-box-shadow:0 0 0 transparent;
823
+ -moz-box-shadow:0 0 0 transparent;
824
+ box-shadow:0 0 0 transparent;
825
+ color:var(--components-form-baseform-standard-text-content);
826
+ -webkit-transition:border-color 0.1s ease-in-out;
827
+ -o-transition:border-color 0.1s ease-in-out;
828
+ -moz-transition:border-color 0.1s ease-in-out;
829
+ transition:border-color 0.1s ease-in-out;
830
+ }
831
+ .eds-form-control-wrapper:hover{
832
+ border-color:var(--components-form-baseform-standard-border-interactive);
833
+ }
834
+ .eds-contrast .eds-form-control-wrapper:hover{
835
+ border-color:var(--components-form-baseform-contrast-border-interactive);
836
+ }
837
+ .eds-form-control-wrapper:focus-within:not(.eds-form-control-wrapper--readonly){
838
+ border-color:var(--components-form-baseform-standard-border-interactive);
839
+ outline:2px solid var(--components-form-baseform-standard-border-interactive);
840
+ }
841
+ .eds-contrast .eds-form-control-wrapper:focus-within:not(.eds-form-control-wrapper--readonly){
842
+ border-color:var(--components-form-baseform-contrast-border-interactive);
843
+ outline-color:var(--components-form-baseform-contrast-border-interactive);
844
+ }
845
+ .eds-form-control-wrapper ::-webkit-input-placeholder{
846
+ color:var(--components-form-baseform-standard-text-label);
847
+ }
848
+ .eds-form-control-wrapper :-moz-placeholder{
849
+ color:var(--components-form-baseform-standard-text-label);
850
+ }
851
+ .eds-form-control-wrapper ::-moz-placeholder{
852
+ color:var(--components-form-baseform-standard-text-label);
853
+ }
854
+ .eds-form-control-wrapper ::-ms-input-placeholder{
855
+ color:var(--components-form-baseform-standard-text-label);
856
+ }
857
+ .eds-form-control-wrapper ::placeholder{
858
+ color:var(--components-form-baseform-standard-text-label);
859
+ }
860
+ .eds-form-control-wrapper--disabled{
861
+ border-color:transparent;
862
+ background-color:var(--components-form-baseform-standard-fill-disabled);
863
+ pointer-events:none;
864
+ color:var(--components-form-baseform-standard-text-disabled);
865
+ }
866
+ .eds-form-control-wrapper--disabled .eds-input-group__label{
867
+ color:var(--components-form-baseform-standard-text-disabled);
868
+ }
869
+ .eds-contrast .eds-form-control-wrapper--disabled{
870
+ border-color:transparent;
871
+ background-color:var(--components-form-baseform-contrast-fill-disabled);
872
+ color:var(--components-form-baseform-contrast-text-disabled);
873
+ }
874
+ .eds-contrast .eds-form-control-wrapper--disabled .eds-input-group__label{
875
+ color:var(--components-form-baseform-contrast-text-disabled);
876
+ }
877
+ .eds-form-control-wrapper--disabled::before, .eds-form-control-wrapper--disabled::after{
878
+ display:none;
879
+ }
880
+ .eds-form-control-wrapper--disabled:focus-within{
881
+ border-color:transparent;
882
+ outline:none;
883
+ }
884
+ .eds-contrast .eds-form-control-wrapper--disabled:focus-within{
885
+ border-color:transparent;
886
+ outline:none;
887
+ }
888
+ .eds-form-control-wrapper--readonly{
889
+ border-color:transparent;
890
+ cursor:default;
891
+ background:var(--components-form-baseform-standard-fill-readonly);
892
+ border:var(--components-form-baseform-standard-fill-readonly);
893
+ }
894
+ .eds-form-control-wrapper--readonly:focus-visible{
895
+ outline:none;
896
+ }
897
+ .eds-contrast .eds-form-control-wrapper--readonly{
898
+ background:var(--components-form-baseform-contrast-fill-readonly);
899
+ border:var(--components-form-baseform-contrast-fill-readonly);
900
+ color:var(--components-form-baseform-contrast-text-description);
901
+ }
902
+ .eds-contrast .eds-form-control-wrapper--readonly .eds-form-control{
903
+ color:var(--components-form-baseform-contrast-text-description);
904
+ }
905
+ .eds-contrast .eds-form-control-wrapper--readonly .eds-input-group__label{
906
+ color:var(--components-form-baseform-contrast-text-description);
907
+ }
908
+ .eds-form-control-wrapper--readonly::before, .eds-form-control-wrapper--readonly::after{
909
+ display:none;
863
910
  }
864
911
  .eds-form-control-wrapper--size-medium .eds-form-control,
865
912
  .eds-form-control-wrapper--size-medium .eds-form-control__append,
866
- .eds-form-control-wrapper--size-medium .eds-form-control__prepend {
867
- font-size: 1rem;
868
- line-height: 1rem;
913
+ .eds-form-control-wrapper--size-medium .eds-form-control__prepend{
914
+ font-size:1rem;
915
+ line-height:1rem;
869
916
  }
870
- .eds-form-control-wrapper--size-large {
871
- min-height: 4rem;
917
+ .eds-form-control-wrapper--size-large{
918
+ min-height:4rem;
872
919
  }
873
920
  .eds-form-control-wrapper--size-large .eds-form-control,
874
921
  .eds-form-control-wrapper--size-large .eds-form-control__append,
875
- .eds-form-control-wrapper--size-large .eds-form-control__prepend {
876
- font-size: 1.5rem;
922
+ .eds-form-control-wrapper--size-large .eds-form-control__prepend{
923
+ font-size:1.5rem;
877
924
  }
878
- .eds-form-control-wrapper--success {
879
- border-color: var(--components-form-baseform-standard-border-success);
925
+ .eds-form-control-wrapper--success{
926
+ border-color:var(--components-form-baseform-standard-border-success);
880
927
  }
881
- .eds-form-control-wrapper--success:focus-within {
882
- border-color: var(--components-form-baseform-standard-border-success);
883
- outline-color: var(--components-form-baseform-standard-border-success);
928
+ .eds-form-control-wrapper--success:focus-within{
929
+ border-color:var(--components-form-baseform-standard-border-success);
930
+ outline-color:var(--components-form-baseform-standard-border-success);
884
931
  }
885
- .eds-contrast .eds-form-control-wrapper--success {
886
- border-color: var(--components-form-baseform-standard-border-success);
932
+ .eds-contrast .eds-form-control-wrapper--success{
933
+ border-color:var(--components-form-baseform-standard-border-success);
887
934
  }
888
- .eds-contrast .eds-form-control-wrapper--success:focus-within {
889
- border-color: var(--components-form-baseform-contrast-border-success);
890
- outline-color: var(--components-form-baseform-contrast-border-success);
935
+ .eds-contrast .eds-form-control-wrapper--success:focus-within{
936
+ border-color:var(--components-form-baseform-contrast-border-success);
937
+ outline-color:var(--components-form-baseform-contrast-border-success);
891
938
  }
892
- .eds-form-control-wrapper--error, .eds-form-control-wrapper--negative {
893
- border-color: var(--components-form-baseform-standard-border-negative);
939
+ .eds-form-control-wrapper--error, .eds-form-control-wrapper--negative{
940
+ border-color:var(--components-form-baseform-standard-border-negative);
894
941
  }
895
- .eds-form-control-wrapper--error:focus-within, .eds-form-control-wrapper--negative:focus-within {
896
- border-color: var(--components-form-baseform-standard-border-negative);
897
- outline-color: var(--components-form-baseform-standard-border-negative);
942
+ .eds-form-control-wrapper--error:focus-within, .eds-form-control-wrapper--negative:focus-within{
943
+ border-color:var(--components-form-baseform-standard-border-negative);
944
+ outline-color:var(--components-form-baseform-standard-border-negative);
898
945
  }
899
- .eds-contrast .eds-form-control-wrapper--error, .eds-contrast .eds-form-control-wrapper--negative {
900
- border-color: var(--components-form-baseform-contrast-border-negative);
946
+ .eds-contrast .eds-form-control-wrapper--error, .eds-contrast .eds-form-control-wrapper--negative{
947
+ border-color:var(--components-form-baseform-contrast-border-negative);
901
948
  }
902
- .eds-contrast .eds-form-control-wrapper--error:focus-within, .eds-contrast .eds-form-control-wrapper--negative:focus-within {
903
- border-color: var(--components-form-baseform-contrast-border-negative);
904
- outline-color: var(--components-form-baseform-contrast-border-negative);
949
+ .eds-contrast .eds-form-control-wrapper--error:focus-within, .eds-contrast .eds-form-control-wrapper--negative:focus-within{
950
+ border-color:var(--components-form-baseform-contrast-border-negative);
951
+ outline-color:var(--components-form-baseform-contrast-border-negative);
905
952
  }
906
- .eds-contrast .eds-form-control .eds-tooltip {
907
- background: var(--components-tooltip-tooltip-standard-fill);
908
- color: var(--components-tooltip-tooltip-standard-text);
909
- box-shadow: 0 0.0625rem 0.1875rem rgba(0, 0, 0, 0.25);
953
+ .eds-contrast .eds-form-control .eds-tooltip{
954
+ background:var(--components-tooltip-tooltip-standard-fill);
955
+ color:var(--components-tooltip-tooltip-standard-text);
956
+ -webkit-box-shadow:0 0.0625rem 0.1875rem rgba(0, 0, 0, 0.25);
957
+ -moz-box-shadow:0 0.0625rem 0.1875rem rgba(0, 0, 0, 0.25);
958
+ box-shadow:0 0.0625rem 0.1875rem rgba(0, 0, 0, 0.25);
910
959
  }
911
- .eds-form-control .eds-tooltip::after {
912
- background: var(--components-tooltip-tooltip-standard-fill);
960
+ .eds-form-control .eds-tooltip::after{
961
+ background:var(--components-tooltip-tooltip-standard-fill);
913
962
  }
914
963
 
915
- .eds-form-control {
916
- display: block;
917
- appearance: none;
918
- width: 100%;
919
- height: 100%;
920
- padding: 20px 0rem 0.25rem;
921
- font-family: inherit;
922
- font-size: 1rem;
923
- line-height: 1rem;
924
- border: 0;
925
- color: var(--components-form-baseform-standard-text-content);
926
- background-color: transparent;
927
- }
928
- .eds-form-control::placeholder {
929
- opacity: 0;
930
- transition: opacity 0.2s ease-in-out;
931
- }
932
- .eds-form-control:focus {
933
- outline: none;
934
- }
935
- .eds-form-control:focus::placeholder {
936
- opacity: 1;
937
- }
938
- .eds-form-control__prepend, .eds-form-control__append {
939
- position: relative;
940
- line-height: inherit;
941
- }
942
- .eds-form-control__prepend--tooltip, .eds-form-control__append--tooltip {
943
- all: unset;
944
- position: absolute;
945
- display: flex;
946
- align-items: center;
947
- justify-content: center;
948
- height: 1.5rem;
949
- width: 1.5rem;
950
- right: -2rem;
951
- border-radius: 100%;
952
- color: var(--primary-text-color);
953
- cursor: pointer;
954
- }
955
- .eds-form-control__prepend {
956
- margin-right: 0.75rem;
957
- margin-left: 0;
958
- }
959
- .eds-form-control__append {
960
- margin-right: 0;
961
- margin-left: 0.75rem;
962
- }/* DO NOT CHANGE!*/
963
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
964
- .eds-checkbox__container {
965
- display: flex;
966
- align-items: center;
967
- position: relative;
968
- appearance: none;
969
- cursor: pointer;
970
- user-select: none;
971
- width: fit-content;
972
- margin: 0.5rem 0;
973
- }
974
- .eds-checkbox__container--reduced-click-area {
975
- height: fit-content;
976
- }
977
- .eds-checkbox__container input {
978
- position: absolute;
979
- opacity: 0;
980
- height: 0;
981
- width: 0;
982
- }
983
- .eds-checkbox__container input:checked + .eds-checkbox__icon, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon {
984
- background-color: var(--components-form-checkbox-standard-fill-selected);
985
- }
986
- .eds-checkbox__container input:checked + .eds-checkbox__icon .eds-checkbox-icon, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon .eds-checkbox-icon {
987
- visibility: visible;
988
- }
989
- .eds-checkbox__container input:checked + .eds-checkbox__icon .eds-checkbox-icon path, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon .eds-checkbox-icon path {
990
- stroke: var(--components-form-checkbox-standard-icon);
991
- animation: stroke ease-in-out 0.2s 0.1s forwards;
992
- }
993
- .eds-checkbox__container input:checked + .eds-checkbox__icon .eds-checkbox-icon rect, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon .eds-checkbox-icon rect {
994
- fill: var(--components-form-checkbox-standard-icon);
995
- }
996
- .eds-checkbox__container input:checked + .eds-checkbox__icon .eds-contrast, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon .eds-contrast {
997
- color: var(--components-form-checkbox-contrast-fill-selected);
998
- }
999
- .eds-checkbox__container input:checked + .eds-checkbox__icon .eds-contrast path, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon .eds-contrast path {
1000
- stroke: var(--components-form-checkbox-contrast-icon);
1001
- }
1002
- .eds-checkbox__container input:checked + .eds-checkbox__icon .eds-contrast rect, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon .eds-contrast rect {
1003
- fill: var(--components-form-checkbox-contrast-icon);
1004
- }
1005
- .eds-checkbox__container input:checked + .eds-checkbox__icon--disabled, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon--disabled {
1006
- background-color: var(--components-form-checkbox-standard-icon-disabled);
1007
- }
1008
- .eds-checkbox__container input:checked + .eds-checkbox__icon--disabled :is(path, rect), .eds-checkbox__container input:indeterminate + .eds-checkbox__icon--disabled :is(path, rect) {
1009
- background-color: var(--components-form-checkbox-standard-icon-disabled);
1010
- }
1011
- .eds-checkbox__container input:checked + .eds-checkbox__icon--readonly, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon--readonly {
1012
- background-color: var(--components-form-checkbox-standard-fill-disabled);
1013
- }
1014
- .eds-checkbox__container input:checked + .eds-checkbox__icon--readonly .eds-checkbox-icon path, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon--readonly .eds-checkbox-icon path {
1015
- stroke: var(--components-form-checkbox-standard-icon-readonly);
1016
- }
1017
- .eds-checkbox__container input:checked + .eds-checkbox__icon--readonly .eds-checkbox-icon rect, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon--readonly .eds-checkbox-icon rect {
1018
- fill: var(--components-form-checkbox-standard-icon-readonly);
1019
- }
1020
- .eds-contrast .eds-checkbox__container input:checked + .eds-checkbox__icon--readonly .eds-checkbox-icon path, .eds-contrast .eds-checkbox__container input:indeterminate + .eds-checkbox__icon--readonly .eds-checkbox-icon path {
1021
- stroke: var(--components-form-checkbox-contrast-icon-readonly);
1022
- }
1023
- .eds-contrast .eds-checkbox__container input:checked + .eds-checkbox__icon--readonly .eds-checkbox-icon rect, .eds-contrast .eds-checkbox__container input:indeterminate + .eds-checkbox__icon--readonly .eds-checkbox-icon rect {
1024
- fill: var(--components-form-checkbox-contrast-icon-readonly);
1025
- }
1026
- .eds-checkbox__container:hover:not(:has(input:disabled)) input + .eds-checkbox__icon {
1027
- border-color: var(--components-form-checkbox-standard-border);
1028
- background-color: var(--components-form-checkbox-standard-fill-hover);
1029
- }
1030
- .eds-contrast .eds-checkbox__container:hover:not(:has(input:disabled)) input + .eds-checkbox__icon {
1031
- border-color: var(--components-form-checkbox-contrast-border);
1032
- background-color: var(--components-form-checkbox-contrast-fill-hover);
964
+ .eds-form-control{
965
+ display:block;
966
+ -webkit-appearance:none;
967
+ -moz-appearance:none;
968
+ appearance:none;
969
+ width:100%;
970
+ height:100%;
971
+ padding:20px 0rem 0.25rem;
972
+ font-family:inherit;
973
+ font-size:1rem;
974
+ line-height:1rem;
975
+ border:0;
976
+ color:var(--components-form-baseform-standard-text-content);
977
+ background-color:transparent;
978
+ }
979
+ .eds-form-control::-webkit-input-placeholder{
980
+ opacity:0;
981
+ -webkit-transition:opacity 0.2s ease-in-out;
982
+ transition:opacity 0.2s ease-in-out;
983
+ }
984
+ .eds-form-control:-moz-placeholder{
985
+ opacity:0;
986
+ -moz-transition:opacity 0.2s ease-in-out;
987
+ transition:opacity 0.2s ease-in-out;
988
+ }
989
+ .eds-form-control::-moz-placeholder{
990
+ opacity:0;
991
+ -moz-transition:opacity 0.2s ease-in-out;
992
+ transition:opacity 0.2s ease-in-out;
993
+ }
994
+ .eds-form-control::-ms-input-placeholder{
995
+ opacity:0;
996
+ -ms-transition:opacity 0.2s ease-in-out;
997
+ transition:opacity 0.2s ease-in-out;
998
+ }
999
+ .eds-form-control::placeholder{
1000
+ opacity:0;
1001
+ -webkit-transition:opacity 0.2s ease-in-out;
1002
+ -o-transition:opacity 0.2s ease-in-out;
1003
+ -moz-transition:opacity 0.2s ease-in-out;
1004
+ transition:opacity 0.2s ease-in-out;
1005
+ }
1006
+ .eds-form-control:focus{
1007
+ outline:none;
1008
+ }
1009
+ .eds-form-control:focus::-webkit-input-placeholder{
1010
+ opacity:1;
1011
+ }
1012
+ .eds-form-control:focus:-moz-placeholder{
1013
+ opacity:1;
1014
+ }
1015
+ .eds-form-control:focus::-moz-placeholder{
1016
+ opacity:1;
1017
+ }
1018
+ .eds-form-control:focus::-ms-input-placeholder{
1019
+ opacity:1;
1020
+ }
1021
+ .eds-form-control:focus::placeholder{
1022
+ opacity:1;
1023
+ }
1024
+ .eds-form-control__prepend, .eds-form-control__append{
1025
+ position:relative;
1026
+ line-height:inherit;
1027
+ }
1028
+ .eds-form-control__prepend--tooltip, .eds-form-control__append--tooltip{
1029
+ all:unset;
1030
+ position:absolute;
1031
+ display:-webkit-box;
1032
+ display:-webkit-flex;
1033
+ display:-moz-box;
1034
+ display:flex;
1035
+ -webkit-box-align:center;
1036
+ -webkit-align-items:center;
1037
+ -moz-box-align:center;
1038
+ align-items:center;
1039
+ -webkit-box-pack:center;
1040
+ -webkit-justify-content:center;
1041
+ -moz-box-pack:center;
1042
+ justify-content:center;
1043
+ height:1.5rem;
1044
+ width:1.5rem;
1045
+ right:-2rem;
1046
+ -webkit-border-radius:100%;
1047
+ -moz-border-radius:100%;
1048
+ border-radius:100%;
1049
+ color:var(--primary-text-color);
1050
+ cursor:pointer;
1051
+ }
1052
+ .eds-form-control__prepend{
1053
+ margin-right:0.75rem;
1054
+ margin-left:0;
1055
+ }
1056
+ .eds-form-control__append{
1057
+ margin-right:0;
1058
+ margin-left:0.75rem;
1059
+ }.eds-checkbox__container{
1060
+ display:-webkit-box;
1061
+ display:-webkit-flex;
1062
+ display:-moz-box;
1063
+ display:flex;
1064
+ -webkit-box-align:center;
1065
+ -webkit-align-items:center;
1066
+ -moz-box-align:center;
1067
+ align-items:center;
1068
+ position:relative;
1069
+ -webkit-appearance:none;
1070
+ -moz-appearance:none;
1071
+ appearance:none;
1072
+ cursor:pointer;
1073
+ -webkit-user-select:none;
1074
+ -moz-user-select:none;
1075
+ -ms-user-select:none;
1076
+ user-select:none;
1077
+ width:-webkit-fit-content;
1078
+ width:-moz-fit-content;
1079
+ width:fit-content;
1080
+ margin:0.5rem 0;
1081
+ }
1082
+ .eds-checkbox__container--reduced-click-area{
1083
+ height:-webkit-fit-content;
1084
+ height:-moz-fit-content;
1085
+ height:fit-content;
1086
+ }
1087
+ .eds-checkbox__container input{
1088
+ position:absolute;
1089
+ opacity:0;
1090
+ height:0;
1091
+ width:0;
1092
+ }
1093
+ .eds-checkbox__container input:checked + .eds-checkbox__icon, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon{
1094
+ background-color:var(--components-form-checkbox-standard-fill-selected);
1095
+ }
1096
+ .eds-checkbox__container input:checked + .eds-checkbox__icon .eds-checkbox-icon, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon .eds-checkbox-icon{
1097
+ visibility:visible;
1098
+ }
1099
+ .eds-checkbox__container input:checked + .eds-checkbox__icon .eds-checkbox-icon path, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon .eds-checkbox-icon path{
1100
+ stroke:var(--components-form-checkbox-standard-icon);
1101
+ -webkit-animation:stroke ease-in-out 0.2s 0.1s forwards;
1102
+ -moz-animation:stroke ease-in-out 0.2s 0.1s forwards;
1103
+ -o-animation:stroke ease-in-out 0.2s 0.1s forwards;
1104
+ animation:stroke ease-in-out 0.2s 0.1s forwards;
1105
+ }
1106
+ .eds-checkbox__container input:checked + .eds-checkbox__icon .eds-checkbox-icon rect, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon .eds-checkbox-icon rect{
1107
+ fill:var(--components-form-checkbox-standard-icon);
1108
+ }
1109
+ .eds-checkbox__container input:checked + .eds-checkbox__icon .eds-contrast, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon .eds-contrast{
1110
+ color:var(--components-form-checkbox-contrast-fill-selected);
1111
+ }
1112
+ .eds-checkbox__container input:checked + .eds-checkbox__icon .eds-contrast path, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon .eds-contrast path{
1113
+ stroke:var(--components-form-checkbox-contrast-icon);
1114
+ }
1115
+ .eds-checkbox__container input:checked + .eds-checkbox__icon .eds-contrast rect, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon .eds-contrast rect{
1116
+ fill:var(--components-form-checkbox-contrast-icon);
1117
+ }
1118
+ .eds-checkbox__container input:checked + .eds-checkbox__icon--disabled, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon--disabled{
1119
+ background-color:var(--components-form-checkbox-standard-icon-disabled);
1120
+ }
1121
+ .eds-checkbox__container input:checked + .eds-checkbox__icon--disabled path{
1122
+ background-color:var(--components-form-checkbox-standard-icon-disabled);
1123
+ }
1124
+ .eds-checkbox__container input:checked + .eds-checkbox__icon--disabled rect{
1125
+ background-color:var(--components-form-checkbox-standard-icon-disabled);
1126
+ }
1127
+ .eds-checkbox__container input:indeterminate + .eds-checkbox__icon--disabled path{
1128
+ background-color:var(--components-form-checkbox-standard-icon-disabled);
1129
+ }
1130
+ .eds-checkbox__container input:indeterminate + .eds-checkbox__icon--disabled rect{
1131
+ background-color:var(--components-form-checkbox-standard-icon-disabled);
1132
+ }
1133
+ .eds-checkbox__container input:checked + .eds-checkbox__icon--readonly, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon--readonly{
1134
+ background-color:var(--components-form-checkbox-standard-fill-disabled);
1135
+ }
1136
+ .eds-checkbox__container input:checked + .eds-checkbox__icon--readonly .eds-checkbox-icon path, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon--readonly .eds-checkbox-icon path{
1137
+ stroke:var(--components-form-checkbox-standard-icon-readonly);
1138
+ }
1139
+ .eds-checkbox__container input:checked + .eds-checkbox__icon--readonly .eds-checkbox-icon rect, .eds-checkbox__container input:indeterminate + .eds-checkbox__icon--readonly .eds-checkbox-icon rect{
1140
+ fill:var(--components-form-checkbox-standard-icon-readonly);
1141
+ }
1142
+ .eds-contrast .eds-checkbox__container input:checked + .eds-checkbox__icon--readonly .eds-checkbox-icon path, .eds-contrast .eds-checkbox__container input:indeterminate + .eds-checkbox__icon--readonly .eds-checkbox-icon path{
1143
+ stroke:var(--components-form-checkbox-contrast-icon-readonly);
1144
+ }
1145
+ .eds-contrast .eds-checkbox__container input:checked + .eds-checkbox__icon--readonly .eds-checkbox-icon rect, .eds-contrast .eds-checkbox__container input:indeterminate + .eds-checkbox__icon--readonly .eds-checkbox-icon rect{
1146
+ fill:var(--components-form-checkbox-contrast-icon-readonly);
1147
+ }
1148
+ .eds-checkbox__container:hover:not(:has(input:disabled)) input + .eds-checkbox__icon{
1149
+ border-color:var(--components-form-checkbox-standard-border);
1150
+ background-color:var(--components-form-checkbox-standard-fill-hover);
1151
+ }
1152
+ .eds-contrast .eds-checkbox__container:hover:not(:has(input:disabled)) input + .eds-checkbox__icon{
1153
+ border-color:var(--components-form-checkbox-contrast-border);
1154
+ background-color:var(--components-form-checkbox-contrast-fill-hover);
1033
1155
  }
1034
1156
  .eds-checkbox__container:hover:not(:has(input:disabled)) input:checked + .eds-checkbox__icon,
1035
- .eds-checkbox__container:hover:not(:has(input:disabled)) input:indeterminate + .eds-checkbox__icon:not(.eds-checkbox--disabled) {
1036
- border-color: transparent;
1037
- background-color: var(--components-form-checkbox-standard-fill-selectedhover);
1157
+ .eds-checkbox__container:hover:not(:has(input:disabled)) input:indeterminate + .eds-checkbox__icon:not(.eds-checkbox--disabled){
1158
+ border-color:transparent;
1159
+ background-color:var(--components-form-checkbox-standard-fill-selectedhover);
1038
1160
  }
1039
1161
  .eds-contrast .eds-checkbox__container:hover:not(:has(input:disabled)) input:checked + .eds-checkbox__icon,
1040
- .eds-contrast .eds-checkbox__container:hover:not(:has(input:disabled)) input:indeterminate + .eds-checkbox__icon:not(.eds-checkbox--disabled) {
1041
- background-color: var(--components-form-checkbox-contrast-fill-selectedhover);
1162
+ .eds-contrast .eds-checkbox__container:hover:not(:has(input:disabled)) input:indeterminate + .eds-checkbox__icon:not(.eds-checkbox--disabled){
1163
+ background-color:var(--components-form-checkbox-contrast-fill-selectedhover);
1042
1164
  }
1043
1165
  .eds-checkbox__container:active:not(:has(input:disabled)) input:checked + .eds-checkbox__icon,
1044
- .eds-checkbox__container:active:not(:has(input:disabled)) input:indeterminate + .eds-checkbox__icon {
1045
- background-color: var(--components-form-checkbox-standard-fill-selected);
1166
+ .eds-checkbox__container:active:not(:has(input:disabled)) input:indeterminate + .eds-checkbox__icon{
1167
+ background-color:var(--components-form-checkbox-standard-fill-selected);
1046
1168
  }
1047
1169
  .eds-contrast .eds-checkbox__container:active:not(:has(input:disabled)) input:checked + .eds-checkbox__icon,
1048
- .eds-contrast .eds-checkbox__container:active:not(:has(input:disabled)) input:indeterminate + .eds-checkbox__icon {
1049
- background-color: var(--components-form-checkbox-contrast-fill-selected);
1050
- }
1051
- .eds-checkbox__container:has(:focus-visible) .eds-checkbox__icon {
1052
- outline: 2px solid #181c56;
1053
- outline-color: var(--basecolors-stroke-focus-standard);
1054
- outline-offset: 0.125rem;
1055
- }
1056
- .eds-contrast .eds-checkbox__container:has(:focus-visible) .eds-checkbox__icon {
1057
- outline-color: var(--basecolors-stroke-focus-contrast);
1058
- }
1059
- .eds-checkbox--disabled {
1060
- cursor: not-allowed;
1061
- }
1062
- .eds-checkbox--disabled input {
1063
- pointer-events: none;
1064
- }
1065
- .eds-checkbox--disabled .eds-checkbox__label {
1066
- opacity: 0.5;
1067
- }
1068
- .eds-checkbox--disabled .eds-checkbox__icon {
1069
- border-color: var(--components-form-checkbox-standard-icon-disabled);
1070
- }
1071
- .eds-contrast .eds-checkbox--disabled .eds-checkbox__icon {
1072
- border-color: var(--components-form-checkbox-contrast-icon-disabled);
1073
- }
1074
- .eds-checkbox--readonly {
1075
- cursor: default;
1076
- pointer-events: auto;
1077
- user-select: text;
1078
- }
1079
- .eds-checkbox--readonly input {
1080
- pointer-events: auto;
1081
- user-select: text;
1082
- }
1083
- .eds-checkbox--readonly .eds-checkbox__icon {
1084
- border-color: var(--components-form-checkbox-standard-border-readonly);
1085
- }
1086
- .eds-contrast .eds-checkbox--readonly .eds-checkbox__icon {
1087
- border-color: var(--components-form-checkbox-contrast-border-readonly);
1088
- }
1089
- .eds-checkbox__icon {
1090
- box-sizing: border-box;
1091
- display: inline-flex;
1092
- justify-content: center;
1093
- align-items: center;
1094
- position: relative;
1095
- margin-right: 1rem;
1096
- height: 1.25rem;
1097
- width: 1.25rem;
1098
- border: 0.125rem solid var(--components-form-checkbox-standard-border);
1099
- border-radius: 0.125rem;
1100
- background-color: transparent;
1101
- transition: border-color 0.1s ease-in-out, background-color 0.1s ease-in-out;
1102
- }
1103
- .eds-checkbox__icon--reduced-click-area {
1104
- margin-right: 0;
1105
- }
1106
- .eds-contrast .eds-checkbox__icon {
1107
- border-color: var(--components-form-checkbox-contrast-border);
1108
- }
1109
- .eds-checkbox__icon .eds-checkbox-icon {
1110
- height: 1rem;
1111
- width: 1rem;
1112
- visibility: hidden;
1113
- }
1114
- .eds-checkbox__icon .eds-checkbox-icon path {
1115
- transform-origin: 50% 50%;
1116
- stroke-dasharray: 48;
1117
- stroke-dashoffset: 48;
1118
- stroke-width: 0.375rem;
1119
- }
1120
- .eds-checkbox__icon--no-animation .eds-checkbox-icon path {
1121
- animation: none !important;
1122
- transition: none !important;
1123
- stroke-dasharray: 48;
1124
- stroke-dashoffset: 0;
1125
- }
1126
- .eds-checkbox__icon--no-animation .eds-checkbox-icon rect {
1127
- transition: none !important;
1170
+ .eds-contrast .eds-checkbox__container:active:not(:has(input:disabled)) input:indeterminate + .eds-checkbox__icon{
1171
+ background-color:var(--components-form-checkbox-contrast-fill-selected);
1172
+ }
1173
+ .eds-checkbox__container:has(:focus-visible) .eds-checkbox__icon{
1174
+ outline:2px solid #181c56;
1175
+ outline-color:var(--basecolors-stroke-focus-standard);
1176
+ outline-offset:0.125rem;
1177
+ }
1178
+ .eds-contrast .eds-checkbox__container:has(:focus-visible) .eds-checkbox__icon{
1179
+ outline-color:var(--basecolors-stroke-focus-contrast);
1180
+ }
1181
+ .eds-checkbox--disabled{
1182
+ cursor:not-allowed;
1183
+ }
1184
+ .eds-checkbox--disabled input{
1185
+ pointer-events:none;
1186
+ }
1187
+ .eds-checkbox--disabled .eds-checkbox__label{
1188
+ opacity:0.5;
1189
+ }
1190
+ .eds-checkbox--disabled .eds-checkbox__icon{
1191
+ border-color:var(--components-form-checkbox-standard-icon-disabled);
1192
+ }
1193
+ .eds-contrast .eds-checkbox--disabled .eds-checkbox__icon{
1194
+ border-color:var(--components-form-checkbox-contrast-icon-disabled);
1195
+ }
1196
+ .eds-checkbox--readonly{
1197
+ cursor:default;
1198
+ pointer-events:auto;
1199
+ -webkit-user-select:text;
1200
+ -moz-user-select:text;
1201
+ -ms-user-select:text;
1202
+ user-select:text;
1203
+ }
1204
+ .eds-checkbox--readonly input{
1205
+ pointer-events:auto;
1206
+ -webkit-user-select:text;
1207
+ -moz-user-select:text;
1208
+ -ms-user-select:text;
1209
+ user-select:text;
1210
+ }
1211
+ .eds-checkbox--readonly .eds-checkbox__icon{
1212
+ border-color:var(--components-form-checkbox-standard-border-readonly);
1213
+ }
1214
+ .eds-contrast .eds-checkbox--readonly .eds-checkbox__icon{
1215
+ border-color:var(--components-form-checkbox-contrast-border-readonly);
1216
+ }
1217
+ .eds-checkbox__icon{
1218
+ -webkit-box-sizing:border-box;
1219
+ -moz-box-sizing:border-box;
1220
+ box-sizing:border-box;
1221
+ display:-webkit-inline-box;
1222
+ display:-webkit-inline-flex;
1223
+ display:-moz-inline-box;
1224
+ display:inline-flex;
1225
+ -webkit-box-pack:center;
1226
+ -webkit-justify-content:center;
1227
+ -moz-box-pack:center;
1228
+ justify-content:center;
1229
+ -webkit-box-align:center;
1230
+ -webkit-align-items:center;
1231
+ -moz-box-align:center;
1232
+ align-items:center;
1233
+ position:relative;
1234
+ margin-right:1rem;
1235
+ height:1.25rem;
1236
+ width:1.25rem;
1237
+ border:0.125rem solid var(--components-form-checkbox-standard-border);
1238
+ -webkit-border-radius:0.125rem;
1239
+ -moz-border-radius:0.125rem;
1240
+ border-radius:0.125rem;
1241
+ background-color:transparent;
1242
+ -webkit-transition:border-color 0.1s ease-in-out, background-color 0.1s ease-in-out;
1243
+ -o-transition:border-color 0.1s ease-in-out, background-color 0.1s ease-in-out;
1244
+ -moz-transition:border-color 0.1s ease-in-out, background-color 0.1s ease-in-out;
1245
+ transition:border-color 0.1s ease-in-out, background-color 0.1s ease-in-out;
1246
+ }
1247
+ .eds-checkbox__icon--reduced-click-area{
1248
+ margin-right:0;
1249
+ }
1250
+ .eds-contrast .eds-checkbox__icon{
1251
+ border-color:var(--components-form-checkbox-contrast-border);
1252
+ }
1253
+ .eds-checkbox__icon .eds-checkbox-icon{
1254
+ height:1rem;
1255
+ width:1rem;
1256
+ visibility:hidden;
1257
+ }
1258
+ .eds-checkbox__icon .eds-checkbox-icon path{
1259
+ -webkit-transform-origin:50% 50%;
1260
+ -moz-transform-origin:50% 50%;
1261
+ -o-transform-origin:50% 50%;
1262
+ transform-origin:50% 50%;
1263
+ stroke-dasharray:48;
1264
+ stroke-dashoffset:48;
1265
+ stroke-width:0.375rem;
1266
+ }
1267
+ .eds-checkbox__icon--no-animation .eds-checkbox-icon path{
1268
+ -webkit-animation:none !important;
1269
+ -moz-animation:none !important;
1270
+ -o-animation:none !important;
1271
+ animation:none !important;
1272
+ -webkit-transition:none !important;
1273
+ -o-transition:none !important;
1274
+ -moz-transition:none !important;
1275
+ transition:none !important;
1276
+ stroke-dasharray:48;
1277
+ stroke-dashoffset:0;
1278
+ }
1279
+ .eds-checkbox__icon--no-animation .eds-checkbox-icon rect{
1280
+ -webkit-transition:none !important;
1281
+ -o-transition:none !important;
1282
+ -moz-transition:none !important;
1283
+ transition:none !important;
1284
+ }
1285
+
1286
+ @-webkit-keyframes stroke{
1287
+ 100%{
1288
+ stroke-dashoffset:0;
1289
+ }
1290
+ }
1291
+
1292
+ @-moz-keyframes stroke{
1293
+ 100%{
1294
+ stroke-dashoffset:0;
1295
+ }
1128
1296
  }
1129
1297
 
1130
- @keyframes stroke {
1131
- 100% {
1132
- stroke-dashoffset: 0;
1298
+ @-o-keyframes stroke{
1299
+ 100%{
1300
+ stroke-dashoffset:0;
1133
1301
  }
1134
- }.eds-fieldset {
1135
- margin: 0;
1136
- padding: 0;
1137
- border: 0;
1138
- }/* DO NOT CHANGE!*/
1139
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
1140
- .eds-form-component--radio__container {
1141
- display: flex;
1142
- justify-content: center;
1143
- align-items: center;
1144
- position: relative;
1145
- cursor: pointer;
1146
- height: 2rem;
1147
- width: fit-content;
1148
- user-select: none;
1149
- }
1150
- .eds-form-component--radio__container :hover ~ .eds-form-component--radio__radio {
1151
- background-color: var(--components-form-radio-standard-fill-hover);
1152
- }
1153
- .eds-contrast .eds-form-component--radio__container :hover ~ .eds-form-component--radio__radio {
1154
- background-color: var(--components-form-radio-contrast-fill-hover);
1155
- }
1156
- .eds-form-component--radio__container input {
1157
- position: absolute;
1158
- opacity: 0;
1159
- cursor: pointer;
1160
- height: 0;
1161
- width: 0;
1162
- }
1163
- .eds-form-component--radio__container input:checked ~ .eds-form-component--radio__radio .eds-form-component--radio__circle {
1164
- height: 0.625rem;
1165
- width: 0.625rem;
1166
- }
1167
- .eds-form-component--radio__container input:focus-visible ~ .eds-form-component--radio__radio {
1168
- outline: 2px solid #181c56;
1169
- outline-color: var(--basecolors-stroke-focus-standard);
1170
- outline-offset: 0.125rem;
1171
- }
1172
- .eds-contrast .eds-form-component--radio__container input:focus-visible ~ .eds-form-component--radio__radio {
1173
- outline-color: var(--basecolors-stroke-focus-contrast);
1174
- }
1175
- .eds-form-component--radio__container:has(input:disabled) {
1176
- cursor: not-allowed;
1177
- }
1178
- .eds-form-component--radio__container:has(.eds-form-component--radio__radio--readonly) {
1179
- cursor: default;
1180
- user-select: text;
1181
- }
1182
- .eds-form-component--radio__container .eds-form-component--radio__radio {
1183
- position: relative;
1184
- height: 1.25rem;
1185
- width: 1.25rem;
1186
- margin-right: 1rem;
1187
- background-color: var(--components-form-radio-standard-fill-default);
1188
- border: 0.125rem solid var(--components-form-radio-standard-border);
1189
- border-radius: 50%;
1190
- display: flex;
1191
- align-items: center;
1192
- justify-content: center;
1193
- }
1194
- .eds-contrast .eds-form-component--radio__container .eds-form-component--radio__radio {
1195
- background-color: var(--components-form-radio-contrast-fill-default);
1196
- border-color: var(--components-form-radio-contrast-border);
1197
- }
1198
- .eds-form-component--radio__container .eds-form-component--radio__radio.eds-form-component--radio__radio--disabled {
1199
- background: var(--components-form-radio-contrast-fill-disabled);
1200
- border-color: var(--components-form-radio-contrast-text-disabled);
1201
- }
1202
- .eds-form-component--radio__container .eds-form-component--radio__radio.eds-form-component--radio__radio--disabled:hover {
1203
- border-color: var(--components-form-radio-contrast-text-disabled);
1204
- }
1205
- .eds-contrast .eds-form-component--radio__container .eds-form-component--radio__radio.eds-form-component--radio__radio--disabled {
1206
- background: var(--components-form-radio-contrast-fill-disabled);
1207
- border-color: var(--components-form-radio-contrast-text-disabled);
1208
- }
1209
- .eds-form-component--radio__container .eds-form-component--radio__radio.eds-form-component--radio__radio--disabled ~ .eds-form-component--radio__label {
1210
- color: var(--components-form-radio-contrast-text-disabled);
1211
- }
1212
- .eds-form-component--radio__container .eds-form-component--radio__radio.eds-form-component--radio__radio--disabled:checked ~ .eds-form-component--radio__radio .eds-form-component--radio__circle {
1213
- background-color: var(--components-form-radio-standard-icon-disabled);
1214
- border-color: var(--components-form-radio-contrast-text-disabled);
1215
- }
1216
- .eds-form-component--radio__container .eds-form-component--radio__radio.eds-form-component--radio__radio--disabled .eds-form-component--radio__circle {
1217
- background-color: var(--components-form-radio-standard-icon-disabled);
1218
- }
1219
- .eds-contrast .eds-form-component--radio__container .eds-form-component--radio__radio.eds-form-component--radio__radio--disabled .eds-form-component--radio__circle {
1220
- background-color: var(--components-form-radio-contrast-icon-disabled);
1221
- }
1222
- .eds-form-component--radio__container .eds-form-component--radio__radio.eds-form-component--radio__radio--readonly {
1223
- background: var(--components-form-radio-standard-fill-disabled);
1224
- border-color: var(--components-form-radio-standard-border-readonly);
1225
- }
1226
- .eds-contrast .eds-form-component--radio__container .eds-form-component--radio__radio.eds-form-component--radio__radio--readonly {
1227
- background: var(--components-form-radio-contrast-fill-disabled);
1228
- border-color: var(--components-form-radio-contrast-border-readonly);
1229
- }
1230
- .eds-form-component--radio__container .eds-form-component--radio__radio.eds-form-component--radio__radio--readonly:checked ~ .eds-form-component--radio__radio .eds-form-component--radio__circle {
1231
- background-color: var(--components-form-radio-standard-icon);
1232
- border-color: var(--components-form-radio-standard-border-readonly);
1233
- }
1234
- .eds-form-component--radio__container .eds-form-component--radio__radio .eds-form-component--radio__circle {
1235
- display: block;
1236
- width: 0;
1237
- height: 0;
1238
- border-radius: 50%;
1239
- background-color: var(--components-form-radio-standard-fill-selected);
1240
- transition: width 0.1s ease-in-out, height 0.1s ease-in-out;
1241
- }
1242
- .eds-contrast .eds-form-component--radio__container .eds-form-component--radio__radio .eds-form-component--radio__circle {
1243
- background-color: var(--components-form-radio-contrast-icon);
1244
- }/* DO NOT CHANGE!*/
1245
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
1246
- .eds-input-panel:has(:focus-visible) .eds-input-panel__container {
1247
- outline: 2px solid #181c56;
1248
- outline-color: var(--basecolors-stroke-focus-standard);
1249
- outline-offset: 0.125rem;
1250
- }
1251
- .eds-contrast .eds-input-panel:has(:focus-visible) .eds-input-panel__container {
1252
- outline-color: var(--basecolors-stroke-focus-contrast);
1253
- }
1254
- .eds-input-panel > input {
1255
- position: absolute;
1256
- opacity: 0;
1257
- cursor: pointer;
1258
- height: 0;
1259
- width: 0;
1260
- }
1261
- .eds-input-panel > input:checked + .eds-input-panel__container {
1262
- border-color: var(--components-form-basepanel-standard-border-selected);
1263
- background: var(--components-form-basepanel-standard-fill-selected);
1264
- }
1265
- .eds-contrast .eds-input-panel > input:checked + .eds-input-panel__container {
1266
- border-color: var(--components-form-basepanel-contrast-border-selected);
1267
- background: var(--components-form-basepanel-contrast-fill-selected);
1268
- }
1269
- .eds-input-panel > input:checked + .eds-input-panel__container .eds-form-component--radio__circle {
1270
- width: 0.75rem;
1271
- height: 0.75rem;
1272
- }
1273
- .eds-contrast .eds-input-panel > input:checked + .eds-input-panel__container .eds-form-component--radio__circle {
1274
- background-color: var(--components-form-radio-contrast-icon);
1275
- }
1276
- .eds-input-panel > input:checked + .eds-input-panel__container:hover {
1277
- background-color: var(--components-form-basepanel-standard-fill-hover);
1302
+ }
1303
+
1304
+ @keyframes stroke{
1305
+ 100%{
1306
+ stroke-dashoffset:0;
1307
+ }
1308
+ }.eds-fieldset{
1309
+ margin:0;
1310
+ padding:0;
1311
+ border:0;
1312
+ }.eds-form-component--radio__container{
1313
+ display:-webkit-box;
1314
+ display:-webkit-flex;
1315
+ display:-moz-box;
1316
+ display:flex;
1317
+ -webkit-box-pack:center;
1318
+ -webkit-justify-content:center;
1319
+ -moz-box-pack:center;
1320
+ justify-content:center;
1321
+ -webkit-box-align:center;
1322
+ -webkit-align-items:center;
1323
+ -moz-box-align:center;
1324
+ align-items:center;
1325
+ position:relative;
1326
+ cursor:pointer;
1327
+ height:2rem;
1328
+ width:-webkit-fit-content;
1329
+ width:-moz-fit-content;
1330
+ width:fit-content;
1331
+ -webkit-user-select:none;
1332
+ -moz-user-select:none;
1333
+ -ms-user-select:none;
1334
+ user-select:none;
1335
+ }
1336
+ .eds-form-component--radio__container :hover ~ .eds-form-component--radio__radio{
1337
+ background-color:var(--components-form-radio-standard-fill-hover);
1338
+ }
1339
+ .eds-contrast .eds-form-component--radio__container :hover ~ .eds-form-component--radio__radio{
1340
+ background-color:var(--components-form-radio-contrast-fill-hover);
1341
+ }
1342
+ .eds-form-component--radio__container input{
1343
+ position:absolute;
1344
+ opacity:0;
1345
+ cursor:pointer;
1346
+ height:0;
1347
+ width:0;
1348
+ }
1349
+ .eds-form-component--radio__container input:checked ~ .eds-form-component--radio__radio .eds-form-component--radio__circle{
1350
+ height:0.625rem;
1351
+ width:0.625rem;
1352
+ }
1353
+ .eds-form-component--radio__container input:focus-visible ~ .eds-form-component--radio__radio{
1354
+ outline:2px solid #181c56;
1355
+ outline-color:var(--basecolors-stroke-focus-standard);
1356
+ outline-offset:0.125rem;
1357
+ }
1358
+ .eds-contrast .eds-form-component--radio__container input:focus-visible ~ .eds-form-component--radio__radio{
1359
+ outline-color:var(--basecolors-stroke-focus-contrast);
1360
+ }
1361
+ .eds-form-component--radio__container:has(input:disabled){
1362
+ cursor:not-allowed;
1363
+ }
1364
+ .eds-form-component--radio__container:has(.eds-form-component--radio__radio--readonly){
1365
+ cursor:default;
1366
+ -webkit-user-select:text;
1367
+ -moz-user-select:text;
1368
+ -ms-user-select:text;
1369
+ user-select:text;
1370
+ }
1371
+ .eds-form-component--radio__container .eds-form-component--radio__radio{
1372
+ position:relative;
1373
+ height:1.25rem;
1374
+ width:1.25rem;
1375
+ margin-right:1rem;
1376
+ background-color:var(--components-form-radio-standard-fill-default);
1377
+ border:0.125rem solid var(--components-form-radio-standard-border);
1378
+ -webkit-border-radius:50%;
1379
+ -moz-border-radius:50%;
1380
+ border-radius:50%;
1381
+ display:-webkit-box;
1382
+ display:-webkit-flex;
1383
+ display:-moz-box;
1384
+ display:flex;
1385
+ -webkit-box-align:center;
1386
+ -webkit-align-items:center;
1387
+ -moz-box-align:center;
1388
+ align-items:center;
1389
+ -webkit-box-pack:center;
1390
+ -webkit-justify-content:center;
1391
+ -moz-box-pack:center;
1392
+ justify-content:center;
1393
+ }
1394
+ .eds-contrast .eds-form-component--radio__container .eds-form-component--radio__radio{
1395
+ background-color:var(--components-form-radio-contrast-fill-default);
1396
+ border-color:var(--components-form-radio-contrast-border);
1397
+ }
1398
+ .eds-form-component--radio__container .eds-form-component--radio__radio.eds-form-component--radio__radio--disabled{
1399
+ background:var(--components-form-radio-contrast-fill-disabled);
1400
+ border-color:var(--components-form-radio-contrast-text-disabled);
1401
+ }
1402
+ .eds-form-component--radio__container .eds-form-component--radio__radio.eds-form-component--radio__radio--disabled:hover{
1403
+ border-color:var(--components-form-radio-contrast-text-disabled);
1404
+ }
1405
+ .eds-contrast .eds-form-component--radio__container .eds-form-component--radio__radio.eds-form-component--radio__radio--disabled{
1406
+ background:var(--components-form-radio-contrast-fill-disabled);
1407
+ border-color:var(--components-form-radio-contrast-text-disabled);
1408
+ }
1409
+ .eds-form-component--radio__container .eds-form-component--radio__radio.eds-form-component--radio__radio--disabled ~ .eds-form-component--radio__label{
1410
+ color:var(--components-form-radio-contrast-text-disabled);
1411
+ }
1412
+ .eds-form-component--radio__container .eds-form-component--radio__radio.eds-form-component--radio__radio--disabled:checked ~ .eds-form-component--radio__radio .eds-form-component--radio__circle{
1413
+ background-color:var(--components-form-radio-standard-icon-disabled);
1414
+ border-color:var(--components-form-radio-contrast-text-disabled);
1415
+ }
1416
+ .eds-form-component--radio__container .eds-form-component--radio__radio.eds-form-component--radio__radio--disabled .eds-form-component--radio__circle{
1417
+ background-color:var(--components-form-radio-standard-icon-disabled);
1418
+ }
1419
+ .eds-contrast .eds-form-component--radio__container .eds-form-component--radio__radio.eds-form-component--radio__radio--disabled .eds-form-component--radio__circle{
1420
+ background-color:var(--components-form-radio-contrast-icon-disabled);
1421
+ }
1422
+ .eds-form-component--radio__container .eds-form-component--radio__radio.eds-form-component--radio__radio--readonly{
1423
+ background:var(--components-form-radio-standard-fill-disabled);
1424
+ border-color:var(--components-form-radio-standard-border-readonly);
1425
+ }
1426
+ .eds-contrast .eds-form-component--radio__container .eds-form-component--radio__radio.eds-form-component--radio__radio--readonly{
1427
+ background:var(--components-form-radio-contrast-fill-disabled);
1428
+ border-color:var(--components-form-radio-contrast-border-readonly);
1429
+ }
1430
+ .eds-form-component--radio__container .eds-form-component--radio__radio.eds-form-component--radio__radio--readonly:checked ~ .eds-form-component--radio__radio .eds-form-component--radio__circle{
1431
+ background-color:var(--components-form-radio-standard-icon);
1432
+ border-color:var(--components-form-radio-standard-border-readonly);
1433
+ }
1434
+ .eds-form-component--radio__container .eds-form-component--radio__radio .eds-form-component--radio__circle{
1435
+ display:block;
1436
+ width:0;
1437
+ height:0;
1438
+ -webkit-border-radius:50%;
1439
+ -moz-border-radius:50%;
1440
+ border-radius:50%;
1441
+ background-color:var(--components-form-radio-standard-fill-selected);
1442
+ -webkit-transition:width 0.1s ease-in-out, height 0.1s ease-in-out;
1443
+ -o-transition:width 0.1s ease-in-out, height 0.1s ease-in-out;
1444
+ -moz-transition:width 0.1s ease-in-out, height 0.1s ease-in-out;
1445
+ transition:width 0.1s ease-in-out, height 0.1s ease-in-out;
1446
+ }
1447
+ .eds-contrast .eds-form-component--radio__container .eds-form-component--radio__radio .eds-form-component--radio__circle{
1448
+ background-color:var(--components-form-radio-contrast-icon);
1449
+ }.eds-input-panel:has(:focus-visible) .eds-input-panel__container{
1450
+ outline:2px solid #181c56;
1451
+ outline-color:var(--basecolors-stroke-focus-standard);
1452
+ outline-offset:0.125rem;
1453
+ }
1454
+ .eds-contrast .eds-input-panel:has(:focus-visible) .eds-input-panel__container{
1455
+ outline-color:var(--basecolors-stroke-focus-contrast);
1456
+ }
1457
+ .eds-input-panel > input{
1458
+ position:absolute;
1459
+ opacity:0;
1460
+ cursor:pointer;
1461
+ height:0;
1462
+ width:0;
1463
+ }
1464
+ .eds-input-panel > input:checked + .eds-input-panel__container{
1465
+ border-color:var(--components-form-basepanel-standard-border-selected);
1466
+ background:var(--components-form-basepanel-standard-fill-selected);
1467
+ }
1468
+ .eds-contrast .eds-input-panel > input:checked + .eds-input-panel__container{
1469
+ border-color:var(--components-form-basepanel-contrast-border-selected);
1470
+ background:var(--components-form-basepanel-contrast-fill-selected);
1471
+ }
1472
+ .eds-input-panel > input:checked + .eds-input-panel__container .eds-form-component--radio__circle{
1473
+ width:0.75rem;
1474
+ height:0.75rem;
1475
+ }
1476
+ .eds-contrast .eds-input-panel > input:checked + .eds-input-panel__container .eds-form-component--radio__circle{
1477
+ background-color:var(--components-form-radio-contrast-icon);
1478
+ }
1479
+ .eds-input-panel > input:checked + .eds-input-panel__container:hover{
1480
+ background-color:var(--components-form-basepanel-standard-fill-hover);
1278
1481
  /* The following styling is needed to sync the inner checkbox/radiobutton's
1279
1482
  hover state styling with the inputPanel container */
1280
1483
  }
1281
- .eds-contrast .eds-input-panel > input:checked + .eds-input-panel__container:hover {
1282
- background-color: var(--components-form-basepanel-contrast-fill-hover);
1283
- }
1284
- .eds-input-panel > input:checked + .eds-input-panel__container:hover .eds-form-component--radio__radio {
1285
- background-color: var(--components-form-basepanel-standard-fill-hover);
1286
- border-color: var(--components-form-basepanel-standard-border-selected);
1287
- }
1288
- .eds-contrast .eds-input-panel > input:checked + .eds-input-panel__container:hover .eds-form-component--radio__radio {
1289
- background-color: var(--components-form-basepanel-contrast-fill-hover);
1290
- border-color: var(--components-form-basepanel-contrast-border-selected);
1291
- }
1292
- .eds-input-panel > input:checked + .eds-input-panel__container:hover .eds-checkbox__icon {
1293
- border-color: transparent;
1294
- }
1295
- .eds-contrast .eds-input-panel > input:checked + .eds-input-panel__container:hover .eds-checkbox__icon {
1296
- background-color: var(--components-form-checkbox-contrast-fill-selectedhover);
1297
- }
1298
- .eds-input-panel__container {
1299
- background: var(--components-form-basepanel-standard-fill-default);
1300
- border: 0.125rem solid var(--components-form-basepanel-standard-border-default);
1301
- color: var(--components-form-basepanel-standard-text-accent);
1302
- border-radius: 0.25rem;
1303
- display: flex;
1304
- flex-direction: column;
1305
- justify-content: flex-start;
1306
- min-width: 20rem;
1307
- position: relative;
1308
- padding: 1rem;
1309
- user-select: none;
1310
- width: fit-content;
1311
- transition: background ease-in-out 0.1s, border-color ease-in-out 0.1s;
1312
- }
1313
- .eds-contrast .eds-input-panel__container {
1314
- background-color: var(--components-form-basepanel-contrast-fill-default);
1315
- border-color: var(--components-form-basepanel-contrast-border-default);
1316
- color: var(--components-form-basepanel-contrast-text-accent);
1317
- }
1318
- .eds-input-panel__container:hover {
1319
- background-color: var(--components-form-basepanel-standard-fill-hover);
1484
+ .eds-contrast .eds-input-panel > input:checked + .eds-input-panel__container:hover{
1485
+ background-color:var(--components-form-basepanel-contrast-fill-hover);
1486
+ }
1487
+ .eds-input-panel > input:checked + .eds-input-panel__container:hover .eds-form-component--radio__radio{
1488
+ background-color:var(--components-form-basepanel-standard-fill-hover);
1489
+ border-color:var(--components-form-basepanel-standard-border-selected);
1490
+ }
1491
+ .eds-contrast .eds-input-panel > input:checked + .eds-input-panel__container:hover .eds-form-component--radio__radio{
1492
+ background-color:var(--components-form-basepanel-contrast-fill-hover);
1493
+ border-color:var(--components-form-basepanel-contrast-border-selected);
1494
+ }
1495
+ .eds-input-panel > input:checked + .eds-input-panel__container:hover .eds-checkbox__icon{
1496
+ border-color:transparent;
1497
+ }
1498
+ .eds-contrast .eds-input-panel > input:checked + .eds-input-panel__container:hover .eds-checkbox__icon{
1499
+ background-color:var(--components-form-checkbox-contrast-fill-selectedhover);
1500
+ }
1501
+ .eds-input-panel__container{
1502
+ background:var(--components-form-basepanel-standard-fill-default);
1503
+ border:0.125rem solid var(--components-form-basepanel-standard-border-default);
1504
+ color:var(--components-form-basepanel-standard-text-accent);
1505
+ -webkit-border-radius:0.25rem;
1506
+ -moz-border-radius:0.25rem;
1507
+ border-radius:0.25rem;
1508
+ display:-webkit-box;
1509
+ display:-webkit-flex;
1510
+ display:-moz-box;
1511
+ display:flex;
1512
+ -webkit-box-orient:vertical;
1513
+ -webkit-box-direction:normal;
1514
+ -webkit-flex-direction:column;
1515
+ -moz-box-orient:vertical;
1516
+ -moz-box-direction:normal;
1517
+ flex-direction:column;
1518
+ -webkit-box-pack:start;
1519
+ -webkit-justify-content:flex-start;
1520
+ -moz-box-pack:start;
1521
+ justify-content:flex-start;
1522
+ min-width:20rem;
1523
+ position:relative;
1524
+ padding:1rem;
1525
+ -webkit-user-select:none;
1526
+ -moz-user-select:none;
1527
+ -ms-user-select:none;
1528
+ user-select:none;
1529
+ width:-webkit-fit-content;
1530
+ width:-moz-fit-content;
1531
+ width:fit-content;
1532
+ -webkit-transition:background ease-in-out 0.1s, border-color ease-in-out 0.1s;
1533
+ -o-transition:background ease-in-out 0.1s, border-color ease-in-out 0.1s;
1534
+ -moz-transition:background ease-in-out 0.1s, border-color ease-in-out 0.1s;
1535
+ transition:background ease-in-out 0.1s, border-color ease-in-out 0.1s;
1536
+ }
1537
+ .eds-contrast .eds-input-panel__container{
1538
+ background-color:var(--components-form-basepanel-contrast-fill-default);
1539
+ border-color:var(--components-form-basepanel-contrast-border-default);
1540
+ color:var(--components-form-basepanel-contrast-text-accent);
1541
+ }
1542
+ .eds-input-panel__container:hover{
1543
+ background-color:var(--components-form-basepanel-standard-fill-hover);
1320
1544
  /* The following styling is needed to sync the inner checkbox/radiobutton's
1321
1545
  hover state styling with the inputPanel container */
1322
1546
  }
1323
- .eds-contrast .eds-input-panel__container:hover {
1324
- background-color: var(--components-form-basepanel-contrast-fill-hover);
1547
+ .eds-contrast .eds-input-panel__container:hover{
1548
+ background-color:var(--components-form-basepanel-contrast-fill-hover);
1325
1549
  }
1326
1550
  .eds-input-panel__container:hover .eds-checkbox__icon,
1327
- .eds-input-panel__container:hover .eds-form-component--radio__radio {
1328
- background-color: var(--components-form-basepanel-standard-fill-hover);
1329
- border-color: var(--components-form-basepanel-standard-border-selected);
1551
+ .eds-input-panel__container:hover .eds-form-component--radio__radio{
1552
+ background-color:var(--components-form-basepanel-standard-fill-hover);
1553
+ border-color:var(--components-form-basepanel-standard-border-selected);
1330
1554
  }
1331
1555
  .eds-contrast .eds-input-panel__container:hover .eds-checkbox__icon,
1332
- .eds-contrast .eds-input-panel__container:hover .eds-form-component--radio__radio {
1333
- background-color: var(--components-form-basepanel-contrast-fill-hover);
1334
- border-color: var(--components-form-basepanel-contrast-border-selected);
1335
- }
1336
- input:disabled + .eds-input-panel__container {
1337
- background: var(--components-form-basepanel-standard-fill-disabled);
1338
- border-color: var(--components-form-basepanel-standard-border-disabled);
1339
- color: var(--components-form-basepanel-standard-text-disabled);
1340
- cursor: not-allowed;
1341
- }
1342
- .eds-contrast input:disabled + .eds-input-panel__container {
1343
- background: var(--components-form-basepanel-contrast-fill-disabled);
1344
- border-style: dashed;
1345
- border-color: var(--components-form-basepanel-contrast-border-disabled);
1346
- color: var(--components-form-basepanel-contrast-text-disabled);
1556
+ .eds-contrast .eds-input-panel__container:hover .eds-form-component--radio__radio{
1557
+ background-color:var(--components-form-basepanel-contrast-fill-hover);
1558
+ border-color:var(--components-form-basepanel-contrast-border-selected);
1559
+ }
1560
+ input:disabled + .eds-input-panel__container{
1561
+ background:var(--components-form-basepanel-standard-fill-disabled);
1562
+ border-color:var(--components-form-basepanel-standard-border-disabled);
1563
+ color:var(--components-form-basepanel-standard-text-disabled);
1564
+ cursor:not-allowed;
1565
+ }
1566
+ .eds-contrast input:disabled + .eds-input-panel__container{
1567
+ background:var(--components-form-basepanel-contrast-fill-disabled);
1568
+ border-style:dashed;
1569
+ border-color:var(--components-form-basepanel-contrast-border-disabled);
1570
+ color:var(--components-form-basepanel-contrast-text-disabled);
1347
1571
  }
1348
1572
  .eds-input-panel__container .eds-checkbox__icon,
1349
1573
  .eds-input-panel__container .eds-checkbox__icon .eds-checkbox__icon,
1350
- .eds-input-panel__container .eds-form-component--radio__radio {
1351
- width: 1.5rem;
1352
- height: 1.5rem;
1353
- margin-right: 0;
1354
- }
1355
- .eds-input-panel--medium .eds-input-panel__title {
1356
- font-size: 1rem;
1357
- font-weight: 500;
1358
- }
1359
- .eds-input-panel--medium.eds-input-panel__container {
1360
- padding-bottom: 1rem;
1361
- min-height: 3.75rem;
1362
- }
1363
- .eds-input-panel--large.eds-input-panel__container {
1364
- min-height: 6rem;
1365
- }
1366
- .eds-input-panel--large .eds-input-panel__title {
1367
- font-size: 1.25rem;
1368
- font-weight: 500;
1369
- line-height: 1.875rem;
1370
- }
1371
- .eds-input-panel__title-wrapper {
1372
- display: flex;
1373
- justify-content: space-between;
1374
- align-items: center;
1375
- }
1376
- .eds-input-panel__secondary-label-and-icon-wrapper {
1377
- display: flex;
1378
- justify-content: center;
1379
- align-items: center;
1380
- gap: 0.75rem;
1381
- }
1382
- .eds-input-panel__secondary-label-and-icon-wrapper .eds-checkbox__container {
1383
- margin: 0;
1384
- }
1385
- .eds-input-panel__additional-content {
1386
- margin-top: 0.25rem;
1387
- word-wrap: break-word;
1388
- }/* DO NOT CHANGE!*/
1389
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
1390
- .eds-switch {
1391
- cursor: pointer;
1392
- user-select: none;
1393
- padding: 0.5rem 0;
1394
- width: fit-content;
1395
- }
1396
- .eds-switch input {
1397
- opacity: 0;
1398
- pointer-events: none;
1399
- position: absolute;
1400
- }
1401
- .eds-switch--right {
1402
- display: flex;
1403
- flex-direction: row;
1404
- align-items: center;
1405
- }
1406
- .eds-switch--bottom {
1407
- display: flex;
1408
- flex-direction: column;
1409
- align-items: center;
1410
- }
1411
- .eds-switch__circle {
1412
- border-radius: 50%;
1413
- height: 1.25rem;
1414
- width: 1.25rem;
1415
- content: "";
1416
- display: flex;
1417
- align-items: center;
1418
- justify-content: center;
1419
- transition: left 0.1s ease-in-out, background-color 0.1s ease-in-out;
1420
- box-shadow: 0 0.0625rem 0.1875rem rgba(0, 0, 0, 0.25);
1421
- background-color: var(--components-form-switch-standard-switch);
1422
- top: 0.125rem;
1423
- left: 0.125rem;
1424
- position: relative;
1425
- }
1426
- .eds-switch__switch--large .eds-switch__circle {
1427
- height: 1.75rem;
1428
- width: 1.75rem;
1429
- }
1430
- .eds-contrast .eds-switch__circle {
1431
- box-shadow: 0 0.0625rem 0.1875rem rgba(0, 0, 0, 0.5);
1432
- }
1433
- .eds-switch__switch {
1434
- position: relative;
1435
- background-color: var(--components-form-switch-standard-fill-false);
1436
- content: "";
1437
- display: block;
1438
- transition: background-color 0.1s ease-in-out;
1439
- height: 1.5rem;
1440
- width: 3rem;
1441
- border-radius: 1.5rem;
1442
- box-shadow: inset 0px 2px 2px -1px rgba(0, 0, 0, 0.1);
1443
- }
1444
- .eds-contrast .eds-switch__switch {
1445
- background-color: var(--components-form-switch-contrast-fill-false);
1446
- }
1447
- .eds-switch--right .eds-switch__switch {
1448
- margin-right: 0.75rem;
1574
+ .eds-input-panel__container .eds-form-component--radio__radio{
1575
+ width:1.5rem;
1576
+ height:1.5rem;
1577
+ margin-right:0;
1578
+ }
1579
+ .eds-input-panel--medium .eds-input-panel__title{
1580
+ font-size:1rem;
1581
+ font-weight:500;
1582
+ }
1583
+ .eds-input-panel--medium.eds-input-panel__container{
1584
+ padding-bottom:1rem;
1585
+ min-height:3.75rem;
1586
+ }
1587
+ .eds-input-panel--large.eds-input-panel__container{
1588
+ min-height:6rem;
1589
+ }
1590
+ .eds-input-panel--large .eds-input-panel__title{
1591
+ font-size:1.25rem;
1592
+ font-weight:500;
1593
+ line-height:1.875rem;
1594
+ }
1595
+ .eds-input-panel__title-wrapper{
1596
+ display:-webkit-box;
1597
+ display:-webkit-flex;
1598
+ display:-moz-box;
1599
+ display:flex;
1600
+ -webkit-box-pack:justify;
1601
+ -webkit-justify-content:space-between;
1602
+ -moz-box-pack:justify;
1603
+ justify-content:space-between;
1604
+ -webkit-box-align:center;
1605
+ -webkit-align-items:center;
1606
+ -moz-box-align:center;
1607
+ align-items:center;
1608
+ }
1609
+ .eds-input-panel__secondary-label-and-icon-wrapper{
1610
+ display:-webkit-box;
1611
+ display:-webkit-flex;
1612
+ display:-moz-box;
1613
+ display:flex;
1614
+ -webkit-box-pack:center;
1615
+ -webkit-justify-content:center;
1616
+ -moz-box-pack:center;
1617
+ justify-content:center;
1618
+ -webkit-box-align:center;
1619
+ -webkit-align-items:center;
1620
+ -moz-box-align:center;
1621
+ align-items:center;
1622
+ gap:0.75rem;
1623
+ }
1624
+ .eds-input-panel__secondary-label-and-icon-wrapper .eds-checkbox__container{
1625
+ margin:0;
1626
+ }
1627
+ .eds-input-panel__additional-content{
1628
+ margin-top:0.25rem;
1629
+ word-wrap:break-word;
1630
+ }.eds-switch{
1631
+ cursor:pointer;
1632
+ -webkit-user-select:none;
1633
+ -moz-user-select:none;
1634
+ -ms-user-select:none;
1635
+ user-select:none;
1636
+ padding:0.5rem 0;
1637
+ width:-webkit-fit-content;
1638
+ width:-moz-fit-content;
1639
+ width:fit-content;
1640
+ }
1641
+ .eds-switch input{
1642
+ opacity:0;
1643
+ pointer-events:none;
1644
+ position:absolute;
1645
+ }
1646
+ .eds-switch--right{
1647
+ display:-webkit-box;
1648
+ display:-webkit-flex;
1649
+ display:-moz-box;
1650
+ display:flex;
1651
+ -webkit-box-orient:horizontal;
1652
+ -webkit-box-direction:normal;
1653
+ -webkit-flex-direction:row;
1654
+ -moz-box-orient:horizontal;
1655
+ -moz-box-direction:normal;
1656
+ flex-direction:row;
1657
+ -webkit-box-align:center;
1658
+ -webkit-align-items:center;
1659
+ -moz-box-align:center;
1660
+ align-items:center;
1661
+ }
1662
+ .eds-switch--bottom{
1663
+ display:-webkit-box;
1664
+ display:-webkit-flex;
1665
+ display:-moz-box;
1666
+ display:flex;
1667
+ -webkit-box-orient:vertical;
1668
+ -webkit-box-direction:normal;
1669
+ -webkit-flex-direction:column;
1670
+ -moz-box-orient:vertical;
1671
+ -moz-box-direction:normal;
1672
+ flex-direction:column;
1673
+ -webkit-box-align:center;
1674
+ -webkit-align-items:center;
1675
+ -moz-box-align:center;
1676
+ align-items:center;
1677
+ }
1678
+ .eds-switch__circle{
1679
+ -webkit-border-radius:50%;
1680
+ -moz-border-radius:50%;
1681
+ border-radius:50%;
1682
+ height:1.25rem;
1683
+ width:1.25rem;
1684
+ content:"";
1685
+ display:-webkit-box;
1686
+ display:-webkit-flex;
1687
+ display:-moz-box;
1688
+ display:flex;
1689
+ -webkit-box-align:center;
1690
+ -webkit-align-items:center;
1691
+ -moz-box-align:center;
1692
+ align-items:center;
1693
+ -webkit-box-pack:center;
1694
+ -webkit-justify-content:center;
1695
+ -moz-box-pack:center;
1696
+ justify-content:center;
1697
+ -webkit-transition:left 0.1s ease-in-out, background-color 0.1s ease-in-out;
1698
+ -o-transition:left 0.1s ease-in-out, background-color 0.1s ease-in-out;
1699
+ -moz-transition:left 0.1s ease-in-out, background-color 0.1s ease-in-out;
1700
+ transition:left 0.1s ease-in-out, background-color 0.1s ease-in-out;
1701
+ -webkit-box-shadow:0 0.0625rem 0.1875rem rgba(0, 0, 0, 0.25);
1702
+ -moz-box-shadow:0 0.0625rem 0.1875rem rgba(0, 0, 0, 0.25);
1703
+ box-shadow:0 0.0625rem 0.1875rem rgba(0, 0, 0, 0.25);
1704
+ background-color:var(--components-form-switch-standard-switch);
1705
+ top:0.125rem;
1706
+ left:0.125rem;
1707
+ position:relative;
1708
+ }
1709
+ .eds-switch__switch--large .eds-switch__circle{
1710
+ height:1.75rem;
1711
+ width:1.75rem;
1712
+ }
1713
+ .eds-contrast .eds-switch__circle{
1714
+ -webkit-box-shadow:0 0.0625rem 0.1875rem rgba(0, 0, 0, 0.5);
1715
+ -moz-box-shadow:0 0.0625rem 0.1875rem rgba(0, 0, 0, 0.5);
1716
+ box-shadow:0 0.0625rem 0.1875rem rgba(0, 0, 0, 0.5);
1717
+ }
1718
+ .eds-switch__switch{
1719
+ position:relative;
1720
+ background-color:var(--components-form-switch-standard-fill-false);
1721
+ content:"";
1722
+ display:block;
1723
+ -webkit-transition:background-color 0.1s ease-in-out;
1724
+ -o-transition:background-color 0.1s ease-in-out;
1725
+ -moz-transition:background-color 0.1s ease-in-out;
1726
+ transition:background-color 0.1s ease-in-out;
1727
+ height:1.5rem;
1728
+ width:3rem;
1729
+ -webkit-border-radius:1.5rem;
1730
+ -moz-border-radius:1.5rem;
1731
+ border-radius:1.5rem;
1732
+ -webkit-box-shadow:inset 0px 2px 2px -1px rgba(0, 0, 0, 0.1);
1733
+ -moz-box-shadow:inset 0px 2px 2px -1px rgba(0, 0, 0, 0.1);
1734
+ box-shadow:inset 0px 2px 2px -1px rgba(0, 0, 0, 0.1);
1735
+ }
1736
+ .eds-contrast .eds-switch__switch{
1737
+ background-color:var(--components-form-switch-contrast-fill-false);
1738
+ }
1739
+ .eds-switch--right .eds-switch__switch{
1740
+ margin-right:0.75rem;
1449
1741
  }
1450
1742
  .eds-switch__switch svg g,
1451
- .eds-switch__switch path {
1452
- fill: var(--components-form-switch-standard-icon-false);
1453
- transition: fill ease-in-out 0.1s;
1743
+ .eds-switch__switch path{
1744
+ fill:var(--components-form-switch-standard-icon-false);
1745
+ -webkit-transition:fill ease-in-out 0.1s;
1746
+ -o-transition:fill ease-in-out 0.1s;
1747
+ -moz-transition:fill ease-in-out 0.1s;
1748
+ transition:fill ease-in-out 0.1s;
1454
1749
  }
1455
1750
  .eds-contrast .eds-switch__switch svg g,
1456
- .eds-contrast .eds-switch__switch path {
1457
- fill: var(--components-form-switch-contrast-icon-false);
1751
+ .eds-contrast .eds-switch__switch path{
1752
+ fill:var(--components-form-switch-contrast-icon-false);
1458
1753
  }
1459
- :checked + .eds-switch__switch {
1460
- background-color: var(--eds-switch-color);
1754
+ :checked + .eds-switch__switch{
1755
+ background-color:var(--eds-switch-color);
1461
1756
  }
1462
- :checked + .eds-switch__switch .eds-switch__circle {
1463
- left: 1.625rem;
1757
+ :checked + .eds-switch__switch .eds-switch__circle{
1758
+ left:1.625rem;
1464
1759
  }
1465
1760
  :checked + .eds-switch__switch .eds-switch__circle svg g,
1466
- :checked + .eds-switch__switch .eds-switch__circle path {
1467
- fill: var(--eds-switch-color);
1468
- }
1469
- .eds-contrast :checked + .eds-switch__switch {
1470
- background-color: var(--eds-switch-contrast-color);
1471
- }
1472
- :focus-visible + .eds-switch__switch {
1473
- outline: 2px solid #181c56;
1474
- outline-color: var(--basecolors-stroke-focus-standard);
1475
- outline-offset: 0.125rem;
1476
- }
1477
- .eds-contrast :focus-visible + .eds-switch__switch {
1478
- outline-color: var(--basecolors-stroke-focus-contrast);
1479
- }
1480
- .eds-switch__switch--large {
1481
- width: 3.75rem;
1482
- height: 2rem;
1483
- border-radius: 3.75rem;
1484
- }
1485
- :checked + .eds-switch__switch--large .eds-switch__circle {
1486
- left: 1.875rem;
1487
- }
1488
- .eds-switch__switch--large svg {
1489
- position: relative;
1490
- right: 0.05rem;
1491
- }
1492
- .eds-switch__label--large--right {
1493
- font-size: 1rem;
1494
- }
1495
- .eds-switch__label--large--bottom {
1496
- font-size: 0.875rem;
1497
- }
1498
- .eds-switch__label--medium--right {
1499
- font-size: 0.875rem;
1500
- }
1501
- .eds-switch__label--medium--bottom {
1502
- font-size: 0.75rem;
1503
- }/* DO NOT CHANGE!*/
1504
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
1505
- /* DO NOT CHANGE!*/
1506
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
1507
- /* DO NOT CHANGE!*/
1508
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
1509
- /* DO NOT CHANGE!*/
1510
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
1511
- /* DO NOT CHANGE!*/
1512
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
1513
- [data-color-mode=light],
1514
- :root {
1515
- --basecolors-frame-contrast: #181c56;
1516
- --basecolors-frame-contrastalt: #393d79;
1517
- --basecolors-frame-contrastalt-2: #292b6a;
1518
- --basecolors-frame-default: #ffffff;
1519
- --basecolors-frame-elevated: #ffffff;
1520
- --basecolors-frame-elevatedalt: #f6f6f9;
1521
- --basecolors-frame-subdued: #d9dae8;
1522
- --basecolors-frame-tint: #f6f6f9;
1523
- --basecolors-shape-accent: #181c56;
1524
- --basecolors-shape-bicycle-contrast: #00db9b;
1525
- --basecolors-shape-bicycle-default: #33826b;
1526
- --basecolors-shape-bus-contrast: #ff6392;
1527
- --basecolors-shape-bus-default: #c5044e;
1528
- --basecolors-shape-cableway-contrast: #b482fb;
1529
- --basecolors-shape-cableway-default: #78469a;
1530
- --basecolors-shape-disabled: #6e6f73;
1531
- --basecolors-shape-disabledalt: #b6b8ba;
1532
- --basecolors-shape-ferry-contrast: #6fdfff;
1533
- --basecolors-shape-ferry-default: #0c6693;
1534
- --basecolors-shape-funicular-contrast: #b482fb;
1535
- --basecolors-shape-funicular-default: #78469a;
1536
- --basecolors-shape-helicopter-contrast: #fbafea;
1537
- --basecolors-shape-helicopter-default: #800664;
1538
- --basecolors-shape-highlight: #ff5959;
1539
- --basecolors-shape-light: #ffffff;
1540
- --basecolors-shape-mask: #ffffff;
1541
- --basecolors-shape-maskalt: #ffffff;
1542
- --basecolors-shape-metro-contrast: #f08901;
1543
- --basecolors-shape-metro-default: #bf5826;
1544
- --basecolors-shape-mobility-contrast: #00db9b;
1545
- --basecolors-shape-mobility-default: #33826b;
1546
- --basecolors-shape-plane-contrast: #fbafea;
1547
- --basecolors-shape-plane-default: #800664;
1548
- --basecolors-shape-subdued: #626493;
1549
- --basecolors-shape-subduedalt: #d9dae8;
1550
- --basecolors-shape-taxi-contrast: #ffe082;
1551
- --basecolors-shape-taxi-default: #3d3e40;
1552
- --basecolors-shape-train-contrast: #42a5f5;
1553
- --basecolors-shape-train-default: #00367f;
1554
- --basecolors-shape-tram-contrast: #b482fb;
1555
- --basecolors-shape-tram-default: #78469a;
1556
- --basecolors-shape-walk-contrast: #8284ab;
1557
- --basecolors-shape-walk-default: #8d8e9c;
1558
- --basecolors-shape-airportlinkbus-contrast: #fbafea;
1559
- --basecolors-shape-airportlinkbus-default: #800664;
1560
- --basecolors-shape-airportlinkrail-contrast: #fbafea;
1561
- --basecolors-shape-airportlinkrail-default: #800664;
1562
- --basecolors-stroke-contrast: #aeb7e2;
1563
- --basecolors-stroke-default: #181c56;
1564
- --basecolors-stroke-disabled: #949699;
1565
- --basecolors-stroke-focus-contrast: #aeb7e2;
1566
- --basecolors-stroke-focus-standard: #181c56;
1567
- --basecolors-stroke-highlight: #ff5959;
1568
- --basecolors-stroke-light: #ffffff;
1569
- --basecolors-stroke-subdued: #8284ab;
1570
- --basecolors-stroke-subduedalt: #e3e6e8;
1571
- --basecolors-text-accent: #181c56;
1572
- --basecolors-text-disabled: #6e6f73;
1573
- --basecolors-text-disabledalt: #b6b8ba;
1574
- --basecolors-text-highlight: #ff5959;
1575
- --basecolors-text-light: #ffffff;
1576
- --basecolors-text-subdued: #626493;
1577
- --basecolors-text-subduedalt: #d9dae8;
1761
+ :checked + .eds-switch__switch .eds-switch__circle path{
1762
+ fill:var(--eds-switch-color);
1763
+ }
1764
+ .eds-contrast :checked + .eds-switch__switch{
1765
+ background-color:var(--eds-switch-contrast-color);
1766
+ }
1767
+ :focus-visible + .eds-switch__switch{
1768
+ outline:2px solid #181c56;
1769
+ outline-color:var(--basecolors-stroke-focus-standard);
1770
+ outline-offset:0.125rem;
1771
+ }
1772
+ .eds-contrast :focus-visible + .eds-switch__switch{
1773
+ outline-color:var(--basecolors-stroke-focus-contrast);
1774
+ }
1775
+ .eds-switch__switch--large{
1776
+ width:3.75rem;
1777
+ height:2rem;
1778
+ -webkit-border-radius:3.75rem;
1779
+ -moz-border-radius:3.75rem;
1780
+ border-radius:3.75rem;
1781
+ }
1782
+ :checked + .eds-switch__switch--large .eds-switch__circle{
1783
+ left:1.875rem;
1784
+ }
1785
+ .eds-switch__switch--large svg{
1786
+ position:relative;
1787
+ right:0.05rem;
1788
+ }
1789
+ .eds-switch__label--large--right{
1790
+ font-size:1rem;
1791
+ }
1792
+ .eds-switch__label--large--bottom{
1793
+ font-size:0.875rem;
1794
+ }
1795
+ .eds-switch__label--medium--right{
1796
+ font-size:0.875rem;
1797
+ }
1798
+ .eds-switch__label--medium--bottom{
1799
+ font-size:0.75rem;
1800
+ }[data-color-mode=light],
1801
+ :root{
1802
+ --basecolors-frame-contrast:#181c56;
1803
+ --basecolors-frame-contrastalt:#393d79;
1804
+ --basecolors-frame-contrastalt-2:#292b6a;
1805
+ --basecolors-frame-default:#ffffff;
1806
+ --basecolors-frame-elevated:#ffffff;
1807
+ --basecolors-frame-elevatedalt:#f6f6f9;
1808
+ --basecolors-frame-subdued:#d9dae8;
1809
+ --basecolors-frame-tint:#f6f6f9;
1810
+ --basecolors-shape-accent:#181c56;
1811
+ --basecolors-shape-bicycle-contrast:#00db9b;
1812
+ --basecolors-shape-bicycle-default:#33826b;
1813
+ --basecolors-shape-bus-contrast:#ff6392;
1814
+ --basecolors-shape-bus-default:#c5044e;
1815
+ --basecolors-shape-cableway-contrast:#b482fb;
1816
+ --basecolors-shape-cableway-default:#78469a;
1817
+ --basecolors-shape-disabled:#6e6f73;
1818
+ --basecolors-shape-disabledalt:#b6b8ba;
1819
+ --basecolors-shape-ferry-contrast:#6fdfff;
1820
+ --basecolors-shape-ferry-default:#0c6693;
1821
+ --basecolors-shape-funicular-contrast:#b482fb;
1822
+ --basecolors-shape-funicular-default:#78469a;
1823
+ --basecolors-shape-helicopter-contrast:#fbafea;
1824
+ --basecolors-shape-helicopter-default:#800664;
1825
+ --basecolors-shape-highlight:#ff5959;
1826
+ --basecolors-shape-light:#ffffff;
1827
+ --basecolors-shape-mask:#ffffff;
1828
+ --basecolors-shape-maskalt:#ffffff;
1829
+ --basecolors-shape-metro-contrast:#f08901;
1830
+ --basecolors-shape-metro-default:#bf5826;
1831
+ --basecolors-shape-mobility-contrast:#00db9b;
1832
+ --basecolors-shape-mobility-default:#33826b;
1833
+ --basecolors-shape-plane-contrast:#fbafea;
1834
+ --basecolors-shape-plane-default:#800664;
1835
+ --basecolors-shape-subdued:#626493;
1836
+ --basecolors-shape-subduedalt:#d9dae8;
1837
+ --basecolors-shape-taxi-contrast:#ffe082;
1838
+ --basecolors-shape-taxi-default:#3d3e40;
1839
+ --basecolors-shape-train-contrast:#42a5f5;
1840
+ --basecolors-shape-train-default:#00367f;
1841
+ --basecolors-shape-tram-contrast:#b482fb;
1842
+ --basecolors-shape-tram-default:#78469a;
1843
+ --basecolors-shape-walk-contrast:#8284ab;
1844
+ --basecolors-shape-walk-default:#8d8e9c;
1845
+ --basecolors-shape-airportlinkbus-contrast:#fbafea;
1846
+ --basecolors-shape-airportlinkbus-default:#800664;
1847
+ --basecolors-shape-airportlinkrail-contrast:#fbafea;
1848
+ --basecolors-shape-airportlinkrail-default:#800664;
1849
+ --basecolors-stroke-contrast:#aeb7e2;
1850
+ --basecolors-stroke-default:#181c56;
1851
+ --basecolors-stroke-disabled:#949699;
1852
+ --basecolors-stroke-focus-contrast:#aeb7e2;
1853
+ --basecolors-stroke-focus-standard:#181c56;
1854
+ --basecolors-stroke-highlight:#ff5959;
1855
+ --basecolors-stroke-light:#ffffff;
1856
+ --basecolors-stroke-subdued:#8284ab;
1857
+ --basecolors-stroke-subduedalt:#e3e6e8;
1858
+ --basecolors-text-accent:#181c56;
1859
+ --basecolors-text-disabled:#6e6f73;
1860
+ --basecolors-text-disabledalt:#b6b8ba;
1861
+ --basecolors-text-highlight:#ff5959;
1862
+ --basecolors-text-light:#ffffff;
1863
+ --basecolors-text-subdued:#626493;
1864
+ --basecolors-text-subduedalt:#d9dae8;
1578
1865
  }
1579
1866
 
1580
- [data-color-mode=dark] {
1581
- --basecolors-frame-contrast: #212233;
1582
- --basecolors-frame-contrastalt: #141527;
1583
- --basecolors-frame-contrastalt-2: #08091c;
1584
- --basecolors-frame-default: #08091c;
1585
- --basecolors-frame-elevated: rgba(229, 229, 233, 0.1490196078);
1586
- --basecolors-frame-elevatedalt: #464755;
1587
- --basecolors-frame-subdued: #2d2e3e;
1588
- --basecolors-frame-tint: #141527;
1589
- --basecolors-shape-accent: #e5e5e9;
1590
- --basecolors-shape-bicycle-contrast: #4db295;
1591
- --basecolors-shape-bicycle-default: #4db295;
1592
- --basecolors-shape-bus-contrast: #ef7398;
1593
- --basecolors-shape-bus-default: #ef7398;
1594
- --basecolors-shape-cableway-contrast: #b898e5;
1595
- --basecolors-shape-cableway-default: #b898e5;
1596
- --basecolors-shape-disabled: #b6b8ba;
1597
- --basecolors-shape-disabledalt: #b3b4bd;
1598
- --basecolors-shape-ferry-contrast: #8ccfe2;
1599
- --basecolors-shape-ferry-default: #8ccfe2;
1600
- --basecolors-shape-funicular-contrast: #b898e5;
1601
- --basecolors-shape-funicular-default: #b898e5;
1602
- --basecolors-shape-helicopter-contrast: #f2b8e5;
1603
- --basecolors-shape-helicopter-default: #f2b8e5;
1604
- --basecolors-shape-highlight: #ff9494;
1605
- --basecolors-shape-light: #e5e5e9;
1606
- --basecolors-shape-mask: #2d2e3e;
1607
- --basecolors-shape-maskalt: #393a49;
1608
- --basecolors-shape-metro-contrast: #dd973c;
1609
- --basecolors-shape-metro-default: #dd973c;
1610
- --basecolors-shape-mobility-contrast: #4db295;
1611
- --basecolors-shape-mobility-default: #4db295;
1612
- --basecolors-shape-plane-contrast: #f2b8e5;
1613
- --basecolors-shape-plane-default: #f2b8e5;
1614
- --basecolors-shape-subdued: #b3b4bd;
1615
- --basecolors-shape-subduedalt: #b3b4bd;
1616
- --basecolors-shape-taxi-contrast: #ffe082;
1617
- --basecolors-shape-taxi-default: #ffe082;
1618
- --basecolors-shape-train-contrast: #60a2d7;
1619
- --basecolors-shape-train-default: #60a2d7;
1620
- --basecolors-shape-tram-contrast: #b898e5;
1621
- --basecolors-shape-tram-default: #b898e5;
1622
- --basecolors-shape-walk-contrast: #8d8e9c;
1623
- --basecolors-shape-walk-default: #8d8e9c;
1624
- --basecolors-shape-airportlinkbus-contrast: #f2b8e5;
1625
- --basecolors-shape-airportlinkbus-default: #f2b8e5;
1626
- --basecolors-shape-airportlinkrail-contrast: #f2b8e5;
1627
- --basecolors-shape-airportlinkrail-default: #f2b8e5;
1628
- --basecolors-stroke-contrast: #aeb7e2;
1629
- --basecolors-stroke-default: #b3b4bd;
1630
- --basecolors-stroke-disabled: #e3e6e8;
1631
- --basecolors-stroke-focus-contrast: #aeb7e2;
1632
- --basecolors-stroke-focus-standard: #aeb7e2;
1633
- --basecolors-stroke-highlight: #ff9494;
1634
- --basecolors-stroke-light: #b3b4bd;
1635
- --basecolors-stroke-subdued: #81828f;
1636
- --basecolors-stroke-subduedalt: #949699;
1637
- --basecolors-text-accent: #e5e5e9;
1638
- --basecolors-text-disabled: #b6b8ba;
1639
- --basecolors-text-disabledalt: #b6b8ba;
1640
- --basecolors-text-highlight: #ff9494;
1641
- --basecolors-text-light: #e5e5e9;
1642
- --basecolors-text-subdued: #b3b4bd;
1643
- --basecolors-text-subduedalt: #b3b4bd;
1867
+ [data-color-mode=dark]{
1868
+ --basecolors-frame-contrast:#212233;
1869
+ --basecolors-frame-contrastalt:#141527;
1870
+ --basecolors-frame-contrastalt-2:#08091c;
1871
+ --basecolors-frame-default:#08091c;
1872
+ --basecolors-frame-elevated:rgba(229, 229, 233, 0.1490196078);
1873
+ --basecolors-frame-elevatedalt:#464755;
1874
+ --basecolors-frame-subdued:#2d2e3e;
1875
+ --basecolors-frame-tint:#141527;
1876
+ --basecolors-shape-accent:#e5e5e9;
1877
+ --basecolors-shape-bicycle-contrast:#4db295;
1878
+ --basecolors-shape-bicycle-default:#4db295;
1879
+ --basecolors-shape-bus-contrast:#ef7398;
1880
+ --basecolors-shape-bus-default:#ef7398;
1881
+ --basecolors-shape-cableway-contrast:#b898e5;
1882
+ --basecolors-shape-cableway-default:#b898e5;
1883
+ --basecolors-shape-disabled:#b6b8ba;
1884
+ --basecolors-shape-disabledalt:#b3b4bd;
1885
+ --basecolors-shape-ferry-contrast:#8ccfe2;
1886
+ --basecolors-shape-ferry-default:#8ccfe2;
1887
+ --basecolors-shape-funicular-contrast:#b898e5;
1888
+ --basecolors-shape-funicular-default:#b898e5;
1889
+ --basecolors-shape-helicopter-contrast:#f2b8e5;
1890
+ --basecolors-shape-helicopter-default:#f2b8e5;
1891
+ --basecolors-shape-highlight:#ff9494;
1892
+ --basecolors-shape-light:#e5e5e9;
1893
+ --basecolors-shape-mask:#2d2e3e;
1894
+ --basecolors-shape-maskalt:#393a49;
1895
+ --basecolors-shape-metro-contrast:#dd973c;
1896
+ --basecolors-shape-metro-default:#dd973c;
1897
+ --basecolors-shape-mobility-contrast:#4db295;
1898
+ --basecolors-shape-mobility-default:#4db295;
1899
+ --basecolors-shape-plane-contrast:#f2b8e5;
1900
+ --basecolors-shape-plane-default:#f2b8e5;
1901
+ --basecolors-shape-subdued:#b3b4bd;
1902
+ --basecolors-shape-subduedalt:#b3b4bd;
1903
+ --basecolors-shape-taxi-contrast:#ffe082;
1904
+ --basecolors-shape-taxi-default:#ffe082;
1905
+ --basecolors-shape-train-contrast:#60a2d7;
1906
+ --basecolors-shape-train-default:#60a2d7;
1907
+ --basecolors-shape-tram-contrast:#b898e5;
1908
+ --basecolors-shape-tram-default:#b898e5;
1909
+ --basecolors-shape-walk-contrast:#8d8e9c;
1910
+ --basecolors-shape-walk-default:#8d8e9c;
1911
+ --basecolors-shape-airportlinkbus-contrast:#f2b8e5;
1912
+ --basecolors-shape-airportlinkbus-default:#f2b8e5;
1913
+ --basecolors-shape-airportlinkrail-contrast:#f2b8e5;
1914
+ --basecolors-shape-airportlinkrail-default:#f2b8e5;
1915
+ --basecolors-stroke-contrast:#aeb7e2;
1916
+ --basecolors-stroke-default:#b3b4bd;
1917
+ --basecolors-stroke-disabled:#e3e6e8;
1918
+ --basecolors-stroke-focus-contrast:#aeb7e2;
1919
+ --basecolors-stroke-focus-standard:#aeb7e2;
1920
+ --basecolors-stroke-highlight:#ff9494;
1921
+ --basecolors-stroke-light:#b3b4bd;
1922
+ --basecolors-stroke-subdued:#81828f;
1923
+ --basecolors-stroke-subduedalt:#949699;
1924
+ --basecolors-text-accent:#e5e5e9;
1925
+ --basecolors-text-disabled:#b6b8ba;
1926
+ --basecolors-text-disabledalt:#b6b8ba;
1927
+ --basecolors-text-highlight:#ff9494;
1928
+ --basecolors-text-light:#e5e5e9;
1929
+ --basecolors-text-subdued:#b3b4bd;
1930
+ --basecolors-text-subduedalt:#b3b4bd;
1644
1931
  }
1645
1932
 
1646
- .eds-textarea__wrapper :not(.eds-form-control-wrapper--disabled, .eds-form-control-wrapper--readonly) .eds-textarea__label .eds-input-group__label {
1647
- background: var(--basecolors-frame-default);
1648
- width: fit-content;
1649
- height: fit-content;
1650
- padding: 0.15rem;
1651
- margin: -0.15rem;
1652
- }
1653
- *[data-color-mode=dark] .eds-contrast .eds-textarea__wrapper :not(.eds-form-control-wrapper--disabled, .eds-form-control-wrapper--readonly) .eds-textarea__label .eds-input-group__label {
1654
- background-color: var(--basecolors-frame-contrast);
1655
- }
1656
- .eds-textarea__wrapper textarea.eds-form-control.eds-textarea {
1657
- min-height: 7.75rem;
1658
- resize: vertical;
1659
- line-height: 1.5rem;
1660
- }
1661
- .eds-textarea__wrapper .eds-form-control-wrapper {
1662
- padding-right: 0;
1663
- cursor: text;
1664
- }/* DO NOT CHANGE!*/
1665
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
1666
- .eds-textfield__clear-button {
1667
- background: none;
1668
- border: none;
1669
- border-radius: 50%;
1670
- color: inherit;
1671
- cursor: pointer;
1672
- display: flex;
1673
- font: inherit;
1674
- font-size: 1rem;
1675
- line-height: 1rem;
1676
- padding: 0.5rem;
1677
- margin-right: -0.75rem;
1678
- }
1679
- .eds-textfield__clear-button:hover {
1680
- background: var(--components-form-basepanel-standard-fill-hover);
1681
- }
1682
- .eds-textfield__clear-button:focus-visible {
1683
- outline: 2px solid #181c56;
1684
- outline-color: var(--basecolors-stroke-focus-standard);
1685
- outline-offset: 0.125rem;
1686
- }
1687
- .eds-textfield__clear-button-wrapper {
1688
- display: flex;
1689
- align-items: center;
1933
+ .eds-textarea__wrapper :not(.eds-form-control-wrapper--disabled):not(.eds-form-control-wrapper--readonly) .eds-textarea__label .eds-input-group__label{
1934
+ background:#ffffff;
1935
+ background:var(--basecolors-frame-default);
1936
+ width:-webkit-fit-content;
1937
+ width:-moz-fit-content;
1938
+ width:fit-content;
1939
+ height:-webkit-fit-content;
1940
+ height:-moz-fit-content;
1941
+ height:fit-content;
1942
+ padding:0.15rem;
1943
+ margin:-0.15rem;
1944
+ }
1945
+ *[data-color-mode=dark] .eds-contrast .eds-textarea__wrapper :not(.eds-form-control-wrapper--disabled):not(.eds-form-control-wrapper--readonly) .eds-textarea__label .eds-input-group__label{
1946
+ background-color:#181c56;
1947
+ background-color:var(--basecolors-frame-contrast);
1948
+ }
1949
+ .eds-textarea__wrapper textarea.eds-form-control.eds-textarea{
1950
+ min-height:7.75rem;
1951
+ resize:vertical;
1952
+ line-height:1.5rem;
1953
+ }
1954
+ .eds-textarea__wrapper .eds-form-control-wrapper{
1955
+ padding-right:0;
1956
+ cursor:text;
1957
+ }.eds-textfield__clear-button{
1958
+ background:none;
1959
+ border:none;
1960
+ -webkit-border-radius:50%;
1961
+ -moz-border-radius:50%;
1962
+ border-radius:50%;
1963
+ color:inherit;
1964
+ cursor:pointer;
1965
+ display:-webkit-box;
1966
+ display:-webkit-flex;
1967
+ display:-moz-box;
1968
+ display:flex;
1969
+ font:inherit;
1970
+ font-size:1rem;
1971
+ line-height:1rem;
1972
+ padding:0.5rem;
1973
+ margin-right:-0.75rem;
1974
+ }
1975
+ .eds-textfield__clear-button:hover{
1976
+ background:var(--components-form-basepanel-standard-fill-hover);
1977
+ }
1978
+ .eds-textfield__clear-button:focus-visible{
1979
+ outline:2px solid #181c56;
1980
+ outline-color:var(--basecolors-stroke-focus-standard);
1981
+ outline-offset:0.125rem;
1982
+ }
1983
+ .eds-textfield__clear-button-wrapper{
1984
+ display:-webkit-box;
1985
+ display:-webkit-flex;
1986
+ display:-moz-box;
1987
+ display:flex;
1988
+ -webkit-box-align:center;
1989
+ -webkit-align-items:center;
1990
+ -moz-box-align:center;
1991
+ align-items:center;
1690
1992
  }
1691
1993
 
1692
- .eds-textfield__divider {
1693
- content: "";
1694
- display: block;
1695
- background-color: var(--components-form-baseform-standard-icon);
1696
- height: 1.5rem;
1697
- width: 1px;
1994
+ .eds-textfield__divider{
1995
+ content:"";
1996
+ display:block;
1997
+ background-color:var(--components-form-baseform-standard-icon);
1998
+ height:1.5rem;
1999
+ width:1px;
1698
2000
  }
1699
- .eds-contrast .eds-form-control-wrapper--disabled .eds-textfield__divider {
1700
- background-color: var(--components-form-baseform-contrast-icon);
2001
+ .eds-contrast .eds-form-control-wrapper--disabled .eds-textfield__divider{
2002
+ background-color:var(--components-form-baseform-contrast-icon);
1701
2003
  }
1702
2004
 
1703
- .eds-textfield__wrapper {
1704
- cursor: text;
1705
- }/* DO NOT CHANGE!*/
1706
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
1707
- .eds-segmented-control .eds-label {
1708
- font-weight: 600;
1709
- }
1710
- .eds-segmented-control .eds-segmented-control__choices {
1711
- position: relative;
1712
- display: flex;
1713
- margin-top: 0.25rem;
1714
- background: var(--components-form-segmentedcontrol-standard-background);
1715
- border-radius: 0.5rem;
1716
- }
1717
- .eds-contrast .eds-segmented-control .eds-segmented-control__choices {
1718
- background: var(--components-form-segmentedcontrol-contrast-background);
1719
- }/* DO NOT CHANGE!*/
1720
- /* This file is automatically generated from @entur/tokens! Changes will be overwritten. */
1721
- .eds-segmented-choice {
1722
- all: unset;
1723
- display: flex;
1724
- align-items: center;
1725
- justify-content: center;
1726
- flex: 1 1 0px;
1727
- --background-color: var(--components-form-segmentedcontrol-standard-fill-unselected);
1728
- background-color: var(--background-color);
1729
- border-radius: 0.25rem;
1730
- color: var(--components-form-segmentedcontrol-standard-text-unselected);
1731
- cursor: pointer;
1732
- font-size: 0.875rem;
1733
- height: 1.5rem;
1734
- line-height: 1.25rem;
1735
- margin: 0.25rem;
1736
- outline-color: transparent;
1737
- padding: calc(0.25rem / 2) 0.75rem;
1738
- text-align: center;
1739
- user-select: none;
1740
- transition: background-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
1741
- vertical-align: middle;
1742
- text-decoration: none;
1743
- }
1744
- .eds-segmented-choice--large {
1745
- font-size: 1rem;
1746
- height: 2.5rem;
1747
- line-height: 1.5rem;
1748
- padding: 0.5rem 0.75rem;
1749
- }
1750
- .eds-contrast .eds-segmented-choice {
1751
- --background-color: var(--components-form-segmentedcontrol-contrast-background);
1752
- color: var(--components-form-segmentedcontrol-contrast-text-unselected);
1753
- }
1754
- .eds-segmented-choice:hover {
1755
- --background-color: var(--components-form-segmentedcontrol-standard-fill-hover);
1756
- }
1757
- .eds-contrast .eds-segmented-choice:hover {
1758
- --background-color: var(--components-form-segmentedcontrol-contrast-fill-hover);
1759
- }
1760
- .eds-segmented-choice[aria-checked=true] {
1761
- --background-color: var(--components-form-segmentedcontrol-standard-fill-selected);
1762
- color: var(--components-form-segmentedcontrol-standard-text-selected);
1763
- box-shadow: 0 0.0625rem 0.1875rem rgba(0, 0, 0, 0.25);
1764
- }
1765
- .eds-contrast .eds-segmented-choice[aria-checked=true] {
1766
- --background-color: var(--components-form-segmentedcontrol-contrast-fill-selected);
1767
- box-shadow: 0 0.0625rem 0.1875rem rgb(57, 61, 121);
1768
- color: var(--components-form-segmentedcontrol-contrast-text-selected);
1769
- }
1770
- .eds-segmented-choice:focus-visible {
1771
- outline: 2px solid #181c56;
1772
- outline-color: var(--basecolors-stroke-focus-standard);
1773
- outline-offset: 0.125rem;
1774
- }
1775
- .eds-contrast .eds-segmented-choice:focus-visible {
1776
- outline-color: var(--basecolors-stroke-focus-contrast);
2005
+ .eds-textfield__wrapper{
2006
+ cursor:text;
2007
+ }.eds-segmented-control .eds-label{
2008
+ font-weight:600;
2009
+ }
2010
+ .eds-segmented-control .eds-segmented-control__choices{
2011
+ position:relative;
2012
+ display:-webkit-box;
2013
+ display:-webkit-flex;
2014
+ display:-moz-box;
2015
+ display:flex;
2016
+ margin-top:0.25rem;
2017
+ background:var(--components-form-segmentedcontrol-standard-background);
2018
+ -webkit-border-radius:0.5rem;
2019
+ -moz-border-radius:0.5rem;
2020
+ border-radius:0.5rem;
2021
+ }
2022
+ .eds-contrast .eds-segmented-control .eds-segmented-control__choices{
2023
+ background:var(--components-form-segmentedcontrol-contrast-background);
2024
+ }.eds-segmented-choice{
2025
+ all:unset;
2026
+ display:-webkit-box;
2027
+ display:-webkit-flex;
2028
+ display:-moz-box;
2029
+ display:flex;
2030
+ -webkit-box-align:center;
2031
+ -webkit-align-items:center;
2032
+ -moz-box-align:center;
2033
+ align-items:center;
2034
+ -webkit-box-pack:center;
2035
+ -webkit-justify-content:center;
2036
+ -moz-box-pack:center;
2037
+ justify-content:center;
2038
+ -webkit-box-flex:1;
2039
+ -webkit-flex:1 1 0px;
2040
+ -moz-box-flex:1;
2041
+ flex:1 1 0px;
2042
+ --background-color:var(--components-form-segmentedcontrol-standard-fill-unselected);
2043
+ background-color:var(--background-color);
2044
+ -webkit-border-radius:0.25rem;
2045
+ -moz-border-radius:0.25rem;
2046
+ border-radius:0.25rem;
2047
+ color:var(--components-form-segmentedcontrol-standard-text-unselected);
2048
+ cursor:pointer;
2049
+ font-size:0.875rem;
2050
+ height:1.5rem;
2051
+ line-height:1.25rem;
2052
+ margin:0.25rem;
2053
+ outline-color:transparent;
2054
+ padding:-webkit-calc(0.25rem / 2) 0.75rem;
2055
+ padding:-moz-calc(0.25rem / 2) 0.75rem;
2056
+ padding:calc(0.25rem / 2) 0.75rem;
2057
+ text-align:center;
2058
+ -webkit-user-select:none;
2059
+ -moz-user-select:none;
2060
+ -ms-user-select:none;
2061
+ user-select:none;
2062
+ -webkit-transition:background-color 0.15s ease, color 0.15s ease, -webkit-box-shadow 0.15s ease;
2063
+ transition:background-color 0.15s ease, color 0.15s ease, -webkit-box-shadow 0.15s ease;
2064
+ -o-transition:background-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
2065
+ -moz-transition:background-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease, -moz-box-shadow 0.15s ease;
2066
+ transition:background-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
2067
+ transition:background-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease, -webkit-box-shadow 0.15s ease, -moz-box-shadow 0.15s ease;
2068
+ vertical-align:middle;
2069
+ -webkit-text-decoration:none;
2070
+ text-decoration:none;
2071
+ }
2072
+ .eds-segmented-choice--large{
2073
+ font-size:1rem;
2074
+ height:2.5rem;
2075
+ line-height:1.5rem;
2076
+ padding:0.5rem 0.75rem;
2077
+ }
2078
+ .eds-contrast .eds-segmented-choice{
2079
+ --background-color:var(--components-form-segmentedcontrol-contrast-background);
2080
+ color:var(--components-form-segmentedcontrol-contrast-text-unselected);
2081
+ }
2082
+ .eds-segmented-choice:hover{
2083
+ --background-color:var(--components-form-segmentedcontrol-standard-fill-hover);
2084
+ }
2085
+ .eds-contrast .eds-segmented-choice:hover{
2086
+ --background-color:var(--components-form-segmentedcontrol-contrast-fill-hover);
2087
+ }
2088
+ .eds-segmented-choice[aria-checked=true]{
2089
+ --background-color:var(--components-form-segmentedcontrol-standard-fill-selected);
2090
+ color:var(--components-form-segmentedcontrol-standard-text-selected);
2091
+ -webkit-box-shadow:0 0.0625rem 0.1875rem rgba(0, 0, 0, 0.25);
2092
+ -moz-box-shadow:0 0.0625rem 0.1875rem rgba(0, 0, 0, 0.25);
2093
+ box-shadow:0 0.0625rem 0.1875rem rgba(0, 0, 0, 0.25);
2094
+ }
2095
+ .eds-contrast .eds-segmented-choice[aria-checked=true]{
2096
+ --background-color:var(--components-form-segmentedcontrol-contrast-fill-selected);
2097
+ -webkit-box-shadow:0 0.0625rem 0.1875rem rgb(57, 61, 121);
2098
+ -moz-box-shadow:0 0.0625rem 0.1875rem rgb(57, 61, 121);
2099
+ box-shadow:0 0.0625rem 0.1875rem rgb(57, 61, 121);
2100
+ color:var(--components-form-segmentedcontrol-contrast-text-selected);
2101
+ }
2102
+ .eds-segmented-choice:focus-visible{
2103
+ outline:2px solid #181c56;
2104
+ outline-color:var(--basecolors-stroke-focus-standard);
2105
+ outline-offset:0.125rem;
2106
+ }
2107
+ .eds-contrast .eds-segmented-choice:focus-visible{
2108
+ outline-color:var(--basecolors-stroke-focus-contrast);
1777
2109
  }