@oicl/openbridge-webcomponents 0.0.15-dev-20240915195432 → 0.0.15-dev-20240916185711

Sign up to get free protection for your applications and to get access to all the features.
Files changed (33) hide show
  1. package/__snapshots__/navigation-instruments-azimuth-thruster--in-command-at-setpoint-disable-auto-setpoint.png +0 -0
  2. package/__snapshots__/navigation-instruments-azimuth-thruster--in-command-at-setpoint.png +0 -0
  3. package/__snapshots__/navigation-instruments-azimuth-thruster--in-command.png +0 -0
  4. package/__snapshots__/navigation-instruments-azimuth-thruster--pod.png +0 -0
  5. package/__snapshots__/navigation-instruments-azimuth-thruster--single-direction-with-propeller.png +0 -0
  6. package/__snapshots__/navigation-instruments-azimuth-thruster--single-direction.png +0 -0
  7. package/__snapshots__/navigation-instruments-azimuth-thruster-labeled--large.png +0 -0
  8. package/__snapshots__/navigation-instruments-main-engine--active.png +0 -0
  9. package/__snapshots__/navigation-instruments-main-engine--in-command.png +0 -0
  10. package/__snapshots__/navigation-instruments-main-engine--off.png +0 -0
  11. package/__snapshots__/navigation-instruments-thruster--tunnel.png +0 -0
  12. package/custom-elements.json +570 -7
  13. package/dist/navigation-instruments/azimuth-thruster/azimuth-thruster.d.ts.map +1 -1
  14. package/dist/navigation-instruments/azimuth-thruster/azimuth-thruster.js +2 -1
  15. package/dist/navigation-instruments/azimuth-thruster/azimuth-thruster.js.map +1 -1
  16. package/dist/navigation-instruments/main-engine/main-engine.css.js +22 -0
  17. package/dist/navigation-instruments/main-engine/main-engine.css.js.map +1 -0
  18. package/dist/navigation-instruments/main-engine/main-engine.d.ts +29 -0
  19. package/dist/navigation-instruments/main-engine/main-engine.d.ts.map +1 -0
  20. package/dist/navigation-instruments/main-engine/main-engine.js +196 -0
  21. package/dist/navigation-instruments/main-engine/main-engine.js.map +1 -0
  22. package/dist/navigation-instruments/thruster/thruster.d.ts +54 -1
  23. package/dist/navigation-instruments/thruster/thruster.d.ts.map +1 -1
  24. package/dist/navigation-instruments/thruster/thruster.js +163 -99
  25. package/dist/navigation-instruments/thruster/thruster.js.map +1 -1
  26. package/package.json +1 -1
  27. package/src/navigation-instruments/azimuth-thruster/azimuth-thruster.ts +1 -0
  28. package/src/navigation-instruments/main-engine/main-engine.css +17 -0
  29. package/src/navigation-instruments/main-engine/main-engine.stories.ts +54 -0
  30. package/src/navigation-instruments/main-engine/main-engine.ts +160 -0
  31. package/src/navigation-instruments/thruster/thruster.stories.ts +1 -0
  32. package/src/navigation-instruments/thruster/thruster.ts +205 -113
  33. package/src/palettes/variables.css +1343 -1343
@@ -1,1354 +1,1354 @@
1
1
  :root[data-obc-theme=bright] {
2
- --element-active-color: rgb(26, 26, 26);
3
- --element-neutral-color: rgba(0, 0, 0, .550);
4
- --element-inactive-color: rgba(0, 0, 0, .420);
5
- --element-disabled-color: rgba(0, 0, 0, .200);
6
- --element-active-inverted-color: rgb(255, 255, 255);
7
- --element-neutral-inverted-color: rgba(255, 255, 255, .700);
8
- --element-inactive-inverted-color: rgba(255, 255, 255, .400);
9
- --element-disabled-inverted-color: rgba(255, 255, 255, .200);
10
- --container-backdrop-color: rgb(224, 224, 224);
11
- --container-section-color: rgb(240, 240, 240);
12
- --container-background-color: rgb(255, 255, 255);
13
- --container-global-color: rgb(255, 255, 255);
14
- --container-overlay-color: rgba(0, 0, 0, .100);
15
- --border-divider-color: rgba(0, 0, 0, .080);
16
- --border-outline-color: rgba(0, 0, 0, .080);
17
- --border-edge-color: rgba(0, 0, 0, .050);
18
- --border-solid-color: rgb(51, 51, 51);
19
- --border-icon-outline-color: rgba(0, 0, 0, .500);
20
- --border-silhouette-color: rgb(255, 255, 255);
21
- --instrument-enhanced-primary-color: rgb(26, 45, 255);
22
- --instrument-enhanced-secondary-color: rgb(37, 76, 147);
23
- --instrument-enhanced-tertiary-color: rgba(46, 79, 138, .300);
24
- --instrument-regular-primary-color: rgb(13, 13, 13);
25
- --instrument-regular-secondary-color: rgb(89, 89, 89);
26
- --instrument-regular-tertiary-color: rgba(102, 102, 102, .250);
27
- --instrument-frame-primary-color: rgb(255, 255, 255);
28
- --instrument-frame-secondary-color: rgb(240, 240, 240);
29
- --instrument-frame-tertiary-color: rgb(140, 140, 140);
30
- --instrument-tick-mark-primary-color: rgb(13, 13, 13);
31
- --instrument-tick-mark-secondary-color: rgb(89, 89, 89);
32
- --instrument-tick-mark-tertiary-color: rgb(140, 140, 140);
33
- --instrument-starboard-color: rgb(53, 158, 133);
34
- --instrument-port-color: rgb(225, 98, 144);
35
- --alert-running-color: rgb(0, 138, 23);
36
- --alert-caution-color: rgb(250, 217, 0);
37
- --alert-warning-color: rgb(246, 148, 0);
38
- --alert-alarm-color: rgb(223, 27, 27);
39
- --alert-critical-alarm-color: rgb(229, 0, 229);
40
- --alert-limit-primary-color: rgba(0, 0, 0, .100);
41
- --alert-limit-secondary-color: rgba(0, 0, 0, .100);
42
- --automation-device-primary-color: rgb(255, 255, 255);
43
- --automation-device-secondary-color: rgb(89, 89, 89);
44
- --automation-device-tertiary-color: rgb(13, 13, 13);
45
- --automation-device-primary-inverted-color: rgb(51, 51, 51);
46
- --automation-device-secondary-inverted-color: rgb(102, 102, 102);
47
- --automation-device-tertiary-inverted-color: rgb(143, 143, 143);
48
- --automation-pipe-primary-color: rgb(255, 255, 255);
49
- --automation-pipe-secondary-color: rgb(198, 198, 198);
50
- --automation-pipe-tertiary-color: rgba(0, 0, 0, .800);
51
- --automation-pipe-primary-inverted-color: rgba(0, 0, 0, .100);
52
- --automation-pipe-secondary-inverted-color: rgba(0, 0, 0, .200);
53
- --automation-pipe-tertiary-inverted-color: rgba(0, 0, 0, .200);
54
- --automation-pipe-overlay-color: rgba(0, 0, 0, .200);
55
- --automation-pipe-disabled-color: rgba(0, 0, 0, .100);
56
- --automation-acid-alkalis: rgb(231, 193, 244);
57
- --automation-air-ventilation: rgb(222, 222, 222);
58
- --automation-fire-fighting: rgb(255, 177, 196);
59
- --automation-flammable-gas: rgb(216, 224, 127);
60
- --automation-fresh-water: rgb(198, 241, 251);
61
- --automation-fuel: rgb(249, 208, 169);
62
- --automation-masses: rgb(209, 191, 173);
63
- --automation-non-flammable-gas: rgb(220, 232, 206);
64
- --automation-oil: rgb(253, 243, 155);
65
- --automation-sea-water: rgb(173, 230, 213);
66
- --automation-steam: rgb(203, 203, 203);
67
- --automation-waste-media: rgb(138, 138, 138);
68
- --normal-enabled-background-color: rgb(255, 255, 255);
69
- --normal-enabled-border-color: rgb(140, 140, 140);
70
- --normal-hover-background-color: rgb(230, 230, 230);
71
- --normal-hover-border-color: rgb(140, 140, 140);
72
- --normal-pressed-background-color: rgb(204, 204, 204);
73
- --normal-pressed-border-color: rgb(140, 140, 140);
74
- --normal-focused-background-color: rgb(255, 255, 255);
75
- --normal-focused-border-color: rgba(0, 110, 225, .300);
76
- --normal-disabled-background-color: rgba(255, 255, 255, .00);
77
- --normal-disabled-border-color: rgba(0, 0, 0, .100);
78
- --normal-activated-background-color: rgb(235, 235, 235);
79
- --normal-activated-border-color: rgba(0, 0, 0, .200);
80
- --on-normal-active-color: rgb(13, 13, 13);
81
- --on-normal-neutral-color: rgba(0, 0, 0, .650);
82
- --on-normal-disabled-color: rgba(0, 0, 0, .300);
83
- --raised-enabled-background-color: rgba(0, 0, 0, .650);
84
- --raised-enabled-border-color: rgba(0, 0, 0, .100);
85
- --raised-hover-background-color: rgba(0, 0, 0, .750);
86
- --raised-hover-border-color: rgba(0, 0, 0, .100);
87
- --raised-pressed-background-color: rgba(0, 0, 0, .850);
88
- --raised-pressed-border-color: rgba(0, 0, 0, .300);
89
- --raised-focused-background-color: rgba(0, 0, 0, .650);
90
- --raised-focused-border-color: rgba(0, 110, 225, .300);
91
- --raised-disabled-background-color: rgba(0, 0, 0, .00);
92
- --raised-disabled-border-color: rgba(0, 0, 0, .100);
93
- --on-raised-active-color: rgb(255, 255, 255);
94
- --on-raised-neutral-color: rgba(255, 255, 255, .700);
95
- --on-raised-disabled-color: rgba(0, 0, 0, .200);
96
- --indent-enabled-background-color: rgba(0, 0, 0, .050);
97
- --indent-enabled-border-color: rgba(0, 0, 0, .050);
98
- --indent-hover-background-color: rgba(0, 0, 0, .100);
99
- --indent-hover-border-color: rgba(0, 0, 0, .050);
100
- --indent-pressed-background-color: rgba(0, 0, 0, .160);
101
- --indent-pressed-border-color: rgba(0, 0, 0, .100);
102
- --indent-focused-background-color: rgba(0, 0, 0, .050);
103
- --indent-focused-border-color: rgba(0, 110, 225, .300);
104
- --indent-disabled-background-color: rgba(0, 0, 0, .00);
105
- --indent-disabled-border-color: rgba(0, 0, 0, .100);
106
- --on-indent-active-color: rgb(13, 13, 13);
107
- --on-indent-neutral-color: rgba(0, 0, 0, .450);
108
- --on-indent-disabled-color: rgba(0, 0, 0, .300);
109
- --flat-enabled-background-color: rgba(0, 0, 0, .00);
110
- --flat-enabled-border-color: rgba(0, 0, 0, .00);
111
- --flat-hover-background-color: rgba(0, 0, 0, .060);
112
- --flat-hover-border-color: rgba(0, 0, 0, .00);
113
- --flat-pressed-background-color: rgba(0, 0, 0, .120);
114
- --flat-pressed-border-color: rgba(0, 0, 0, .00);
115
- --flat-focused-background-color: rgba(0, 0, 0, .00);
116
- --flat-focused-border-color: rgba(0, 110, 225, .300);
117
- --flat-disabled-background-color: rgba(0, 0, 0, .00);
118
- --flat-disabled-border-color: rgba(0, 0, 0, .00);
119
- --flat-activated-background-color: rgba(0, 0, 0, .050);
120
- --flat-activated-border-color: rgba(0, 0, 0, .00);
121
- --flat-checked-background-color: rgba(48, 87, 146, .100);
122
- --flat-checked-border-color: rgba(15, 74, 163, .00);
123
- --on-flat-active-color: rgb(13, 13, 13);
124
- --on-flat-neutral-color: rgba(0, 0, 0, .650);
125
- --on-flat-disabled-color: rgba(0, 0, 0, .300);
126
- --selected-enabled-background-color: rgb(37, 76, 147);
127
- --selected-enabled-border-color: rgba(0, 0, 0, .00);
128
- --selected-hover-background-color: rgb(27, 55, 106);
129
- --selected-hover-border-color: rgba(0, 0, 0, .00);
130
- --selected-pressed-background-color: rgb(16, 34, 65);
131
- --selected-pressed-border-color: rgba(0, 0, 0, .00);
132
- --selected-focused-background-color: rgb(37, 76, 147);
133
- --selected-focused-border-color: rgba(0, 110, 225, .300);
134
- --selected-disabled-background-color: rgba(0, 0, 0, .200);
135
- --selected-disabled-border-color: rgba(0, 0, 0, .00);
136
- --on-selected-active-color: rgb(255, 255, 255);
137
- --on-selected-neutral-color: rgba(255, 255, 255, .800);
138
- --on-selected-disabled-color: rgba(0, 0, 0, .300);
139
- --thumb-enabled-background-color: rgb(255, 255, 255);
140
- --thumb-enabled-border-color: rgb(140, 140, 140);
141
- --thumb-hover-background-color: rgb(230, 230, 230);
142
- --thumb-hover-border-color: rgb(140, 140, 140);
143
- --thumb-pressed-background-color: rgb(204, 204, 204);
144
- --thumb-pressed-border-color: rgb(140, 140, 140);
145
- --thumb-focused-background-color: rgb(255, 255, 255);
146
- --thumb-focused-border-color: rgba(0, 110, 225, .300);
147
- --thumb-disabled-background-color: rgba(0, 0, 0, .100);
148
- --thumb-disabled-border-color: rgba(0, 0, 0, .00);
149
- --on-thumb-active-color: rgb(13, 13, 13);
150
- --on-thumb-neutral-color: rgba(0, 0, 0, .650);
151
- --on-thumb-disabled-color: rgba(0, 0, 0, .300);
152
- --amplified-enabled-background-color: rgba(46, 79, 138, .100);
153
- --amplified-enabled-border-color: rgba(0, 0, 0, .00);
154
- --amplified-hover-background-color: rgba(46, 79, 138, .200);
155
- --amplified-hover-border-color: rgba(0, 0, 0, .00);
156
- --amplified-pressed-background-color: rgba(46, 79, 138, .260);
157
- --amplified-pressed-border-color: rgba(0, 0, 0, .00);
158
- --amplified-focused-background-color: rgba(46, 79, 138, .100);
159
- --amplified-focused-border-color: rgba(0, 110, 225, .300);
160
- --amplified-disabled-background-color: rgba(0, 0, 0, .100);
161
- --amplified-disabled-border-color: rgba(0, 0, 0, .00);
162
- --on-amplified-active-color: rgb(13, 13, 13);
163
- --on-amplified-neutral-color: rgba(0, 0, 0, .650);
164
- --on-amplified-disabled-color: rgba(0, 0, 0, .300);
165
- --device-enabled-background-color: rgb(255, 255, 255);
166
- --device-enabled-border-color: rgba(0, 0, 0, .200);
167
- --device-hover-background-color: rgb(239, 239, 239);
168
- --device-hover-border-color: rgba(0, 0, 0, .200);
169
- --device-pressed-background-color: rgb(230, 230, 230);
170
- --device-pressed-border-color: rgba(0, 0, 0, .050);
171
- --device-focused-background-color: rgb(255, 255, 255);
172
- --device-focused-border-color: rgba(0, 110, 225, .300);
173
- --device-disabled-background-color: rgba(0, 0, 0, .00);
174
- --device-disabled-border-color: rgba(0, 0, 0, .050);
175
- --on-device-active-color: rgb(255, 255, 255);
176
- --on-device-neutral-color: rgba(0, 0, 0, .450);
177
- --on-device-disabled-color: rgb(179, 179, 179);
178
- --notification-enabled-background-color: rgb(26, 45, 255);
179
- --notification-enabled-border-color: rgba(0, 0, 0, .300);
180
- --notification-hover-background-color: rgb(0, 19, 229);
181
- --notification-hover-border-color: rgba(0, 0, 0, .300);
182
- --notification-pressed-background-color: rgb(0, 15, 178);
183
- --notification-pressed-border-color: rgba(0, 0, 0, .500);
184
- --notification-focused-background-color: rgb(26, 45, 255);
185
- --notification-focused-border-color: rgba(37, 76, 147, .500);
186
- --notification-disabled-background-color: rgb(26, 45, 255);
187
- --notification-disabled-border-color: rgba(0, 0, 0, .00);
188
- --on-notification-active-color: rgb(255, 255, 255);
189
- --on-notification-neutral-color: rgba(255, 255, 255, .600);
190
- --on-notification-disabled-color: rgba(255, 255, 255, .300);
191
- --running-enabled-background-color: rgb(0, 138, 23);
192
- --running-enabled-border-color: rgba(0, 0, 0, .100);
193
- --running-hover-background-color: rgb(27, 111, 27);
194
- --running-hover-border-color: rgba(0, 0, 0, .100);
195
- --running-pressed-background-color: rgb(17, 70, 17);
196
- --running-pressed-border-color: rgba(0, 0, 0, .200);
197
- --running-focused-background-color: rgb(37, 152, 37);
198
- --running-focused-border-color: rgb(247, 247, 247);
199
- --running-disabled-background-color: rgb(37, 152, 37);
200
- --running-disabled-border-color: rgba(0, 0, 0, .00);
201
- --on-running-active-color: rgb(255, 255, 255);
202
- --on-running-neutral-color: rgba(255, 255, 255, .700);
203
- --on-running-disabled-color: rgba(255, 255, 255, .300);
204
- --caution-enabled-background-color: rgb(250, 217, 0);
205
- --caution-enabled-border-color: rgba(0, 0, 0, .100);
206
- --caution-hover-background-color: rgb(199, 173, 0);
207
- --caution-hover-border-color: rgba(0, 0, 0, .100);
208
- --caution-pressed-background-color: rgb(148, 128, 0);
209
- --caution-pressed-border-color: rgba(0, 0, 0, .200);
210
- --caution-focused-background-color: rgb(250, 217, 0);
211
- --caution-focused-border-color: rgb(247, 247, 247);
212
- --caution-disabled-background-color: rgb(250, 217, 0);
213
- --caution-disabled-border-color: rgba(0, 0, 0, .00);
214
- --on-caution-active-color: rgba(0, 0, 0, .900);
215
- --on-caution-neutral-color: rgba(0, 0, 0, .600);
216
- --on-caution-disabled-color: rgba(0, 0, 0, .300);
217
- --warning-enabled-background-color: rgb(255, 145, 15);
218
- --warning-enabled-border-color: rgba(0, 0, 0, .100);
219
- --warning-hover-background-color: rgb(194, 117, 0);
220
- --warning-hover-border-color: rgba(0, 0, 0, .100);
221
- --warning-pressed-background-color: rgb(143, 90, 0);
222
- --warning-pressed-border-color: rgba(0, 0, 0, .200);
223
- --warning-focused-background-color: rgb(246, 148, 0);
224
- --warning-focused-border-color: rgb(247, 247, 247);
225
- --warning-disabled-background-color: rgb(246, 148, 0);
226
- --warning-disabled-border-color: rgba(0, 0, 0, .00);
227
- --on-warning-active-color: rgba(0, 0, 0, .900);
228
- --on-warning-neutral-color: rgba(0, 0, 0, .600);
229
- --on-warning-disabled-color: rgba(0, 0, 0, .300);
230
- --alarm-enabled-background-color: rgb(228, 27, 27);
231
- --alarm-enabled-border-color: rgba(0, 0, 0, .100);
232
- --alarm-hover-background-color: rgb(182, 22, 22);
233
- --alarm-hover-border-color: rgba(0, 0, 0, .100);
234
- --alarm-pressed-background-color: rgb(137, 16, 16);
235
- --alarm-pressed-border-color: rgba(0, 0, 0, .200);
236
- --alarm-focused-background-color: rgb(228, 27, 27);
237
- --alarm-focused-border-color: rgb(247, 247, 247);
238
- --alarm-disabled-background-color: rgb(228, 27, 27);
239
- --alarm-disabled-border-color: rgba(0, 0, 0, .00);
240
- --on-alarm-active-color: rgb(255, 255, 255);
241
- --on-alarm-neutral-color: rgba(255, 255, 255, .700);
242
- --on-alarm-disabled-color: rgba(0, 0, 0, .300);
243
- --critical-alarm-enabled-background-color: rgb(201, 0, 202);
244
- --critical-alarm-enabled-border-color: rgba(0, 0, 0, .100);
245
- --critical-alarm-hover-background-color: rgb(152, 0, 153);
246
- --critical-alarm-hover-border-color: rgba(0, 0, 0, .100);
247
- --critical-alarm-pressed-background-color: rgb(102, 0, 102);
248
- --critical-alarm-pressed-border-color: rgba(0, 0, 0, .200);
249
- --critical-alarm-focused-background-color: rgb(201, 0, 202);
250
- --critical-alarm-focused-border-color: rgb(247, 247, 247);
251
- --critical-alarm-disabled-background-color: rgb(201, 0, 202);
252
- --critical-alarm-disabled-border-color: rgba(0, 0, 0, .00);
253
- --on-critical-alarm-active-color: rgb(255, 255, 255);
254
- --on-critical-alarm-neutral-color: rgba(255, 255, 255, .700);
255
- --on-critical-alarm-disabled-color: rgba(255, 255, 255, .300);
256
- --font-ui-title-size: 24px;
257
- --font-ui-title-weight: bold;
258
- --font-ui-title-line-height: 32px;
259
- --font-ui-subtitle-size: 24px;
260
- --font-ui-subtitle-weight: regular;
261
- --font-ui-subtitle-line-height: 32px;
262
- --font-ui-overline-size: 12px;
263
- --font-ui-overline-weight: semibold;
264
- --font-ui-overline-line-height: 24px;
265
- --font-ui-button-size: 16px;
266
- --font-ui-button-weight: semibold;
267
- --font-ui-button-line-height: 24px;
268
- --font-ui-body-active-size: 16px;
269
- --font-ui-body-active-weight: bold;
270
- --font-ui-body-active-line-height: 24px;
271
- --font-ui-body-size: 16px;
272
- --font-ui-body-weight: regular;
273
- --font-ui-body-line-height: 24px;
274
- --font-ui-label-active-size: 12px;
275
- --font-ui-label-active-weight: bold;
276
- --font-ui-label-active-line-height: 16px;
277
- --font-ui-label-size: 12px;
278
- --font-ui-label-weight: regular;
279
- --font-ui-label-line-height: 16px;
280
- --font-instrument-label-s-size: 16px;
281
- --font-instrument-label-s-weight: regular;
282
- --font-instrument-label-s-line-height: 24px;
283
- --font-instrument-label-m-size: 32px;
284
- --font-instrument-label-m-weight: regular;
285
- --font-instrument-label-m-line-height: 40px;
286
- --font-instrument-label-l-size: 64px;
287
- --font-instrument-label-l-weight: regular;
288
- --font-instrument-label-l-line-height: 80px;
289
- --font-instrument-value-s-size: 16px;
290
- --font-instrument-value-s-weight: semibold;
291
- --font-instrument-value-s-line-height: 24px;
292
- --font-instrument-value-s-enhanced-size: 24px;
293
- --font-instrument-value-s-enhanced-weight: semibold;
294
- --font-instrument-value-s-enhanced-line-height: 32px;
295
- --font-instrument-value-m-size: 32px;
296
- --font-instrument-value-m-weight: semibold;
297
- --font-instrument-value-m-line-height: 40px;
298
- --font-instrument-value-m-enhanced-size: 48px;
299
- --font-instrument-value-m-enhanced-weight: semibold;
300
- --font-instrument-value-m-enhanced-line-height: 64px;
301
- --font-instrument-value-l-size: 64px;
302
- --font-instrument-value-l-weight: semibold;
303
- --font-instrument-value-l-line-height: 80px;
304
- --font-instrument-value-l-enhanced-size: 96px;
305
- --font-instrument-value-l-enhanced-weight: semibold;
306
- --font-instrument-value-l-enhanced-line-height: 128px;
307
- --font-instrument-unit-s-size: 16px;
308
- --font-instrument-unit-s-weight: regular;
309
- --font-instrument-unit-s-line-height: 24px;
310
- --font-instrument-unit-m-size: 32px;
311
- --font-instrument-unit-m-weight: regular;
312
- --font-instrument-unit-m-line-height: 40px;
313
- --font-instrument-unit-l-size: 64px;
314
- --font-instrument-unit-l-weight: regular;
315
- --font-instrument-unit-l-line-height: 80px;
316
- --font-instrument-status-s-size: 16px;
317
- --font-instrument-status-s-weight: regular;
318
- --font-instrument-status-s-line-height: 24px;
319
- --font-instrument-status-m-size: 32px;
320
- --font-instrument-status-m-weight: regular;
321
- --font-instrument-status-m-line-height: 40px;
322
- --font-instrument-status-l-size: 64px;
323
- --font-instrument-status-l-weight: regular;
324
- --font-instrument-status-l-line-height: 80px;
325
- --shadow-flat: 0px 1px 1px 0px rgba(0, 0, 0, .400);
326
- --shadow-raised: 0px 2px 4px 0px rgba(0, 0, 0, .400);
327
- --shadow-floating: 0px 4px 16px 0px rgba(0, 0, 0, .400);
328
- --shadow-overlay: 0px 8px 32px 0px rgba(0, 0, 0, .600);
329
- --shadow-focused: 0px 0px 0px 4px rgb(0, 59, 148);
2
+ --element-active-color: rgb(26, 26, 26);
3
+ --element-neutral-color: rgba(0, 0, 0, .550);
4
+ --element-inactive-color: rgba(0, 0, 0, .420);
5
+ --element-disabled-color: rgba(0, 0, 0, .200);
6
+ --element-active-inverted-color: rgb(255, 255, 255);
7
+ --element-neutral-inverted-color: rgba(255, 255, 255, .700);
8
+ --element-inactive-inverted-color: rgba(255, 255, 255, .400);
9
+ --element-disabled-inverted-color: rgba(255, 255, 255, .200);
10
+ --container-backdrop-color: rgb(224, 224, 224);
11
+ --container-section-color: rgb(240, 240, 240);
12
+ --container-background-color: rgb(255, 255, 255);
13
+ --container-global-color: rgb(255, 255, 255);
14
+ --container-overlay-color: rgba(0, 0, 0, .100);
15
+ --border-divider-color: rgba(0, 0, 0, .080);
16
+ --border-outline-color: rgba(0, 0, 0, .080);
17
+ --border-edge-color: rgba(0, 0, 0, .050);
18
+ --border-solid-color: rgb(51, 51, 51);
19
+ --border-icon-outline-color: rgba(0, 0, 0, .500);
20
+ --border-silhouette-color: rgb(255, 255, 255);
21
+ --instrument-enhanced-primary-color: rgb(26, 45, 255);
22
+ --instrument-enhanced-secondary-color: rgb(37, 76, 147);
23
+ --instrument-enhanced-tertiary-color: rgb(192, 202, 218);
24
+ --instrument-regular-primary-color: rgb(13, 13, 13);
25
+ --instrument-regular-secondary-color: rgb(89, 89, 89);
26
+ --instrument-regular-tertiary-color: rgba(102, 102, 102, .250);
27
+ --instrument-frame-primary-color: rgb(255, 255, 255);
28
+ --instrument-frame-secondary-color: rgb(240, 240, 240);
29
+ --instrument-frame-tertiary-color: rgb(140, 140, 140);
30
+ --instrument-tick-mark-primary-color: rgb(13, 13, 13);
31
+ --instrument-tick-mark-secondary-color: rgb(89, 89, 89);
32
+ --instrument-tick-mark-tertiary-color: rgb(140, 140, 140);
33
+ --instrument-starboard-color: rgb(53, 158, 133);
34
+ --instrument-port-color: rgb(225, 98, 144);
35
+ --alert-running-color: rgb(0, 138, 23);
36
+ --alert-caution-color: rgb(250, 217, 0);
37
+ --alert-warning-color: rgb(246, 148, 0);
38
+ --alert-alarm-color: rgb(223, 27, 27);
39
+ --alert-critical-alarm-color: rgb(229, 0, 229);
40
+ --alert-limit-primary-color: rgba(0, 0, 0, .100);
41
+ --alert-limit-secondary-color: rgba(0, 0, 0, .100);
42
+ --automation-device-primary-color: rgb(255, 255, 255);
43
+ --automation-device-secondary-color: rgb(89, 89, 89);
44
+ --automation-device-tertiary-color: rgb(13, 13, 13);
45
+ --automation-device-primary-inverted-color: rgb(51, 51, 51);
46
+ --automation-device-secondary-inverted-color: rgb(102, 102, 102);
47
+ --automation-device-tertiary-inverted-color: rgb(143, 143, 143);
48
+ --automation-pipe-primary-color: rgb(255, 255, 255);
49
+ --automation-pipe-secondary-color: rgb(198, 198, 198);
50
+ --automation-pipe-tertiary-color: rgba(0, 0, 0, .800);
51
+ --automation-pipe-primary-inverted-color: rgba(0, 0, 0, .100);
52
+ --automation-pipe-secondary-inverted-color: rgba(0, 0, 0, .200);
53
+ --automation-pipe-tertiary-inverted-color: rgba(0, 0, 0, .200);
54
+ --automation-pipe-overlay-color: rgba(0, 0, 0, .200);
55
+ --automation-pipe-disabled-color: rgba(0, 0, 0, .100);
56
+ --automation-acid-alkalis: rgb(231, 193, 244);
57
+ --automation-air-ventilation: rgb(222, 222, 222);
58
+ --automation-fire-fighting: rgb(255, 177, 196);
59
+ --automation-flammable-gas: rgb(216, 224, 127);
60
+ --automation-fresh-water: rgb(198, 241, 251);
61
+ --automation-fuel: rgb(249, 208, 169);
62
+ --automation-masses: rgb(209, 191, 173);
63
+ --automation-non-flammable-gas: rgb(220, 232, 206);
64
+ --automation-oil: rgb(253, 243, 155);
65
+ --automation-sea-water: rgb(173, 230, 213);
66
+ --automation-steam: rgb(203, 203, 203);
67
+ --automation-waste-media: rgb(138, 138, 138);
68
+ --normal-enabled-background-color: rgb(255, 255, 255);
69
+ --normal-enabled-border-color: rgb(140, 140, 140);
70
+ --normal-hover-background-color: rgb(230, 230, 230);
71
+ --normal-hover-border-color: rgb(140, 140, 140);
72
+ --normal-pressed-background-color: rgb(204, 204, 204);
73
+ --normal-pressed-border-color: rgb(140, 140, 140);
74
+ --normal-focused-background-color: rgb(255, 255, 255);
75
+ --normal-focused-border-color: rgba(0, 110, 225, .300);
76
+ --normal-disabled-background-color: rgba(255, 255, 255, .00);
77
+ --normal-disabled-border-color: rgba(0, 0, 0, .100);
78
+ --normal-activated-background-color: rgb(235, 235, 235);
79
+ --normal-activated-border-color: rgba(0, 0, 0, .200);
80
+ --on-normal-active-color: rgb(13, 13, 13);
81
+ --on-normal-neutral-color: rgba(0, 0, 0, .650);
82
+ --on-normal-disabled-color: rgba(0, 0, 0, .300);
83
+ --raised-enabled-background-color: rgba(0, 0, 0, .650);
84
+ --raised-enabled-border-color: rgba(0, 0, 0, .100);
85
+ --raised-hover-background-color: rgba(0, 0, 0, .750);
86
+ --raised-hover-border-color: rgba(0, 0, 0, .100);
87
+ --raised-pressed-background-color: rgba(0, 0, 0, .850);
88
+ --raised-pressed-border-color: rgba(0, 0, 0, .300);
89
+ --raised-focused-background-color: rgba(0, 0, 0, .650);
90
+ --raised-focused-border-color: rgba(0, 110, 225, .300);
91
+ --raised-disabled-background-color: rgba(0, 0, 0, .00);
92
+ --raised-disabled-border-color: rgba(0, 0, 0, .100);
93
+ --on-raised-active-color: rgb(255, 255, 255);
94
+ --on-raised-neutral-color: rgba(255, 255, 255, .700);
95
+ --on-raised-disabled-color: rgba(0, 0, 0, .200);
96
+ --indent-enabled-background-color: rgba(0, 0, 0, .050);
97
+ --indent-enabled-border-color: rgba(0, 0, 0, .050);
98
+ --indent-hover-background-color: rgba(0, 0, 0, .100);
99
+ --indent-hover-border-color: rgba(0, 0, 0, .050);
100
+ --indent-pressed-background-color: rgba(0, 0, 0, .160);
101
+ --indent-pressed-border-color: rgba(0, 0, 0, .100);
102
+ --indent-focused-background-color: rgba(0, 0, 0, .050);
103
+ --indent-focused-border-color: rgba(0, 110, 225, .300);
104
+ --indent-disabled-background-color: rgba(0, 0, 0, .00);
105
+ --indent-disabled-border-color: rgba(0, 0, 0, .100);
106
+ --on-indent-active-color: rgb(13, 13, 13);
107
+ --on-indent-neutral-color: rgba(0, 0, 0, .450);
108
+ --on-indent-disabled-color: rgba(0, 0, 0, .300);
109
+ --flat-enabled-background-color: rgba(0, 0, 0, .00);
110
+ --flat-enabled-border-color: rgba(0, 0, 0, .00);
111
+ --flat-hover-background-color: rgba(0, 0, 0, .060);
112
+ --flat-hover-border-color: rgba(0, 0, 0, .00);
113
+ --flat-pressed-background-color: rgba(0, 0, 0, .120);
114
+ --flat-pressed-border-color: rgba(0, 0, 0, .00);
115
+ --flat-focused-background-color: rgba(0, 0, 0, .00);
116
+ --flat-focused-border-color: rgba(0, 110, 225, .300);
117
+ --flat-disabled-background-color: rgba(0, 0, 0, .00);
118
+ --flat-disabled-border-color: rgba(0, 0, 0, .00);
119
+ --flat-activated-background-color: rgba(0, 0, 0, .050);
120
+ --flat-activated-border-color: rgba(0, 0, 0, .00);
121
+ --flat-checked-background-color: rgba(48, 87, 146, .100);
122
+ --flat-checked-border-color: rgba(15, 74, 163, .00);
123
+ --on-flat-active-color: rgb(13, 13, 13);
124
+ --on-flat-neutral-color: rgba(0, 0, 0, .650);
125
+ --on-flat-disabled-color: rgba(0, 0, 0, .300);
126
+ --selected-enabled-background-color: rgb(37, 76, 147);
127
+ --selected-enabled-border-color: rgba(0, 0, 0, .00);
128
+ --selected-hover-background-color: rgb(27, 55, 106);
129
+ --selected-hover-border-color: rgba(0, 0, 0, .00);
130
+ --selected-pressed-background-color: rgb(16, 34, 65);
131
+ --selected-pressed-border-color: rgba(0, 0, 0, .00);
132
+ --selected-focused-background-color: rgb(37, 76, 147);
133
+ --selected-focused-border-color: rgba(0, 110, 225, .300);
134
+ --selected-disabled-background-color: rgba(0, 0, 0, .200);
135
+ --selected-disabled-border-color: rgba(0, 0, 0, .00);
136
+ --on-selected-active-color: rgb(255, 255, 255);
137
+ --on-selected-neutral-color: rgba(255, 255, 255, .800);
138
+ --on-selected-disabled-color: rgba(0, 0, 0, .300);
139
+ --thumb-enabled-background-color: rgb(255, 255, 255);
140
+ --thumb-enabled-border-color: rgb(140, 140, 140);
141
+ --thumb-hover-background-color: rgb(230, 230, 230);
142
+ --thumb-hover-border-color: rgb(140, 140, 140);
143
+ --thumb-pressed-background-color: rgb(204, 204, 204);
144
+ --thumb-pressed-border-color: rgb(140, 140, 140);
145
+ --thumb-focused-background-color: rgb(255, 255, 255);
146
+ --thumb-focused-border-color: rgba(0, 110, 225, .300);
147
+ --thumb-disabled-background-color: rgba(0, 0, 0, .100);
148
+ --thumb-disabled-border-color: rgba(0, 0, 0, .00);
149
+ --on-thumb-active-color: rgb(13, 13, 13);
150
+ --on-thumb-neutral-color: rgba(0, 0, 0, .650);
151
+ --on-thumb-disabled-color: rgba(0, 0, 0, .300);
152
+ --amplified-enabled-background-color: rgba(46, 79, 138, .100);
153
+ --amplified-enabled-border-color: rgba(0, 0, 0, .00);
154
+ --amplified-hover-background-color: rgba(46, 79, 138, .200);
155
+ --amplified-hover-border-color: rgba(0, 0, 0, .00);
156
+ --amplified-pressed-background-color: rgba(46, 79, 138, .260);
157
+ --amplified-pressed-border-color: rgba(0, 0, 0, .00);
158
+ --amplified-focused-background-color: rgba(46, 79, 138, .100);
159
+ --amplified-focused-border-color: rgba(0, 110, 225, .300);
160
+ --amplified-disabled-background-color: rgba(0, 0, 0, .100);
161
+ --amplified-disabled-border-color: rgba(0, 0, 0, .00);
162
+ --on-amplified-active-color: rgb(13, 13, 13);
163
+ --on-amplified-neutral-color: rgba(0, 0, 0, .650);
164
+ --on-amplified-disabled-color: rgba(0, 0, 0, .300);
165
+ --device-enabled-background-color: rgb(255, 255, 255);
166
+ --device-enabled-border-color: rgba(0, 0, 0, .200);
167
+ --device-hover-background-color: rgb(239, 239, 239);
168
+ --device-hover-border-color: rgba(0, 0, 0, .200);
169
+ --device-pressed-background-color: rgb(230, 230, 230);
170
+ --device-pressed-border-color: rgba(0, 0, 0, .050);
171
+ --device-focused-background-color: rgb(255, 255, 255);
172
+ --device-focused-border-color: rgba(0, 110, 225, .300);
173
+ --device-disabled-background-color: rgba(0, 0, 0, .00);
174
+ --device-disabled-border-color: rgba(0, 0, 0, .050);
175
+ --on-device-active-color: rgb(255, 255, 255);
176
+ --on-device-neutral-color: rgba(0, 0, 0, .450);
177
+ --on-device-disabled-color: rgb(179, 179, 179);
178
+ --notification-enabled-background-color: rgb(26, 45, 255);
179
+ --notification-enabled-border-color: rgba(0, 0, 0, .300);
180
+ --notification-hover-background-color: rgb(0, 19, 229);
181
+ --notification-hover-border-color: rgba(0, 0, 0, .300);
182
+ --notification-pressed-background-color: rgb(0, 15, 178);
183
+ --notification-pressed-border-color: rgba(0, 0, 0, .500);
184
+ --notification-focused-background-color: rgb(26, 45, 255);
185
+ --notification-focused-border-color: rgba(37, 76, 147, .500);
186
+ --notification-disabled-background-color: rgb(26, 45, 255);
187
+ --notification-disabled-border-color: rgba(0, 0, 0, .00);
188
+ --on-notification-active-color: rgb(255, 255, 255);
189
+ --on-notification-neutral-color: rgba(255, 255, 255, .600);
190
+ --on-notification-disabled-color: rgba(255, 255, 255, .300);
191
+ --running-enabled-background-color: rgb(0, 138, 23);
192
+ --running-enabled-border-color: rgba(0, 0, 0, .100);
193
+ --running-hover-background-color: rgb(27, 111, 27);
194
+ --running-hover-border-color: rgba(0, 0, 0, .100);
195
+ --running-pressed-background-color: rgb(17, 70, 17);
196
+ --running-pressed-border-color: rgba(0, 0, 0, .200);
197
+ --running-focused-background-color: rgb(37, 152, 37);
198
+ --running-focused-border-color: rgb(247, 247, 247);
199
+ --running-disabled-background-color: rgb(37, 152, 37);
200
+ --running-disabled-border-color: rgba(0, 0, 0, .00);
201
+ --on-running-active-color: rgb(255, 255, 255);
202
+ --on-running-neutral-color: rgba(255, 255, 255, .700);
203
+ --on-running-disabled-color: rgba(255, 255, 255, .300);
204
+ --caution-enabled-background-color: rgb(250, 217, 0);
205
+ --caution-enabled-border-color: rgba(0, 0, 0, .100);
206
+ --caution-hover-background-color: rgb(199, 173, 0);
207
+ --caution-hover-border-color: rgba(0, 0, 0, .100);
208
+ --caution-pressed-background-color: rgb(148, 128, 0);
209
+ --caution-pressed-border-color: rgba(0, 0, 0, .200);
210
+ --caution-focused-background-color: rgb(250, 217, 0);
211
+ --caution-focused-border-color: rgb(247, 247, 247);
212
+ --caution-disabled-background-color: rgb(250, 217, 0);
213
+ --caution-disabled-border-color: rgba(0, 0, 0, .00);
214
+ --on-caution-active-color: rgba(0, 0, 0, .900);
215
+ --on-caution-neutral-color: rgba(0, 0, 0, .600);
216
+ --on-caution-disabled-color: rgba(0, 0, 0, .300);
217
+ --warning-enabled-background-color: rgb(255, 145, 15);
218
+ --warning-enabled-border-color: rgba(0, 0, 0, .100);
219
+ --warning-hover-background-color: rgb(194, 117, 0);
220
+ --warning-hover-border-color: rgba(0, 0, 0, .100);
221
+ --warning-pressed-background-color: rgb(143, 90, 0);
222
+ --warning-pressed-border-color: rgba(0, 0, 0, .200);
223
+ --warning-focused-background-color: rgb(246, 148, 0);
224
+ --warning-focused-border-color: rgb(247, 247, 247);
225
+ --warning-disabled-background-color: rgb(246, 148, 0);
226
+ --warning-disabled-border-color: rgba(0, 0, 0, .00);
227
+ --on-warning-active-color: rgba(0, 0, 0, .900);
228
+ --on-warning-neutral-color: rgba(0, 0, 0, .600);
229
+ --on-warning-disabled-color: rgba(0, 0, 0, .300);
230
+ --alarm-enabled-background-color: rgb(228, 27, 27);
231
+ --alarm-enabled-border-color: rgba(0, 0, 0, .100);
232
+ --alarm-hover-background-color: rgb(182, 22, 22);
233
+ --alarm-hover-border-color: rgba(0, 0, 0, .100);
234
+ --alarm-pressed-background-color: rgb(137, 16, 16);
235
+ --alarm-pressed-border-color: rgba(0, 0, 0, .200);
236
+ --alarm-focused-background-color: rgb(228, 27, 27);
237
+ --alarm-focused-border-color: rgb(247, 247, 247);
238
+ --alarm-disabled-background-color: rgb(228, 27, 27);
239
+ --alarm-disabled-border-color: rgba(0, 0, 0, .00);
240
+ --on-alarm-active-color: rgb(255, 255, 255);
241
+ --on-alarm-neutral-color: rgba(255, 255, 255, .700);
242
+ --on-alarm-disabled-color: rgba(0, 0, 0, .300);
243
+ --critical-alarm-enabled-background-color: rgb(201, 0, 202);
244
+ --critical-alarm-enabled-border-color: rgba(0, 0, 0, .100);
245
+ --critical-alarm-hover-background-color: rgb(152, 0, 153);
246
+ --critical-alarm-hover-border-color: rgba(0, 0, 0, .100);
247
+ --critical-alarm-pressed-background-color: rgb(102, 0, 102);
248
+ --critical-alarm-pressed-border-color: rgba(0, 0, 0, .200);
249
+ --critical-alarm-focused-background-color: rgb(201, 0, 202);
250
+ --critical-alarm-focused-border-color: rgb(247, 247, 247);
251
+ --critical-alarm-disabled-background-color: rgb(201, 0, 202);
252
+ --critical-alarm-disabled-border-color: rgba(0, 0, 0, .00);
253
+ --on-critical-alarm-active-color: rgb(255, 255, 255);
254
+ --on-critical-alarm-neutral-color: rgba(255, 255, 255, .700);
255
+ --on-critical-alarm-disabled-color: rgba(255, 255, 255, .300);
256
+ --font-ui-title-size: 24px;
257
+ --font-ui-title-weight: bold;
258
+ --font-ui-title-line-height: 32px;
259
+ --font-ui-subtitle-size: 24px;
260
+ --font-ui-subtitle-weight: regular;
261
+ --font-ui-subtitle-line-height: 32px;
262
+ --font-ui-overline-size: 12px;
263
+ --font-ui-overline-weight: semibold;
264
+ --font-ui-overline-line-height: 24px;
265
+ --font-ui-button-size: 16px;
266
+ --font-ui-button-weight: semibold;
267
+ --font-ui-button-line-height: 24px;
268
+ --font-ui-body-active-size: 16px;
269
+ --font-ui-body-active-weight: bold;
270
+ --font-ui-body-active-line-height: 24px;
271
+ --font-ui-body-size: 16px;
272
+ --font-ui-body-weight: regular;
273
+ --font-ui-body-line-height: 24px;
274
+ --font-ui-label-active-size: 12px;
275
+ --font-ui-label-active-weight: bold;
276
+ --font-ui-label-active-line-height: 16px;
277
+ --font-ui-label-size: 12px;
278
+ --font-ui-label-weight: regular;
279
+ --font-ui-label-line-height: 16px;
280
+ --font-instrument-label-s-size: 16px;
281
+ --font-instrument-label-s-weight: regular;
282
+ --font-instrument-label-s-line-height: 24px;
283
+ --font-instrument-label-m-size: 32px;
284
+ --font-instrument-label-m-weight: regular;
285
+ --font-instrument-label-m-line-height: 40px;
286
+ --font-instrument-label-l-size: 64px;
287
+ --font-instrument-label-l-weight: regular;
288
+ --font-instrument-label-l-line-height: 80px;
289
+ --font-instrument-value-s-size: 16px;
290
+ --font-instrument-value-s-weight: semibold;
291
+ --font-instrument-value-s-line-height: 24px;
292
+ --font-instrument-value-s-enhanced-size: 24px;
293
+ --font-instrument-value-s-enhanced-weight: semibold;
294
+ --font-instrument-value-s-enhanced-line-height: 32px;
295
+ --font-instrument-value-m-size: 32px;
296
+ --font-instrument-value-m-weight: semibold;
297
+ --font-instrument-value-m-line-height: 40px;
298
+ --font-instrument-value-m-enhanced-size: 48px;
299
+ --font-instrument-value-m-enhanced-weight: semibold;
300
+ --font-instrument-value-m-enhanced-line-height: 64px;
301
+ --font-instrument-value-l-size: 64px;
302
+ --font-instrument-value-l-weight: semibold;
303
+ --font-instrument-value-l-line-height: 80px;
304
+ --font-instrument-value-l-enhanced-size: 96px;
305
+ --font-instrument-value-l-enhanced-weight: semibold;
306
+ --font-instrument-value-l-enhanced-line-height: 128px;
307
+ --font-instrument-unit-s-size: 16px;
308
+ --font-instrument-unit-s-weight: regular;
309
+ --font-instrument-unit-s-line-height: 24px;
310
+ --font-instrument-unit-m-size: 32px;
311
+ --font-instrument-unit-m-weight: regular;
312
+ --font-instrument-unit-m-line-height: 40px;
313
+ --font-instrument-unit-l-size: 64px;
314
+ --font-instrument-unit-l-weight: regular;
315
+ --font-instrument-unit-l-line-height: 80px;
316
+ --font-instrument-status-s-size: 16px;
317
+ --font-instrument-status-s-weight: regular;
318
+ --font-instrument-status-s-line-height: 24px;
319
+ --font-instrument-status-m-size: 32px;
320
+ --font-instrument-status-m-weight: regular;
321
+ --font-instrument-status-m-line-height: 40px;
322
+ --font-instrument-status-l-size: 64px;
323
+ --font-instrument-status-l-weight: regular;
324
+ --font-instrument-status-l-line-height: 80px;
325
+ --shadow-flat: 0px 1px 1px 0px rgba(0, 0, 0, .400);
326
+ --shadow-raised: 0px 2px 4px 0px rgba(0, 0, 0, .400);
327
+ --shadow-floating: 0px 4px 16px 0px rgba(0, 0, 0, .400);
328
+ --shadow-overlay: 0px 8px 32px 0px rgba(0, 0, 0, .600);
329
+ --shadow-focused: 0px 0px 0px 4px rgb(0, 59, 148);
330
330
 
331
- --icon-02-chevron-up: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M6 14.0002L7.41 15.4102L12 10.8302L16.59 15.4102L18 14.0002L12 8.00016L6 14.0002Z" fill="rgba(0, 0, 0, .650)"/></svg>');
332
- --icon-02-chevron-down: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d=" M18 9.41L16.59 8L12 12.58L7.41 8L6 9.41L12 15.41L18 9.41Z" fill="rgba(0, 0, 0, .650)"/></svg>');
331
+ --icon-02-chevron-up: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M6 14.0002L7.41 15.4102L12 10.8302L16.59 15.4102L18 14.0002L12 8.00016L6 14.0002Z" fill="rgba(0, 0, 0, .650)"/></svg>');
332
+ --icon-02-chevron-down: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d=" M18 9.41L16.59 8L12 12.58L7.41 8L6 9.41L12 15.41L18 9.41Z" fill="rgba(0, 0, 0, .650)"/></svg>');
333
333
 
334
- }
334
+ }
335
335
 
336
- :root[data-obc-theme=day] {
337
- --element-active-color: rgb(26, 26, 26);
338
- --element-neutral-color: rgba(0, 0, 0, .590);
339
- --element-inactive-color: rgba(0, 0, 0, .420);
340
- --element-disabled-color: rgba(0, 0, 0, .200);
341
- --element-active-inverted-color: rgb(255, 255, 255);
342
- --element-neutral-inverted-color: rgba(255, 255, 255, .700);
343
- --element-inactive-inverted-color: rgba(255, 255, 255, .400);
344
- --element-disabled-inverted-color: rgba(255, 255, 255, .200);
345
- --container-backdrop-color: rgb(224, 224, 224);
346
- --container-section-color: rgb(240, 240, 240);
347
- --container-background-color: rgb(247, 247, 247);
348
- --container-global-color: rgb(252, 252, 252);
349
- --container-overlay-color: rgba(0, 0, 0, .100);
350
- --border-divider-color: rgba(0, 0, 0, .080);
351
- --border-outline-color: rgba(0, 0, 0, .080);
352
- --border-edge-color: rgba(0, 0, 0, .050);
353
- --border-solid-color: rgb(51, 51, 51);
354
- --border-icon-outline-color: rgba(0, 0, 0, .400);
355
- --border-silhouette-color: rgb(247, 247, 247);
356
- --instrument-enhanced-primary-color: rgb(0, 112, 214);
357
- --instrument-enhanced-secondary-color: rgb(50, 91, 154);
358
- --instrument-enhanced-tertiary-color: rgba(50, 91, 154, .200);
359
- --instrument-regular-primary-color: rgb(51, 51, 51);
360
- --instrument-regular-secondary-color: rgb(102, 102, 102);
361
- --instrument-regular-tertiary-color: rgba(102, 102, 102, .250);
362
- --instrument-frame-primary-color: rgb(255, 255, 255);
363
- --instrument-frame-secondary-color: rgb(240, 240, 240);
364
- --instrument-frame-tertiary-color: rgb(217, 217, 217);
365
- --instrument-tick-mark-primary-color: rgb(51, 51, 51);
366
- --instrument-tick-mark-secondary-color: rgb(112, 112, 112);
367
- --instrument-tick-mark-tertiary-color: rgb(143, 143, 143);
368
- --instrument-starboard-color: rgb(53, 158, 133);
369
- --instrument-port-color: rgb(225, 98, 144);
370
- --navigation-green-color: rgb(184, 234, 195);
371
- --navigation-yellow-color: rgb(247, 241, 161);
372
- --navigation-orange-color: rgb(247, 204, 161);
373
- --navigation-red-color: rgb(241, 177, 200);
374
- --navigation-generic-color: rgb(202, 194, 239);
375
- --navigation-white-color: rgb(199, 213, 234);
376
- --alert-running-color: rgb(34, 135, 34);
377
- --alert-caution-color: rgb(250, 217, 0);
378
- --alert-warning-color: rgb(246, 148, 0);
379
- --alert-alarm-color: rgb(223, 27, 27);
380
- --alert-critical-alarm-color: rgb(229, 0, 229);
381
- --alert-limit-primary-color: rgba(0, 0, 0, .080);
382
- --alert-limit-secondary-color: rgba(0, 0, 0, .080);
383
- --automation-device-primary-color: rgb(255, 255, 255);
384
- --automation-device-secondary-color: rgb(112, 112, 112);
385
- --automation-device-tertiary-color: rgb(0, 0, 0);
386
- --automation-device-primary-inverted-color: rgb(15, 15, 15);
387
- --automation-device-secondary-inverted-color: rgb(102, 102, 102);
388
- --automation-device-tertiary-inverted-color: rgb(128, 128, 128);
389
- --automation-pipe-primary-color: rgb(255, 255, 255);
390
- --automation-pipe-secondary-color: rgb(143, 143, 143);
391
- --automation-pipe-tertiary-color: rgb(51, 51, 51);
392
- --automation-pipe-primary-inverted-color: rgb(224, 224, 224);
393
- --automation-pipe-secondary-inverted-color: rgb(179, 179, 179);
394
- --automation-pipe-tertiary-inverted-color: rgb(143, 143, 143);
395
- --automation-pipe-overlay-color: rgba(0, 0, 0, .200);
396
- --automation-pipe-disabled-color: rgba(0, 0, 0, .100);
397
- --automation-acid-alkalis: rgb(231, 193, 244);
398
- --automation-air-ventilation: rgb(222, 222, 222);
399
- --automation-fire-fighting: rgb(255, 177, 196);
400
- --automation-flammable-gas: rgb(216, 224, 127);
401
- --automation-fresh-water: rgb(198, 241, 251);
402
- --automation-fuel: rgb(249, 208, 169);
403
- --automation-masses: rgb(209, 191, 173);
404
- --automation-non-flammable-gas: rgb(220, 232, 206);
405
- --automation-oil: rgb(253, 243, 155);
406
- --automation-sea-water: rgb(173, 230, 213);
407
- --automation-steam: rgb(203, 203, 203);
408
- --automation-waste-media: rgb(138, 138, 138);
409
- --normal-enabled-background-color: rgb(255, 255, 255);
410
- --normal-enabled-border-color: rgb(205, 205, 205);
411
- --normal-hover-background-color: rgb(240, 240, 240);
412
- --normal-hover-border-color: rgba(0, 0, 0, .200);
413
- --normal-pressed-background-color: rgb(224, 224, 224);
414
- --normal-pressed-border-color: rgba(0, 0, 0, .200);
415
- --normal-focused-background-color: rgb(255, 255, 255);
416
- --normal-focused-border-color: rgba(0, 110, 225, .300);
417
- --normal-disabled-background-color: rgba(255, 255, 255, .00);
418
- --normal-disabled-border-color: rgba(0, 0, 0, .100);
419
- --normal-activated-background-color: rgb(235, 235, 235);
420
- --normal-activated-border-color: rgba(0, 0, 0, .200);
421
- --on-normal-active-color: rgb(26, 26, 26);
422
- --on-normal-neutral-color: rgba(0, 0, 0, .550);
423
- --on-normal-disabled-color: rgba(0, 0, 0, .300);
424
- --raised-enabled-background-color: rgba(0, 0, 0, .600);
425
- --raised-enabled-border-color: rgba(0, 0, 0, .100);
426
- --raised-hover-background-color: rgba(0, 0, 0, .700);
427
- --raised-hover-border-color: rgba(0, 0, 0, .100);
428
- --raised-pressed-background-color: rgba(0, 0, 0, .800);
429
- --raised-pressed-border-color: rgba(0, 0, 0, .300);
430
- --raised-focused-background-color: rgba(0, 0, 0, .600);
431
- --raised-focused-border-color: rgba(0, 110, 225, .300);
432
- --raised-disabled-background-color: rgba(0, 0, 0, .00);
433
- --raised-disabled-border-color: rgba(0, 0, 0, .100);
434
- --on-raised-active-color: rgb(255, 255, 255);
435
- --on-raised-neutral-color: rgba(255, 255, 255, .700);
436
- --on-raised-disabled-color: rgba(0, 0, 0, .300);
437
- --indent-enabled-background-color: rgba(0, 0, 0, .050);
438
- --indent-enabled-border-color: rgba(0, 0, 0, .050);
439
- --indent-hover-background-color: rgba(0, 0, 0, .100);
440
- --indent-hover-border-color: rgba(0, 0, 0, .050);
441
- --indent-pressed-background-color: rgba(0, 0, 0, .160);
442
- --indent-pressed-border-color: rgba(0, 0, 0, .100);
443
- --indent-focused-background-color: rgba(0, 0, 0, .050);
444
- --indent-focused-border-color: rgba(0, 110, 225, .300);
445
- --indent-disabled-background-color: rgba(0, 0, 0, .00);
446
- --indent-disabled-border-color: rgba(0, 0, 0, .100);
447
- --on-indent-active-color: rgba(0, 0, 0, .900);
448
- --on-indent-neutral-color: rgba(0, 0, 0, .440);
449
- --on-indent-disabled-color: rgba(0, 0, 0, .300);
450
- --flat-enabled-background-color: rgba(0, 0, 0, .00);
451
- --flat-enabled-border-color: rgba(0, 0, 0, .00);
452
- --flat-hover-background-color: rgba(0, 0, 0, .060);
453
- --flat-hover-border-color: rgba(0, 0, 0, .00);
454
- --flat-pressed-background-color: rgba(0, 0, 0, .120);
455
- --flat-pressed-border-color: rgba(0, 0, 0, .00);
456
- --flat-focused-background-color: rgba(0, 0, 0, .00);
457
- --flat-focused-border-color: rgb(153, 206, 255);
458
- --flat-disabled-background-color: rgba(0, 0, 0, .00);
459
- --flat-disabled-border-color: rgba(0, 0, 0, .00);
460
- --flat-activated-background-color: rgba(0, 0, 0, .050);
461
- --flat-activated-border-color: rgba(0, 0, 0, .00);
462
- --flat-checked-background-color: rgba(48, 87, 146, .100);
463
- --flat-checked-border-color: rgba(15, 74, 163, .00);
464
- --on-flat-active-color: rgba(0, 0, 0, .900);
465
- --on-flat-neutral-color: rgba(0, 0, 0, .550);
466
- --on-flat-disabled-color: rgba(0, 0, 0, .300);
467
- --selected-enabled-background-color: rgb(50, 91, 154);
468
- --selected-enabled-border-color: rgba(0, 0, 0, .00);
469
- --selected-hover-background-color: rgb(38, 69, 115);
470
- --selected-hover-border-color: rgba(0, 0, 0, .00);
471
- --selected-pressed-background-color: rgb(28, 50, 84);
472
- --selected-pressed-border-color: rgba(0, 0, 0, .00);
473
- --selected-focused-background-color: rgb(50, 91, 154);
474
- --selected-focused-border-color: rgba(0, 110, 225, .300);
475
- --selected-disabled-background-color: rgba(0, 0, 0, .200);
476
- --selected-disabled-border-color: rgba(0, 0, 0, .00);
477
- --on-selected-active-color: rgb(255, 255, 255);
478
- --on-selected-neutral-color: rgba(255, 255, 255, .800);
479
- --on-selected-disabled-color: rgba(0, 0, 0, .300);
480
- --thumb-enabled-background-color: rgb(255, 255, 255);
481
- --thumb-enabled-border-color: rgba(0, 0, 0, .200);
482
- --thumb-hover-background-color: rgb(230, 230, 230);
483
- --thumb-hover-border-color: rgba(0, 0, 0, .200);
484
- --thumb-pressed-background-color: rgb(204, 204, 204);
485
- --thumb-pressed-border-color: rgba(0, 0, 0, .200);
486
- --thumb-focused-background-color: rgb(255, 255, 255);
487
- --thumb-focused-border-color: rgba(0, 110, 225, .300);
488
- --thumb-disabled-background-color: rgba(0, 0, 0, .100);
489
- --thumb-disabled-border-color: rgba(0, 0, 0, .00);
490
- --on-thumb-active-color: rgba(0, 0, 0, .900);
491
- --on-thumb-neutral-color: rgba(0, 0, 0, .550);
492
- --on-thumb-disabled-color: rgba(0, 0, 0, .300);
493
- --amplified-enabled-background-color: rgba(48, 87, 146, .100);
494
- --amplified-enabled-border-color: rgba(0, 0, 0, .00);
495
- --amplified-hover-background-color: rgba(48, 87, 146, .200);
496
- --amplified-hover-border-color: rgba(0, 0, 0, .00);
497
- --amplified-pressed-background-color: rgba(48, 87, 146, .260);
498
- --amplified-pressed-border-color: rgba(0, 0, 0, .00);
499
- --amplified-focused-background-color: rgba(48, 87, 146, .100);
500
- --amplified-focused-border-color: rgba(0, 110, 225, .300);
501
- --amplified-disabled-background-color: rgba(0, 0, 0, .100);
502
- --amplified-disabled-border-color: rgba(0, 0, 0, .00);
503
- --on-amplified-active-color: rgba(0, 0, 0, .900);
504
- --on-amplified-neutral-color: rgba(0, 0, 0, .550);
505
- --on-amplified-disabled-color: rgba(0, 0, 0, .300);
506
- --device-enabled-background-color: rgb(255, 255, 255);
507
- --device-enabled-border-color: rgba(0, 0, 0, .200);
508
- --device-hover-background-color: rgb(239, 239, 239);
509
- --device-hover-border-color: rgba(0, 0, 0, .200);
510
- --device-pressed-background-color: rgb(230, 230, 230);
511
- --device-pressed-border-color: rgba(0, 0, 0, .050);
512
- --device-focused-background-color: rgb(255, 255, 255);
513
- --device-focused-border-color: rgba(0, 110, 225, .300);
514
- --device-disabled-background-color: rgba(0, 0, 0, .00);
515
- --device-disabled-border-color: rgba(0, 0, 0, .050);
516
- --on-device-active-color: rgb(255, 255, 255);
517
- --on-device-neutral-color: rgba(0, 0, 0, .440);
518
- --on-device-disabled-color: rgb(179, 179, 179);
519
- --notification-enabled-background-color: rgb(0, 112, 214);
520
- --notification-enabled-border-color: rgba(0, 0, 0, .100);
521
- --notification-hover-background-color: rgb(0, 85, 163);
522
- --notification-hover-border-color: rgba(0, 0, 0, .100);
523
- --notification-pressed-background-color: rgb(0, 53, 102);
524
- --notification-pressed-border-color: rgba(0, 0, 0, .200);
525
- --notification-focused-background-color: rgb(0, 112, 214);
526
- --notification-focused-border-color: rgba(0, 112, 214, .300);
527
- --notification-disabled-background-color: rgb(0, 112, 214);
528
- --notification-disabled-border-color: rgba(0, 0, 0, .00);
529
- --on-notification-active-color: rgb(255, 255, 255);
530
- --on-notification-neutral-color: rgba(255, 255, 255, .700);
531
- --on-notification-disabled-color: rgba(255, 255, 255, .300);
532
- --running-enabled-background-color: rgb(37, 146, 40);
533
- --running-enabled-border-color: rgba(0, 0, 0, .100);
534
- --running-hover-background-color: rgb(29, 114, 29);
535
- --running-hover-border-color: rgba(0, 0, 0, .100);
536
- --running-pressed-background-color: rgb(27, 106, 29);
537
- --running-pressed-border-color: rgba(0, 0, 0, .200);
538
- --running-focused-background-color: rgb(37, 146, 40);
539
- --running-focused-border-color: rgb(247, 247, 247);
540
- --running-disabled-background-color: rgb(37, 146, 40);
541
- --running-disabled-border-color: rgba(0, 0, 0, .00);
542
- --on-running-active-color: rgb(255, 255, 255);
543
- --on-running-neutral-color: rgba(255, 255, 255, .700);
544
- --on-running-disabled-color: rgba(255, 255, 255, .300);
545
- --caution-enabled-background-color: rgb(250, 217, 0);
546
- --caution-enabled-border-color: rgba(0, 0, 0, .300);
547
- --caution-hover-background-color: rgb(199, 173, 0);
548
- --caution-hover-border-color: rgba(0, 0, 0, .300);
549
- --caution-pressed-background-color: rgb(148, 128, 0);
550
- --caution-pressed-border-color: rgba(0, 0, 0, .200);
551
- --caution-focused-background-color: rgb(250, 217, 0);
552
- --caution-focused-border-color: rgb(247, 247, 247);
553
- --caution-disabled-background-color: rgb(250, 217, 0);
554
- --caution-disabled-border-color: rgba(0, 0, 0, .00);
555
- --on-caution-active-color: rgba(0, 0, 0, .900);
556
- --on-caution-neutral-color: rgba(0, 0, 0, .600);
557
- --on-caution-disabled-color: rgba(0, 0, 0, .300);
558
- --warning-enabled-background-color: rgb(255, 145, 15);
559
- --warning-enabled-border-color: rgba(0, 0, 0, .300);
560
- --warning-hover-background-color: rgb(194, 117, 0);
561
- --warning-hover-border-color: rgba(0, 0, 0, .300);
562
- --warning-pressed-background-color: rgb(143, 90, 0);
563
- --warning-pressed-border-color: rgba(0, 0, 0, .200);
564
- --warning-focused-background-color: rgb(246, 148, 0);
565
- --warning-focused-border-color: rgb(247, 247, 247);
566
- --warning-disabled-background-color: rgb(246, 148, 0);
567
- --warning-disabled-border-color: rgba(0, 0, 0, .00);
568
- --on-warning-active-color: rgba(0, 0, 0, .900);
569
- --on-warning-neutral-color: rgba(0, 0, 0, .600);
570
- --on-warning-disabled-color: rgba(0, 0, 0, .300);
571
- --alarm-enabled-background-color: rgb(228, 27, 27);
572
- --alarm-enabled-border-color: rgba(0, 0, 0, .100);
573
- --alarm-hover-background-color: rgb(182, 22, 22);
574
- --alarm-hover-border-color: rgba(0, 0, 0, .100);
575
- --alarm-pressed-background-color: rgb(137, 16, 16);
576
- --alarm-pressed-border-color: rgba(0, 0, 0, .200);
577
- --alarm-focused-background-color: rgb(228, 27, 27);
578
- --alarm-focused-border-color: rgb(247, 247, 247);
579
- --alarm-disabled-background-color: rgb(228, 27, 27);
580
- --alarm-disabled-border-color: rgba(0, 0, 0, .00);
581
- --on-alarm-active-color: rgb(255, 255, 255);
582
- --on-alarm-neutral-color: rgba(255, 255, 255, .700);
583
- --on-alarm-disabled-color: rgba(0, 0, 0, .300);
584
- --critical-alarm-enabled-background-color: rgb(201, 0, 202);
585
- --critical-alarm-enabled-border-color: rgba(0, 0, 0, .100);
586
- --critical-alarm-hover-background-color: rgb(152, 0, 153);
587
- --critical-alarm-hover-border-color: rgba(0, 0, 0, .100);
588
- --critical-alarm-pressed-background-color: rgb(102, 0, 102);
589
- --critical-alarm-pressed-border-color: rgba(0, 0, 0, .200);
590
- --critical-alarm-focused-background-color: rgb(201, 0, 202);
591
- --critical-alarm-focused-border-color: rgb(247, 247, 247);
592
- --critical-alarm-disabled-background-color: rgb(201, 0, 202);
593
- --critical-alarm-disabled-border-color: rgba(0, 0, 0, .00);
594
- --on-critical-alarm-active-color: rgb(255, 255, 255);
595
- --on-critical-alarm-neutral-color: rgba(255, 255, 255, .700);
596
- --on-critical-alarm-disabled-color: rgba(255, 255, 255, .300);
597
- --font-ui-title-size: 24px;
598
- --font-ui-title-weight: bold;
599
- --font-ui-title-line-height: 32px;
600
- --font-ui-subtitle-size: 24px;
601
- --font-ui-subtitle-weight: regular;
602
- --font-ui-subtitle-line-height: 32px;
603
- --font-ui-overline-size: 12px;
604
- --font-ui-overline-weight: semibold;
605
- --font-ui-overline-line-height: 24px;
606
- --font-ui-overline-new-size: 16px;
607
- --font-ui-overline-new-weight: semibold;
608
- --font-ui-overline-new-line-height: 24px;
609
- --font-ui-button-size: 16px;
610
- --font-ui-button-weight: Medium;
611
- --font-ui-button-line-height: 24px;
612
- --font-ui-body-active-size: 16px;
613
- --font-ui-body-active-weight: semibold;
614
- --font-ui-body-active-line-height: 24px;
615
- --font-ui-body-size: 16px;
616
- --font-ui-body-weight: regular;
617
- --font-ui-body-line-height: 24px;
618
- --font-ui-label-active-size: 12px;
619
- --font-ui-label-active-weight: semibold;
620
- --font-ui-label-active-line-height: 16px;
621
- --font-ui-label-size: 12px;
622
- --font-ui-label-weight: regular;
623
- --font-ui-label-line-height: 16px;
624
- --font-instrument-label-s-size: 16px;
625
- --font-instrument-label-s-weight: regular;
626
- --font-instrument-label-s-line-height: 24px;
627
- --font-instrument-label-m-size: 32px;
628
- --font-instrument-label-m-weight: regular;
629
- --font-instrument-label-m-line-height: 40px;
630
- --font-instrument-label-l-size: 64px;
631
- --font-instrument-label-l-weight: regular;
632
- --font-instrument-label-l-line-height: 80px;
633
- --font-instrument-value-regular-size: 16px;
634
- --font-instrument-value-regular-weight: Medium;
635
- --font-instrument-value-regular-line-height: 24px;
636
- --font-instrument-value-enhanced-size: 36px;
637
- --font-instrument-value-enhanced-weight: Medium;
638
- --font-instrument-value-enhanced-line-height: 48px;
639
- --font-instrument-value-double-size: 72px;
640
- --font-instrument-value-double-weight: Medium;
641
- --font-instrument-value-double-line-height: 96px;
642
- --font-instrument-value-s-size: 16px;
643
- --font-instrument-value-s-weight: semibold;
644
- --font-instrument-value-s-line-height: 24px;
645
- --font-instrument-value-s-enhanced-size: 24px;
646
- --font-instrument-value-s-enhanced-weight: semibold;
647
- --font-instrument-value-s-enhanced-line-height: 32px;
648
- --font-instrument-value-m-size: 32px;
649
- --font-instrument-value-m-weight: semibold;
650
- --font-instrument-value-m-line-height: 40px;
651
- --font-instrument-value-m-enhanced-size: 48px;
652
- --font-instrument-value-m-enhanced-weight: semibold;
653
- --font-instrument-value-m-enhanced-line-height: 64px;
654
- --font-instrument-value-l-size: 64px;
655
- --font-instrument-value-l-weight: semibold;
656
- --font-instrument-value-l-line-height: 80px;
657
- --font-instrument-value-l-enhanced-size: 96px;
658
- --font-instrument-value-l-enhanced-weight: semibold;
659
- --font-instrument-value-l-enhanced-line-height: 128px;
660
- --font-instrument-unit-s-size: 16px;
661
- --font-instrument-unit-s-weight: regular;
662
- --font-instrument-unit-s-line-height: 24px;
663
- --font-instrument-unit-m-size: 32px;
664
- --font-instrument-unit-m-weight: regular;
665
- --font-instrument-unit-m-line-height: 40px;
666
- --font-instrument-unit-l-size: 64px;
667
- --font-instrument-unit-l-weight: regular;
668
- --font-instrument-unit-l-line-height: 80px;
669
- --font-instrument-status-s-size: 16px;
670
- --font-instrument-status-s-weight: regular;
671
- --font-instrument-status-s-line-height: 24px;
672
- --font-instrument-status-m-size: 32px;
673
- --font-instrument-status-m-weight: regular;
674
- --font-instrument-status-m-line-height: 40px;
675
- --font-instrument-status-l-size: 64px;
676
- --font-instrument-status-l-weight: regular;
677
- --font-instrument-status-l-line-height: 80px;
678
- --shadow-flat: 0px 1px 1px 0px rgba(0, 0, 0, .200);
679
- --shadow-raised: 0px 2px 4px 0px rgba(0, 0, 0, .200);
680
- --shadow-floating: 0px 4px 16px 0px rgba(0, 0, 0, .300);
681
- --shadow-overlay: 0px 8px 32px 0px rgba(0, 0, 0, .400);
682
- --shadow-focused: 0px 0px 0px 4px rgb(0, 59, 148);
683
- --icon-02-chevron-up: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M6 14.0002L7.41 15.4102L12 10.8302L16.59 15.4102L18 14.0002L12 8.00016L6 14.0002Z" fill="rgba(0, 0, 0, 0.55)"/></svg>');
684
- --icon-02-chevron-down: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M18 9.41L16.59 8L12 12.58L7.41 8L6 9.41L12 15.41L18 9.41Z" fill="rgba(0, 0, 0, 0.55)"/></svg>');
336
+ :root[data-obc-theme=day] {
337
+ --element-active-color: rgb(26, 26, 26);
338
+ --element-neutral-color: rgba(0, 0, 0, .590);
339
+ --element-inactive-color: rgba(0, 0, 0, .420);
340
+ --element-disabled-color: rgba(0, 0, 0, .200);
341
+ --element-active-inverted-color: rgb(255, 255, 255);
342
+ --element-neutral-inverted-color: rgba(255, 255, 255, .700);
343
+ --element-inactive-inverted-color: rgba(255, 255, 255, .400);
344
+ --element-disabled-inverted-color: rgba(255, 255, 255, .200);
345
+ --container-backdrop-color: rgb(224, 224, 224);
346
+ --container-section-color: rgb(240, 240, 240);
347
+ --container-background-color: rgb(247, 247, 247);
348
+ --container-global-color: rgb(252, 252, 252);
349
+ --container-overlay-color: rgba(0, 0, 0, .100);
350
+ --border-divider-color: rgba(0, 0, 0, .080);
351
+ --border-outline-color: rgba(0, 0, 0, .080);
352
+ --border-edge-color: rgba(0, 0, 0, .050);
353
+ --border-solid-color: rgb(51, 51, 51);
354
+ --border-icon-outline-color: rgba(0, 0, 0, .400);
355
+ --border-silhouette-color: rgb(247, 247, 247);
356
+ --instrument-enhanced-primary-color: rgb(0, 112, 214);
357
+ --instrument-enhanced-secondary-color: rgb(50, 91, 154);
358
+ --instrument-enhanced-tertiary-color: rgb(208, 216, 228);
359
+ --instrument-regular-primary-color: rgb(51, 51, 51);
360
+ --instrument-regular-secondary-color: rgb(102, 102, 102);
361
+ --instrument-regular-tertiary-color: rgba(102, 102, 102, .250);
362
+ --instrument-frame-primary-color: rgb(255, 255, 255);
363
+ --instrument-frame-secondary-color: rgb(240, 240, 240);
364
+ --instrument-frame-tertiary-color: rgb(217, 217, 217);
365
+ --instrument-tick-mark-primary-color: rgb(51, 51, 51);
366
+ --instrument-tick-mark-secondary-color: rgb(112, 112, 112);
367
+ --instrument-tick-mark-tertiary-color: rgb(143, 143, 143);
368
+ --instrument-starboard-color: rgb(53, 158, 133);
369
+ --instrument-port-color: rgb(225, 98, 144);
370
+ --navigation-green-color: rgb(184, 234, 195);
371
+ --navigation-yellow-color: rgb(247, 241, 161);
372
+ --navigation-orange-color: rgb(247, 204, 161);
373
+ --navigation-red-color: rgb(241, 177, 200);
374
+ --navigation-generic-color: rgb(202, 194, 239);
375
+ --navigation-white-color: rgb(199, 213, 234);
376
+ --alert-running-color: rgb(34, 135, 34);
377
+ --alert-caution-color: rgb(250, 217, 0);
378
+ --alert-warning-color: rgb(246, 148, 0);
379
+ --alert-alarm-color: rgb(223, 27, 27);
380
+ --alert-critical-alarm-color: rgb(229, 0, 229);
381
+ --alert-limit-primary-color: rgba(0, 0, 0, .080);
382
+ --alert-limit-secondary-color: rgba(0, 0, 0, .080);
383
+ --automation-device-primary-color: rgb(255, 255, 255);
384
+ --automation-device-secondary-color: rgb(112, 112, 112);
385
+ --automation-device-tertiary-color: rgb(0, 0, 0);
386
+ --automation-device-primary-inverted-color: rgb(15, 15, 15);
387
+ --automation-device-secondary-inverted-color: rgb(102, 102, 102);
388
+ --automation-device-tertiary-inverted-color: rgb(128, 128, 128);
389
+ --automation-pipe-primary-color: rgb(255, 255, 255);
390
+ --automation-pipe-secondary-color: rgb(143, 143, 143);
391
+ --automation-pipe-tertiary-color: rgb(51, 51, 51);
392
+ --automation-pipe-primary-inverted-color: rgb(224, 224, 224);
393
+ --automation-pipe-secondary-inverted-color: rgb(179, 179, 179);
394
+ --automation-pipe-tertiary-inverted-color: rgb(143, 143, 143);
395
+ --automation-pipe-overlay-color: rgba(0, 0, 0, .200);
396
+ --automation-pipe-disabled-color: rgba(0, 0, 0, .100);
397
+ --automation-acid-alkalis: rgb(231, 193, 244);
398
+ --automation-air-ventilation: rgb(222, 222, 222);
399
+ --automation-fire-fighting: rgb(255, 177, 196);
400
+ --automation-flammable-gas: rgb(216, 224, 127);
401
+ --automation-fresh-water: rgb(198, 241, 251);
402
+ --automation-fuel: rgb(249, 208, 169);
403
+ --automation-masses: rgb(209, 191, 173);
404
+ --automation-non-flammable-gas: rgb(220, 232, 206);
405
+ --automation-oil: rgb(253, 243, 155);
406
+ --automation-sea-water: rgb(173, 230, 213);
407
+ --automation-steam: rgb(203, 203, 203);
408
+ --automation-waste-media: rgb(138, 138, 138);
409
+ --normal-enabled-background-color: rgb(255, 255, 255);
410
+ --normal-enabled-border-color: rgb(205, 205, 205);
411
+ --normal-hover-background-color: rgb(240, 240, 240);
412
+ --normal-hover-border-color: rgba(0, 0, 0, .200);
413
+ --normal-pressed-background-color: rgb(224, 224, 224);
414
+ --normal-pressed-border-color: rgba(0, 0, 0, .200);
415
+ --normal-focused-background-color: rgb(255, 255, 255);
416
+ --normal-focused-border-color: rgba(0, 110, 225, .300);
417
+ --normal-disabled-background-color: rgba(255, 255, 255, .00);
418
+ --normal-disabled-border-color: rgba(0, 0, 0, .100);
419
+ --normal-activated-background-color: rgb(235, 235, 235);
420
+ --normal-activated-border-color: rgba(0, 0, 0, .200);
421
+ --on-normal-active-color: rgb(26, 26, 26);
422
+ --on-normal-neutral-color: rgba(0, 0, 0, .550);
423
+ --on-normal-disabled-color: rgba(0, 0, 0, .300);
424
+ --raised-enabled-background-color: rgba(0, 0, 0, .600);
425
+ --raised-enabled-border-color: rgba(0, 0, 0, .100);
426
+ --raised-hover-background-color: rgba(0, 0, 0, .700);
427
+ --raised-hover-border-color: rgba(0, 0, 0, .100);
428
+ --raised-pressed-background-color: rgba(0, 0, 0, .800);
429
+ --raised-pressed-border-color: rgba(0, 0, 0, .300);
430
+ --raised-focused-background-color: rgba(0, 0, 0, .600);
431
+ --raised-focused-border-color: rgba(0, 110, 225, .300);
432
+ --raised-disabled-background-color: rgba(0, 0, 0, .00);
433
+ --raised-disabled-border-color: rgba(0, 0, 0, .100);
434
+ --on-raised-active-color: rgb(255, 255, 255);
435
+ --on-raised-neutral-color: rgba(255, 255, 255, .700);
436
+ --on-raised-disabled-color: rgba(0, 0, 0, .300);
437
+ --indent-enabled-background-color: rgba(0, 0, 0, .050);
438
+ --indent-enabled-border-color: rgba(0, 0, 0, .050);
439
+ --indent-hover-background-color: rgba(0, 0, 0, .100);
440
+ --indent-hover-border-color: rgba(0, 0, 0, .050);
441
+ --indent-pressed-background-color: rgba(0, 0, 0, .160);
442
+ --indent-pressed-border-color: rgba(0, 0, 0, .100);
443
+ --indent-focused-background-color: rgba(0, 0, 0, .050);
444
+ --indent-focused-border-color: rgba(0, 110, 225, .300);
445
+ --indent-disabled-background-color: rgba(0, 0, 0, .00);
446
+ --indent-disabled-border-color: rgba(0, 0, 0, .100);
447
+ --on-indent-active-color: rgba(0, 0, 0, .900);
448
+ --on-indent-neutral-color: rgba(0, 0, 0, .440);
449
+ --on-indent-disabled-color: rgba(0, 0, 0, .300);
450
+ --flat-enabled-background-color: rgba(0, 0, 0, .00);
451
+ --flat-enabled-border-color: rgba(0, 0, 0, .00);
452
+ --flat-hover-background-color: rgba(0, 0, 0, .060);
453
+ --flat-hover-border-color: rgba(0, 0, 0, .00);
454
+ --flat-pressed-background-color: rgba(0, 0, 0, .120);
455
+ --flat-pressed-border-color: rgba(0, 0, 0, .00);
456
+ --flat-focused-background-color: rgba(0, 0, 0, .00);
457
+ --flat-focused-border-color: rgb(153, 206, 255);
458
+ --flat-disabled-background-color: rgba(0, 0, 0, .00);
459
+ --flat-disabled-border-color: rgba(0, 0, 0, .00);
460
+ --flat-activated-background-color: rgba(0, 0, 0, .050);
461
+ --flat-activated-border-color: rgba(0, 0, 0, .00);
462
+ --flat-checked-background-color: rgba(48, 87, 146, .100);
463
+ --flat-checked-border-color: rgba(15, 74, 163, .00);
464
+ --on-flat-active-color: rgba(0, 0, 0, .900);
465
+ --on-flat-neutral-color: rgba(0, 0, 0, .550);
466
+ --on-flat-disabled-color: rgba(0, 0, 0, .300);
467
+ --selected-enabled-background-color: rgb(50, 91, 154);
468
+ --selected-enabled-border-color: rgba(0, 0, 0, .00);
469
+ --selected-hover-background-color: rgb(38, 69, 115);
470
+ --selected-hover-border-color: rgba(0, 0, 0, .00);
471
+ --selected-pressed-background-color: rgb(28, 50, 84);
472
+ --selected-pressed-border-color: rgba(0, 0, 0, .00);
473
+ --selected-focused-background-color: rgb(50, 91, 154);
474
+ --selected-focused-border-color: rgba(0, 110, 225, .300);
475
+ --selected-disabled-background-color: rgba(0, 0, 0, .200);
476
+ --selected-disabled-border-color: rgba(0, 0, 0, .00);
477
+ --on-selected-active-color: rgb(255, 255, 255);
478
+ --on-selected-neutral-color: rgba(255, 255, 255, .800);
479
+ --on-selected-disabled-color: rgba(0, 0, 0, .300);
480
+ --thumb-enabled-background-color: rgb(255, 255, 255);
481
+ --thumb-enabled-border-color: rgba(0, 0, 0, .200);
482
+ --thumb-hover-background-color: rgb(230, 230, 230);
483
+ --thumb-hover-border-color: rgba(0, 0, 0, .200);
484
+ --thumb-pressed-background-color: rgb(204, 204, 204);
485
+ --thumb-pressed-border-color: rgba(0, 0, 0, .200);
486
+ --thumb-focused-background-color: rgb(255, 255, 255);
487
+ --thumb-focused-border-color: rgba(0, 110, 225, .300);
488
+ --thumb-disabled-background-color: rgba(0, 0, 0, .100);
489
+ --thumb-disabled-border-color: rgba(0, 0, 0, .00);
490
+ --on-thumb-active-color: rgba(0, 0, 0, .900);
491
+ --on-thumb-neutral-color: rgba(0, 0, 0, .550);
492
+ --on-thumb-disabled-color: rgba(0, 0, 0, .300);
493
+ --amplified-enabled-background-color: rgba(48, 87, 146, .100);
494
+ --amplified-enabled-border-color: rgba(0, 0, 0, .00);
495
+ --amplified-hover-background-color: rgba(48, 87, 146, .200);
496
+ --amplified-hover-border-color: rgba(0, 0, 0, .00);
497
+ --amplified-pressed-background-color: rgba(48, 87, 146, .260);
498
+ --amplified-pressed-border-color: rgba(0, 0, 0, .00);
499
+ --amplified-focused-background-color: rgba(48, 87, 146, .100);
500
+ --amplified-focused-border-color: rgba(0, 110, 225, .300);
501
+ --amplified-disabled-background-color: rgba(0, 0, 0, .100);
502
+ --amplified-disabled-border-color: rgba(0, 0, 0, .00);
503
+ --on-amplified-active-color: rgba(0, 0, 0, .900);
504
+ --on-amplified-neutral-color: rgba(0, 0, 0, .550);
505
+ --on-amplified-disabled-color: rgba(0, 0, 0, .300);
506
+ --device-enabled-background-color: rgb(255, 255, 255);
507
+ --device-enabled-border-color: rgba(0, 0, 0, .200);
508
+ --device-hover-background-color: rgb(239, 239, 239);
509
+ --device-hover-border-color: rgba(0, 0, 0, .200);
510
+ --device-pressed-background-color: rgb(230, 230, 230);
511
+ --device-pressed-border-color: rgba(0, 0, 0, .050);
512
+ --device-focused-background-color: rgb(255, 255, 255);
513
+ --device-focused-border-color: rgba(0, 110, 225, .300);
514
+ --device-disabled-background-color: rgba(0, 0, 0, .00);
515
+ --device-disabled-border-color: rgba(0, 0, 0, .050);
516
+ --on-device-active-color: rgb(255, 255, 255);
517
+ --on-device-neutral-color: rgba(0, 0, 0, .440);
518
+ --on-device-disabled-color: rgb(179, 179, 179);
519
+ --notification-enabled-background-color: rgb(0, 112, 214);
520
+ --notification-enabled-border-color: rgba(0, 0, 0, .100);
521
+ --notification-hover-background-color: rgb(0, 85, 163);
522
+ --notification-hover-border-color: rgba(0, 0, 0, .100);
523
+ --notification-pressed-background-color: rgb(0, 53, 102);
524
+ --notification-pressed-border-color: rgba(0, 0, 0, .200);
525
+ --notification-focused-background-color: rgb(0, 112, 214);
526
+ --notification-focused-border-color: rgba(0, 112, 214, .300);
527
+ --notification-disabled-background-color: rgb(0, 112, 214);
528
+ --notification-disabled-border-color: rgba(0, 0, 0, .00);
529
+ --on-notification-active-color: rgb(255, 255, 255);
530
+ --on-notification-neutral-color: rgba(255, 255, 255, .700);
531
+ --on-notification-disabled-color: rgba(255, 255, 255, .300);
532
+ --running-enabled-background-color: rgb(37, 146, 40);
533
+ --running-enabled-border-color: rgba(0, 0, 0, .100);
534
+ --running-hover-background-color: rgb(29, 114, 29);
535
+ --running-hover-border-color: rgba(0, 0, 0, .100);
536
+ --running-pressed-background-color: rgb(27, 106, 29);
537
+ --running-pressed-border-color: rgba(0, 0, 0, .200);
538
+ --running-focused-background-color: rgb(37, 146, 40);
539
+ --running-focused-border-color: rgb(247, 247, 247);
540
+ --running-disabled-background-color: rgb(37, 146, 40);
541
+ --running-disabled-border-color: rgba(0, 0, 0, .00);
542
+ --on-running-active-color: rgb(255, 255, 255);
543
+ --on-running-neutral-color: rgba(255, 255, 255, .700);
544
+ --on-running-disabled-color: rgba(255, 255, 255, .300);
545
+ --caution-enabled-background-color: rgb(250, 217, 0);
546
+ --caution-enabled-border-color: rgba(0, 0, 0, .300);
547
+ --caution-hover-background-color: rgb(199, 173, 0);
548
+ --caution-hover-border-color: rgba(0, 0, 0, .300);
549
+ --caution-pressed-background-color: rgb(148, 128, 0);
550
+ --caution-pressed-border-color: rgba(0, 0, 0, .200);
551
+ --caution-focused-background-color: rgb(250, 217, 0);
552
+ --caution-focused-border-color: rgb(247, 247, 247);
553
+ --caution-disabled-background-color: rgb(250, 217, 0);
554
+ --caution-disabled-border-color: rgba(0, 0, 0, .00);
555
+ --on-caution-active-color: rgba(0, 0, 0, .900);
556
+ --on-caution-neutral-color: rgba(0, 0, 0, .600);
557
+ --on-caution-disabled-color: rgba(0, 0, 0, .300);
558
+ --warning-enabled-background-color: rgb(255, 145, 15);
559
+ --warning-enabled-border-color: rgba(0, 0, 0, .300);
560
+ --warning-hover-background-color: rgb(194, 117, 0);
561
+ --warning-hover-border-color: rgba(0, 0, 0, .300);
562
+ --warning-pressed-background-color: rgb(143, 90, 0);
563
+ --warning-pressed-border-color: rgba(0, 0, 0, .200);
564
+ --warning-focused-background-color: rgb(246, 148, 0);
565
+ --warning-focused-border-color: rgb(247, 247, 247);
566
+ --warning-disabled-background-color: rgb(246, 148, 0);
567
+ --warning-disabled-border-color: rgba(0, 0, 0, .00);
568
+ --on-warning-active-color: rgba(0, 0, 0, .900);
569
+ --on-warning-neutral-color: rgba(0, 0, 0, .600);
570
+ --on-warning-disabled-color: rgba(0, 0, 0, .300);
571
+ --alarm-enabled-background-color: rgb(228, 27, 27);
572
+ --alarm-enabled-border-color: rgba(0, 0, 0, .100);
573
+ --alarm-hover-background-color: rgb(182, 22, 22);
574
+ --alarm-hover-border-color: rgba(0, 0, 0, .100);
575
+ --alarm-pressed-background-color: rgb(137, 16, 16);
576
+ --alarm-pressed-border-color: rgba(0, 0, 0, .200);
577
+ --alarm-focused-background-color: rgb(228, 27, 27);
578
+ --alarm-focused-border-color: rgb(247, 247, 247);
579
+ --alarm-disabled-background-color: rgb(228, 27, 27);
580
+ --alarm-disabled-border-color: rgba(0, 0, 0, .00);
581
+ --on-alarm-active-color: rgb(255, 255, 255);
582
+ --on-alarm-neutral-color: rgba(255, 255, 255, .700);
583
+ --on-alarm-disabled-color: rgba(0, 0, 0, .300);
584
+ --critical-alarm-enabled-background-color: rgb(201, 0, 202);
585
+ --critical-alarm-enabled-border-color: rgba(0, 0, 0, .100);
586
+ --critical-alarm-hover-background-color: rgb(152, 0, 153);
587
+ --critical-alarm-hover-border-color: rgba(0, 0, 0, .100);
588
+ --critical-alarm-pressed-background-color: rgb(102, 0, 102);
589
+ --critical-alarm-pressed-border-color: rgba(0, 0, 0, .200);
590
+ --critical-alarm-focused-background-color: rgb(201, 0, 202);
591
+ --critical-alarm-focused-border-color: rgb(247, 247, 247);
592
+ --critical-alarm-disabled-background-color: rgb(201, 0, 202);
593
+ --critical-alarm-disabled-border-color: rgba(0, 0, 0, .00);
594
+ --on-critical-alarm-active-color: rgb(255, 255, 255);
595
+ --on-critical-alarm-neutral-color: rgba(255, 255, 255, .700);
596
+ --on-critical-alarm-disabled-color: rgba(255, 255, 255, .300);
597
+ --font-ui-title-size: 24px;
598
+ --font-ui-title-weight: bold;
599
+ --font-ui-title-line-height: 32px;
600
+ --font-ui-subtitle-size: 24px;
601
+ --font-ui-subtitle-weight: regular;
602
+ --font-ui-subtitle-line-height: 32px;
603
+ --font-ui-overline-size: 12px;
604
+ --font-ui-overline-weight: semibold;
605
+ --font-ui-overline-line-height: 24px;
606
+ --font-ui-overline-new-size: 16px;
607
+ --font-ui-overline-new-weight: semibold;
608
+ --font-ui-overline-new-line-height: 24px;
609
+ --font-ui-button-size: 16px;
610
+ --font-ui-button-weight: Medium;
611
+ --font-ui-button-line-height: 24px;
612
+ --font-ui-body-active-size: 16px;
613
+ --font-ui-body-active-weight: semibold;
614
+ --font-ui-body-active-line-height: 24px;
615
+ --font-ui-body-size: 16px;
616
+ --font-ui-body-weight: regular;
617
+ --font-ui-body-line-height: 24px;
618
+ --font-ui-label-active-size: 12px;
619
+ --font-ui-label-active-weight: semibold;
620
+ --font-ui-label-active-line-height: 16px;
621
+ --font-ui-label-size: 12px;
622
+ --font-ui-label-weight: regular;
623
+ --font-ui-label-line-height: 16px;
624
+ --font-instrument-label-s-size: 16px;
625
+ --font-instrument-label-s-weight: regular;
626
+ --font-instrument-label-s-line-height: 24px;
627
+ --font-instrument-label-m-size: 32px;
628
+ --font-instrument-label-m-weight: regular;
629
+ --font-instrument-label-m-line-height: 40px;
630
+ --font-instrument-label-l-size: 64px;
631
+ --font-instrument-label-l-weight: regular;
632
+ --font-instrument-label-l-line-height: 80px;
633
+ --font-instrument-value-regular-size: 16px;
634
+ --font-instrument-value-regular-weight: Medium;
635
+ --font-instrument-value-regular-line-height: 24px;
636
+ --font-instrument-value-enhanced-size: 36px;
637
+ --font-instrument-value-enhanced-weight: Medium;
638
+ --font-instrument-value-enhanced-line-height: 48px;
639
+ --font-instrument-value-double-size: 72px;
640
+ --font-instrument-value-double-weight: Medium;
641
+ --font-instrument-value-double-line-height: 96px;
642
+ --font-instrument-value-s-size: 16px;
643
+ --font-instrument-value-s-weight: semibold;
644
+ --font-instrument-value-s-line-height: 24px;
645
+ --font-instrument-value-s-enhanced-size: 24px;
646
+ --font-instrument-value-s-enhanced-weight: semibold;
647
+ --font-instrument-value-s-enhanced-line-height: 32px;
648
+ --font-instrument-value-m-size: 32px;
649
+ --font-instrument-value-m-weight: semibold;
650
+ --font-instrument-value-m-line-height: 40px;
651
+ --font-instrument-value-m-enhanced-size: 48px;
652
+ --font-instrument-value-m-enhanced-weight: semibold;
653
+ --font-instrument-value-m-enhanced-line-height: 64px;
654
+ --font-instrument-value-l-size: 64px;
655
+ --font-instrument-value-l-weight: semibold;
656
+ --font-instrument-value-l-line-height: 80px;
657
+ --font-instrument-value-l-enhanced-size: 96px;
658
+ --font-instrument-value-l-enhanced-weight: semibold;
659
+ --font-instrument-value-l-enhanced-line-height: 128px;
660
+ --font-instrument-unit-s-size: 16px;
661
+ --font-instrument-unit-s-weight: regular;
662
+ --font-instrument-unit-s-line-height: 24px;
663
+ --font-instrument-unit-m-size: 32px;
664
+ --font-instrument-unit-m-weight: regular;
665
+ --font-instrument-unit-m-line-height: 40px;
666
+ --font-instrument-unit-l-size: 64px;
667
+ --font-instrument-unit-l-weight: regular;
668
+ --font-instrument-unit-l-line-height: 80px;
669
+ --font-instrument-status-s-size: 16px;
670
+ --font-instrument-status-s-weight: regular;
671
+ --font-instrument-status-s-line-height: 24px;
672
+ --font-instrument-status-m-size: 32px;
673
+ --font-instrument-status-m-weight: regular;
674
+ --font-instrument-status-m-line-height: 40px;
675
+ --font-instrument-status-l-size: 64px;
676
+ --font-instrument-status-l-weight: regular;
677
+ --font-instrument-status-l-line-height: 80px;
678
+ --shadow-flat: 0px 1px 1px 0px rgba(0, 0, 0, .200);
679
+ --shadow-raised: 0px 2px 4px 0px rgba(0, 0, 0, .200);
680
+ --shadow-floating: 0px 4px 16px 0px rgba(0, 0, 0, .300);
681
+ --shadow-overlay: 0px 8px 32px 0px rgba(0, 0, 0, .400);
682
+ --shadow-focused: 0px 0px 0px 4px rgb(0, 59, 148);
683
+ --icon-02-chevron-up: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M6 14.0002L7.41 15.4102L12 10.8302L16.59 15.4102L18 14.0002L12 8.00016L6 14.0002Z" fill="rgba(0, 0, 0, 0.55)"/></svg>');
684
+ --icon-02-chevron-down: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M18 9.41L16.59 8L12 12.58L7.41 8L6 9.41L12 15.41L18 9.41Z" fill="rgba(0, 0, 0, 0.55)"/></svg>');
685
685
 
686
- }
686
+ }
687
687
 
688
- :root[data-obc-theme=dusk] {
689
- --element-active-color: rgb(242, 242, 242);
690
- --element-neutral-color: rgba(255, 255, 255, .550);
691
- --element-inactive-color: rgba(255, 255, 255, .350);
692
- --element-disabled-color: rgba(255, 255, 255, .150);
693
- --element-active-inverted-color: rgb(0, 0, 0);
694
- --element-neutral-inverted-color: rgba(0, 0, 0, .600);
695
- --element-inactive-inverted-color: rgba(0, 0, 0, .400);
696
- --element-disabled-inverted-color: rgba(0, 0, 0, .200);
697
- --container-backdrop-color: rgb(15, 15, 15);
698
- --container-section-color: rgb(26, 26, 26);
699
- --container-background-color: rgb(31, 31, 31);
700
- --container-global-color: rgb(38, 38, 38);
701
- --container-overlay-color: rgba(0, 0, 0, .300);
702
- --border-divider-color: rgba(255, 255, 255, .080);
703
- --border-outline-color: rgba(0, 0, 0, .900);
704
- --border-edge-color: rgba(255, 255, 255, .050);
705
- --border-silhouette-color: rgb(0, 0, 0);
706
- --border-icon-outline-color: rgba(0, 0, 0, .500);
707
- --border-solid-color: rgb(51, 51, 51);
708
- --instrument-enhanced-primary-color: rgb(94, 213, 253);
709
- --instrument-enhanced-secondary-color: rgb(86, 150, 199);
710
- --instrument-enhanced-tertiary-color: rgba(92, 139, 193, .200);
711
- --instrument-regular-primary-color: rgb(230, 230, 230);
712
- --instrument-regular-secondary-color: rgb(153, 153, 153);
713
- --instrument-regular-tertiary-color: rgba(171, 171, 171, .150);
714
- --instrument-frame-primary-color: rgb(51, 51, 51);
715
- --instrument-frame-secondary-color: rgb(23, 23, 23);
716
- --instrument-frame-tertiary-color: rgb(5, 5, 5);
717
- --instrument-tick-mark-primary-color: rgb(230, 230, 230);
718
- --instrument-tick-mark-secondary-color: rgb(156, 156, 156);
719
- --instrument-tick-mark-tertiary-color: rgb(115, 115, 115);
720
- --instrument-starboard-color: rgb(41, 133, 111);
721
- --instrument-port-color: rgb(186, 86, 122);
722
- --alert-running-color: rgb(19, 138, 0);
723
- --alert-caution-color: rgb(237, 206, 6);
724
- --alert-warning-color: rgb(246, 148, 0);
725
- --alert-alarm-color: rgb(229, 38, 38);
726
- --alert-critical-alarm-color: rgb(229, 0, 229);
727
- --alert-limit-primary-color: rgba(0, 0, 0, .100);
728
- --alert-limit-secondary-color: rgba(0, 0, 0, .100);
729
- --automation-device-primary-color: rgb(230, 230, 230);
730
- --automation-device-secondary-color: rgb(115, 115, 115);
731
- --automation-device-tertiary-color: rgb(15, 15, 15);
732
- --automation-device-primary-inverted-color: rgb(0, 0, 0);
733
- --automation-device-secondary-inverted-color: rgb(51, 51, 51);
734
- --automation-device-tertiary-inverted-color: rgb(154, 154, 154);
735
- --automation-pipe-primary-color: rgb(156, 156, 156);
736
- --automation-pipe-secondary-color: rgb(20, 20, 20);
737
- --automation-pipe-tertiary-color: rgb(0, 0, 0);
738
- --automation-pipe-primary-inverted-color: rgb(15, 15, 15);
739
- --automation-pipe-secondary-inverted-color: rgba(255, 255, 255, .200);
740
- --automation-pipe-tertiary-inverted-color: rgba(255, 255, 255, .350);
741
- --automation-pipe-overlay-color: rgba(0, 0, 0, .200);
742
- --automation-pipe-disabled-color: rgba(0, 0, 0, .100);
743
- --automation-acid-alkalis: rgb(133, 113, 140);
744
- --automation-air-ventilation: rgb(133, 133, 133);
745
- --automation-fire-fighting: rgb(156, 106, 119);
746
- --automation-flammable-gas: rgb(119, 124, 72);
747
- --automation-fresh-water: rgb(89, 129, 139);
748
- --automation-fuel: rgb(153, 114, 74);
749
- --automation-masses: rgb(136, 118, 102);
750
- --automation-non-flammable-gas: rgb(112, 122, 97);
751
- --automation-oil: rgb(101, 94, 37);
752
- --automation-sea-water: rgb(91, 128, 121);
753
- --automation-steam: rgb(94, 97, 103);
754
- --automation-waste-media: rgb(90, 90, 90);
755
- --normal-enabled-background-color: rgb(51, 51, 51);
756
- --normal-enabled-border-color: rgb(0, 0, 0);
757
- --normal-hover-background-color: rgb(64, 64, 64);
758
- --normal-hover-border-color: rgb(0, 0, 0);
759
- --normal-pressed-background-color: rgb(38, 38, 38);
760
- --normal-pressed-border-color: rgb(0, 0, 0);
761
- --normal-focused-background-color: rgb(51, 51, 51);
762
- --normal-focused-border-color: rgba(87, 121, 162, .500);
763
- --normal-disabled-background-color: rgba(255, 255, 255, .00);
764
- --normal-disabled-border-color: rgba(0, 0, 0, .100);
765
- --normal-activated-background-color: rgb(38, 38, 38);
766
- --normal-activated-border-color: rgb(0, 0, 0);
767
- --on-normal-active-color: rgb(242, 242, 242);
768
- --on-normal-neutral-color: rgba(255, 255, 255, .550);
769
- --on-normal-disabled-color: rgba(255, 255, 255, .200);
770
- --raised-enabled-background-color: rgb(125, 125, 125);
771
- --raised-enabled-border-color: rgb(5, 5, 5);
772
- --raised-hover-background-color: rgb(140, 140, 140);
773
- --raised-hover-border-color: rgb(0, 0, 0);
774
- --raised-pressed-background-color: rgb(112, 112, 112);
775
- --raised-pressed-border-color: rgb(0, 0, 0);
776
- --raised-focused-background-color: rgb(125, 125, 125);
777
- --raised-focused-border-color: rgba(87, 121, 162, .500);
778
- --raised-disabled-background-color: rgba(0, 0, 0, .00);
779
- --raised-disabled-border-color: rgba(0, 0, 0, .100);
780
- --on-raised-active-color: rgb(0, 0, 0);
781
- --on-raised-neutral-color: rgba(0, 0, 0, .700);
782
- --on-raised-disabled-color: rgba(255, 255, 255, .200);
783
- --indent-enabled-background-color: rgba(0, 0, 0, .300);
784
- --indent-enabled-border-color: rgba(0, 0, 0, .400);
785
- --indent-hover-background-color: rgba(255, 255, 255, .060);
786
- --indent-hover-border-color: rgb(15, 15, 15);
787
- --indent-pressed-background-color: rgba(0, 0, 0, .400);
788
- --indent-pressed-border-color: rgb(15, 15, 15);
789
- --indent-focused-background-color: rgba(0, 0, 0, .200);
790
- --indent-focused-border-color: rgba(87, 121, 162, .500);
791
- --indent-disabled-background-color: rgba(0, 0, 0, .00);
792
- --indent-disabled-border-color: rgba(0, 0, 0, .100);
793
- --on-indent-active-color: rgb(242, 242, 242);
794
- --on-indent-neutral-color: rgba(255, 255, 255, .550);
795
- --on-indent-disabled-color: rgba(255, 255, 255, .200);
796
- --flat-enabled-background-color: rgba(255, 255, 255, .00);
797
- --flat-enabled-border-color: rgba(0, 0, 0, .00);
798
- --flat-hover-background-color: rgba(255, 255, 255, .060);
799
- --flat-hover-border-color: rgba(0, 0, 0, .00);
800
- --flat-pressed-background-color: rgba(255, 255, 255, .120);
801
- --flat-pressed-border-color: rgba(0, 0, 0, .00);
802
- --flat-focused-background-color: rgba(255, 255, 255, .00);
803
- --flat-focused-border-color: rgba(87, 121, 162, .500);
804
- --flat-disabled-background-color: rgba(0, 0, 0, .00);
805
- --flat-disabled-border-color: rgba(0, 0, 0, .00);
806
- --flat-activated-background-color: rgba(0, 0, 0, .050);
807
- --flat-activated-border-color: rgba(0, 0, 0, .00);
808
- --flat-checked-background-color: rgba(48, 87, 146, .100);
809
- --flat-checked-border-color: rgba(15, 74, 163, .00);
810
- --on-flat-active-color: rgb(242, 242, 242);
811
- --on-flat-neutral-color: rgba(255, 255, 255, .550);
812
- --on-flat-disabled-color: rgba(255, 255, 255, .200);
813
- --selected-enabled-background-color: rgb(74, 123, 165);
814
- --selected-enabled-border-color: rgb(0, 0, 0);
815
- --selected-hover-background-color: rgb(97, 144, 184);
816
- --selected-hover-border-color: rgb(0, 0, 0);
817
- --selected-pressed-background-color: rgb(62, 102, 137);
818
- --selected-pressed-border-color: rgb(0, 0, 0);
819
- --selected-focused-background-color: rgb(74, 123, 165);
820
- --selected-focused-border-color: rgba(87, 121, 162, .500);
821
- --selected-disabled-background-color: rgba(0, 0, 0, .200);
822
- --selected-disabled-border-color: rgba(0, 0, 0, .00);
823
- --on-selected-active-color: rgb(255, 255, 255);
824
- --on-selected-neutral-color: rgba(255, 255, 255, .550);
825
- --on-selected-disabled-color: rgba(0, 0, 0, .300);
826
- --thumb-enabled-background-color: rgb(51, 51, 51);
827
- --thumb-enabled-border-color: rgb(0, 0, 0);
828
- --thumb-hover-background-color: rgb(64, 64, 64);
829
- --thumb-hover-border-color: rgb(0, 0, 0);
830
- --thumb-pressed-background-color: rgb(92, 92, 92);
831
- --thumb-pressed-border-color: rgb(0, 0, 0);
832
- --thumb-focused-background-color: rgb(61, 61, 61);
833
- --thumb-focused-border-color: rgba(87, 121, 162, .500);
834
- --thumb-disabled-background-color: rgb(50, 50, 50);
835
- --thumb-disabled-border-color: rgba(0, 0, 0, .00);
836
- --on-thumb-active-color: rgb(242, 242, 242);
837
- --on-thumb-neutral-color: rgba(255, 255, 255, .550);
838
- --on-thumb-disabled-color: rgba(255, 255, 255, .200);
839
- --amplified-enabled-background-color: rgba(56, 122, 168, .100);
840
- --amplified-enabled-border-color: rgba(0, 0, 0, .00);
841
- --amplified-hover-background-color: rgba(56, 122, 168, .160);
842
- --amplified-hover-border-color: rgba(0, 0, 0, .00);
843
- --amplified-pressed-background-color: rgba(56, 122, 168, .080);
844
- --amplified-pressed-border-color: rgba(0, 0, 0, .00);
845
- --amplified-focused-background-color: rgba(56, 122, 168, .100);
846
- --amplified-focused-border-color: rgba(56, 122, 168, .500);
847
- --amplified-disabled-background-color: rgba(0, 0, 0, .100);
848
- --amplified-disabled-border-color: rgba(0, 0, 0, .00);
849
- --on-amplified-active-color: rgb(242, 242, 242);
850
- --on-amplified-neutral-color: rgba(255, 255, 255, .550);
851
- --on-amplified-disabled-color: rgba(255, 255, 255, .200);
852
- --device-enabled-background-color: rgb(31, 31, 31);
853
- --device-enabled-border-color: rgb(26, 26, 26);
854
- --device-hover-background-color: rgb(46, 46, 46);
855
- --device-hover-border-color: rgb(26, 26, 26);
856
- --device-pressed-background-color: rgb(61, 61, 61);
857
- --device-pressed-border-color: rgb(26, 26, 26);
858
- --device-focused-background-color: rgb(31, 31, 31);
859
- --device-focused-border-color: rgba(87, 121, 162, .500);
860
- --device-disabled-background-color: rgba(0, 0, 0, .00);
861
- --device-disabled-border-color: rgba(0, 0, 0, .050);
862
- --on-device-active-color: rgb(255, 255, 255);
863
- --on-device-neutral-color: rgb(123, 123, 123);
864
- --on-device-disabled-color: rgb(84, 84, 84);
865
- --notification-enabled-background-color: rgb(94, 213, 253);
866
- --notification-enabled-border-color: rgba(0, 0, 0, .500);
867
- --notification-hover-background-color: rgb(154, 229, 254);
868
- --notification-hover-border-color: rgba(0, 0, 0, .100);
869
- --notification-pressed-background-color: rgb(17, 163, 212);
870
- --notification-pressed-border-color: rgba(0, 0, 0, .200);
871
- --notification-focused-background-color: rgb(94, 213, 253);
872
- --notification-focused-border-color: rgb(247, 247, 247);
873
- --notification-disabled-background-color: rgb(94, 213, 253);
874
- --notification-disabled-border-color: rgba(0, 0, 0, .00);
875
- --on-notification-active-color: rgb(0, 0, 0);
876
- --on-notification-neutral-color: rgba(0, 0, 0, .600);
877
- --on-notification-disabled-color: rgba(0, 0, 0, .200);
878
- --running-enabled-background-color: rgb(19, 138, 0);
879
- --running-enabled-border-color: rgba(0, 0, 0, .100);
880
- --running-hover-background-color: rgb(23, 168, 0);
881
- --running-hover-border-color: rgba(0, 0, 0, .100);
882
- --running-pressed-background-color: rgb(15, 107, 0);
883
- --running-pressed-border-color: rgba(0, 0, 0, .200);
884
- --running-focused-background-color: rgb(19, 138, 0);
885
- --running-focused-border-color: rgb(247, 247, 247);
886
- --running-disabled-background-color: rgb(19, 138, 0);
887
- --running-disabled-border-color: rgba(0, 0, 0, .00);
888
- --on-running-active-color: rgb(255, 255, 255);
889
- --on-running-neutral-color: rgba(255, 255, 255, .600);
890
- --on-running-disabled-color: rgba(255, 255, 255, .200);
891
- --caution-enabled-background-color: rgb(237, 206, 6);
892
- --caution-enabled-border-color: rgb(20, 20, 20);
893
- --caution-hover-background-color: rgb(250, 222, 46);
894
- --caution-hover-border-color: rgb(20, 20, 20);
895
- --caution-pressed-background-color: rgb(199, 173, 5);
896
- --caution-pressed-border-color: rgb(20, 20, 20);
897
- --caution-focused-background-color: rgb(237, 206, 6);
898
- --caution-focused-border-color: rgb(247, 247, 247);
899
- --caution-disabled-background-color: rgb(237, 206, 6);
900
- --caution-disabled-border-color: rgba(0, 0, 0, .00);
901
- --on-caution-active-color: rgba(0, 0, 0, .900);
902
- --on-caution-neutral-color: rgba(0, 0, 0, .600);
903
- --on-caution-disabled-color: rgba(0, 0, 0, .300);
904
- --warning-enabled-background-color: rgb(246, 148, 0);
905
- --warning-enabled-border-color: rgba(0, 0, 0, .100);
906
- --warning-hover-background-color: rgb(255, 166, 31);
907
- --warning-hover-border-color: rgba(0, 0, 0, .100);
908
- --warning-pressed-background-color: rgb(204, 123, 0);
909
- --warning-pressed-border-color: rgba(0, 0, 0, .200);
910
- --warning-focused-background-color: rgb(246, 148, 0);
911
- --warning-focused-border-color: rgb(247, 247, 247);
912
- --warning-disabled-background-color: rgb(246, 148, 0);
913
- --warning-disabled-border-color: rgba(0, 0, 0, .00);
914
- --on-warning-active-color: rgba(0, 0, 0, .900);
915
- --on-warning-neutral-color: rgba(0, 0, 0, .600);
916
- --on-warning-disabled-color: rgba(0, 0, 0, .300);
917
- --alarm-enabled-background-color: rgb(229, 38, 38);
918
- --alarm-enabled-border-color: rgb(20, 20, 20);
919
- --alarm-hover-background-color: rgb(232, 64, 64);
920
- --alarm-hover-border-color: rgb(20, 20, 20);
921
- --alarm-pressed-background-color: rgb(200, 24, 24);
922
- --alarm-pressed-border-color: rgb(20, 20, 20);
923
- --alarm-focused-background-color: rgb(229, 38, 38);
924
- --alarm-focused-border-color: rgb(247, 247, 247);
925
- --alarm-disabled-background-color: rgb(229, 38, 38);
926
- --alarm-disabled-border-color: rgba(0, 0, 0, .00);
927
- --on-alarm-active-color: rgb(255, 255, 255);
928
- --on-alarm-neutral-color: rgba(255, 255, 255, .650);
929
- --on-alarm-disabled-color: rgba(0, 0, 0, .300);
930
- --critical-alarm-enabled-background-color: rgb(201, 0, 202);
931
- --critical-alarm-enabled-border-color: rgba(0, 0, 0, .100);
932
- --critical-alarm-hover-background-color: rgb(152, 0, 153);
933
- --critical-alarm-hover-border-color: rgba(0, 0, 0, .100);
934
- --critical-alarm-pressed-background-color: rgb(102, 0, 102);
935
- --critical-alarm-pressed-border-color: rgba(0, 0, 0, .200);
936
- --critical-alarm-focused-background-color: rgb(201, 0, 202);
937
- --critical-alarm-focused-border-color: rgb(247, 247, 247);
938
- --critical-alarm-disabled-background-color: rgb(201, 0, 202);
939
- --critical-alarm-disabled-border-color: rgba(0, 0, 0, .00);
940
- --on-critical-alarm-active-color: rgb(255, 255, 255);
941
- --on-critical-alarm-neutral-color: rgba(255, 255, 255, .700);
942
- --on-critical-alarm-disabled-color: rgba(255, 255, 255, .300);
943
- --font-ui-title-size: 24px;
944
- --font-ui-title-weight: bold;
945
- --font-ui-title-line-height: 32px;
946
- --font-ui-subtitle-size: 24px;
947
- --font-ui-subtitle-weight: regular;
948
- --font-ui-subtitle-line-height: 32px;
949
- --font-ui-overline-size: 12px;
950
- --font-ui-overline-weight: semibold;
951
- --font-ui-overline-line-height: 24px;
952
- --font-ui-button-size: 16px;
953
- --font-ui-button-weight: semibold;
954
- --font-ui-button-line-height: 24px;
955
- --font-ui-body-active-size: 16px;
956
- --font-ui-body-active-weight: bold;
957
- --font-ui-body-active-line-height: 24px;
958
- --font-ui-body-size: 16px;
959
- --font-ui-body-weight: regular;
960
- --font-ui-body-line-height: 24px;
961
- --font-ui-label-active-size: 12px;
962
- --font-ui-label-active-weight: bold;
963
- --font-ui-label-active-line-height: 16px;
964
- --font-ui-label-size: 12px;
965
- --font-ui-label-weight: regular;
966
- --font-ui-label-line-height: 16px;
967
- --font-instrument-label-s-size: 16px;
968
- --font-instrument-label-s-weight: regular;
969
- --font-instrument-label-s-line-height: 24px;
970
- --font-instrument-label-m-size: 32px;
971
- --font-instrument-label-m-weight: regular;
972
- --font-instrument-label-m-line-height: 40px;
973
- --font-instrument-label-l-size: 64px;
974
- --font-instrument-label-l-weight: regular;
975
- --font-instrument-label-l-line-height: 80px;
976
- --font-instrument-value-s-size: 16px;
977
- --font-instrument-value-s-weight: semibold;
978
- --font-instrument-value-s-line-height: 24px;
979
- --font-instrument-value-s-enhanced-size: 24px;
980
- --font-instrument-value-s-enhanced-weight: semibold;
981
- --font-instrument-value-s-enhanced-line-height: 32px;
982
- --font-instrument-value-m-size: 32px;
983
- --font-instrument-value-m-weight: semibold;
984
- --font-instrument-value-m-line-height: 40px;
985
- --font-instrument-value-m-enhanced-size: 48px;
986
- --font-instrument-value-m-enhanced-weight: semibold;
987
- --font-instrument-value-m-enhanced-line-height: 64px;
988
- --font-instrument-value-l-size: 64px;
989
- --font-instrument-value-l-weight: semibold;
990
- --font-instrument-value-l-line-height: 80px;
991
- --font-instrument-value-l-enhanced-size: 96px;
992
- --font-instrument-value-l-enhanced-weight: semibold;
993
- --font-instrument-value-l-enhanced-line-height: 128px;
994
- --font-instrument-unit-s-size: 16px;
995
- --font-instrument-unit-s-weight: regular;
996
- --font-instrument-unit-s-line-height: 24px;
997
- --font-instrument-unit-m-size: 32px;
998
- --font-instrument-unit-m-weight: regular;
999
- --font-instrument-unit-m-line-height: 40px;
1000
- --font-instrument-unit-l-size: 64px;
1001
- --font-instrument-unit-l-weight: regular;
1002
- --font-instrument-unit-l-line-height: 80px;
1003
- --font-instrument-status-s-size: 16px;
1004
- --font-instrument-status-s-weight: regular;
1005
- --font-instrument-status-s-line-height: 24px;
1006
- --font-instrument-status-m-size: 32px;
1007
- --font-instrument-status-m-weight: regular;
1008
- --font-instrument-status-m-line-height: 40px;
1009
- --font-instrument-status-l-size: 64px;
1010
- --font-instrument-status-l-weight: regular;
1011
- --font-instrument-status-l-line-height: 80px;
1012
- --shadow-flat: 0px 1px 1px 0px rgba(0, 0, 0, .600);
1013
- --shadow-raised: 0px 2px 4px 0px rgba(0, 0, 0, .700);
1014
- --shadow-floating: 0px 4px 16px 0px rgba(0, 0, 0, .600);
1015
- --shadow-overlay: 0px 8px 32px 0px rgba(0, 0, 0, .800);
688
+ :root[data-obc-theme=dusk] {
689
+ --element-active-color: rgb(242, 242, 242);
690
+ --element-neutral-color: rgba(255, 255, 255, .550);
691
+ --element-inactive-color: rgba(255, 255, 255, .350);
692
+ --element-disabled-color: rgba(255, 255, 255, .150);
693
+ --element-active-inverted-color: rgb(0, 0, 0);
694
+ --element-neutral-inverted-color: rgba(0, 0, 0, .600);
695
+ --element-inactive-inverted-color: rgba(0, 0, 0, .400);
696
+ --element-disabled-inverted-color: rgba(0, 0, 0, .200);
697
+ --container-backdrop-color: rgb(15, 15, 15);
698
+ --container-section-color: rgb(26, 26, 26);
699
+ --container-background-color: rgb(31, 31, 31);
700
+ --container-global-color: rgb(38, 38, 38);
701
+ --container-overlay-color: rgba(0, 0, 0, .300);
702
+ --border-divider-color: rgba(255, 255, 255, .080);
703
+ --border-outline-color: rgba(0, 0, 0, .900);
704
+ --border-edge-color: rgba(255, 255, 255, .050);
705
+ --border-silhouette-color: rgb(0, 0, 0);
706
+ --border-icon-outline-color: rgba(0, 0, 0, .500);
707
+ --border-solid-color: rgb(51, 51, 51);
708
+ --instrument-enhanced-primary-color: rgb(94, 213, 253);
709
+ --instrument-enhanced-secondary-color: rgb(86, 150, 199);
710
+ --instrument-enhanced-tertiary-color: #2B353F;
711
+ --instrument-regular-primary-color: rgb(230, 230, 230);
712
+ --instrument-regular-secondary-color: rgb(153, 153, 153);
713
+ --instrument-regular-tertiary-color: rgba(171, 171, 171, .150);
714
+ --instrument-frame-primary-color: rgb(51, 51, 51);
715
+ --instrument-frame-secondary-color: rgb(23, 23, 23);
716
+ --instrument-frame-tertiary-color: rgb(5, 5, 5);
717
+ --instrument-tick-mark-primary-color: rgb(230, 230, 230);
718
+ --instrument-tick-mark-secondary-color: rgb(156, 156, 156);
719
+ --instrument-tick-mark-tertiary-color: rgb(115, 115, 115);
720
+ --instrument-starboard-color: rgb(41, 133, 111);
721
+ --instrument-port-color: rgb(186, 86, 122);
722
+ --alert-running-color: rgb(19, 138, 0);
723
+ --alert-caution-color: rgb(237, 206, 6);
724
+ --alert-warning-color: rgb(246, 148, 0);
725
+ --alert-alarm-color: rgb(229, 38, 38);
726
+ --alert-critical-alarm-color: rgb(229, 0, 229);
727
+ --alert-limit-primary-color: rgba(0, 0, 0, .100);
728
+ --alert-limit-secondary-color: rgba(0, 0, 0, .100);
729
+ --automation-device-primary-color: rgb(230, 230, 230);
730
+ --automation-device-secondary-color: rgb(115, 115, 115);
731
+ --automation-device-tertiary-color: rgb(15, 15, 15);
732
+ --automation-device-primary-inverted-color: rgb(0, 0, 0);
733
+ --automation-device-secondary-inverted-color: rgb(51, 51, 51);
734
+ --automation-device-tertiary-inverted-color: rgb(154, 154, 154);
735
+ --automation-pipe-primary-color: rgb(156, 156, 156);
736
+ --automation-pipe-secondary-color: rgb(20, 20, 20);
737
+ --automation-pipe-tertiary-color: rgb(0, 0, 0);
738
+ --automation-pipe-primary-inverted-color: rgb(15, 15, 15);
739
+ --automation-pipe-secondary-inverted-color: rgba(255, 255, 255, .200);
740
+ --automation-pipe-tertiary-inverted-color: rgba(255, 255, 255, .350);
741
+ --automation-pipe-overlay-color: rgba(0, 0, 0, .200);
742
+ --automation-pipe-disabled-color: rgba(0, 0, 0, .100);
743
+ --automation-acid-alkalis: rgb(133, 113, 140);
744
+ --automation-air-ventilation: rgb(133, 133, 133);
745
+ --automation-fire-fighting: rgb(156, 106, 119);
746
+ --automation-flammable-gas: rgb(119, 124, 72);
747
+ --automation-fresh-water: rgb(89, 129, 139);
748
+ --automation-fuel: rgb(153, 114, 74);
749
+ --automation-masses: rgb(136, 118, 102);
750
+ --automation-non-flammable-gas: rgb(112, 122, 97);
751
+ --automation-oil: rgb(101, 94, 37);
752
+ --automation-sea-water: rgb(91, 128, 121);
753
+ --automation-steam: rgb(94, 97, 103);
754
+ --automation-waste-media: rgb(90, 90, 90);
755
+ --normal-enabled-background-color: rgb(51, 51, 51);
756
+ --normal-enabled-border-color: rgb(0, 0, 0);
757
+ --normal-hover-background-color: rgb(64, 64, 64);
758
+ --normal-hover-border-color: rgb(0, 0, 0);
759
+ --normal-pressed-background-color: rgb(38, 38, 38);
760
+ --normal-pressed-border-color: rgb(0, 0, 0);
761
+ --normal-focused-background-color: rgb(51, 51, 51);
762
+ --normal-focused-border-color: rgba(87, 121, 162, .500);
763
+ --normal-disabled-background-color: rgba(255, 255, 255, .00);
764
+ --normal-disabled-border-color: rgba(0, 0, 0, .100);
765
+ --normal-activated-background-color: rgb(38, 38, 38);
766
+ --normal-activated-border-color: rgb(0, 0, 0);
767
+ --on-normal-active-color: rgb(242, 242, 242);
768
+ --on-normal-neutral-color: rgba(255, 255, 255, .550);
769
+ --on-normal-disabled-color: rgba(255, 255, 255, .200);
770
+ --raised-enabled-background-color: rgb(125, 125, 125);
771
+ --raised-enabled-border-color: rgb(5, 5, 5);
772
+ --raised-hover-background-color: rgb(140, 140, 140);
773
+ --raised-hover-border-color: rgb(0, 0, 0);
774
+ --raised-pressed-background-color: rgb(112, 112, 112);
775
+ --raised-pressed-border-color: rgb(0, 0, 0);
776
+ --raised-focused-background-color: rgb(125, 125, 125);
777
+ --raised-focused-border-color: rgba(87, 121, 162, .500);
778
+ --raised-disabled-background-color: rgba(0, 0, 0, .00);
779
+ --raised-disabled-border-color: rgba(0, 0, 0, .100);
780
+ --on-raised-active-color: rgb(0, 0, 0);
781
+ --on-raised-neutral-color: rgba(0, 0, 0, .700);
782
+ --on-raised-disabled-color: rgba(255, 255, 255, .200);
783
+ --indent-enabled-background-color: rgba(0, 0, 0, .300);
784
+ --indent-enabled-border-color: rgba(0, 0, 0, .400);
785
+ --indent-hover-background-color: rgba(255, 255, 255, .060);
786
+ --indent-hover-border-color: rgb(15, 15, 15);
787
+ --indent-pressed-background-color: rgba(0, 0, 0, .400);
788
+ --indent-pressed-border-color: rgb(15, 15, 15);
789
+ --indent-focused-background-color: rgba(0, 0, 0, .200);
790
+ --indent-focused-border-color: rgba(87, 121, 162, .500);
791
+ --indent-disabled-background-color: rgba(0, 0, 0, .00);
792
+ --indent-disabled-border-color: rgba(0, 0, 0, .100);
793
+ --on-indent-active-color: rgb(242, 242, 242);
794
+ --on-indent-neutral-color: rgba(255, 255, 255, .550);
795
+ --on-indent-disabled-color: rgba(255, 255, 255, .200);
796
+ --flat-enabled-background-color: rgba(255, 255, 255, .00);
797
+ --flat-enabled-border-color: rgba(0, 0, 0, .00);
798
+ --flat-hover-background-color: rgba(255, 255, 255, .060);
799
+ --flat-hover-border-color: rgba(0, 0, 0, .00);
800
+ --flat-pressed-background-color: rgba(255, 255, 255, .120);
801
+ --flat-pressed-border-color: rgba(0, 0, 0, .00);
802
+ --flat-focused-background-color: rgba(255, 255, 255, .00);
803
+ --flat-focused-border-color: rgba(87, 121, 162, .500);
804
+ --flat-disabled-background-color: rgba(0, 0, 0, .00);
805
+ --flat-disabled-border-color: rgba(0, 0, 0, .00);
806
+ --flat-activated-background-color: rgba(0, 0, 0, .050);
807
+ --flat-activated-border-color: rgba(0, 0, 0, .00);
808
+ --flat-checked-background-color: rgba(48, 87, 146, .100);
809
+ --flat-checked-border-color: rgba(15, 74, 163, .00);
810
+ --on-flat-active-color: rgb(242, 242, 242);
811
+ --on-flat-neutral-color: rgba(255, 255, 255, .550);
812
+ --on-flat-disabled-color: rgba(255, 255, 255, .200);
813
+ --selected-enabled-background-color: rgb(74, 123, 165);
814
+ --selected-enabled-border-color: rgb(0, 0, 0);
815
+ --selected-hover-background-color: rgb(97, 144, 184);
816
+ --selected-hover-border-color: rgb(0, 0, 0);
817
+ --selected-pressed-background-color: rgb(62, 102, 137);
818
+ --selected-pressed-border-color: rgb(0, 0, 0);
819
+ --selected-focused-background-color: rgb(74, 123, 165);
820
+ --selected-focused-border-color: rgba(87, 121, 162, .500);
821
+ --selected-disabled-background-color: rgba(0, 0, 0, .200);
822
+ --selected-disabled-border-color: rgba(0, 0, 0, .00);
823
+ --on-selected-active-color: rgb(255, 255, 255);
824
+ --on-selected-neutral-color: rgba(255, 255, 255, .550);
825
+ --on-selected-disabled-color: rgba(0, 0, 0, .300);
826
+ --thumb-enabled-background-color: rgb(51, 51, 51);
827
+ --thumb-enabled-border-color: rgb(0, 0, 0);
828
+ --thumb-hover-background-color: rgb(64, 64, 64);
829
+ --thumb-hover-border-color: rgb(0, 0, 0);
830
+ --thumb-pressed-background-color: rgb(92, 92, 92);
831
+ --thumb-pressed-border-color: rgb(0, 0, 0);
832
+ --thumb-focused-background-color: rgb(61, 61, 61);
833
+ --thumb-focused-border-color: rgba(87, 121, 162, .500);
834
+ --thumb-disabled-background-color: rgb(50, 50, 50);
835
+ --thumb-disabled-border-color: rgba(0, 0, 0, .00);
836
+ --on-thumb-active-color: rgb(242, 242, 242);
837
+ --on-thumb-neutral-color: rgba(255, 255, 255, .550);
838
+ --on-thumb-disabled-color: rgba(255, 255, 255, .200);
839
+ --amplified-enabled-background-color: rgba(56, 122, 168, .100);
840
+ --amplified-enabled-border-color: rgba(0, 0, 0, .00);
841
+ --amplified-hover-background-color: rgba(56, 122, 168, .160);
842
+ --amplified-hover-border-color: rgba(0, 0, 0, .00);
843
+ --amplified-pressed-background-color: rgba(56, 122, 168, .080);
844
+ --amplified-pressed-border-color: rgba(0, 0, 0, .00);
845
+ --amplified-focused-background-color: rgba(56, 122, 168, .100);
846
+ --amplified-focused-border-color: rgba(56, 122, 168, .500);
847
+ --amplified-disabled-background-color: rgba(0, 0, 0, .100);
848
+ --amplified-disabled-border-color: rgba(0, 0, 0, .00);
849
+ --on-amplified-active-color: rgb(242, 242, 242);
850
+ --on-amplified-neutral-color: rgba(255, 255, 255, .550);
851
+ --on-amplified-disabled-color: rgba(255, 255, 255, .200);
852
+ --device-enabled-background-color: rgb(31, 31, 31);
853
+ --device-enabled-border-color: rgb(26, 26, 26);
854
+ --device-hover-background-color: rgb(46, 46, 46);
855
+ --device-hover-border-color: rgb(26, 26, 26);
856
+ --device-pressed-background-color: rgb(61, 61, 61);
857
+ --device-pressed-border-color: rgb(26, 26, 26);
858
+ --device-focused-background-color: rgb(31, 31, 31);
859
+ --device-focused-border-color: rgba(87, 121, 162, .500);
860
+ --device-disabled-background-color: rgba(0, 0, 0, .00);
861
+ --device-disabled-border-color: rgba(0, 0, 0, .050);
862
+ --on-device-active-color: rgb(255, 255, 255);
863
+ --on-device-neutral-color: rgb(123, 123, 123);
864
+ --on-device-disabled-color: rgb(84, 84, 84);
865
+ --notification-enabled-background-color: rgb(94, 213, 253);
866
+ --notification-enabled-border-color: rgba(0, 0, 0, .500);
867
+ --notification-hover-background-color: rgb(154, 229, 254);
868
+ --notification-hover-border-color: rgba(0, 0, 0, .100);
869
+ --notification-pressed-background-color: rgb(17, 163, 212);
870
+ --notification-pressed-border-color: rgba(0, 0, 0, .200);
871
+ --notification-focused-background-color: rgb(94, 213, 253);
872
+ --notification-focused-border-color: rgb(247, 247, 247);
873
+ --notification-disabled-background-color: rgb(94, 213, 253);
874
+ --notification-disabled-border-color: rgba(0, 0, 0, .00);
875
+ --on-notification-active-color: rgb(0, 0, 0);
876
+ --on-notification-neutral-color: rgba(0, 0, 0, .600);
877
+ --on-notification-disabled-color: rgba(0, 0, 0, .200);
878
+ --running-enabled-background-color: rgb(19, 138, 0);
879
+ --running-enabled-border-color: rgba(0, 0, 0, .100);
880
+ --running-hover-background-color: rgb(23, 168, 0);
881
+ --running-hover-border-color: rgba(0, 0, 0, .100);
882
+ --running-pressed-background-color: rgb(15, 107, 0);
883
+ --running-pressed-border-color: rgba(0, 0, 0, .200);
884
+ --running-focused-background-color: rgb(19, 138, 0);
885
+ --running-focused-border-color: rgb(247, 247, 247);
886
+ --running-disabled-background-color: rgb(19, 138, 0);
887
+ --running-disabled-border-color: rgba(0, 0, 0, .00);
888
+ --on-running-active-color: rgb(255, 255, 255);
889
+ --on-running-neutral-color: rgba(255, 255, 255, .600);
890
+ --on-running-disabled-color: rgba(255, 255, 255, .200);
891
+ --caution-enabled-background-color: rgb(237, 206, 6);
892
+ --caution-enabled-border-color: rgb(20, 20, 20);
893
+ --caution-hover-background-color: rgb(250, 222, 46);
894
+ --caution-hover-border-color: rgb(20, 20, 20);
895
+ --caution-pressed-background-color: rgb(199, 173, 5);
896
+ --caution-pressed-border-color: rgb(20, 20, 20);
897
+ --caution-focused-background-color: rgb(237, 206, 6);
898
+ --caution-focused-border-color: rgb(247, 247, 247);
899
+ --caution-disabled-background-color: rgb(237, 206, 6);
900
+ --caution-disabled-border-color: rgba(0, 0, 0, .00);
901
+ --on-caution-active-color: rgba(0, 0, 0, .900);
902
+ --on-caution-neutral-color: rgba(0, 0, 0, .600);
903
+ --on-caution-disabled-color: rgba(0, 0, 0, .300);
904
+ --warning-enabled-background-color: rgb(246, 148, 0);
905
+ --warning-enabled-border-color: rgba(0, 0, 0, .100);
906
+ --warning-hover-background-color: rgb(255, 166, 31);
907
+ --warning-hover-border-color: rgba(0, 0, 0, .100);
908
+ --warning-pressed-background-color: rgb(204, 123, 0);
909
+ --warning-pressed-border-color: rgba(0, 0, 0, .200);
910
+ --warning-focused-background-color: rgb(246, 148, 0);
911
+ --warning-focused-border-color: rgb(247, 247, 247);
912
+ --warning-disabled-background-color: rgb(246, 148, 0);
913
+ --warning-disabled-border-color: rgba(0, 0, 0, .00);
914
+ --on-warning-active-color: rgba(0, 0, 0, .900);
915
+ --on-warning-neutral-color: rgba(0, 0, 0, .600);
916
+ --on-warning-disabled-color: rgba(0, 0, 0, .300);
917
+ --alarm-enabled-background-color: rgb(229, 38, 38);
918
+ --alarm-enabled-border-color: rgb(20, 20, 20);
919
+ --alarm-hover-background-color: rgb(232, 64, 64);
920
+ --alarm-hover-border-color: rgb(20, 20, 20);
921
+ --alarm-pressed-background-color: rgb(200, 24, 24);
922
+ --alarm-pressed-border-color: rgb(20, 20, 20);
923
+ --alarm-focused-background-color: rgb(229, 38, 38);
924
+ --alarm-focused-border-color: rgb(247, 247, 247);
925
+ --alarm-disabled-background-color: rgb(229, 38, 38);
926
+ --alarm-disabled-border-color: rgba(0, 0, 0, .00);
927
+ --on-alarm-active-color: rgb(255, 255, 255);
928
+ --on-alarm-neutral-color: rgba(255, 255, 255, .650);
929
+ --on-alarm-disabled-color: rgba(0, 0, 0, .300);
930
+ --critical-alarm-enabled-background-color: rgb(201, 0, 202);
931
+ --critical-alarm-enabled-border-color: rgba(0, 0, 0, .100);
932
+ --critical-alarm-hover-background-color: rgb(152, 0, 153);
933
+ --critical-alarm-hover-border-color: rgba(0, 0, 0, .100);
934
+ --critical-alarm-pressed-background-color: rgb(102, 0, 102);
935
+ --critical-alarm-pressed-border-color: rgba(0, 0, 0, .200);
936
+ --critical-alarm-focused-background-color: rgb(201, 0, 202);
937
+ --critical-alarm-focused-border-color: rgb(247, 247, 247);
938
+ --critical-alarm-disabled-background-color: rgb(201, 0, 202);
939
+ --critical-alarm-disabled-border-color: rgba(0, 0, 0, .00);
940
+ --on-critical-alarm-active-color: rgb(255, 255, 255);
941
+ --on-critical-alarm-neutral-color: rgba(255, 255, 255, .700);
942
+ --on-critical-alarm-disabled-color: rgba(255, 255, 255, .300);
943
+ --font-ui-title-size: 24px;
944
+ --font-ui-title-weight: bold;
945
+ --font-ui-title-line-height: 32px;
946
+ --font-ui-subtitle-size: 24px;
947
+ --font-ui-subtitle-weight: regular;
948
+ --font-ui-subtitle-line-height: 32px;
949
+ --font-ui-overline-size: 12px;
950
+ --font-ui-overline-weight: semibold;
951
+ --font-ui-overline-line-height: 24px;
952
+ --font-ui-button-size: 16px;
953
+ --font-ui-button-weight: semibold;
954
+ --font-ui-button-line-height: 24px;
955
+ --font-ui-body-active-size: 16px;
956
+ --font-ui-body-active-weight: bold;
957
+ --font-ui-body-active-line-height: 24px;
958
+ --font-ui-body-size: 16px;
959
+ --font-ui-body-weight: regular;
960
+ --font-ui-body-line-height: 24px;
961
+ --font-ui-label-active-size: 12px;
962
+ --font-ui-label-active-weight: bold;
963
+ --font-ui-label-active-line-height: 16px;
964
+ --font-ui-label-size: 12px;
965
+ --font-ui-label-weight: regular;
966
+ --font-ui-label-line-height: 16px;
967
+ --font-instrument-label-s-size: 16px;
968
+ --font-instrument-label-s-weight: regular;
969
+ --font-instrument-label-s-line-height: 24px;
970
+ --font-instrument-label-m-size: 32px;
971
+ --font-instrument-label-m-weight: regular;
972
+ --font-instrument-label-m-line-height: 40px;
973
+ --font-instrument-label-l-size: 64px;
974
+ --font-instrument-label-l-weight: regular;
975
+ --font-instrument-label-l-line-height: 80px;
976
+ --font-instrument-value-s-size: 16px;
977
+ --font-instrument-value-s-weight: semibold;
978
+ --font-instrument-value-s-line-height: 24px;
979
+ --font-instrument-value-s-enhanced-size: 24px;
980
+ --font-instrument-value-s-enhanced-weight: semibold;
981
+ --font-instrument-value-s-enhanced-line-height: 32px;
982
+ --font-instrument-value-m-size: 32px;
983
+ --font-instrument-value-m-weight: semibold;
984
+ --font-instrument-value-m-line-height: 40px;
985
+ --font-instrument-value-m-enhanced-size: 48px;
986
+ --font-instrument-value-m-enhanced-weight: semibold;
987
+ --font-instrument-value-m-enhanced-line-height: 64px;
988
+ --font-instrument-value-l-size: 64px;
989
+ --font-instrument-value-l-weight: semibold;
990
+ --font-instrument-value-l-line-height: 80px;
991
+ --font-instrument-value-l-enhanced-size: 96px;
992
+ --font-instrument-value-l-enhanced-weight: semibold;
993
+ --font-instrument-value-l-enhanced-line-height: 128px;
994
+ --font-instrument-unit-s-size: 16px;
995
+ --font-instrument-unit-s-weight: regular;
996
+ --font-instrument-unit-s-line-height: 24px;
997
+ --font-instrument-unit-m-size: 32px;
998
+ --font-instrument-unit-m-weight: regular;
999
+ --font-instrument-unit-m-line-height: 40px;
1000
+ --font-instrument-unit-l-size: 64px;
1001
+ --font-instrument-unit-l-weight: regular;
1002
+ --font-instrument-unit-l-line-height: 80px;
1003
+ --font-instrument-status-s-size: 16px;
1004
+ --font-instrument-status-s-weight: regular;
1005
+ --font-instrument-status-s-line-height: 24px;
1006
+ --font-instrument-status-m-size: 32px;
1007
+ --font-instrument-status-m-weight: regular;
1008
+ --font-instrument-status-m-line-height: 40px;
1009
+ --font-instrument-status-l-size: 64px;
1010
+ --font-instrument-status-l-weight: regular;
1011
+ --font-instrument-status-l-line-height: 80px;
1012
+ --shadow-flat: 0px 1px 1px 0px rgba(0, 0, 0, .600);
1013
+ --shadow-raised: 0px 2px 4px 0px rgba(0, 0, 0, .700);
1014
+ --shadow-floating: 0px 4px 16px 0px rgba(0, 0, 0, .600);
1015
+ --shadow-overlay: 0px 8px 32px 0px rgba(0, 0, 0, .800);
1016
1016
 
1017
- --icon-02-chevron-up: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M6 14.0002L7.41 15.4102L12 10.8302L16.59 15.4102L18 14.0002L12 8.00016L6 14.0002Z" fill="rgba(255, 255, 255, .550)"/></svg>');
1018
- --icon-02-chevron-down: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M18 9.41L16.59 8L12 12.58L7.41 8L6 9.41L12 15.41L18 9.41Z" fill="rgba(255, 255, 255, .550)"/></svg>');
1019
- }
1017
+ --icon-02-chevron-up: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M6 14.0002L7.41 15.4102L12 10.8302L16.59 15.4102L18 14.0002L12 8.00016L6 14.0002Z" fill="rgba(255, 255, 255, .550)"/></svg>');
1018
+ --icon-02-chevron-down: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M18 9.41L16.59 8L12 12.58L7.41 8L6 9.41L12 15.41L18 9.41Z" fill="rgba(255, 255, 255, .550)"/></svg>');
1019
+ }
1020
1020
 
1021
1021
 
1022
- :root[data-obc-theme=night] {
1023
- --element-active-color: rgb(71, 71, 0);
1024
- --element-neutral-color: rgba(71, 71, 0, .650);
1025
- --element-inactive-color: rgba(71, 71, 0, .450);
1026
- --element-disabled-color: rgba(71, 71, 0, .250);
1027
- --element-active-inverted-color: rgb(0, 0, 0);
1028
- --element-neutral-inverted-color: rgba(0, 0, 0, .600);
1029
- --element-inactive-inverted-color: rgba(0, 0, 0, .400);
1030
- --element-disabled-inverted-color: rgba(0, 0, 0, .200);
1031
- --container-backdrop-color: rgb(5, 5, 0);
1032
- --container-section-color: rgb(0, 0, 0);
1033
- --container-background-color: rgb(0, 0, 0);
1034
- --container-global-color: rgb(10, 10, 0);
1035
- --container-overlay-color: rgba(0, 0, 0, .300);
1036
- --border-divider-color: rgba(71, 71, 0, .200);
1037
- --border-outline-color: rgba(71, 71, 0, .200);
1038
- --border-edge-color: rgba(71, 71, 0, .100);
1039
- --border-silhouette-color: rgb(0, 0, 0);
1040
- --border-icon-outline-color: rgba(0, 0, 0, .500);
1041
- --border-solid-color: rgb(46, 46, 0);
1042
- --instrument-enhanced-primary-color: rgb(0, 77, 32);
1043
- --instrument-enhanced-secondary-color: rgb(0, 51, 21);
1044
- --instrument-enhanced-tertiary-color: rgba(0, 51, 17, .200);
1045
- --instrument-regular-primary-color: rgb(71, 71, 0);
1046
- --instrument-regular-secondary-color: rgb(51, 51, 0);
1047
- --instrument-regular-tertiary-color: rgba(51, 51, 0, .150);
1048
- --instrument-frame-primary-color: rgb(10, 10, 0);
1049
- --instrument-frame-secondary-color: rgb(0, 0, 0);
1050
- --instrument-frame-tertiary-color: rgb(33, 36, 0);
1051
- --instrument-tick-mark-primary-color: rgb(71, 71, 0);
1052
- --instrument-tick-mark-secondary-color: rgb(51, 51, 0);
1053
- --instrument-tick-mark-tertiary-color: rgb(36, 36, 0);
1054
- --instrument-starboard-color: rgb(12, 39, 33);
1055
- --instrument-port-color: rgb(43, 18, 27);
1056
- --alert-running-color: rgb(23, 56, 0);
1057
- --alert-caution-color: rgb(92, 69, 0);
1058
- --alert-warning-color: rgb(92, 44, 0);
1059
- --alert-alarm-color: rgb(77, 0, 5);
1060
- --alert-critical-alarm-color: rgb(76, 0, 77);
1061
- --alert-limit-primary-color: rgba(0, 0, 0, .200);
1062
- --alert-limit-secondary-color: rgba(0, 0, 0, .200);
1063
- --automation-device-primary-color: rgb(71, 71, 0);
1064
- --automation-device-secondary-color: rgb(26, 26, 0);
1065
- --automation-device-tertiary-color: rgb(0, 0, 0);
1066
- --automation-device-primary-inverted-color: rgb(0, 0, 0);
1067
- --automation-device-secondary-inverted-color: rgb(10, 10, 0);
1068
- --automation-device-tertiary-inverted-color: rgb(51, 51, 0);
1069
- --automation-pipe-primary-color: rgb(31, 31, 0);
1070
- --automation-pipe-secondary-color: rgb(15, 15, 0);
1071
- --automation-pipe-tertiary-color: rgb(0, 0, 0);
1072
- --automation-pipe-primary-inverted-color: rgb(0, 0, 0);
1073
- --automation-pipe-secondary-inverted-color: rgb(15, 15, 0);
1074
- --automation-pipe-tertiary-inverted-color: rgb(32, 32, 0);
1075
- --automation-pipe-overlay-color: rgba(0, 0, 0, .200);
1076
- --automation-pipe-disabled-color: rgba(0, 0, 0, .100);
1077
- --automation-acid-alkalis: rgb(21, 18, 23);
1078
- --automation-air-ventilation: rgb(20, 20, 20);
1079
- --automation-fire-fighting: rgb(25, 16, 18);
1080
- --automation-flammable-gas: rgb(25, 26, 15);
1081
- --automation-fresh-water: rgb(16, 23, 25);
1082
- --automation-fuel: rgb(27, 20, 13);
1083
- --automation-masses: rgb(23, 20, 17);
1084
- --automation-non-flammable-gas: rgb(31, 34, 27);
1085
- --automation-oil: rgb(30, 26, 11);
1086
- --automation-sea-water: rgb(17, 24, 23);
1087
- --automation-steam: rgb(19, 20, 21);
1088
- --automation-waste-media: rgb(20, 20, 20);
1089
- --normal-enabled-background-color: rgb(0, 0, 0);
1090
- --normal-enabled-border-color: rgb(26, 26, 0);
1091
- --normal-hover-background-color: rgb(0, 0, 0);
1092
- --normal-hover-border-color: rgb(36, 36, 0);
1093
- --normal-pressed-background-color: rgb(0, 0, 0);
1094
- --normal-pressed-border-color: rgb(15, 15, 0);
1095
- --normal-focused-background-color: rgb(0, 0, 0);
1096
- --normal-focused-border-color: rgba(0, 51, 21, .500);
1097
- --normal-disabled-background-color: rgba(255, 255, 255, .00);
1098
- --normal-disabled-border-color: rgb(10, 10, 0);
1099
- --normal-activated-background-color: rgba(71, 71, 0, .120);
1100
- --normal-activated-border-color: rgb(0, 0, 0);
1101
- --on-normal-active-color: rgb(71, 71, 0);
1102
- --on-normal-neutral-color: rgba(71, 71, 0, .650);
1103
- --on-normal-disabled-color: rgba(71, 71, 0, .350);
1104
- --raised-enabled-background-color: rgb(15, 15, 0);
1105
- --raised-enabled-border-color: rgb(26, 26, 0);
1106
- --raised-hover-background-color: rgb(15, 15, 0);
1107
- --raised-hover-border-color: rgb(36, 36, 0);
1108
- --raised-pressed-background-color: rgb(0, 0, 0);
1109
- --raised-pressed-border-color: rgb(15, 15, 0);
1110
- --raised-focused-background-color: rgb(15, 15, 0);
1111
- --raised-focused-border-color: rgba(0, 51, 21, .500);
1112
- --raised-disabled-background-color: rgba(0, 0, 0, .00);
1113
- --raised-disabled-border-color: rgb(10, 10, 0);
1114
- --on-raised-active-color: rgb(71, 71, 0);
1115
- --on-raised-neutral-color: rgb(51, 51, 0);
1116
- --on-raised-disabled-color: rgba(71, 71, 0, .350);
1117
- --indent-enabled-background-color: rgb(0, 0, 0);
1118
- --indent-enabled-border-color: rgba(71, 71, 0, .300);
1119
- --indent-hover-background-color: rgba(0, 0, 0, .00);
1120
- --indent-hover-border-color: rgb(25, 26, 0);
1121
- --indent-pressed-background-color: rgba(0, 0, 0, .00);
1122
- --indent-pressed-border-color: rgb(10, 10, 0);
1123
- --indent-focused-background-color: rgba(0, 0, 0, .00);
1124
- --indent-focused-border-color: rgba(0, 51, 21, .500);
1125
- --indent-disabled-background-color: rgba(0, 0, 0, .00);
1126
- --indent-disabled-border-color: rgba(0, 0, 0, .100);
1127
- --on-indent-active-color: rgb(71, 71, 0);
1128
- --on-indent-neutral-color: rgb(51, 51, 0);
1129
- --on-indent-disabled-color: rgb(18, 18, 0);
1130
- --flat-enabled-background-color: rgba(255, 255, 255, .00);
1131
- --flat-enabled-border-color: rgba(0, 0, 0, .00);
1132
- --flat-hover-background-color: rgba(0, 0, 0, .00);
1133
- --flat-hover-border-color: rgb(26, 26, 0);
1134
- --flat-pressed-background-color: rgba(0, 0, 0, .00);
1135
- --flat-pressed-border-color: rgb(15, 15, 0);
1136
- --flat-focused-background-color: rgba(0, 0, 0, .00);
1137
- --flat-focused-border-color: rgba(0, 51, 21, .500);
1138
- --flat-disabled-background-color: rgba(0, 0, 0, .00);
1139
- --flat-disabled-border-color: rgba(0, 0, 0, .00);
1140
- --flat-activated-background-color: rgb(15, 15, 0);
1141
- --flat-activated-border-color: rgba(0, 0, 0, .00);
1142
- --flat-checked-background-color: rgba(0, 71, 30, .150);
1143
- --flat-checked-border-color: rgba(15, 74, 163, .00);
1144
- --on-flat-active-color: rgb(71, 71, 0);
1145
- --on-flat-neutral-color: rgb(51, 51, 0);
1146
- --on-flat-disabled-color: rgba(97, 107, 46, .200);
1147
- --selected-enabled-background-color: rgb(0, 10, 4);
1148
- --selected-enabled-border-color: rgb(0, 51, 21);
1149
- --selected-hover-background-color: rgb(0, 10, 4);
1150
- --selected-hover-border-color: rgb(0, 61, 26);
1151
- --selected-pressed-background-color: rgb(0, 10, 4);
1152
- --selected-pressed-border-color: rgb(0, 41, 17);
1153
- --selected-focused-background-color: rgb(0, 10, 4);
1154
- --selected-focused-border-color: rgba(0, 51, 21, .500);
1155
- --selected-disabled-background-color: rgb(0, 10, 4);
1156
- --selected-disabled-border-color: rgba(0, 0, 0, .00);
1157
- --on-selected-active-color: rgb(0, 51, 21);
1158
- --on-selected-neutral-color: rgb(0, 36, 15);
1159
- --on-selected-disabled-color: rgb(0, 26, 11);
1160
- --thumb-enabled-background-color: rgb(0, 0, 0);
1161
- --thumb-enabled-border-color: rgb(26, 26, 0);
1162
- --thumb-hover-background-color: rgb(0, 0, 0);
1163
- --thumb-hover-border-color: rgb(36, 36, 0);
1164
- --thumb-pressed-background-color: rgb(7, 7, 7);
1165
- --thumb-pressed-border-color: rgb(15, 15, 0);
1166
- --thumb-focused-background-color: rgb(0, 0, 0);
1167
- --thumb-focused-border-color: rgba(0, 71, 30, .500);
1168
- --thumb-disabled-background-color: rgb(0, 10, 4);
1169
- --thumb-disabled-border-color: rgba(0, 0, 0, .00);
1170
- --on-thumb-active-color: rgb(71, 71, 0);
1171
- --on-thumb-neutral-color: rgb(51, 51, 0);
1172
- --on-thumb-disabled-color: rgb(18, 18, 0);
1173
- --amplified-enabled-background-color: rgba(0, 71, 30, .150);
1174
- --amplified-enabled-border-color: rgba(0, 0, 0, .00);
1175
- --amplified-hover-background-color: rgba(0, 71, 30, .200);
1176
- --amplified-hover-border-color: rgba(0, 0, 0, .00);
1177
- --amplified-pressed-background-color: rgba(0, 71, 30, .080);
1178
- --amplified-pressed-border-color: rgba(0, 0, 0, .00);
1179
- --amplified-focused-background-color: rgba(0, 71, 30, .150);
1180
- --amplified-focused-border-color: rgba(0, 71, 30, .500);
1181
- --amplified-disabled-background-color: rgba(0, 71, 30, .100);
1182
- --amplified-disabled-border-color: rgba(0, 0, 0, .00);
1183
- --on-amplified-active-color: rgb(0, 51, 21);
1184
- --on-amplified-neutral-color: rgb(0, 36, 15);
1185
- --on-amplified-disabled-color: rgb(0, 26, 11);
1186
- --device-enabled-background-color: rgb(31, 31, 0);
1187
- --device-enabled-border-color: rgb(0, 0, 0);
1188
- --device-hover-background-color: rgb(36, 36, 0);
1189
- --device-hover-border-color: rgb(0, 0, 0);
1190
- --device-pressed-background-color: rgb(26, 26, 0);
1191
- --device-pressed-border-color: rgb(0, 0, 0);
1192
- --device-focused-background-color: rgb(31, 31, 0);
1193
- --device-focused-border-color: rgba(0, 71, 30, .500);
1194
- --device-disabled-background-color: rgba(0, 0, 0, .00);
1195
- --device-disabled-border-color: rgba(0, 0, 0, .050);
1196
- --on-device-active-color: rgb(71, 71, 0);
1197
- --on-device-neutral-color: rgb(51, 51, 0);
1198
- --on-device-disabled-color: rgb(18, 18, 0);
1199
- --notification-enabled-background-color: rgb(0, 76, 32);
1200
- --notification-enabled-border-color: rgba(0, 0, 0, .500);
1201
- --notification-hover-background-color: rgb(0, 66, 28);
1202
- --notification-hover-border-color: rgba(0, 0, 0, .100);
1203
- --notification-pressed-background-color: rgb(0, 56, 23);
1204
- --notification-pressed-border-color: rgba(0, 0, 0, .200);
1205
- --notification-focused-background-color: rgb(0, 77, 32);
1206
- --notification-focused-border-color: rgba(0, 51, 21, .500);
1207
- --notification-disabled-background-color: rgb(0, 76, 32);
1208
- --notification-disabled-border-color: rgba(0, 0, 0, .00);
1209
- --on-notification-active-color: rgb(0, 0, 0);
1210
- --on-notification-neutral-color: rgba(0, 0, 0, .600);
1211
- --on-notification-disabled-color: rgba(0, 0, 0, .200);
1212
- --running-enabled-background-color: rgb(23, 56, 0);
1213
- --running-enabled-border-color: rgba(0, 0, 0, .100);
1214
- --running-hover-background-color: rgb(19, 46, 0);
1215
- --running-hover-border-color: rgba(0, 0, 0, .100);
1216
- --running-pressed-background-color: rgb(15, 36, 0);
1217
- --running-pressed-border-color: rgba(0, 0, 0, .200);
1218
- --running-focused-background-color: rgb(23, 56, 0);
1219
- --running-focused-border-color: rgba(0, 51, 21, .500);
1220
- --running-disabled-background-color: rgb(23, 56, 0);
1221
- --running-disabled-border-color: rgba(0, 0, 0, .00);
1222
- --on-running-active-color: rgb(0, 0, 0);
1223
- --on-running-neutral-color: rgba(0, 0, 0, .600);
1224
- --on-running-disabled-color: rgba(0, 0, 0, .200);
1225
- --caution-enabled-background-color: rgb(92, 69, 0);
1226
- --caution-enabled-border-color: rgb(0, 0, 0);
1227
- --caution-hover-background-color: rgb(82, 61, 0);
1228
- --caution-hover-border-color: rgb(0, 0, 0);
1229
- --caution-pressed-background-color: rgb(71, 54, 0);
1230
- --caution-pressed-border-color: rgb(0, 0, 0);
1231
- --caution-focused-background-color: rgb(92, 69, 0);
1232
- --caution-focused-border-color: rgba(0, 51, 21, .500);
1233
- --caution-disabled-background-color: rgb(92, 69, 0);
1234
- --caution-disabled-border-color: rgba(0, 0, 0, .00);
1235
- --on-caution-active-color: rgba(0, 0, 0, .900);
1236
- --on-caution-neutral-color: rgba(0, 0, 0, .600);
1237
- --on-caution-disabled-color: rgba(0, 0, 0, .300);
1238
- --warning-enabled-background-color: rgb(92, 44, 0);
1239
- --warning-enabled-border-color: rgba(0, 0, 0, .100);
1240
- --warning-hover-background-color: rgb(82, 39, 0);
1241
- --warning-hover-border-color: rgba(0, 0, 0, .100);
1242
- --warning-pressed-background-color: rgb(71, 34, 0);
1243
- --warning-pressed-border-color: rgba(0, 0, 0, .200);
1244
- --warning-focused-background-color: rgb(92, 44, 0);
1245
- --warning-focused-border-color: rgba(0, 51, 21, .500);
1246
- --warning-disabled-background-color: rgb(92, 44, 0);
1247
- --warning-disabled-border-color: rgba(0, 0, 0, .00);
1248
- --on-warning-active-color: rgba(0, 0, 0, .900);
1249
- --on-warning-neutral-color: rgba(0, 0, 0, .600);
1250
- --on-warning-disabled-color: rgba(0, 0, 0, .300);
1251
- --alarm-enabled-background-color: rgb(76, 0, 5);
1252
- --alarm-enabled-border-color: rgb(0, 0, 0);
1253
- --alarm-hover-background-color: rgb(66, 0, 4);
1254
- --alarm-hover-border-color: rgb(0, 0, 0);
1255
- --alarm-pressed-background-color: rgb(56, 0, 4);
1256
- --alarm-pressed-border-color: rgb(0, 0, 0);
1257
- --alarm-focused-background-color: rgb(76, 0, 5);
1258
- --alarm-focused-border-color: rgba(0, 51, 21, .500);
1259
- --alarm-disabled-background-color: rgb(76, 0, 5);
1260
- --alarm-disabled-border-color: rgba(0, 0, 0, .00);
1261
- --on-alarm-active-color: rgb(0, 0, 0);
1262
- --on-alarm-neutral-color: rgba(0, 0, 0, .650);
1263
- --on-alarm-disabled-color: rgba(0, 0, 0, .300);
1264
- --critical-alarm-enabled-background-color: rgb(76, 0, 76);
1265
- --critical-alarm-enabled-border-color: rgba(0, 0, 0, .100);
1266
- --critical-alarm-hover-background-color: rgb(66, 0, 66);
1267
- --critical-alarm-hover-border-color: rgba(0, 0, 0, .100);
1268
- --critical-alarm-pressed-background-color: rgb(61, 0, 61);
1269
- --critical-alarm-pressed-border-color: rgba(0, 0, 0, .200);
1270
- --critical-alarm-focused-background-color: rgb(76, 0, 76);
1271
- --critical-alarm-focused-border-color: rgba(0, 51, 21, .500);
1272
- --critical-alarm-disabled-background-color: rgb(76, 0, 76);
1273
- --critical-alarm-disabled-border-color: rgba(0, 0, 0, .00);
1274
- --on-critical-alarm-active-color: rgb(0, 0, 0);
1275
- --on-critical-alarm-neutral-color: rgba(0, 0, 0, .700);
1276
- --on-critical-alarm-disabled-color: rgba(0, 0, 0, .300);
1277
- --font-ui-title-size: 24px;
1278
- --font-ui-title-weight: bold;
1279
- --font-ui-title-line-height: 32px;
1280
- --font-ui-subtitle-size: 24px;
1281
- --font-ui-subtitle-weight: regular;
1282
- --font-ui-subtitle-line-height: 32px;
1283
- --font-ui-overline-size: 12px;
1284
- --font-ui-overline-weight: semibold;
1285
- --font-ui-overline-line-height: 24px;
1286
- --font-ui-button-size: 16px;
1287
- --font-ui-button-weight: semibold;
1288
- --font-ui-button-line-height: 24px;
1289
- --font-ui-body-active-size: 16px;
1290
- --font-ui-body-active-weight: bold;
1291
- --font-ui-body-active-line-height: 24px;
1292
- --font-ui-body-size: 16px;
1293
- --font-ui-body-weight: regular;
1294
- --font-ui-body-line-height: 24px;
1295
- --font-ui-label-active-size: 12px;
1296
- --font-ui-label-active-weight: bold;
1297
- --font-ui-label-active-line-height: 16px;
1298
- --font-ui-label-size: 12px;
1299
- --font-ui-label-weight: regular;
1300
- --font-ui-label-line-height: 16px;
1301
- --font-instrument-label-s-size: 16px;
1302
- --font-instrument-label-s-weight: regular;
1303
- --font-instrument-label-s-line-height: 24px;
1304
- --font-instrument-label-m-size: 32px;
1305
- --font-instrument-label-m-weight: regular;
1306
- --font-instrument-label-m-line-height: 40px;
1307
- --font-instrument-label-l-size: 64px;
1308
- --font-instrument-label-l-weight: regular;
1309
- --font-instrument-label-l-line-height: 80px;
1310
- --font-instrument-value-s-size: 16px;
1311
- --font-instrument-value-s-weight: semibold;
1312
- --font-instrument-value-s-line-height: 24px;
1313
- --font-instrument-value-s-enhanced-size: 24px;
1314
- --font-instrument-value-s-enhanced-weight: semibold;
1315
- --font-instrument-value-s-enhanced-line-height: 32px;
1316
- --font-instrument-value-m-size: 32px;
1317
- --font-instrument-value-m-weight: semibold;
1318
- --font-instrument-value-m-line-height: 40px;
1319
- --font-instrument-value-m-enhanced-size: 48px;
1320
- --font-instrument-value-m-enhanced-weight: semibold;
1321
- --font-instrument-value-m-enhanced-line-height: 64px;
1322
- --font-instrument-value-l-size: 64px;
1323
- --font-instrument-value-l-weight: semibold;
1324
- --font-instrument-value-l-line-height: 80px;
1325
- --font-instrument-value-l-enhanced-size: 96px;
1326
- --font-instrument-value-l-enhanced-weight: semibold;
1327
- --font-instrument-value-l-enhanced-line-height: 128px;
1328
- --font-instrument-unit-s-size: 16px;
1329
- --font-instrument-unit-s-weight: regular;
1330
- --font-instrument-unit-s-line-height: 24px;
1331
- --font-instrument-unit-m-size: 32px;
1332
- --font-instrument-unit-m-weight: regular;
1333
- --font-instrument-unit-m-line-height: 40px;
1334
- --font-instrument-unit-l-size: 64px;
1335
- --font-instrument-unit-l-weight: regular;
1336
- --font-instrument-unit-l-line-height: 80px;
1337
- --font-instrument-status-s-size: 16px;
1338
- --font-instrument-status-s-weight: regular;
1339
- --font-instrument-status-s-line-height: 24px;
1340
- --font-instrument-status-m-size: 32px;
1341
- --font-instrument-status-m-weight: regular;
1342
- --font-instrument-status-m-line-height: 40px;
1343
- --font-instrument-status-l-size: 64px;
1344
- --font-instrument-status-l-weight: regular;
1345
- --font-instrument-status-l-line-height: 80px;
1346
- --shadow-flat: 0px 0px 0px 1px rgb(19, 22, 4);
1347
- --shadow-raised: 0px 0px 0px 1px rgb(19, 22, 4);
1348
- --shadow-floating: 0px 0px 0px 1px rgb(27, 31, 10);
1349
- --shadow-overlay: 0px 0px 0px 1px rgb(30, 35, 6);
1022
+ :root[data-obc-theme=night] {
1023
+ --element-active-color: rgb(71, 71, 0);
1024
+ --element-neutral-color: rgba(71, 71, 0, .650);
1025
+ --element-inactive-color: rgba(71, 71, 0, .450);
1026
+ --element-disabled-color: rgba(71, 71, 0, .250);
1027
+ --element-active-inverted-color: rgb(0, 0, 0);
1028
+ --element-neutral-inverted-color: rgba(0, 0, 0, .600);
1029
+ --element-inactive-inverted-color: rgba(0, 0, 0, .400);
1030
+ --element-disabled-inverted-color: rgba(0, 0, 0, .200);
1031
+ --container-backdrop-color: rgb(5, 5, 0);
1032
+ --container-section-color: rgb(0, 0, 0);
1033
+ --container-background-color: rgb(0, 0, 0);
1034
+ --container-global-color: rgb(10, 10, 0);
1035
+ --container-overlay-color: rgba(0, 0, 0, .300);
1036
+ --border-divider-color: rgba(71, 71, 0, .200);
1037
+ --border-outline-color: rgba(71, 71, 0, .200);
1038
+ --border-edge-color: rgba(71, 71, 0, .100);
1039
+ --border-silhouette-color: rgb(0, 0, 0);
1040
+ --border-icon-outline-color: rgba(0, 0, 0, .500);
1041
+ --border-solid-color: rgb(46, 46, 0);
1042
+ --instrument-enhanced-primary-color: rgb(0, 77, 32);
1043
+ --instrument-enhanced-secondary-color: rgb(0, 51, 21);
1044
+ --instrument-enhanced-tertiary-color: rgb(0, 10, 3);
1045
+ --instrument-regular-primary-color: rgb(71, 71, 0);
1046
+ --instrument-regular-secondary-color: rgb(51, 51, 0);
1047
+ --instrument-regular-tertiary-color: rgba(51, 51, 0, .150);
1048
+ --instrument-frame-primary-color: rgb(10, 10, 0);
1049
+ --instrument-frame-secondary-color: rgb(0, 0, 0);
1050
+ --instrument-frame-tertiary-color: rgb(33, 36, 0);
1051
+ --instrument-tick-mark-primary-color: rgb(71, 71, 0);
1052
+ --instrument-tick-mark-secondary-color: rgb(51, 51, 0);
1053
+ --instrument-tick-mark-tertiary-color: rgb(36, 36, 0);
1054
+ --instrument-starboard-color: rgb(12, 39, 33);
1055
+ --instrument-port-color: rgb(43, 18, 27);
1056
+ --alert-running-color: rgb(23, 56, 0);
1057
+ --alert-caution-color: rgb(92, 69, 0);
1058
+ --alert-warning-color: rgb(92, 44, 0);
1059
+ --alert-alarm-color: rgb(77, 0, 5);
1060
+ --alert-critical-alarm-color: rgb(76, 0, 77);
1061
+ --alert-limit-primary-color: rgba(0, 0, 0, .200);
1062
+ --alert-limit-secondary-color: rgba(0, 0, 0, .200);
1063
+ --automation-device-primary-color: rgb(71, 71, 0);
1064
+ --automation-device-secondary-color: rgb(26, 26, 0);
1065
+ --automation-device-tertiary-color: rgb(0, 0, 0);
1066
+ --automation-device-primary-inverted-color: rgb(0, 0, 0);
1067
+ --automation-device-secondary-inverted-color: rgb(10, 10, 0);
1068
+ --automation-device-tertiary-inverted-color: rgb(51, 51, 0);
1069
+ --automation-pipe-primary-color: rgb(31, 31, 0);
1070
+ --automation-pipe-secondary-color: rgb(15, 15, 0);
1071
+ --automation-pipe-tertiary-color: rgb(0, 0, 0);
1072
+ --automation-pipe-primary-inverted-color: rgb(0, 0, 0);
1073
+ --automation-pipe-secondary-inverted-color: rgb(15, 15, 0);
1074
+ --automation-pipe-tertiary-inverted-color: rgb(32, 32, 0);
1075
+ --automation-pipe-overlay-color: rgba(0, 0, 0, .200);
1076
+ --automation-pipe-disabled-color: rgba(0, 0, 0, .100);
1077
+ --automation-acid-alkalis: rgb(21, 18, 23);
1078
+ --automation-air-ventilation: rgb(20, 20, 20);
1079
+ --automation-fire-fighting: rgb(25, 16, 18);
1080
+ --automation-flammable-gas: rgb(25, 26, 15);
1081
+ --automation-fresh-water: rgb(16, 23, 25);
1082
+ --automation-fuel: rgb(27, 20, 13);
1083
+ --automation-masses: rgb(23, 20, 17);
1084
+ --automation-non-flammable-gas: rgb(31, 34, 27);
1085
+ --automation-oil: rgb(30, 26, 11);
1086
+ --automation-sea-water: rgb(17, 24, 23);
1087
+ --automation-steam: rgb(19, 20, 21);
1088
+ --automation-waste-media: rgb(20, 20, 20);
1089
+ --normal-enabled-background-color: rgb(0, 0, 0);
1090
+ --normal-enabled-border-color: rgb(26, 26, 0);
1091
+ --normal-hover-background-color: rgb(0, 0, 0);
1092
+ --normal-hover-border-color: rgb(36, 36, 0);
1093
+ --normal-pressed-background-color: rgb(0, 0, 0);
1094
+ --normal-pressed-border-color: rgb(15, 15, 0);
1095
+ --normal-focused-background-color: rgb(0, 0, 0);
1096
+ --normal-focused-border-color: rgba(0, 51, 21, .500);
1097
+ --normal-disabled-background-color: rgba(255, 255, 255, .00);
1098
+ --normal-disabled-border-color: rgb(10, 10, 0);
1099
+ --normal-activated-background-color: rgba(71, 71, 0, .120);
1100
+ --normal-activated-border-color: rgb(0, 0, 0);
1101
+ --on-normal-active-color: rgb(71, 71, 0);
1102
+ --on-normal-neutral-color: rgba(71, 71, 0, .650);
1103
+ --on-normal-disabled-color: rgba(71, 71, 0, .350);
1104
+ --raised-enabled-background-color: rgb(15, 15, 0);
1105
+ --raised-enabled-border-color: rgb(26, 26, 0);
1106
+ --raised-hover-background-color: rgb(15, 15, 0);
1107
+ --raised-hover-border-color: rgb(36, 36, 0);
1108
+ --raised-pressed-background-color: rgb(0, 0, 0);
1109
+ --raised-pressed-border-color: rgb(15, 15, 0);
1110
+ --raised-focused-background-color: rgb(15, 15, 0);
1111
+ --raised-focused-border-color: rgba(0, 51, 21, .500);
1112
+ --raised-disabled-background-color: rgba(0, 0, 0, .00);
1113
+ --raised-disabled-border-color: rgb(10, 10, 0);
1114
+ --on-raised-active-color: rgb(71, 71, 0);
1115
+ --on-raised-neutral-color: rgb(51, 51, 0);
1116
+ --on-raised-disabled-color: rgba(71, 71, 0, .350);
1117
+ --indent-enabled-background-color: rgb(0, 0, 0);
1118
+ --indent-enabled-border-color: rgba(71, 71, 0, .300);
1119
+ --indent-hover-background-color: rgba(0, 0, 0, .00);
1120
+ --indent-hover-border-color: rgb(25, 26, 0);
1121
+ --indent-pressed-background-color: rgba(0, 0, 0, .00);
1122
+ --indent-pressed-border-color: rgb(10, 10, 0);
1123
+ --indent-focused-background-color: rgba(0, 0, 0, .00);
1124
+ --indent-focused-border-color: rgba(0, 51, 21, .500);
1125
+ --indent-disabled-background-color: rgba(0, 0, 0, .00);
1126
+ --indent-disabled-border-color: rgba(0, 0, 0, .100);
1127
+ --on-indent-active-color: rgb(71, 71, 0);
1128
+ --on-indent-neutral-color: rgb(51, 51, 0);
1129
+ --on-indent-disabled-color: rgb(18, 18, 0);
1130
+ --flat-enabled-background-color: rgba(255, 255, 255, .00);
1131
+ --flat-enabled-border-color: rgba(0, 0, 0, .00);
1132
+ --flat-hover-background-color: rgba(0, 0, 0, .00);
1133
+ --flat-hover-border-color: rgb(26, 26, 0);
1134
+ --flat-pressed-background-color: rgba(0, 0, 0, .00);
1135
+ --flat-pressed-border-color: rgb(15, 15, 0);
1136
+ --flat-focused-background-color: rgba(0, 0, 0, .00);
1137
+ --flat-focused-border-color: rgba(0, 51, 21, .500);
1138
+ --flat-disabled-background-color: rgba(0, 0, 0, .00);
1139
+ --flat-disabled-border-color: rgba(0, 0, 0, .00);
1140
+ --flat-activated-background-color: rgb(15, 15, 0);
1141
+ --flat-activated-border-color: rgba(0, 0, 0, .00);
1142
+ --flat-checked-background-color: rgba(0, 71, 30, .150);
1143
+ --flat-checked-border-color: rgba(15, 74, 163, .00);
1144
+ --on-flat-active-color: rgb(71, 71, 0);
1145
+ --on-flat-neutral-color: rgb(51, 51, 0);
1146
+ --on-flat-disabled-color: rgba(97, 107, 46, .200);
1147
+ --selected-enabled-background-color: rgb(0, 10, 4);
1148
+ --selected-enabled-border-color: rgb(0, 51, 21);
1149
+ --selected-hover-background-color: rgb(0, 10, 4);
1150
+ --selected-hover-border-color: rgb(0, 61, 26);
1151
+ --selected-pressed-background-color: rgb(0, 10, 4);
1152
+ --selected-pressed-border-color: rgb(0, 41, 17);
1153
+ --selected-focused-background-color: rgb(0, 10, 4);
1154
+ --selected-focused-border-color: rgba(0, 51, 21, .500);
1155
+ --selected-disabled-background-color: rgb(0, 10, 4);
1156
+ --selected-disabled-border-color: rgba(0, 0, 0, .00);
1157
+ --on-selected-active-color: rgb(0, 51, 21);
1158
+ --on-selected-neutral-color: rgb(0, 36, 15);
1159
+ --on-selected-disabled-color: rgb(0, 26, 11);
1160
+ --thumb-enabled-background-color: rgb(0, 0, 0);
1161
+ --thumb-enabled-border-color: rgb(26, 26, 0);
1162
+ --thumb-hover-background-color: rgb(0, 0, 0);
1163
+ --thumb-hover-border-color: rgb(36, 36, 0);
1164
+ --thumb-pressed-background-color: rgb(7, 7, 7);
1165
+ --thumb-pressed-border-color: rgb(15, 15, 0);
1166
+ --thumb-focused-background-color: rgb(0, 0, 0);
1167
+ --thumb-focused-border-color: rgba(0, 71, 30, .500);
1168
+ --thumb-disabled-background-color: rgb(0, 10, 4);
1169
+ --thumb-disabled-border-color: rgba(0, 0, 0, .00);
1170
+ --on-thumb-active-color: rgb(71, 71, 0);
1171
+ --on-thumb-neutral-color: rgb(51, 51, 0);
1172
+ --on-thumb-disabled-color: rgb(18, 18, 0);
1173
+ --amplified-enabled-background-color: rgba(0, 71, 30, .150);
1174
+ --amplified-enabled-border-color: rgba(0, 0, 0, .00);
1175
+ --amplified-hover-background-color: rgba(0, 71, 30, .200);
1176
+ --amplified-hover-border-color: rgba(0, 0, 0, .00);
1177
+ --amplified-pressed-background-color: rgba(0, 71, 30, .080);
1178
+ --amplified-pressed-border-color: rgba(0, 0, 0, .00);
1179
+ --amplified-focused-background-color: rgba(0, 71, 30, .150);
1180
+ --amplified-focused-border-color: rgba(0, 71, 30, .500);
1181
+ --amplified-disabled-background-color: rgba(0, 71, 30, .100);
1182
+ --amplified-disabled-border-color: rgba(0, 0, 0, .00);
1183
+ --on-amplified-active-color: rgb(0, 51, 21);
1184
+ --on-amplified-neutral-color: rgb(0, 36, 15);
1185
+ --on-amplified-disabled-color: rgb(0, 26, 11);
1186
+ --device-enabled-background-color: rgb(31, 31, 0);
1187
+ --device-enabled-border-color: rgb(0, 0, 0);
1188
+ --device-hover-background-color: rgb(36, 36, 0);
1189
+ --device-hover-border-color: rgb(0, 0, 0);
1190
+ --device-pressed-background-color: rgb(26, 26, 0);
1191
+ --device-pressed-border-color: rgb(0, 0, 0);
1192
+ --device-focused-background-color: rgb(31, 31, 0);
1193
+ --device-focused-border-color: rgba(0, 71, 30, .500);
1194
+ --device-disabled-background-color: rgba(0, 0, 0, .00);
1195
+ --device-disabled-border-color: rgba(0, 0, 0, .050);
1196
+ --on-device-active-color: rgb(71, 71, 0);
1197
+ --on-device-neutral-color: rgb(51, 51, 0);
1198
+ --on-device-disabled-color: rgb(18, 18, 0);
1199
+ --notification-enabled-background-color: rgb(0, 76, 32);
1200
+ --notification-enabled-border-color: rgba(0, 0, 0, .500);
1201
+ --notification-hover-background-color: rgb(0, 66, 28);
1202
+ --notification-hover-border-color: rgba(0, 0, 0, .100);
1203
+ --notification-pressed-background-color: rgb(0, 56, 23);
1204
+ --notification-pressed-border-color: rgba(0, 0, 0, .200);
1205
+ --notification-focused-background-color: rgb(0, 77, 32);
1206
+ --notification-focused-border-color: rgba(0, 51, 21, .500);
1207
+ --notification-disabled-background-color: rgb(0, 76, 32);
1208
+ --notification-disabled-border-color: rgba(0, 0, 0, .00);
1209
+ --on-notification-active-color: rgb(0, 0, 0);
1210
+ --on-notification-neutral-color: rgba(0, 0, 0, .600);
1211
+ --on-notification-disabled-color: rgba(0, 0, 0, .200);
1212
+ --running-enabled-background-color: rgb(23, 56, 0);
1213
+ --running-enabled-border-color: rgba(0, 0, 0, .100);
1214
+ --running-hover-background-color: rgb(19, 46, 0);
1215
+ --running-hover-border-color: rgba(0, 0, 0, .100);
1216
+ --running-pressed-background-color: rgb(15, 36, 0);
1217
+ --running-pressed-border-color: rgba(0, 0, 0, .200);
1218
+ --running-focused-background-color: rgb(23, 56, 0);
1219
+ --running-focused-border-color: rgba(0, 51, 21, .500);
1220
+ --running-disabled-background-color: rgb(23, 56, 0);
1221
+ --running-disabled-border-color: rgba(0, 0, 0, .00);
1222
+ --on-running-active-color: rgb(0, 0, 0);
1223
+ --on-running-neutral-color: rgba(0, 0, 0, .600);
1224
+ --on-running-disabled-color: rgba(0, 0, 0, .200);
1225
+ --caution-enabled-background-color: rgb(92, 69, 0);
1226
+ --caution-enabled-border-color: rgb(0, 0, 0);
1227
+ --caution-hover-background-color: rgb(82, 61, 0);
1228
+ --caution-hover-border-color: rgb(0, 0, 0);
1229
+ --caution-pressed-background-color: rgb(71, 54, 0);
1230
+ --caution-pressed-border-color: rgb(0, 0, 0);
1231
+ --caution-focused-background-color: rgb(92, 69, 0);
1232
+ --caution-focused-border-color: rgba(0, 51, 21, .500);
1233
+ --caution-disabled-background-color: rgb(92, 69, 0);
1234
+ --caution-disabled-border-color: rgba(0, 0, 0, .00);
1235
+ --on-caution-active-color: rgba(0, 0, 0, .900);
1236
+ --on-caution-neutral-color: rgba(0, 0, 0, .600);
1237
+ --on-caution-disabled-color: rgba(0, 0, 0, .300);
1238
+ --warning-enabled-background-color: rgb(92, 44, 0);
1239
+ --warning-enabled-border-color: rgba(0, 0, 0, .100);
1240
+ --warning-hover-background-color: rgb(82, 39, 0);
1241
+ --warning-hover-border-color: rgba(0, 0, 0, .100);
1242
+ --warning-pressed-background-color: rgb(71, 34, 0);
1243
+ --warning-pressed-border-color: rgba(0, 0, 0, .200);
1244
+ --warning-focused-background-color: rgb(92, 44, 0);
1245
+ --warning-focused-border-color: rgba(0, 51, 21, .500);
1246
+ --warning-disabled-background-color: rgb(92, 44, 0);
1247
+ --warning-disabled-border-color: rgba(0, 0, 0, .00);
1248
+ --on-warning-active-color: rgba(0, 0, 0, .900);
1249
+ --on-warning-neutral-color: rgba(0, 0, 0, .600);
1250
+ --on-warning-disabled-color: rgba(0, 0, 0, .300);
1251
+ --alarm-enabled-background-color: rgb(76, 0, 5);
1252
+ --alarm-enabled-border-color: rgb(0, 0, 0);
1253
+ --alarm-hover-background-color: rgb(66, 0, 4);
1254
+ --alarm-hover-border-color: rgb(0, 0, 0);
1255
+ --alarm-pressed-background-color: rgb(56, 0, 4);
1256
+ --alarm-pressed-border-color: rgb(0, 0, 0);
1257
+ --alarm-focused-background-color: rgb(76, 0, 5);
1258
+ --alarm-focused-border-color: rgba(0, 51, 21, .500);
1259
+ --alarm-disabled-background-color: rgb(76, 0, 5);
1260
+ --alarm-disabled-border-color: rgba(0, 0, 0, .00);
1261
+ --on-alarm-active-color: rgb(0, 0, 0);
1262
+ --on-alarm-neutral-color: rgba(0, 0, 0, .650);
1263
+ --on-alarm-disabled-color: rgba(0, 0, 0, .300);
1264
+ --critical-alarm-enabled-background-color: rgb(76, 0, 76);
1265
+ --critical-alarm-enabled-border-color: rgba(0, 0, 0, .100);
1266
+ --critical-alarm-hover-background-color: rgb(66, 0, 66);
1267
+ --critical-alarm-hover-border-color: rgba(0, 0, 0, .100);
1268
+ --critical-alarm-pressed-background-color: rgb(61, 0, 61);
1269
+ --critical-alarm-pressed-border-color: rgba(0, 0, 0, .200);
1270
+ --critical-alarm-focused-background-color: rgb(76, 0, 76);
1271
+ --critical-alarm-focused-border-color: rgba(0, 51, 21, .500);
1272
+ --critical-alarm-disabled-background-color: rgb(76, 0, 76);
1273
+ --critical-alarm-disabled-border-color: rgba(0, 0, 0, .00);
1274
+ --on-critical-alarm-active-color: rgb(0, 0, 0);
1275
+ --on-critical-alarm-neutral-color: rgba(0, 0, 0, .700);
1276
+ --on-critical-alarm-disabled-color: rgba(0, 0, 0, .300);
1277
+ --font-ui-title-size: 24px;
1278
+ --font-ui-title-weight: bold;
1279
+ --font-ui-title-line-height: 32px;
1280
+ --font-ui-subtitle-size: 24px;
1281
+ --font-ui-subtitle-weight: regular;
1282
+ --font-ui-subtitle-line-height: 32px;
1283
+ --font-ui-overline-size: 12px;
1284
+ --font-ui-overline-weight: semibold;
1285
+ --font-ui-overline-line-height: 24px;
1286
+ --font-ui-button-size: 16px;
1287
+ --font-ui-button-weight: semibold;
1288
+ --font-ui-button-line-height: 24px;
1289
+ --font-ui-body-active-size: 16px;
1290
+ --font-ui-body-active-weight: bold;
1291
+ --font-ui-body-active-line-height: 24px;
1292
+ --font-ui-body-size: 16px;
1293
+ --font-ui-body-weight: regular;
1294
+ --font-ui-body-line-height: 24px;
1295
+ --font-ui-label-active-size: 12px;
1296
+ --font-ui-label-active-weight: bold;
1297
+ --font-ui-label-active-line-height: 16px;
1298
+ --font-ui-label-size: 12px;
1299
+ --font-ui-label-weight: regular;
1300
+ --font-ui-label-line-height: 16px;
1301
+ --font-instrument-label-s-size: 16px;
1302
+ --font-instrument-label-s-weight: regular;
1303
+ --font-instrument-label-s-line-height: 24px;
1304
+ --font-instrument-label-m-size: 32px;
1305
+ --font-instrument-label-m-weight: regular;
1306
+ --font-instrument-label-m-line-height: 40px;
1307
+ --font-instrument-label-l-size: 64px;
1308
+ --font-instrument-label-l-weight: regular;
1309
+ --font-instrument-label-l-line-height: 80px;
1310
+ --font-instrument-value-s-size: 16px;
1311
+ --font-instrument-value-s-weight: semibold;
1312
+ --font-instrument-value-s-line-height: 24px;
1313
+ --font-instrument-value-s-enhanced-size: 24px;
1314
+ --font-instrument-value-s-enhanced-weight: semibold;
1315
+ --font-instrument-value-s-enhanced-line-height: 32px;
1316
+ --font-instrument-value-m-size: 32px;
1317
+ --font-instrument-value-m-weight: semibold;
1318
+ --font-instrument-value-m-line-height: 40px;
1319
+ --font-instrument-value-m-enhanced-size: 48px;
1320
+ --font-instrument-value-m-enhanced-weight: semibold;
1321
+ --font-instrument-value-m-enhanced-line-height: 64px;
1322
+ --font-instrument-value-l-size: 64px;
1323
+ --font-instrument-value-l-weight: semibold;
1324
+ --font-instrument-value-l-line-height: 80px;
1325
+ --font-instrument-value-l-enhanced-size: 96px;
1326
+ --font-instrument-value-l-enhanced-weight: semibold;
1327
+ --font-instrument-value-l-enhanced-line-height: 128px;
1328
+ --font-instrument-unit-s-size: 16px;
1329
+ --font-instrument-unit-s-weight: regular;
1330
+ --font-instrument-unit-s-line-height: 24px;
1331
+ --font-instrument-unit-m-size: 32px;
1332
+ --font-instrument-unit-m-weight: regular;
1333
+ --font-instrument-unit-m-line-height: 40px;
1334
+ --font-instrument-unit-l-size: 64px;
1335
+ --font-instrument-unit-l-weight: regular;
1336
+ --font-instrument-unit-l-line-height: 80px;
1337
+ --font-instrument-status-s-size: 16px;
1338
+ --font-instrument-status-s-weight: regular;
1339
+ --font-instrument-status-s-line-height: 24px;
1340
+ --font-instrument-status-m-size: 32px;
1341
+ --font-instrument-status-m-weight: regular;
1342
+ --font-instrument-status-m-line-height: 40px;
1343
+ --font-instrument-status-l-size: 64px;
1344
+ --font-instrument-status-l-weight: regular;
1345
+ --font-instrument-status-l-line-height: 80px;
1346
+ --shadow-flat: 0px 0px 0px 1px rgb(19, 22, 4);
1347
+ --shadow-raised: 0px 0px 0px 1px rgb(19, 22, 4);
1348
+ --shadow-floating: 0px 0px 0px 1px rgb(27, 31, 10);
1349
+ --shadow-overlay: 0px 0px 0px 1px rgb(30, 35, 6);
1350
1350
 
1351
- --icon-02-chevron-up: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M6 14.0002L7.41 15.4102L12 10.8302L16.59 15.4102L18 14.0002L12 8.00016L6 14.0002Z" fill="rgb(51, 51, 0)"/></svg>');
1352
- --icon-02-chevron-down: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M18 9.41L16.59 8L12 12.58L7.41 8L6 9.41L12 15.41L18 9.41Z" fill="rgb(51, 51, 0)"/></svg>');
1351
+ --icon-02-chevron-up: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M6 14.0002L7.41 15.4102L12 10.8302L16.59 15.4102L18 14.0002L12 8.00016L6 14.0002Z" fill="rgb(51, 51, 0)"/></svg>');
1352
+ --icon-02-chevron-down: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M18 9.41L16.59 8L12 12.58L7.41 8L6 9.41L12 15.41L18 9.41Z" fill="rgb(51, 51, 0)"/></svg>');
1353
1353
 
1354
- }
1354
+ }