tonarchy

tonarchy

https://git.tonybtw.com/tonarchy.git git://git.tonybtw.com/tonarchy.git
150,046 bytes raw
1
/* This stylesheet is generated, DO NOT EDIT */
2
/* Copyright 2009, 2015 Red Hat, Inc.
3
 *
4
 * Portions adapted from Mx's data/style/default.css
5
 *   Copyright 2009 Intel Corporation
6
 *
7
 * This program is free software; you can redistribute it and/or modify it
8
 * under the terms and conditions of the GNU Lesser General Public License,
9
 * version 2.1, as published by the Free Software Foundation.
10
 *
11
 * This program is distributed in the hope it will be useful, but WITHOUT ANY
12
 * WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS
13
 * FOR A PARTICULAR PURPOSE.  See the GNU Lesser General Public License for
14
 * more details.
15
 *
16
 * You should have received a copy of the GNU Lesser General Public License
17
 * along with this program; if not, write to the Free Software Foundation,
18
 * Inc., 51 Franklin St - Fifth Floor, Boston, MA 02110-1301 USA.
19
 */
20
/* General Typography */
21
.search-statustext, .app-folder-dialog .folder-name-container .folder-name-label,
22
.app-folder-dialog .folder-name-container .folder-name-entry {
23
  font-weight: 800;
24
  font-size: 20pt;
25
}
26
27
.message-notification-group .message-group-header .message-group-title, .message-list .message-list-placeholder, .message-dialog-content .message-dialog-title, .lg-debug-flags-header {
28
  font-weight: 800;
29
  font-size: 15pt;
30
}
31
32
.quick-toggle-menu .header .title {
33
  font-weight: 700;
34
  font-size: 15pt;
35
}
36
37
.bt-menu-placeholder.popup-menu-item, .restart-message, .polkit-dialog-user-layout .polkit-dialog-user-label,
38
.polkit-dialog-user-layout .polkit-dialog-user-root-label, .message-dialog-content .message-dialog-title.lightweight {
39
  font-weight: 700;
40
  font-size: 13pt;
41
}
42
43
.background-app-item .title, .message-list-controls, .dialog-list .dialog-list-title, .world-clocks-button .world-clocks-header, .calendar .calendar-month-label, .lg-extension-name {
44
  font-weight: 700;
45
  font-size: 11pt;
46
}
47
48
.quick-toggle-menu .header .subtitle, .app-menu .popup-inactive-menu-item:first-child > StLabel {
49
  font-weight: 700;
50
  font-size: 9pt;
51
}
52
53
.icon-label-button-container, .background-app-item .subtitle, .message .message-header .message-header-content .event-time, .prompt-dialog .prompt-dialog-error-label,
54
.prompt-dialog .prompt-dialog-info-label,
55
.prompt-dialog .prompt-dialog-null-label, .run-dialog .run-dialog-description, .dialog-list .dialog-list-box .dialog-list-item .dialog-list-item-description {
56
  font-weight: 400;
57
  font-size: 9pt;
58
}
59
60
.calendar .calendar-week-number, .calendar .calendar-day-heading {
61
  font-weight: 400;
62
  font-size: 8pt;
63
}
64
65
.calendar .calendar-day-heading {
66
  font-feature-settings: 'tnum';
67
}
68
69
.ripple-pointer-location {
70
  width: 48px;
71
  height: 48px;
72
  border-radius: 24px;
73
  background-color: rgba(145, 218, 232, 0.3);
74
  box-shadow: 0 0 2px 2px #67cbdf;
75
}
76
77
.pie-timer {
78
  width: 60px;
79
  height: 60px;
80
  -pie-border-width: 3px;
81
  -pie-border-color: #27a1b9;
82
  -pie-background-color: rgba(187, 232, 241, 0.3);
83
}
84
85
.magnifier-zoom-region {
86
  border: 2px solid #27a1b9;
87
}
88
89
.magnifier-zoom-region.full-screen {
90
  border-width: 0;
91
}
92
93
.shell-link {
94
  border-radius: 12px;
95
  color: #4aafca;
96
}
97
98
.shell-link:hover {
99
  color: #4aafca;
100
  background-color: rgba(74, 175, 202, 0.15);
101
}
102
103
.shell-link:active {
104
  color: #4aafca;
105
  background-color: rgba(74, 175, 202, 0.25);
106
}
107
108
.lowres-icon {
109
  icon-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
110
}
111
112
.icon-dropshadow {
113
  icon-shadow: 0 3px 6px rgba(0, 0, 0, 0.2);
114
}
115
116
/* Buttons */
117
.quick-settings-system-item .icon-button, .quick-settings-system-item .background-app-item .close-button, .background-app-item .quick-settings-system-item .close-button, .quick-settings-system-item .message .message-header .message-expand-button, .message .message-header .quick-settings-system-item .message-expand-button,
118
.quick-settings-system-item .message .message-header .message-close-button,
119
.message .message-header .quick-settings-system-item .message-close-button, .quick-settings-system-item .message-notification-group .message-collapse-button, .message-notification-group .quick-settings-system-item .message-collapse-button, .hotplug-notification-item, .button {
120
  color: #e9e9ed;
121
  background-color: #323449;
122
  box-shadow: none !important;
123
}
124
125
.quick-settings-system-item .icon-button:focus, .quick-settings-system-item .background-app-item .close-button:focus, .background-app-item .quick-settings-system-item .close-button:focus, .quick-settings-system-item .message .message-header .message-expand-button:focus, .message .message-header .quick-settings-system-item .message-expand-button:focus,
126
.quick-settings-system-item .message .message-header .message-close-button:focus,
127
.message .message-header .quick-settings-system-item .message-close-button:focus, .quick-settings-system-item .message-notification-group .message-collapse-button:focus, .message-notification-group .quick-settings-system-item .message-collapse-button:focus, .hotplug-notification-item:focus, .button:focus {
128
  color: #e9e9ed;
129
  background-color: rgba(233, 233, 237, 0.08);
130
  box-shadow: none !important;
131
}
132
133
.quick-settings-system-item .icon-button:hover, .quick-settings-system-item .background-app-item .close-button:hover, .background-app-item .quick-settings-system-item .close-button:hover, .quick-settings-system-item .message .message-header .message-expand-button:hover, .message .message-header .quick-settings-system-item .message-expand-button:hover,
134
.quick-settings-system-item .message .message-header .message-close-button:hover,
135
.message .message-header .quick-settings-system-item .message-close-button:hover, .quick-settings-system-item .message-notification-group .message-collapse-button:hover, .message-notification-group .quick-settings-system-item .message-collapse-button:hover, .hotplug-notification-item:hover, .button:hover {
136
  color: #e9e9ed;
137
  background-color: rgba(233, 233, 237, 0.12);
138
  box-shadow: none !important;
139
}
140
141
.quick-settings-system-item .icon-button:active, .quick-settings-system-item .background-app-item .close-button:active, .background-app-item .quick-settings-system-item .close-button:active, .quick-settings-system-item .message .message-header .message-expand-button:active, .message .message-header .quick-settings-system-item .message-expand-button:active,
142
.quick-settings-system-item .message .message-header .message-close-button:active,
143
.message .message-header .quick-settings-system-item .message-close-button:active, .quick-settings-system-item .message-notification-group .message-collapse-button:active, .message-notification-group .quick-settings-system-item .message-collapse-button:active, .hotplug-notification-item:active, .button:active {
144
  color: #e9e9ed;
145
  background-color: rgba(233, 233, 237, 0.2);
146
  box-shadow: none !important;
147
}
148
149
.quick-settings-system-item .icon-button:insensitive, .quick-settings-system-item .background-app-item .close-button:insensitive, .background-app-item .quick-settings-system-item .close-button:insensitive, .quick-settings-system-item .message .message-header .message-expand-button:insensitive, .message .message-header .quick-settings-system-item .message-expand-button:insensitive,
150
.quick-settings-system-item .message .message-header .message-close-button:insensitive,
151
.message .message-header .quick-settings-system-item .message-close-button:insensitive, .quick-settings-system-item .message-notification-group .message-collapse-button:insensitive, .message-notification-group .quick-settings-system-item .message-collapse-button:insensitive, .hotplug-notification-item:insensitive, .button:insensitive {
152
  color: rgba(233, 233, 237, 0.35);
153
  background-color: #323449;
154
  box-shadow: none !important;
155
}
156
157
.modal-dialog-button, .lg-obj-inspector-button, .candidate-page-button, .modal-dialog-linked-button, .icon-button.flat, .background-app-item .flat.close-button, .message-notification-group .flat.message-collapse-button, .message .message-header .flat.message-expand-button,
158
.message .message-header .flat.message-close-button, .button.flat, .popup-menu .button {
159
  color: #e9e9ed;
160
  background-color: transparent;
161
  box-shadow: none !important;
162
}
163
164
.modal-dialog-button:focus, .lg-obj-inspector-button:focus, .candidate-page-button:focus, .modal-dialog-linked-button:focus, .icon-button.flat:focus, .background-app-item .flat.close-button:focus, .message-notification-group .flat.message-collapse-button:focus, .message .message-header .flat.message-expand-button:focus,
165
.message .message-header .flat.message-close-button:focus, .button.flat:focus, .popup-menu .button:focus {
166
  color: #e9e9ed;
167
  background-color: rgba(233, 233, 237, 0.08);
168
  box-shadow: none !important;
169
}
170
171
.modal-dialog-button:hover, .lg-obj-inspector-button:hover, .candidate-page-button:hover, .modal-dialog-linked-button:hover, .icon-button.flat:hover, .background-app-item .flat.close-button:hover, .message-notification-group .flat.message-collapse-button:hover, .message .message-header .flat.message-expand-button:hover,
172
.message .message-header .flat.message-close-button:hover, .button.flat:hover, .popup-menu .button:hover {
173
  color: #e9e9ed;
174
  background-color: rgba(233, 233, 237, 0.12);
175
}
176
177
.modal-dialog-button:active, .lg-obj-inspector-button:active, .candidate-page-button:active, .modal-dialog-linked-button:active, .icon-button.flat:active, .background-app-item .flat.close-button:active, .message-notification-group .flat.message-collapse-button:active, .message .message-header .flat.message-expand-button:active,
178
.message .message-header .flat.message-close-button:active, .button.flat:active, .popup-menu .button:active {
179
  color: #e9e9ed;
180
  background-color: rgba(233, 233, 237, 0.2);
181
  box-shadow: none !important;
182
}
183
184
.modal-dialog-button:insensitive, .lg-obj-inspector-button:insensitive, .candidate-page-button:insensitive, .modal-dialog-linked-button:insensitive, .icon-button.flat:insensitive, .background-app-item .flat.close-button:insensitive, .message-notification-group .flat.message-collapse-button:insensitive, .message .message-header .flat.message-expand-button:insensitive,
185
.message .message-header .flat.message-close-button:insensitive, .button.flat:insensitive, .popup-menu .button:insensitive {
186
  background-color: transparent;
187
  color: rgba(233, 233, 237, 0.35);
188
  box-shadow: none !important;
189
}
190
191
.icon-button.default, .background-app-item .default.close-button, .message-notification-group .default.message-collapse-button, .message .message-header .default.message-expand-button,
192
.message .message-header .default.message-close-button, .button.default {
193
  color: #e9e9ed;
194
  background-color: #27a1b9;
195
  box-shadow: none !important;
196
}
197
198
.icon-button.default:focus, .background-app-item .default.close-button:focus, .message-notification-group .default.message-collapse-button:focus, .message .message-header .default.message-expand-button:focus,
199
.message .message-header .default.message-close-button:focus, .button.default:focus {
200
  color: #e9e9ed;
201
  background-color: rgba(233, 233, 237, 0.08);
202
  box-shadow: none !important;
203
}
204
205
.icon-button.default:hover, .background-app-item .default.close-button:hover, .message-notification-group .default.message-collapse-button:hover, .message .message-header .default.message-expand-button:hover,
206
.message .message-header .default.message-close-button:hover, .button.default:hover {
207
  color: #e9e9ed;
208
  background-color: rgba(233, 233, 237, 0.12);
209
  box-shadow: none !important;
210
}
211
212
.icon-button.default:insensitive, .background-app-item .default.close-button:insensitive, .message-notification-group .default.message-collapse-button:insensitive, .message .message-header .default.message-expand-button:insensitive,
213
.message .message-header .default.message-close-button:insensitive, .button.default:insensitive {
214
  color: rgba(233, 233, 237, 0.35);
215
  background-color: #27a1b9;
216
  box-shadow: none !important;
217
}
218
219
.icon-button.default:active, .background-app-item .default.close-button:active, .message-notification-group .default.message-collapse-button:active, .message .message-header .default.message-expand-button:active,
220
.message .message-header .default.message-close-button:active, .button.default:active {
221
  color: #e9e9ed;
222
  background-color: rgba(233, 233, 237, 0.2);
223
  box-shadow: none !important;
224
}
225
226
.button {
227
  min-height: 20px;
228
  padding: 6px 12px;
229
  border-radius: 12px;
230
  border: none;
231
}
232
233
.icon-button, .background-app-item .close-button, .message-notification-group .message-collapse-button, .message .message-header .message-expand-button,
234
.message .message-header .message-close-button {
235
  border-radius: 9999px;
236
  padding: 6px;
237
  min-height: 1.091em;
238
}
239
240
.icon-button StIcon, .background-app-item .close-button StIcon, .message-notification-group .message-collapse-button StIcon, .message .message-header .message-expand-button StIcon,
241
.message .message-header .message-close-button StIcon {
242
  icon-size: 1.091em;
243
  -st-icon-style: symbolic;
244
}
245
246
.screenshot-ui-show-pointer-button, .screenshot-ui-type-button {
247
  color: #e9e9ed;
248
  background-color: transparent;
249
  box-shadow: none !important;
250
}
251
252
.screenshot-ui-show-pointer-button:insensitive, .screenshot-ui-type-button:insensitive {
253
  color: rgba(233, 233, 237, 0.35);
254
  background-color: #1a1b26;
255
  box-shadow: none !important;
256
}
257
258
.screenshot-ui-show-pointer-button:focus, .screenshot-ui-type-button:focus {
259
  color: #e9e9ed;
260
  background-color: rgba(233, 233, 237, 0.08);
261
  box-shadow: none !important;
262
}
263
264
.screenshot-ui-show-pointer-button:hover, .screenshot-ui-type-button:hover {
265
  color: #e9e9ed;
266
  background-color: rgba(233, 233, 237, 0.12);
267
  box-shadow: none !important;
268
}
269
270
.screenshot-ui-show-pointer-button:active, .screenshot-ui-type-button:active {
271
  color: #e9e9ed;
272
  background-color: rgba(233, 233, 237, 0.2);
273
  box-shadow: none !important;
274
}
275
276
.screenshot-ui-show-pointer-button:outlined, .screenshot-ui-type-button:outlined, .screenshot-ui-show-pointer-button:checked, .screenshot-ui-type-button:checked {
277
  color: #e9e9ed;
278
  background-color: #27a1b9;
279
  box-shadow: none !important;
280
}
281
282
/* Check Boxes */
283
.check-box StBoxLayout {
284
  spacing: 0.8em;
285
}
286
287
.check-box StBin {
288
  width: 24px;
289
  height: 24px;
290
  padding: 3px;
291
}
292
293
.check-box StBin, .check-box:focus StBin {
294
  background-image: url("assets/checkbox-off.svg");
295
}
296
297
.check-box:hover StBin {
298
  background-image: url("assets/checkbox-off-hover.svg");
299
}
300
301
.check-box:active StBin {
302
  background-image: url("assets/checkbox-off-active.svg");
303
}
304
305
.check-box:checked StBin, .check-box:focus:checked StBin {
306
  background-image: url("assets/checkbox-dark.svg");
307
}
308
309
/* Activities Ripple */
310
.ripple-box {
311
  background-color: rgba(39, 161, 185, 0.35);
312
  box-shadow: 0 0 2px 2px #67cbdf;
313
  width: 52px;
314
  height: 52px;
315
  border-radius: 0 0 52px 0;
316
}
317
318
.ripple-box:rtl {
319
  border-radius: 0 0 0 52px;
320
}
321
322
/* Modal Dialogs */
323
.candidate-popup-content, .modal-dialog {
324
  background-color: #292e42;
325
  border-radius: 21px;
326
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.35);
327
}
328
329
.modal-dialog-button:last-child, .modal-dialog-linked-button:last-child {
330
  color: #1a1b26;
331
  background-color: #27a1b9;
332
}
333
334
.modal-dialog-button:hover:last-child, .modal-dialog-linked-button:hover:last-child {
335
  color: #1a1b26;
336
  background-color: #39bbd5;
337
}
338
339
.modal-dialog-button:active:last-child, .modal-dialog-linked-button:active:last-child {
340
  color: #1a1b26;
341
  background-color: #238fa4;
342
}
343
344
.modal-dialog-button:insensitive:last-child, .modal-dialog-linked-button:insensitive:last-child {
345
  color: #1a1b26;
346
  background-color: rgba(39, 161, 185, 0.05);
347
}
348
349
.headline {
350
  font-size: 13pt;
351
}
352
353
.modal-dialog {
354
  color: rgba(233, 233, 237, 0.7);
355
  padding: 0 6px 6px 6px;
356
}
357
358
.modal-dialog-linked-button {
359
  min-height: 32px !important;
360
  padding: 6px !important;
361
  margin: 3px !important;
362
  border: none !important;
363
  border-radius: 12px;
364
}
365
366
.modal-dialog-linked-button:first-child {
367
  background-color: rgba(233, 233, 237, 0.04);
368
}
369
370
.modal-dialog-linked-button:first-child:focus {
371
  color: #e9e9ed;
372
  background-color: rgba(233, 233, 237, 0.08);
373
  box-shadow: none !important;
374
}
375
376
.modal-dialog-linked-button:first-child:hover {
377
  color: #e9e9ed;
378
  background-color: rgba(233, 233, 237, 0.12);
379
}
380
381
.modal-dialog-linked-button:first-child:active {
382
  color: #e9e9ed;
383
  background-color: rgba(233, 233, 237, 0.2);
384
  box-shadow: none !important;
385
}
386
387
.modal-dialog .modal-dialog-content-box {
388
  margin: 30px 42px;
389
  spacing: 30px;
390
  max-width: 28em;
391
}
392
393
.end-session-dialog {
394
  width: 30em;
395
}
396
397
.end-session-dialog .end-session-dialog-battery-warning,
398
.end-session-dialog .dialog-list-title {
399
  color: #8c6c3e;
400
}
401
402
.message-dialog-content {
403
  spacing: 18px;
404
}
405
406
.message-dialog-content .message-dialog-title {
407
  text-align: center;
408
  font-size: 18pt;
409
  font-weight: 800;
410
}
411
412
.message-dialog-content .message-dialog-title.lightweight {
413
  font-size: 13pt;
414
  font-weight: 800;
415
}
416
417
.message-dialog-content .message-dialog-description {
418
  text-align: center;
419
}
420
421
.dialog-list {
422
  spacing: 18px;
423
}
424
425
.dialog-list .dialog-list-title {
426
  text-align: center;
427
  font-weight: bold;
428
}
429
430
.dialog-list .dialog-list-scrollview {
431
  max-height: 200px;
432
}
433
434
.dialog-list .dialog-list-box {
435
  spacing: 1em;
436
}
437
438
.dialog-list .dialog-list-box .dialog-list-item {
439
  spacing: 1em;
440
}
441
442
.dialog-list .dialog-list-box .dialog-list-item .dialog-list-item-title {
443
  font-weight: bold;
444
}
445
446
.dialog-list .dialog-list-box .dialog-list-item .dialog-list-item-description {
447
  color: rgba(233, 233, 237, 0.7);
448
  font-size: 11pt;
449
}
450
451
.run-dialog .modal-dialog-content-box {
452
  margin-top: 24px;
453
  margin-bottom: 12px;
454
}
455
456
.run-dialog .run-dialog-entry {
457
  width: 20em;
458
}
459
460
.run-dialog .run-dialog-description {
461
  text-align: center;
462
  color: rgba(233, 233, 237, 0.7);
463
  font-size: 11pt;
464
}
465
466
.prompt-dialog {
467
  width: 28em;
468
}
469
470
.prompt-dialog .modal-dialog-content-box {
471
  margin-bottom: 24px;
472
}
473
474
.prompt-dialog-password-grid {
475
  spacing-rows: 8px;
476
  spacing-columns: 4px;
477
}
478
479
.prompt-dialog-password-grid .prompt-dialog-password-entry {
480
  width: auto;
481
}
482
483
.prompt-dialog-password-grid .prompt-dialog-password-entry:ltr {
484
  margin-left: 20px;
485
}
486
487
.prompt-dialog-password-grid .prompt-dialog-password-entry:rtl {
488
  margin-right: 20px;
489
}
490
491
.prompt-dialog-password-layout {
492
  spacing: 8px;
493
}
494
495
.prompt-dialog-password-entry {
496
  width: 20em;
497
}
498
499
.prompt-dialog-error-label,
500
.prompt-dialog-info-label,
501
.prompt-dialog-null-label {
502
  text-align: center;
503
  font-size: 11pt;
504
  margin: 6px;
505
}
506
507
.prompt-dialog-error-label {
508
  color: #f52a65;
509
}
510
511
.prompt-dialog-info-label,
512
.prompt-dialog-null-label {
513
  color: rgba(233, 233, 237, 0.5);
514
}
515
516
.polkit-dialog-user-layout {
517
  text-align: center;
518
  spacing: 8px;
519
  margin-bottom: 6px;
520
}
521
522
.polkit-dialog-user-layout .polkit-dialog-user-root-label {
523
  color: #8c6c3e;
524
}
525
526
.audio-device-selection-dialog .modal-dialog-content-box {
527
  margin-bottom: 28px;
528
}
529
530
.audio-device-selection-dialog .audio-selection-box {
531
  spacing: 20px;
532
}
533
534
.audio-selection-device {
535
  border: 1px solid rgba(233, 233, 237, 0.12);
536
  border-radius: 12px;
537
}
538
539
.audio-selection-device:hover, .audio-selection-device:focus {
540
  background-color: rgba(233, 233, 237, 0.12);
541
}
542
543
.audio-selection-device:active {
544
  background-color: #27a1b9;
545
  color: #e9e9ed;
546
}
547
548
.audio-selection-device-box {
549
  padding: 18px;
550
  spacing: 18px;
551
}
552
553
.audio-selection-device-icon {
554
  icon-size: 64px;
555
}
556
557
.welcome-dialog-image {
558
  background-image: url("resource:///org/gnome/shell/theme/gnome-shell-start.svg");
559
  background-size: contain;
560
  height: 300px;
561
  width: 300px;
562
}
563
564
/* Entries */
565
StEntry,
566
.popup-menu .search-entry {
567
  min-height: 20px;
568
  padding: 6px 12px;
569
  margin: 2px;
570
  border-radius: 12px;
571
  color: #e9e9ed;
572
  caret-color: #e9e9ed;
573
  selection-background-color: #27a1b9;
574
  selected-color: #e9e9ed;
575
  color: #e9e9ed;
576
  background-color: rgba(233, 233, 237, 0.04);
577
  border: 2px solid transparent !important;
578
  box-shadow: none !important;
579
}
580
581
StEntry:hover,
582
.popup-menu .search-entry:hover {
583
  color: #e9e9ed;
584
  background-color: rgba(233, 233, 237, 0.04);
585
  border: 2px solid rgba(233, 233, 237, 0.3) !important;
586
  box-shadow: none !important;
587
}
588
589
StEntry:focus,
590
.popup-menu .search-entry:focus {
591
  color: #e9e9ed;
592
  background-color: rgba(233, 233, 237, 0.04);
593
  border: 2px solid #27a1b9 !important;
594
  box-shadow: none !important;
595
}
596
597
StEntry:insensitive,
598
.popup-menu .search-entry:insensitive {
599
  background-color: rgba(233, 233, 237, 0.04);
600
  color: rgba(233, 233, 237, 0.35);
601
  box-shadow: none !important;
602
}
603
604
StEntry StIcon.capslock-warning,
605
.popup-menu .search-entry StIcon.capslock-warning {
606
  icon-size: 16px;
607
  warning-color: #8c6c3e;
608
  padding: 0;
609
}
610
611
StEntry StIcon.peek-password,
612
.popup-menu .search-entry StIcon.peek-password {
613
  icon-size: 16px;
614
  padding: 0 4px;
615
}
616
617
StEntry StLabel.hint-text,
618
.popup-menu .search-entry StLabel.hint-text {
619
  margin-left: 2px;
620
  color: rgba(233, 233, 237, 0.5);
621
}
622
623
.hotplug-notification-item {
624
  padding: 12px;
625
  border-style: solid;
626
  border-width: 0;
627
  border-left-width: 0;
628
  border-bottom-width: 0;
629
}
630
631
.hotplug-notification-item:first-child {
632
  border-radius: 0 0 0 12px;
633
}
634
635
.hotplug-notification-item:last-child {
636
  border-right-width: 0;
637
  border-radius: 0 0 12px 0;
638
}
639
640
.hotplug-notification-item:first-child:last-child {
641
  border-radius: 0 0 12px 12px;
642
}
643
644
.hotplug-notification-item-icon {
645
  icon-size: 24px;
646
  padding: 0 4px;
647
}
648
649
.candidate-popup-boxpointer {
650
  -arrow-border-radius: 2px;
651
  -arrow-background-color: transparent;
652
  -arrow-border-width: 0;
653
  -arrow-border-color: transparent;
654
  -arrow-base: 64px;
655
  -arrow-rise: 12px;
656
}
657
658
.candidate-popup-content {
659
  color: rgba(233, 233, 237, 0.7);
660
  box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.15);
661
  border: none;
662
  margin: 3px 8px;
663
  padding: 6px;
664
  spacing: 6px;
665
  border-radius: 12px;
666
}
667
668
.candidate-index {
669
  padding: 0 0.5em 0 0;
670
  color: rgba(233, 233, 237, 0.7);
671
}
672
673
.candidate-box:selected .candidate-index {
674
  color: rgba(233, 233, 237, 0.7);
675
}
676
677
.candidate-box {
678
  padding: 0.3em 0.5em 0.3em 0.5em;
679
  margin-right: 2px;
680
  border-radius: 6px;
681
  color: rgba(233, 233, 237, 0.7);
682
}
683
684
.candidate-box:hover {
685
  background-color: rgba(233, 233, 237, 0.12);
686
  color: #e9e9ed;
687
}
688
689
.candidate-box:active {
690
  background-color: rgba(233, 233, 237, 0.3);
691
  color: #e9e9ed;
692
}
693
694
.candidate-box:selected {
695
  background-color: #27a1b9;
696
  color: #e9e9ed;
697
}
698
699
.candidate-box:last-child {
700
  margin-right: 0;
701
}
702
703
.candidate-page-button-box {
704
  height: 2em;
705
}
706
707
.vertical .candidate-page-button-box {
708
  padding-top: 0.5em;
709
}
710
711
.horizontal .candidate-page-button-box {
712
  padding-left: 0.5em;
713
}
714
715
.candidate-page-button {
716
  padding: 4px 8px;
717
  border-radius: 6px;
718
}
719
720
.candidate-page-button-previous,
721
.candidate-page-button-next {
722
  border-radius: 6px;
723
}
724
725
.candidate-page-button-icon {
726
  icon-size: 1em;
727
}
728
729
/* On-screen Keyboard */
730
#keyboard {
731
  background-color: #1d1d1d;
732
  box-shadow: none;
733
}
734
735
#keyboard .page-indicator {
736
  padding: 6px;
737
}
738
739
#keyboard .page-indicator .page-indicator-icon {
740
  width: 8px;
741
  height: 8px;
742
}
743
744
.key-container,
745
.keyboard-layout {
746
  padding: 4px;
747
  spacing: 4px;
748
}
749
750
.keyboard-key {
751
  font-size: 17pt;
752
  font-weight: bold;
753
  min-height: 1.2em;
754
  min-width: 1.2em;
755
  padding: 0 !important;
756
  border-radius: 15px;
757
  border: none;
758
  color: rgba(233, 233, 237, 0.7);
759
  background-color: #707070;
760
  box-shadow: inset 0 -1px rgba(0, 0, 0, 0.85);
761
}
762
763
.keyboard-key:focus, .keyboard-key:hover {
764
  color: #e9e9ed;
765
  background-color: #656565;
766
}
767
768
.keyboard-key:checked, .keyboard-key:active {
769
  color: #e9e9ed;
770
  background-color: #717171;
771
}
772
773
.keyboard-key:grayed {
774
  background-color: #4b4b4b;
775
  color: rgba(233, 233, 237, 0.7);
776
}
777
778
.keyboard-key.default-key {
779
  background-color: #4b4b4b;
780
  box-shadow: inset 0 -1px rgba(0, 0, 0, 0.85);
781
}
782
783
.keyboard-key.default-key:focus, .keyboard-key.default-key:hover {
784
  color: #e9e9ed;
785
  background-color: #585858;
786
}
787
788
.keyboard-key.default-key:checked, .keyboard-key.default-key:active {
789
  color: #e9e9ed;
790
  background-color: #6a6a6a;
791
}
792
793
.keyboard-key.enter-key {
794
  color: #e9e9ed;
795
  background-color: #27a1b9;
796
}
797
798
.keyboard-key.enter-key:focus, .keyboard-key.enter-key:hover {
799
  color: #e9e9ed;
800
  background-color: #2bb3ce;
801
}
802
803
.keyboard-key.enter-key:checked, .keyboard-key.enter-key:active {
804
  color: #e9e9ed;
805
  background-color: #1e7c8f;
806
}
807
808
.keyboard-key.shift-key-uppercase, .keyboard-key.shift-key-uppercase:focus, .keyboard-key.shift-key-uppercase:hover, .keyboard-key.shift-key-uppercase:checked, .keyboard-key.shift-key-uppercase:active {
809
  color: #27a1b9;
810
}
811
812
.keyboard-key StIcon {
813
  icon-size: 1.125em;
814
}
815
816
.keyboard-subkeys {
817
  color: inherit;
818
  -arrow-border-radius: 18px;
819
  -arrow-background-color: #313132;
820
  -arrow-border-width: 0;
821
  -arrow-border-color: transparent;
822
  -arrow-base: 20px;
823
  -arrow-rise: 10px;
824
  -boxpointer-gap: 6px;
825
  box-shadow: inset 0 -1px rgba(0, 0, 0, 0.85);
826
}
827
828
.emoji-page .keyboard-key {
829
  background-color: transparent;
830
  border: none;
831
  color: initial;
832
}
833
834
.emoji-panel .keyboard-key:latched {
835
  border: none;
836
  background-color: #27a1b9;
837
}
838
839
.word-suggestions {
840
  font-size: 14pt;
841
  spacing: 12px;
842
  min-height: 20pt;
843
}
844
845
/* Login Dialog */
846
#lockDialogGroup {
847
  background-color: #1a1b26;
848
}
849
850
.login-dialog-banner-view {
851
  padding-top: 24px;
852
  max-width: 23em;
853
}
854
855
.login-dialog,
856
.unlock-dialog {
857
  border: none;
858
  background-color: transparent;
859
}
860
861
.login-dialog StEntry,
862
.unlock-dialog StEntry {
863
  selection-background-color: #27a1b9;
864
  selected-color: #e9e9ed;
865
  padding: 4px 8px;
866
  min-height: 26px;
867
  border-radius: 9999px;
868
  caret-color: #e9e9ed;
869
  background-color: rgba(233, 233, 237, 0.04);
870
  border-radius: 0;
871
  border: none !important;
872
  box-shadow: inset 0 -1px rgba(233, 233, 237, 0.15) !important;
873
  color: #e9e9ed;
874
}
875
876
.login-dialog StEntry:focus,
877
.unlock-dialog StEntry:focus {
878
  border: none !important;
879
  background-color: rgba(233, 233, 237, 0.04);
880
  box-shadow: inset 0 -2px #27a1b9 !important;
881
  color: #e9e9ed;
882
}
883
884
.login-dialog StEntry:insensitive,
885
.unlock-dialog StEntry:insensitive {
886
  border: none !important;
887
  background-color: rgba(233, 233, 237, 0.04);
888
  color: rgba(233, 233, 237, 0.35);
889
}
890
891
.login-dialog StEntry StLabel.hint-text,
892
.unlock-dialog StEntry StLabel.hint-text {
893
  color: rgba(233, 233, 237, 0.5);
894
}
895
896
.login-dialog .modal-dialog-button-box,
897
.unlock-dialog .modal-dialog-button-box {
898
  spacing: 3px;
899
}
900
901
.login-dialog .modal-dialog-button,
902
.unlock-dialog .modal-dialog-button {
903
  padding: 0 16px;
904
  border: none;
905
  color: #e9e9ed;
906
  background-color: transparent;
907
  box-shadow: none !important;
908
}
909
910
.login-dialog .modal-dialog-button:hover, .login-dialog .modal-dialog-button:focus,
911
.unlock-dialog .modal-dialog-button:hover,
912
.unlock-dialog .modal-dialog-button:focus {
913
  color: #e9e9ed;
914
  background-color: rgba(233, 233, 237, 0.12);
915
}
916
917
.login-dialog .modal-dialog-button:active,
918
.unlock-dialog .modal-dialog-button:active {
919
  color: #e9e9ed;
920
  background-color: rgba(233, 233, 237, 0.2);
921
  box-shadow: none !important;
922
}
923
924
.login-dialog .modal-dialog-button:insensitive,
925
.unlock-dialog .modal-dialog-button:insensitive {
926
  background-color: transparent;
927
  color: rgba(233, 233, 237, 0.35);
928
  box-shadow: none !important;
929
}
930
931
.login-dialog .modal-dialog-button:default,
932
.unlock-dialog .modal-dialog-button:default {
933
  color: #e9e9ed;
934
  background-color: #323449;
935
  box-shadow: none !important;
936
}
937
938
.login-dialog .modal-dialog-button:default:hover, .login-dialog .modal-dialog-button:default:focus,
939
.unlock-dialog .modal-dialog-button:default:hover,
940
.unlock-dialog .modal-dialog-button:default:focus {
941
  color: #e9e9ed;
942
  background-color: rgba(233, 233, 237, 0.12);
943
  box-shadow: none !important;
944
}
945
946
.login-dialog .modal-dialog-button:default:active,
947
.unlock-dialog .modal-dialog-button:default:active {
948
  color: #e9e9ed;
949
  background-color: rgba(233, 233, 237, 0.2);
950
  box-shadow: none !important;
951
}
952
953
.login-dialog .modal-dialog-button:default:insensitive,
954
.unlock-dialog .modal-dialog-button:default:insensitive {
955
  color: rgba(233, 233, 237, 0.35);
956
  background-color: #323449;
957
  box-shadow: none !important;
958
}
959
960
.login-dialog .cancel-button,
961
.login-dialog .switch-user-button,
962
.login-dialog .login-dialog-session-list-button,
963
.unlock-dialog .cancel-button,
964
.unlock-dialog .switch-user-button,
965
.unlock-dialog .login-dialog-session-list-button {
966
  padding: 0;
967
  border-radius: 100px;
968
  width: 32px;
969
  height: 32px;
970
  border: none;
971
  background-color: rgba(233, 233, 237, 0.12);
972
  color: #e9e9ed;
973
}
974
975
.login-dialog .cancel-button StIcon,
976
.login-dialog .switch-user-button StIcon,
977
.login-dialog .login-dialog-session-list-button StIcon,
978
.unlock-dialog .cancel-button StIcon,
979
.unlock-dialog .switch-user-button StIcon,
980
.unlock-dialog .login-dialog-session-list-button StIcon {
981
  icon-size: 16px;
982
}
983
984
.login-dialog .login-dialog-message-warning,
985
.unlock-dialog .login-dialog-message-warning {
986
  color: rgba(233, 233, 237, 0.7);
987
}
988
989
.login-dialog-logo-bin {
990
  padding: 24px 0px;
991
}
992
993
.login-dialog-banner {
994
  color: rgba(233, 233, 237, 0.7);
995
}
996
997
.login-dialog-button-box {
998
  spacing: 5px;
999
}
1000
1001
.login-dialog-message {
1002
  text-align: center;
1003
}
1004
1005
.login-dialog-message-warning {
1006
  color: #8c6c3e;
1007
}
1008
1009
.login-dialog-message-hint {
1010
  padding-top: 0;
1011
  padding-bottom: 20px;
1012
}
1013
1014
.login-dialog-user-selection-box {
1015
  padding: 100px 0px;
1016
}
1017
1018
.login-dialog-not-listed-label {
1019
  padding-left: 2px;
1020
}
1021
1022
.login-dialog-not-listed-button:focus .login-dialog-not-listed-label, .login-dialog-not-listed-button:hover .login-dialog-not-listed-label {
1023
  color: #e9e9ed;
1024
}
1025
1026
.login-dialog-not-listed-label {
1027
  font-size: 1em;
1028
  font-weight: bold;
1029
  color: rgba(233, 233, 237, 0.7);
1030
  padding-top: 1em;
1031
}
1032
1033
.login-dialog-not-listed-label:hover {
1034
  color: rgba(233, 233, 237, 0.7);
1035
}
1036
1037
.login-dialog-not-listed-label:focus {
1038
  background-color: rgba(233, 233, 237, 0.12);
1039
}
1040
1041
.login-dialog-user-list-view {
1042
  -st-vfade-offset: 1em;
1043
}
1044
1045
.login-dialog-user-list {
1046
  spacing: 12px;
1047
  padding: 0.2em;
1048
  width: 23em;
1049
}
1050
1051
.login-dialog-user-list:expanded .login-dialog-user-list-item:selected, .login-dialog-user-list:expanded .login-dialog-user-list-item:hover, .login-dialog-user-list:expanded .login-dialog-user-list-item:active {
1052
  background-color: rgba(233, 233, 237, 0.3);
1053
  color: rgba(233, 233, 237, 0.7);
1054
}
1055
1056
.login-dialog-user-list:expanded .login-dialog-user-list-item:logged-in {
1057
  border-right: 2px solid #27a1b9;
1058
}
1059
1060
.login-dialog-user-list-item {
1061
  border-radius: 18px;
1062
  padding: 6px;
1063
  color: rgba(233, 233, 237, 0.7);
1064
}
1065
1066
.login-dialog-user-list-item:ltr .user-widget {
1067
  padding-right: 1em;
1068
}
1069
1070
.login-dialog-user-list-item:rtl .user-widget {
1071
  padding-left: 1em;
1072
}
1073
1074
.login-dialog-user-list-item:focus {
1075
  background-color: rgba(233, 233, 237, 0.04) !important;
1076
}
1077
1078
.login-dialog-user-list-item:hover, .login-dialog-user-list-item:focus:hover {
1079
  background-color: rgba(233, 233, 237, 0.12) !important;
1080
  color: rgba(233, 233, 237, 0.7);
1081
}
1082
1083
.login-dialog-user-list-item:active, .login-dialog-user-list-item:focus:active {
1084
  background-color: rgba(233, 233, 237, 0.3) !important;
1085
  color: rgba(233, 233, 237, 0.7);
1086
}
1087
1088
.login-dialog-user-list-item .login-dialog-timed-login-indicator {
1089
  height: 2px;
1090
  margin: 6px 0 0 0;
1091
  background-color: rgba(233, 233, 237, 0.12) !important;
1092
}
1093
1094
.user-widget-label {
1095
  color: rgba(233, 233, 237, 0.7);
1096
}
1097
1098
.user-widget.horizontal .user-widget-label {
1099
  font-size: 14pt;
1100
  font-weight: bold;
1101
  padding-left: 15px;
1102
}
1103
1104
.user-widget.horizontal .user-widget-label:ltr {
1105
  padding-left: 14px;
1106
  text-align: left;
1107
}
1108
1109
.user-widget.horizontal .user-widget-label:rtl {
1110
  padding-right: 14px;
1111
  text-align: right;
1112
}
1113
1114
.user-widget.vertical .user-widget-label {
1115
  font-size: 17pt;
1116
  text-align: center;
1117
  font-weight: normal;
1118
  padding-top: 16px;
1119
}
1120
1121
.login-dialog-prompt-layout {
1122
  padding-top: 24px;
1123
  padding-bottom: 12px;
1124
  spacing: 12px;
1125
  width: 23em;
1126
}
1127
1128
.login-dialog-prompt-entry {
1129
  height: 1.5em;
1130
}
1131
1132
.login-dialog-prompt-label {
1133
  color: rgba(233, 233, 237, 0.7);
1134
  font-size: 13pt;
1135
  padding-top: 1em;
1136
}
1137
1138
/* Looking Glass */
1139
#LookingGlassDialog {
1140
  background-color: #323449;
1141
  padding: 0;
1142
  spacing: 6px;
1143
  margin: 6px;
1144
  border-radius: 20px;
1145
  box-shadow: 0 3px 8px 0 rgba(0, 0, 0, 0.25);
1146
  color: #e9e9ed;
1147
}
1148
1149
#LookingGlassDialog > #Toolbar {
1150
  padding: 0 6px;
1151
  border: none;
1152
  border-radius: 20px 20px 0 0;
1153
  background-color: rgba(233, 233, 237, 0.04);
1154
  box-shadow: inset 0 -1px 0 rgba(233, 233, 237, 0.12);
1155
  spacing: 6px;
1156
}
1157
1158
#LookingGlassDialog .labels {
1159
  spacing: 6px;
1160
}
1161
1162
#LookingGlassDialog .notebook-tab {
1163
  -natural-hpadding: 12px;
1164
  -minimum-hpadding: 12px;
1165
  font-weight: bold;
1166
  color: rgba(233, 233, 237, 0.5);
1167
  padding-left: 16px;
1168
  padding-right: 16px;
1169
  min-height: 32px;
1170
  padding: 3px 30px;
1171
  transition-duration: 100ms;
1172
  border: none;
1173
  background-color: transparent;
1174
  border-radius: 0;
1175
}
1176
1177
#LookingGlassDialog .notebook-tab:hover {
1178
  background-color: rgba(233, 233, 237, 0.04);
1179
  color: #e9e9ed;
1180
  text-shadow: none;
1181
}
1182
1183
#LookingGlassDialog .notebook-tab:selected {
1184
  border-color: transparent;
1185
  background-color: rgba(233, 233, 237, 0.12);
1186
  box-shadow: inset 0 -2px 0px #e1e2e7;
1187
  color: #e9e9ed;
1188
  text-shadow: none;
1189
}
1190
1191
#LookingGlassDialog StBoxLayout#EvalBox {
1192
  padding: 4px;
1193
  spacing: 6px;
1194
  padding: 6px;
1195
}
1196
1197
#LookingGlassDialog StBoxLayout#ResultsArea {
1198
  spacing: 6px;
1199
  padding: 6px;
1200
}
1201
1202
.lg-dialog StEntry {
1203
  min-height: 22px;
1204
  selection-background-color: #27a1b9;
1205
  selected-color: #e9e9ed;
1206
}
1207
1208
.lg-dialog .shell-link {
1209
  color: #4aafca;
1210
}
1211
1212
.lg-dialog .shell-link:hover {
1213
  color: #71c0d6;
1214
}
1215
1216
.lg-dialog .shell-link:active {
1217
  color: #3394ae;
1218
}
1219
1220
.lg-dialog .actor-link {
1221
  color: rgba(233, 233, 237, 0.5);
1222
}
1223
1224
.lg-dialog .actor-link:hover {
1225
  color: #e9e9ed;
1226
}
1227
1228
.lg-dialog .actor-link:active {
1229
  color: rgba(233, 233, 237, 0.7);
1230
}
1231
1232
.lg-dialog .actor-link StIcon {
1233
  icon-size: 12px;
1234
}
1235
1236
.lg-completions-text {
1237
  font-size: 0.9em;
1238
  font-style: italic;
1239
  color: rgba(233, 233, 237, 0.7);
1240
}
1241
1242
.lg-obj-inspector-title {
1243
  spacing: 6px;
1244
  color: rgba(233, 233, 237, 0.7);
1245
}
1246
1247
.lg-obj-inspector-button {
1248
  padding: 0 16px;
1249
  border: none;
1250
  border-radius: 12px;
1251
}
1252
1253
.lg-obj-inspector-button:hover {
1254
  border: none;
1255
}
1256
1257
#lookingGlassExtensions {
1258
  padding: 6px;
1259
  color: rgba(233, 233, 237, 0.7);
1260
}
1261
1262
.lg-extensions-list {
1263
  padding: 6px;
1264
  spacing: 6px;
1265
  color: rgba(233, 233, 237, 0.7);
1266
}
1267
1268
.lg-extension {
1269
  border: none;
1270
  border-radius: 12px;
1271
  background-color: rgba(233, 233, 237, 0.04);
1272
  color: rgba(233, 233, 237, 0.7);
1273
  padding: 12px;
1274
}
1275
1276
.lg-extension:hover {
1277
  color: #e9e9ed;
1278
  background-color: rgba(233, 233, 237, 0.12);
1279
}
1280
1281
.lg-extension:active {
1282
  color: #e9e9ed;
1283
  background-color: rgba(233, 233, 237, 0.3);
1284
}
1285
1286
.lg-extension-meta {
1287
  spacing: 6px;
1288
  color: rgba(233, 233, 237, 0.7);
1289
}
1290
1291
#LookingGlassPropertyInspector {
1292
  color: rgba(233, 233, 237, 0.7);
1293
  background: #323449;
1294
  border: none;
1295
  border-radius: 12px;
1296
  padding: 6px;
1297
  margin: 5px 8px 11px;
1298
  box-shadow: 0 3px 8px 0 rgba(0, 0, 0, 0.25);
1299
}
1300
1301
.lg-debug-flag-button {
1302
  color: rgba(233, 233, 237, 0.7);
1303
}
1304
1305
.lg-debug-flag-button StLabel {
1306
  padding: 6px, 12px;
1307
}
1308
1309
.lg-debug-flag-button:hover {
1310
  color: #e9e9ed;
1311
}
1312
1313
.lg-debug-flag-button:active {
1314
  color: #e9e9ed;
1315
}
1316
1317
.lg-debug-flags-header {
1318
  padding-top: 12px;
1319
  padding: 6px;
1320
}
1321
1322
.select-area-rubberband {
1323
  background-color: rgba(39, 161, 185, 0.3);
1324
  border: 1px solid #27a1b9;
1325
  border-radius: 12px;
1326
}
1327
1328
.user-icon {
1329
  background-size: contain;
1330
  color: rgba(233, 233, 237, 0.7);
1331
  border-radius: 9999px;
1332
  border: none;
1333
  box-shadow: none;
1334
  icon-size: 64px;
1335
}
1336
1337
.modal-dialog .user-icon {
1338
  box-shadow: none;
1339
}
1340
1341
.user-icon:hover {
1342
  color: #e9e9ed;
1343
}
1344
1345
.user-icon StIcon {
1346
  background-color: #e9e9ed;
1347
  border-radius: 9999px;
1348
  padding: 12px;
1349
  width: 40px;
1350
  height: 40px;
1351
}
1352
1353
.user-icon.user-avatar {
1354
  border: 2px solid #27a1b9;
1355
}
1356
1357
.user-widget.vertical .user-icon {
1358
  icon-size: 96px;
1359
}
1360
1361
.user-widget.vertical .user-icon StIcon {
1362
  padding: 20px;
1363
  padding-top: 18px;
1364
  padding-bottom: 22px;
1365
  width: 88px;
1366
  height: 88px;
1367
}
1368
1369
.lightbox {
1370
  background-color: black;
1371
}
1372
1373
.flashspot {
1374
  background-color: white;
1375
}
1376
1377
.hidden {
1378
  color: rgba(0, 0, 0, 0);
1379
}
1380
1381
.caps-lock-warning-label {
1382
  text-align: center;
1383
  padding-bottom: 8px;
1384
  font-size: 11pt;
1385
  color: #8c6c3e;
1386
}
1387
1388
/* Network Dialogs */
1389
.nm-dialog {
1390
  max-height: 34em;
1391
  min-height: 31em;
1392
  min-width: 32em;
1393
}
1394
1395
.nm-dialog-content {
1396
  spacing: 20px;
1397
  padding: 24px;
1398
}
1399
1400
.nm-dialog-header-hbox {
1401
  spacing: 10px;
1402
}
1403
1404
.nm-dialog-airplane-box {
1405
  spacing: 12px;
1406
}
1407
1408
.nm-dialog-airplane-headline {
1409
  font-weight: bold;
1410
  text-align: center;
1411
}
1412
1413
.nm-dialog-airplane-text {
1414
  color: #e9e9ed;
1415
}
1416
1417
.nm-dialog-header {
1418
  font-weight: bold;
1419
}
1420
1421
.nm-dialog-header-icon {
1422
  icon-size: 32px;
1423
}
1424
1425
.nm-dialog-header-hbox {
1426
  spacing: 10px;
1427
}
1428
1429
.nm-dialog-scroll-view {
1430
  border: none;
1431
  padding: 0;
1432
  background-color: rgba(233, 233, 237, 0.04);
1433
  border-radius: 12px;
1434
}
1435
1436
.nm-dialog-item {
1437
  font-size: 12pt;
1438
  border-bottom: none;
1439
  padding: 12px;
1440
  spacing: 0px;
1441
}
1442
1443
.nm-dialog-item:selected {
1444
  background-color: #27a1b9;
1445
  color: #e9e9ed;
1446
}
1447
1448
.nm-dialog-item:hover, .nm-dialog-item:focus {
1449
  background-color: rgba(233, 233, 237, 0.12);
1450
}
1451
1452
.nm-dialog-item:active {
1453
  background-color: rgba(233, 233, 237, 0.3);
1454
}
1455
1456
.nm-dialog-icon {
1457
  icon-size: 16px;
1458
}
1459
1460
.nm-dialog-icons {
1461
  spacing: 12px;
1462
}
1463
1464
.no-networks-label {
1465
  color: rgba(233, 233, 237, 0.5);
1466
}
1467
1468
.no-networks-box {
1469
  spacing: 6px;
1470
}
1471
1472
/* OSD */
1473
.screenshot-ui-panel, .workspace-switcher-container, .switcher-list, .resize-popup, .osd-window {
1474
  color: rgba(233, 233, 237, 0.7);
1475
  background-color: #1a1b26;
1476
  border: none;
1477
  box-shadow: 0 3px 8px 0 rgba(0, 0, 0, 0.25);
1478
  margin: 5px 8px 11px;
1479
  border-radius: 18px;
1480
  padding: 12px;
1481
}
1482
1483
.osd-window {
1484
  text-align: center;
1485
  font-weight: bold;
1486
}
1487
1488
.osd-window .osd-monitor-label {
1489
  font-size: 3em;
1490
}
1491
1492
.osd-window .level {
1493
  height: 2px;
1494
  border-radius: 2px;
1495
  background-color: rgba(233, 233, 237, 0.12);
1496
  color: #e9e9ed;
1497
  -barlevel-height: 2px;
1498
  -barlevel-background-color: rgba(233, 233, 237, 0.12);
1499
  -barlevel-active-background-color: #27a1b9;
1500
  -barlevel-overdrive-color: #f52a65;
1501
  -barlevel-overdrive-separator-width: 2px;
1502
  -barlevel-border-width: 0;
1503
  -barlevel-border-color: rgba(233, 233, 237, 0.12);
1504
}
1505
1506
.osd-window .level-bar {
1507
  background-color: white;
1508
  border-radius: 2px;
1509
}
1510
1511
.pad-osd-window {
1512
  padding: 32px;
1513
  background-color: #1a1b26;
1514
}
1515
1516
.pad-osd-window .pad-osd-title-box {
1517
  spacing: 12px;
1518
}
1519
1520
.pad-osd-window .pad-osd-title-menu-box {
1521
  spacing: 6px;
1522
}
1523
1524
.combo-box-label {
1525
  width: 15em;
1526
}
1527
1528
#overview StScrollBar StBin#trough {
1529
  background-color: rgba(233, 233, 237, 0.12);
1530
}
1531
1532
#overview StScrollBar StButton#vhandle,
1533
#overview StScrollBar StButton#hhandle {
1534
  background-color: rgba(233, 233, 237, 0.5);
1535
}
1536
1537
#overview StScrollBar StButton#vhandle:hover,
1538
#overview StScrollBar StButton#hhandle:hover {
1539
  background-color: rgba(233, 233, 237, 0.7);
1540
}
1541
1542
#overview StScrollBar StButton#vhandle:active,
1543
#overview StScrollBar StButton#hhandle:active {
1544
  background-color: #e9e9ed;
1545
}
1546
1547
#overview {
1548
  spacing: 24px;
1549
}
1550
1551
.overview-controls {
1552
  padding-bottom: 30px;
1553
}
1554
1555
/* Top Bar */
1556
#panel {
1557
  color: rgba(233, 233, 237, 0.7);
1558
  font-weight: bold;
1559
  font-feature-settings: 'tnum';
1560
  font-size: 12pt;
1561
  transition-duration: 250ms;
1562
  box-shadow: none;
1563
  border: none;
1564
  height: 35px;
1565
  background-color: rgba(26, 27, 38, 0.85);
1566
}
1567
1568
#panel .panel-corner {
1569
  -panel-corner-radius: 0;
1570
  -panel-corner-background-color: rgba(26, 27, 38, 0.6);
1571
  -panel-corner-border-width: 2px;
1572
  -panel-corner-border-color: transparent;
1573
  -panel-corner-opacity: 1;
1574
  transition-duration: 250ms;
1575
}
1576
1577
#panel .panel-button {
1578
  -natural-hpadding: 12px;
1579
  -minimum-hpadding: 12px;
1580
  font-weight: bold;
1581
  color: #e9e9ed;
1582
  transition-duration: 150ms;
1583
  border-radius: 12px;
1584
  text-shadow: none;
1585
  box-shadow: none;
1586
  border: 3px solid transparent;
1587
}
1588
1589
#panel .panel-button.clock-display {
1590
  box-shadow: none;
1591
}
1592
1593
#panel .panel-button.clock-display .clock {
1594
  transition-duration: 150ms;
1595
  border-radius: 12px;
1596
}
1597
1598
#panel .panel-button:hover {
1599
  color: #27a1b9;
1600
  background-color: transparent;
1601
  box-shadow: inset 0 0 0 1000px rgba(53, 54, 64, 0.624);
1602
}
1603
1604
#panel .panel-button:hover.clock-display {
1605
  box-shadow: none;
1606
  color: rgba(233, 233, 237, 0.7);
1607
}
1608
1609
#panel .panel-button:hover.clock-display .clock {
1610
  color: #27a1b9;
1611
  box-shadow: inset 0 0 0 1000px rgba(53, 54, 64, 0.624);
1612
}
1613
1614
#panel .panel-button:active, #panel .panel-button:active:hover, #panel .panel-button:overview, #panel .panel-button:overview:hover, #panel .panel-button:focus, #panel .panel-button:focus:hover, #panel .panel-button:checked, #panel .panel-button:checked:hover {
1615
  color: #27a1b9;
1616
  background-color: transparent;
1617
  box-shadow: inset 0 0 0 1000px rgba(76, 77, 86, 0.648);
1618
}
1619
1620
#panel .panel-button:active.clock-display, #panel .panel-button:overview.clock-display, #panel .panel-button:focus.clock-display, #panel .panel-button:checked.clock-display {
1621
  box-shadow: none;
1622
  color: rgba(233, 233, 237, 0.7);
1623
}
1624
1625
#panel .panel-button:active.clock-display .clock, #panel .panel-button:overview.clock-display .clock, #panel .panel-button:focus.clock-display .clock, #panel .panel-button:checked.clock-display .clock {
1626
  color: #27a1b9;
1627
  box-shadow: inset 0 0 0 1000px rgba(76, 77, 86, 0.648);
1628
}
1629
1630
.unlock-screen #panel .panel-button, .login-screen #panel .panel-button, .lock-screen #panel .panel-button {
1631
  color: #e9e9ed;
1632
}
1633
1634
.unlock-screen #panel .panel-button:focus, .unlock-screen #panel .panel-button:hover, .unlock-screen #panel .panel-button:active, .login-screen #panel .panel-button:focus, .login-screen #panel .panel-button:hover, .login-screen #panel .panel-button:active, .lock-screen #panel .panel-button:focus, .lock-screen #panel .panel-button:hover, .lock-screen #panel .panel-button:active {
1635
  color: #e9e9ed;
1636
}
1637
1638
#panel .panel-button .system-status-icon {
1639
  icon-size: 16px;
1640
  padding: 6px;
1641
  margin: 0;
1642
  -st-icon-style: symbolic;
1643
}
1644
1645
#panel .panel-button .appindicator-trayicons-box {
1646
  margin: 0 6px;
1647
}
1648
1649
#panel .panel-button .app-menu-icon {
1650
  -st-icon-style: symbolic;
1651
}
1652
1653
#panel .panel-button#panelActivities {
1654
  -natural-hpadding: 18px;
1655
}
1656
1657
#panel .panel-button#panelActivities StBoxLayout {
1658
  padding: 0 3px;
1659
  spacing: 6px;
1660
}
1661
1662
#panel .panel-button#panelActivities .workspace-dot {
1663
  border-radius: 9999px;
1664
  min-width: 8px;
1665
  min-height: 8px;
1666
  background-color: #e9e9ed;
1667
}
1668
1669
#panel:overview, #panel.unlock-screen, #panel.login-screen, #panel.lock-screen {
1670
  background-color: transparent;
1671
  box-shadow: none;
1672
  border: 2px solid transparent;
1673
}
1674
1675
#panel:overview StLabel,
1676
#panel:overview StIcon, #panel.unlock-screen StLabel,
1677
#panel.unlock-screen StIcon, #panel.login-screen StLabel,
1678
#panel.login-screen StIcon, #panel.lock-screen StLabel,
1679
#panel.lock-screen StIcon {
1680
  color: rgba(233, 233, 237, 0.7);
1681
}
1682
1683
#panel:overview .panel-button:hover, #panel.unlock-screen .panel-button:hover, #panel.login-screen .panel-button:hover, #panel.lock-screen .panel-button:hover {
1684
  color: #e9e9ed;
1685
  background-color: transparent;
1686
  box-shadow: inset 0 0 0 1000px rgba(233, 233, 237, 0.12);
1687
}
1688
1689
#panel:overview .panel-button:hover.clock-display, #panel.unlock-screen .panel-button:hover.clock-display, #panel.login-screen .panel-button:hover.clock-display, #panel.lock-screen .panel-button:hover.clock-display {
1690
  box-shadow: none;
1691
  color: #e9e9ed;
1692
}
1693
1694
#panel:overview .panel-button:hover.clock-display .clock, #panel.unlock-screen .panel-button:hover.clock-display .clock, #panel.login-screen .panel-button:hover.clock-display .clock, #panel.lock-screen .panel-button:hover.clock-display .clock {
1695
  color: #e9e9ed;
1696
  box-shadow: inset 0 0 0 1000px rgba(233, 233, 237, 0.12);
1697
}
1698
1699
#panel:overview .panel-button:active, #panel:overview .panel-button:overview, #panel:overview .panel-button:focus, #panel:overview .panel-button:checked, #panel.unlock-screen .panel-button:active, #panel.unlock-screen .panel-button:overview, #panel.unlock-screen .panel-button:focus, #panel.unlock-screen .panel-button:checked, #panel.login-screen .panel-button:active, #panel.login-screen .panel-button:overview, #panel.login-screen .panel-button:focus, #panel.login-screen .panel-button:checked, #panel.lock-screen .panel-button:active, #panel.lock-screen .panel-button:overview, #panel.lock-screen .panel-button:focus, #panel.lock-screen .panel-button:checked {
1700
  color: #e9e9ed;
1701
  background-color: transparent;
1702
  box-shadow: inset 0 0 0 1000px rgba(233, 233, 237, 0.2);
1703
}
1704
1705
#panel:overview .panel-button:active.clock-display, #panel:overview .panel-button:overview.clock-display, #panel:overview .panel-button:focus.clock-display, #panel:overview .panel-button:checked.clock-display, #panel.unlock-screen .panel-button:active.clock-display, #panel.unlock-screen .panel-button:overview.clock-display, #panel.unlock-screen .panel-button:focus.clock-display, #panel.unlock-screen .panel-button:checked.clock-display, #panel.login-screen .panel-button:active.clock-display, #panel.login-screen .panel-button:overview.clock-display, #panel.login-screen .panel-button:focus.clock-display, #panel.login-screen .panel-button:checked.clock-display, #panel.lock-screen .panel-button:active.clock-display, #panel.lock-screen .panel-button:overview.clock-display, #panel.lock-screen .panel-button:focus.clock-display, #panel.lock-screen .panel-button:checked.clock-display {
1706
  box-shadow: none;
1707
  color: #e9e9ed;
1708
}
1709
1710
#panel:overview .panel-button:active.clock-display .clock, #panel:overview .panel-button:overview.clock-display .clock, #panel:overview .panel-button:focus.clock-display .clock, #panel:overview .panel-button:checked.clock-display .clock, #panel.unlock-screen .panel-button:active.clock-display .clock, #panel.unlock-screen .panel-button:overview.clock-display .clock, #panel.unlock-screen .panel-button:focus.clock-display .clock, #panel.unlock-screen .panel-button:checked.clock-display .clock, #panel.login-screen .panel-button:active.clock-display .clock, #panel.login-screen .panel-button:overview.clock-display .clock, #panel.login-screen .panel-button:focus.clock-display .clock, #panel.login-screen .panel-button:checked.clock-display .clock, #panel.lock-screen .panel-button:active.clock-display .clock, #panel.lock-screen .panel-button:overview.clock-display .clock, #panel.lock-screen .panel-button:focus.clock-display .clock, #panel.lock-screen .panel-button:checked.clock-display .clock {
1711
  box-shadow: inset 0 0 0 1000px rgba(233, 233, 237, 0.2);
1712
  color: #e9e9ed;
1713
}
1714
1715
#panel:overview .panel-button#panelActivities .workspace-dot, #panel.unlock-screen .panel-button#panelActivities .workspace-dot, #panel.login-screen .panel-button#panelActivities .workspace-dot, #panel.lock-screen .panel-button#panelActivities .workspace-dot {
1716
  background-color: #e9e9ed;
1717
}
1718
1719
#panel:overview .panel-corner, #panel.unlock-screen .panel-corner, #panel.login-screen .panel-corner, #panel.lock-screen .panel-corner {
1720
  -panel-corner-radius: 0;
1721
  -panel-corner-background-color: transparent;
1722
  -panel-corner-border-color: transparent;
1723
}
1724
1725
#panel Gjs_status_keyboard_InputSourceIndicator.panel-button,
1726
#panel Gjs_appindicatorsupport_rgcjonas_gmail_com_indicatorStatusIcon_IndicatorStatusIcon.panel-button,
1727
#panel Gjs_appindicatorsupport_rgcjonas_gmail_com_indicatorStatusIcon_AppIndicatorsIndicatorStatusIcon.panel-button {
1728
  -natural-hpadding: 18px !important;
1729
  -minimum-hpadding: 18px !important;
1730
}
1731
1732
#panel .screencast-indicator,
1733
#panel .remote-access-indicator {
1734
  color: #8c6c3e;
1735
}
1736
1737
/* Popovers/Menus */
1738
.popup-menu-boxpointer {
1739
  -arrow-border-radius: 18px;
1740
  -arrow-background-color: transparent;
1741
  -arrow-border-width: 0;
1742
  -arrow-border-color: transparent;
1743
  -arrow-base: 12px;
1744
  -arrow-rise: 0;
1745
  -arrow-box-shadow: none;
1746
  background: transparent;
1747
}
1748
1749
.popup-menu {
1750
  min-width: 12em;
1751
  color: rgba(233, 233, 237, 0.7) !important;
1752
  padding: 0;
1753
  font-weight: normal;
1754
  border-radius: 18px;
1755
  box-shadow: none;
1756
  margin: 6px 6px 8px;
1757
  font-size: 11pt;
1758
}
1759
1760
.popup-menu .popup-menu-content {
1761
  padding: 6px;
1762
  background-color: #1a1b26;
1763
  border-radius: 12px;
1764
  margin: 0 2px;
1765
  box-shadow: 0 6px 15px -6px rgba(0, 0, 0, 0.25);
1766
  border: none;
1767
  font-weight: normal;
1768
}
1769
1770
.popup-menu .popup-menu-item {
1771
  spacing: 6px;
1772
  color: rgba(233, 233, 237, 0.7) !important;
1773
  text-shadow: none;
1774
  border-radius: 12px;
1775
  margin: 0 2px;
1776
  transition-duration: 100ms;
1777
  font-weight: normal;
1778
  background-color: transparent;
1779
}
1780
1781
.popup-menu .popup-menu-item:checked {
1782
  font-weight: normal;
1783
  border: none;
1784
  box-shadow: none;
1785
  color: #e9e9ed !important;
1786
  background-color: rgba(233, 233, 237, 0.12) !important;
1787
  border-radius: 12px 12px 0 0 !important;
1788
}
1789
1790
.popup-menu .popup-menu-item:checked:focus, .popup-menu .popup-menu-item:checked:hover, .popup-menu .popup-menu-item:checked.selected {
1791
  color: #e9e9ed !important;
1792
  background-color: alpha(currentColor, 0.08) !important;
1793
}
1794
1795
.popup-menu .popup-menu-item:checked:active {
1796
  color: #e9e9ed !important;
1797
  background-color: alpha(currentColor, 0.12) !important;
1798
}
1799
1800
.popup-menu .popup-menu-item:checked:insensitive {
1801
  color: rgba(233, 233, 237, 0.32) !important;
1802
}
1803
1804
.popup-menu .popup-menu-item:focus, .popup-menu .popup-menu-item:hover, .popup-menu .popup-menu-item.selected {
1805
  color: #27a1b9 !important;
1806
  background-color: rgba(233, 233, 237, 0.12) !important;
1807
  transition-duration: 0;
1808
}
1809
1810
.popup-menu .popup-menu-item:active, .popup-menu .popup-menu-item.selected:active {
1811
  color: #27a1b9 !important;
1812
  background-color: rgba(233, 233, 237, 0.3) !important;
1813
}
1814
1815
.popup-menu .popup-menu-item:insensitive {
1816
  color: rgba(233, 233, 237, 0.32) !important;
1817
}
1818
1819
.popup-menu .popup-sub-menu {
1820
  background-color: rgba(233, 233, 237, 0.12) !important;
1821
  color: rgba(233, 233, 237, 0.7) !important;
1822
  border: none;
1823
  box-shadow: none;
1824
  margin: 0;
1825
  border-radius: 0 0 12px 12px !important;
1826
}
1827
1828
.popup-menu .popup-sub-menu .popup-menu-item {
1829
  margin: 0;
1830
}
1831
1832
.popup-menu .popup-sub-menu .popup-menu-item:focus, .popup-menu .popup-sub-menu .popup-menu-item:hover, .popup-menu .popup-sub-menu .popup-menu-item.selected {
1833
  color: #e9e9ed !important;
1834
  background-color: rgba(233, 233, 237, 0.12) !important;
1835
}
1836
1837
.popup-menu .popup-sub-menu .popup-menu-item:active, .popup-menu .popup-sub-menu .popup-menu-item.selected:active {
1838
  color: #e9e9ed !important;
1839
  background-color: rgba(233, 233, 237, 0.3) !important;
1840
}
1841
1842
.popup-menu .popup-sub-menu .popup-menu-item:insensitive {
1843
  color: rgba(233, 233, 237, 0.32) !important;
1844
}
1845
1846
.popup-menu .popup-inactive-menu-item {
1847
  color: rgba(233, 233, 237, 0.7) !important;
1848
}
1849
1850
.popup-menu .popup-inactive-menu-item:insensitive {
1851
  color: rgba(233, 233, 237, 0.32) !important;
1852
}
1853
1854
.popup-menu.panel-menu {
1855
  -boxpointer-gap: 4px;
1856
  margin-bottom: 1.75em;
1857
}
1858
1859
.popup-menu-arrow,
1860
.popup-menu-icon {
1861
  icon-size: 16px;
1862
}
1863
1864
.popup-ornamented-menu-item:ltr {
1865
  padding-left: 6px;
1866
}
1867
1868
.popup-ornamented-menu-item:rtl {
1869
  padding-right: 6px;
1870
}
1871
1872
.background-menu {
1873
  -boxpointer-gap: 4px;
1874
  -arrow-rise: 0px;
1875
}
1876
1877
.aggregate-menu {
1878
  min-width: 20em;
1879
}
1880
1881
.aggregate-menu .popup-menu-icon {
1882
  padding: 0;
1883
  margin: 0 3px;
1884
  -st-icon-style: symbolic;
1885
}
1886
1887
.app-menu {
1888
  max-width: 27.25em;
1889
}
1890
1891
.app-menu .popup-menu-ornament {
1892
  width: 0 !important;
1893
}
1894
1895
.app-menu .popup-inactive-menu-item:first-child > StLabel:ltr {
1896
  margin-right: 8px;
1897
}
1898
1899
.app-menu .popup-inactive-menu-item:first-child > StLabel:rtl {
1900
  margin-left: 8px;
1901
}
1902
1903
/* Screen Shield */
1904
.unlock-dialog-clock {
1905
  color: white;
1906
  font-weight: 300;
1907
  text-align: center;
1908
  spacing: 24px;
1909
  padding-bottom: 2.5em;
1910
}
1911
1912
.unlock-dialog-clock-time {
1913
  font-size: 64pt;
1914
  padding-top: 42px;
1915
  font-feature-settings: 'tnum';
1916
}
1917
1918
.unlock-dialog-clock-date {
1919
  font-size: 16pt;
1920
  font-weight: normal;
1921
}
1922
1923
.unlock-dialog-clock-hint {
1924
  font-weight: normal;
1925
  padding-top: 48px;
1926
}
1927
1928
.unlock-dialog-notifications-container {
1929
  margin: 12px 0;
1930
  spacing: 6px;
1931
  width: 23em;
1932
  background-color: transparent;
1933
}
1934
1935
.unlock-dialog-notifications-container .summary-notification-stack-scrollview {
1936
  padding-top: 0;
1937
  padding-bottom: 0;
1938
}
1939
1940
.unlock-dialog-notifications-container .notification,
1941
.unlock-dialog-notifications-container .unlock-dialog-notification-source {
1942
  padding: 12px 6px;
1943
  border: none;
1944
  background-color: #1a1b26;
1945
  color: #e9e9ed;
1946
  border-radius: 18px;
1947
}
1948
1949
.unlock-dialog-notifications-container .notification.critical,
1950
.unlock-dialog-notifications-container .unlock-dialog-notification-source.critical {
1951
  background-color: #2b2c3e;
1952
}
1953
1954
.unlock-dialog-notification-label {
1955
  padding: 0px 0px 0px 12px;
1956
}
1957
1958
.unlock-dialog-notification-count-text {
1959
  weight: bold;
1960
  padding: 0 6px;
1961
  color: #e9e9ed;
1962
  background-color: #27a1b9;
1963
  border-radius: 9999px;
1964
  margin-right: 12px;
1965
}
1966
1967
.screen-shield-background {
1968
  background: black;
1969
  box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.15);
1970
}
1971
1972
#unlockDialogNotifications StButton#vhandle,
1973
#unlockDialogNotifications StButton#hhandle {
1974
  background-color: rgba(26, 27, 38, 0.3);
1975
}
1976
1977
#unlockDialogNotifications StButton#vhandle:hover, #unlockDialogNotifications StButton#vhandle:focus,
1978
#unlockDialogNotifications StButton#hhandle:hover,
1979
#unlockDialogNotifications StButton#hhandle:focus {
1980
  background-color: rgba(26, 27, 38, 0.5);
1981
}
1982
1983
#unlockDialogNotifications StButton#vhandle:active,
1984
#unlockDialogNotifications StButton#hhandle:active {
1985
  background-color: rgba(39, 161, 185, 0.5);
1986
}
1987
1988
/* Scrollbars */
1989
StScrollView.vfade {
1990
  -st-vfade-offset: 32px;
1991
}
1992
1993
StScrollView.hfade {
1994
  -st-hfade-offset: 32px;
1995
}
1996
1997
StScrollBar {
1998
  padding: 0;
1999
}
2000
2001
StScrollView StScrollBar {
2002
  min-width: 12px;
2003
  min-height: 12px;
2004
}
2005
2006
StScrollBar StBin#trough {
2007
  border-radius: 9999px;
2008
  background-color: rgba(233, 233, 237, 0.12);
2009
  margin: 3px;
2010
}
2011
2012
StScrollBar StButton#vhandle,
2013
StScrollBar StButton#hhandle {
2014
  border-radius: 9999px;
2015
  background-color: rgba(233, 233, 237, 0.5);
2016
  border: 3px solid transparent;
2017
  margin: 3px;
2018
}
2019
2020
StScrollBar StButton#vhandle:hover,
2021
StScrollBar StButton#hhandle:hover {
2022
  background-color: rgba(233, 233, 237, 0.7);
2023
}
2024
2025
StScrollBar StButton#vhandle:active,
2026
StScrollBar StButton#hhandle:active {
2027
  background-color: #e9e9ed;
2028
}
2029
2030
2031
.search-entry {
2032
  width: 320px;
2033
  min-height: 32px;
2034
  padding: 0 12px;
2035
  color: rgba(233, 233, 237, 0.7);
2036
  transition-duration: 150ms;
2037
  border-radius: 12px;
2038
  caret-color: #e9e9ed;
2039
  selection-background-color: rgba(233, 233, 237, 0.12);
2040
  selected-color: #e9e9ed !important;
2041
  color: #e9e9ed;
2042
  background-color: #323449;
2043
  border: 2px solid transparent !important;
2044
  box-shadow: none !important;
2045
}
2046
2047
2048
.search-entry:hover {
2049
  color: #e9e9ed;
2050
  background-color: #323449;
2051
  border: 2px solid rgba(233, 233, 237, 0.3) !important;
2052
  box-shadow: none !important;
2053
}
2054
2055
2056
.search-entry:focus {
2057
  color: #e9e9ed;
2058
  background-color: #323449;
2059
  border: 2px solid #27a1b9 !important;
2060
  box-shadow: none !important;
2061
}
2062
2063
2064
.search-entry .search-entry-icon {
2065
  icon-size: 16px;
2066
  padding: 0;
2067
  color: rgba(233, 233, 237, 0.32);
2068
}
2069
2070
2071
.search-entry:hover .search-entry-icon,
2072
.search-entry:focus .search-entry-icon {
2073
  color: rgba(233, 233, 237, 0.7);
2074
}
2075
2076
2077
.search-entry:insensitive {
2078
  border: none;
2079
  color: rgba(233, 233, 237, 0.32);
2080
}
2081
2082
2083
.search-entry StLabel.hint-text {
2084
  color: rgba(233, 233, 237, 0.5);
2085
}
2086
2087
/* Slider */
2088
.slider {
2089
  height: 20px;
2090
  color: #323449;
2091
  -slider-height: 2px;
2092
  -slider-background-color: rgba(233, 233, 237, 0.3);
2093
  -slider-border-color: #27a1b9;
2094
  -slider-active-background-color: #27a1b9;
2095
  -slider-active-border-color: #27a1b9;
2096
  -slider-border-width: 2px;
2097
  -slider-handle-radius: 7px;
2098
  -slider-handle-border-width: 2px;
2099
  -slider-handle-border-color: #27a1b9;
2100
  -barlevel-height: 15px;
2101
  -barlevel-background-color: rgba(233, 233, 237, 0.3);
2102
  -barlevel-border-color: transparent;
2103
  -barlevel-active-background-color: #27a1b9;
2104
  -barlevel-active-border-color: transparent;
2105
  -barlevel-overdrive-color: #f52a65;
2106
  -barlevel-overdrive-border-color: transparent;
2107
  -barlevel-overdrive-separator-width: 2px;
2108
  -barlevel-border-width: 0;
2109
}
2110
2111
/* App Switcher */
2112
.switcher-popup {
2113
  padding: 8px;
2114
  spacing: 24px;
2115
}
2116
2117
.switcher-list .item-box {
2118
  padding: 8px;
2119
  border-radius: 12px;
2120
  border: 1px solid transparent;
2121
  background-color: transparent;
2122
}
2123
2124
.switcher-list .item-box:outlined {
2125
  background-color: rgba(233, 233, 237, 0.12);
2126
  color: #e9e9ed;
2127
}
2128
2129
.switcher-list .item-box:selected {
2130
  background-color: #27a1b9;
2131
  color: #e9e9ed;
2132
}
2133
2134
.switcher-list .thumbnail-box {
2135
  padding: 2px;
2136
  spacing: 6px;
2137
}
2138
2139
.switcher-list .thumbnail {
2140
  width: 256px;
2141
}
2142
2143
.switcher-list .separator {
2144
  width: 1px;
2145
  background: rgba(233, 233, 237, 0.12);
2146
}
2147
2148
.switcher-list .switcher-list-item-container {
2149
  spacing: 12px;
2150
}
2151
2152
.switcher-arrow {
2153
  border-color: rgba(0, 0, 0, 0);
2154
  color: rgba(233, 233, 237, 0.5);
2155
}
2156
2157
.switcher-arrow:highlighted {
2158
  color: #e9e9ed;
2159
}
2160
2161
.input-source-switcher-symbol {
2162
  font-size: 34pt;
2163
  width: 96px;
2164
  height: 96px;
2165
}
2166
2167
.cycler-highlight {
2168
  border: 5px solid #27a1b9;
2169
}
2170
2171
/* Switches */
2172
.toggle-switch {
2173
  width: 46px;
2174
  height: 24px;
2175
  background-size: contain;
2176
}
2177
2178
.toggle-switch, .popup-sub-menu .toggle-switch {
2179
  background-image: url("assets/toggle-off.svg");
2180
}
2181
2182
.toggle-switch:checked, .popup-sub-menu .toggle-switch:checked {
2183
  background-image: url("assets/toggle-on-dark.svg");
2184
}
2185
2186
/* Tiled window previews */
2187
.tile-preview {
2188
  background-color: rgba(39, 161, 185, 0.3);
2189
  border: 1px solid #27a1b9;
2190
}
2191
2192
.tile-preview-left.on-primary {
2193
  border-radius: 13px 0 0 0;
2194
}
2195
2196
.tile-preview-right.on-primary {
2197
  border-radius: 0 13px 0 0;
2198
}
2199
2200
.tile-preview-left.tile-preview-right.on-primary {
2201
  border-radius: 13px 13px 0 0;
2202
}
2203
2204
/* Workspace Switcher */
2205
.workspace-switcher-group {
2206
  padding: 12px;
2207
}
2208
2209
.workspace-switcher {
2210
  background: transparent;
2211
  border: none;
2212
  border-radius: 0;
2213
  padding: 0;
2214
  spacing: 12px;
2215
}
2216
2217
.ws-switcher-box {
2218
  background: transparent;
2219
  height: 50px;
2220
  background-size: 32px;
2221
  background: rgba(233, 233, 237, 0.12);
2222
  border-radius: 12px;
2223
}
2224
2225
.ws-switcher-active-up,
2226
.ws-switcher-active-down,
2227
.ws-switcher-active-left,
2228
.ws-switcher-active-right {
2229
  height: 52px;
2230
  background-color: #27a1b9;
2231
  color: #e9e9ed;
2232
  border-radius: 15px;
2233
  border: none;
2234
}
2235
2236
/* App Icons */
2237
.icon-grid {
2238
  row-spacing: 12px;
2239
  column-spacing: 12px;
2240
  max-row-spacing: 36px;
2241
  max-column-spacing: 36px;
2242
  page-padding-top: 24px;
2243
  page-padding-bottom: 24px;
2244
  page-padding-left: 18px;
2245
  page-padding-right: 18px;
2246
}
2247
2248
.overview-tile, .grid-search-result {
2249
  color: rgba(233, 233, 237, 0.7);
2250
  border-radius: 30px;
2251
  padding: 15px;
2252
  border: none;
2253
  transition-duration: 100ms;
2254
  text-align: center;
2255
  background-color: transparent;
2256
}
2257
2258
.overview-tile:hover, .grid-search-result:hover, .overview-tile:focus, .grid-search-result:focus, .overview-tile:selected, .grid-search-result:selected {
2259
  color: #e9e9ed;
2260
  background-color: rgba(39, 161, 185, 0.3);
2261
  border-image: none;
2262
  background-image: none;
2263
}
2264
2265
.overview-tile:active, .grid-search-result:active, .overview-tile:checked, .grid-search-result:checked {
2266
  color: #e9e9ed;
2267
  background-color: rgba(39, 161, 185, 0.6);
2268
  box-shadow: none;
2269
}
2270
2271
.app-folder {
2272
  background-color: rgba(39, 161, 185, 0.3);
2273
  border-radius: 30px;
2274
  color: rgba(233, 233, 237, 0.7);
2275
}
2276
2277
.app-folder .overview-icon {
2278
  background-color: transparent;
2279
  border-radius: 30px;
2280
}
2281
2282
.app-folder:hover {
2283
  background-color: rgba(39, 161, 185, 0.6);
2284
  color: #e9e9ed;
2285
}
2286
2287
.app-folder:active {
2288
  background-color: rgba(233, 233, 237, 0.3);
2289
  color: #e9e9ed;
2290
}
2291
2292
.app-grid-running-dot {
2293
  width: 6px;
2294
  height: 3px;
2295
  border-radius: 2px;
2296
  background-color: rgba(233, 233, 237, 0.3);
2297
  margin-bottom: 0;
2298
}
2299
2300
StWidget.focused .app-grid-running-dot {
2301
  width: 24px;
2302
  background-color: #e9e9ed !important;
2303
}
2304
2305
.app-folder-dialog-container {
2306
  padding-top: 32px;
2307
}
2308
2309
.app-folder-dialog {
2310
  width: 720px;
2311
  height: 720px;
2312
  border-radius: 54px;
2313
  padding: 12px;
2314
  box-shadow: none;
2315
  border: none;
2316
  background-color: #1a1b26;
2317
}
2318
2319
.app-folder-dialog .folder-name-container {
2320
  padding: 24px 36px;
2321
  padding-bottom: 0;
2322
}
2323
2324
.app-folder-dialog .folder-name-container .folder-name-entry {
2325
  width: 12em;
2326
  border: none;
2327
  caret-color: #e9e9ed;
2328
}
2329
2330
.app-folder-dialog .folder-name-container .folder-name-entry:focus {
2331
  background-color: rgba(233, 233, 237, 0.12);
2332
  color: #e9e9ed;
2333
}
2334
2335
.app-folder-dialog .icon-button, .app-folder-dialog .background-app-item .close-button, .background-app-item .app-folder-dialog .close-button, .app-folder-dialog .message-notification-group .message-collapse-button, .message-notification-group .app-folder-dialog .message-collapse-button, .app-folder-dialog .message .message-header .message-expand-button, .message .message-header .app-folder-dialog .message-expand-button,
2336
.app-folder-dialog .message .message-header .message-close-button,
2337
.message .message-header .app-folder-dialog .message-close-button {
2338
  background-color: rgba(233, 233, 237, 0.06);
2339
  color: rgba(233, 233, 237, 0.7);
2340
  border: none;
2341
  padding: 0;
2342
  width: 36px;
2343
  height: 36px;
2344
  border-radius: 9999px;
2345
}
2346
2347
.app-folder-dialog .icon-button > StIcon, .app-folder-dialog .background-app-item .close-button > StIcon, .background-app-item .app-folder-dialog .close-button > StIcon, .app-folder-dialog .message-notification-group .message-collapse-button > StIcon, .message-notification-group .app-folder-dialog .message-collapse-button > StIcon, .app-folder-dialog .message .message-header .message-expand-button > StIcon, .message .message-header .app-folder-dialog .message-expand-button > StIcon,
2348
.app-folder-dialog .message .message-header .message-close-button > StIcon,
2349
.message .message-header .app-folder-dialog .message-close-button > StIcon {
2350
  icon-size: 16px;
2351
}
2352
2353
.app-folder-dialog .icon-button:hover, .app-folder-dialog .background-app-item .close-button:hover, .background-app-item .app-folder-dialog .close-button:hover, .app-folder-dialog .message-notification-group .message-collapse-button:hover, .message-notification-group .app-folder-dialog .message-collapse-button:hover, .app-folder-dialog .message .message-header .message-expand-button:hover, .message .message-header .app-folder-dialog .message-expand-button:hover,
2354
.app-folder-dialog .message .message-header .message-close-button:hover,
2355
.message .message-header .app-folder-dialog .message-close-button:hover {
2356
  background-color: rgba(233, 233, 237, 0.12);
2357
}
2358
2359
.app-folder-dialog .icon-button:checked, .app-folder-dialog .background-app-item .close-button:checked, .background-app-item .app-folder-dialog .close-button:checked, .app-folder-dialog .message-notification-group .message-collapse-button:checked, .message-notification-group .app-folder-dialog .message-collapse-button:checked, .app-folder-dialog .message .message-header .message-expand-button:checked, .message .message-header .app-folder-dialog .message-expand-button:checked,
2360
.app-folder-dialog .message .message-header .message-close-button:checked,
2361
.message .message-header .app-folder-dialog .message-close-button:checked, .app-folder-dialog .icon-button:active, .app-folder-dialog .background-app-item .close-button:active, .background-app-item .app-folder-dialog .close-button:active, .app-folder-dialog .message-notification-group .message-collapse-button:active, .message-notification-group .app-folder-dialog .message-collapse-button:active, .app-folder-dialog .message .message-header .message-expand-button:active, .message .message-header .app-folder-dialog .message-expand-button:active,
2362
.app-folder-dialog .message .message-header .message-close-button:active,
2363
.message .message-header .app-folder-dialog .message-close-button:active {
2364
  background-color: #e9e9ed;
2365
  color: rgba(26, 27, 38, 0.87);
2366
}
2367
2368
.app-folder-dialog .page-indicators {
2369
  margin-bottom: 18px;
2370
}
2371
2372
.rename-folder-popup .rename-folder-popup-item {
2373
  spacing: 6px;
2374
}
2375
2376
.rename-folder-popup .rename-folder-popup-item:ltr, .rename-folder-popup .rename-folder-popup-item:rtl {
2377
  padding: 0 12px;
2378
}
2379
2380
.system-action-icon {
2381
  box-shadow: 0 4px 4px rgba(0, 0, 0, 0.2);
2382
  background-color: #1a1b26;
2383
  color: #e9e9ed;
2384
  border-radius: 9999px;
2385
  icon-size: 48px;
2386
}
2387
2388
.page-navigation-hint.dnd {
2389
  background: rgba(255, 255, 255, 0.1);
2390
}
2391
2392
.page-navigation-hint.next:ltr, .page-navigation-hint.previous:rtl {
2393
  background-gradient-start: rgba(255, 255, 255, 0.05);
2394
  background-gradient-end: transparent;
2395
  background-gradient-direction: horizontal;
2396
  border-radius: 27px 0px 0px 27px;
2397
}
2398
2399
.page-navigation-hint.previous:ltr, .page-navigation-hint.next:rtl {
2400
  background-gradient-start: transparent;
2401
  background-gradient-end: rgba(255, 255, 255, 0.05);
2402
  background-gradient-direction: horizontal;
2403
  border-radius: 0px 27px 27px 0px;
2404
}
2405
2406
.page-navigation-arrow {
2407
  margin: 6px;
2408
  padding: 18px;
2409
  width: 24px;
2410
  height: 24px;
2411
  border-radius: 9999px;
2412
  transition-duration: 100ms;
2413
  color: rgba(233, 233, 237, 0.7);
2414
  background-color: transparent;
2415
}
2416
2417
.page-navigation-arrow > StIcon {
2418
  color: #e9e9ed;
2419
}
2420
2421
.page-navigation-arrow:insensitive {
2422
  background-color: transparent;
2423
  color: rgba(233, 233, 237, 0.5);
2424
}
2425
2426
.page-navigation-arrow:hover {
2427
  background-color: rgba(233, 233, 237, 0.12);
2428
  color: #e9e9ed;
2429
}
2430
2431
.page-navigation-arrow:active {
2432
  background-color: rgba(233, 233, 237, 0.3);
2433
  color: #e9e9ed;
2434
}
2435
2436
/* Date/Time Menu */
2437
.popup-menu .message, .world-clocks-button,
2438
.weather-button,
2439
.events-button {
2440
  color: rgba(233, 233, 237, 0.7);
2441
  background-color: rgba(233, 233, 237, 0.04);
2442
  border-radius: 12px;
2443
  border: none;
2444
  box-shadow: none;
2445
  text-shadow: none;
2446
}
2447
2448
.popup-menu .message:hover, .world-clocks-button:hover,
2449
.weather-button:hover,
2450
.events-button:hover, .popup-menu .message:focus, .world-clocks-button:focus,
2451
.weather-button:focus,
2452
.events-button:focus {
2453
  color: #e9e9ed;
2454
  background-color: rgba(233, 233, 237, 0.12);
2455
  box-shadow: none;
2456
}
2457
2458
.popup-menu .message:active, .world-clocks-button:active,
2459
.weather-button:active,
2460
.events-button:active {
2461
  color: #e9e9ed;
2462
  background-color: rgba(233, 233, 237, 0.2);
2463
  box-shadow: none;
2464
}
2465
2466
#calendarArea {
2467
  padding: 0;
2468
}
2469
2470
.datemenu-calendar-column {
2471
  spacing: 6px;
2472
  border: none;
2473
  padding: 0 !important;
2474
  margin: 0 !important;
2475
}
2476
2477
.datemenu-calendar-column:ltr {
2478
  margin-right: 0;
2479
  border-left-width: 0;
2480
}
2481
2482
.datemenu-calendar-column:rtl {
2483
  margin-left: 0;
2484
  border-right-width: 0;
2485
}
2486
2487
.datemenu-calendar-column .datemenu-displays-section {
2488
  padding-bottom: 0;
2489
}
2490
2491
.datemenu-calendar-column .datemenu-displays-box {
2492
  spacing: 6px;
2493
}
2494
2495
.world-clocks-header,
2496
.weather-header,
2497
.events-section-title {
2498
  color: rgba(233, 233, 237, 0.7);
2499
  font-weight: bold;
2500
}
2501
2502
.datemenu-today-button,
2503
.datemenu-displays-box {
2504
  margin: 4px 6px;
2505
}
2506
2507
/* today button (the date) */
2508
.datemenu-today-button {
2509
  border: none;
2510
  box-shadow: none;
2511
  background: none;
2512
  padding: 6px 12px;
2513
  margin: 0;
2514
  text-shadow: none;
2515
  color: rgba(233, 233, 237, 0.7);
2516
  border-radius: 12px;
2517
  margin: 4px;
2518
}
2519
2520
.datemenu-today-button:ltr {
2521
  margin-left: 4px;
2522
}
2523
2524
.datemenu-today-button:rtl {
2525
  margin-right: 4px;
2526
}
2527
2528
.datemenu-today-button:hover, .datemenu-today-button:focus {
2529
  background-color: rgba(233, 233, 237, 0.12);
2530
}
2531
2532
.datemenu-today-button:active {
2533
  background-color: rgba(233, 233, 237, 0.2);
2534
}
2535
2536
.datemenu-today-button .day-label {
2537
  font-size: 13pt;
2538
  font-weight: bold;
2539
}
2540
2541
.datemenu-today-button .date-label {
2542
  font-size: 19pt;
2543
  font-weight: normal;
2544
}
2545
2546
/* Calendar */
2547
.calendar {
2548
  border: none;
2549
  box-shadow: none;
2550
  background-color: transparent;
2551
  padding: 6px !important;
2552
  margin: 4px !important;
2553
  text-shadow: none;
2554
  border-radius: 18px;
2555
  color: rgba(233, 233, 237, 0.7);
2556
}
2557
2558
.calendar .calendar-month-label {
2559
  padding: 6px 0;
2560
  color: rgba(233, 233, 237, 0.7) !important;
2561
  font-weight: bold;
2562
  text-align: center;
2563
  text-shadow: none;
2564
  background-color: transparent;
2565
}
2566
2567
.calendar .calendar-change-month-back,
2568
.calendar .calendar-change-month-forward {
2569
  padding: 0 !important;
2570
  margin: 3px 0 !important;
2571
}
2572
2573
.calendar .calendar-change-month-back StIcon,
2574
.calendar .calendar-change-month-forward StIcon {
2575
  icon-size: 16px;
2576
}
2577
2578
.calendar .pager-button {
2579
  width: 32px !important;
2580
  height: 32px !important;
2581
  margin: 2px !important;
2582
  border-radius: 9999px;
2583
  background-color: transparent;
2584
  color: #e9e9ed;
2585
  box-shadow: none !important;
2586
}
2587
2588
.calendar .pager-button:hover, .calendar .pager-button:focus {
2589
  background-color: rgba(233, 233, 237, 0.12);
2590
  box-shadow: none !important;
2591
}
2592
2593
.calendar .pager-button:active {
2594
  background-color: rgba(233, 233, 237, 0.3);
2595
  box-shadow: none !important;
2596
}
2597
2598
.calendar .calendar-day {
2599
  font-size: 11pt;
2600
  text-align: center;
2601
  width: 34px !important;
2602
  height: 34px !important;
2603
  padding: 0 !important;
2604
  margin: 2px !important;
2605
  border-radius: 9999px;
2606
  color: rgba(233, 233, 237, 0.7) !important;
2607
  border: none;
2608
  font-feature-settings: 'tnum';
2609
  background-color: transparent;
2610
}
2611
2612
.calendar .calendar-day:hover, .calendar .calendar-day:focus {
2613
  background-color: rgba(233, 233, 237, 0.12);
2614
  box-shadow: none !important;
2615
  outline: none !important;
2616
}
2617
2618
.calendar .calendar-day:active, .calendar .calendar-day:selected {
2619
  color: #e9e9ed !important;
2620
  background-color: rgba(233, 233, 237, 0.3);
2621
  border-color: transparent !important;
2622
  box-shadow: none !important;
2623
  outline: none !important;
2624
}
2625
2626
.calendar .calendar-day.calendar-weekend {
2627
  color: rgba(233, 233, 237, 0.5) !important;
2628
}
2629
2630
.calendar .calendar-day {
2631
  border-width: 0;
2632
}
2633
2634
.calendar .calendar-day-top {
2635
  border-top-width: 0;
2636
}
2637
2638
.calendar .calendar-day-left {
2639
  border-left-width: 0;
2640
}
2641
2642
.calendar .calendar-nonwork-day {
2643
  color: #e9e9ed;
2644
}
2645
2646
.calendar .calendar-today {
2647
  font-weight: bold;
2648
  color: rgba(233, 233, 237, 0.7) !important;
2649
  background-color: rgba(233, 233, 237, 0.06);
2650
  border: none;
2651
}
2652
2653
.calendar .calendar-today:hover, .calendar .calendar-today:focus {
2654
  background-color: rgba(233, 233, 237, 0.12);
2655
  color: #e9e9ed !important;
2656
}
2657
2658
.calendar .calendar-today:active {
2659
  background-color: #238fa4;
2660
  color: #e9e9ed !important;
2661
}
2662
2663
.calendar .calendar-today:selected {
2664
  background-color: #27a1b9;
2665
  color: #1a1b26 !important;
2666
}
2667
2668
.calendar .calendar-today:selected:hover, .calendar .calendar-today:selected:focus {
2669
  background-color: #34bad4;
2670
  color: #1a1b26 !important;
2671
}
2672
2673
.calendar .calendar-day-with-events {
2674
  color: rgba(233, 233, 237, 0.7);
2675
  background-image: url("assets/calendar-today.svg");
2676
}
2677
2678
.calendar .calendar-day-with-events.calendar-work-day {
2679
  color: rgba(233, 233, 237, 0.7);
2680
  font-weight: bold;
2681
}
2682
2683
.calendar .calendar-other-month {
2684
  color: rgba(233, 233, 237, 0.32) !important;
2685
  font-weight: normal;
2686
}
2687
2688
.calendar .calendar-other-month.calendar-weekend {
2689
  color: rgba(233, 233, 237, 0.32) !important;
2690
}
2691
2692
.calendar .calendar-day-heading {
2693
  font-weight: bold;
2694
  text-align: center;
2695
  margin: 4px;
2696
  padding: 3px 6px;
2697
  border-radius: 12px;
2698
  background-color: transparent;
2699
  color: #e9e9ed;
2700
}
2701
2702
.calendar .calendar-week-number {
2703
  width: 26px;
2704
  height: 20px;
2705
  margin: 6px 2px !important;
2706
  padding: 0;
2707
  border-radius: 12px;
2708
  background-color: rgba(233, 233, 237, 0.04);
2709
  color: rgba(233, 233, 237, 0.5);
2710
  font-weight: bold;
2711
  font-feature-settings: 'tnum';
2712
  text-align: center;
2713
}
2714
2715
.world-clocks-button,
2716
.weather-button,
2717
.events-button {
2718
  padding: 12px !important;
2719
  margin: 4px 0 0 !important;
2720
}
2721
2722
.events-button .events-box {
2723
  spacing: 6px;
2724
}
2725
2726
.events-button .events-list {
2727
  spacing: 12px;
2728
  text-shadow: none;
2729
  color: rgba(233, 233, 237, 0.7);
2730
}
2731
2732
.events-button .events-title {
2733
  font-weight: bold;
2734
  text-shadow: none;
2735
  color: rgba(233, 233, 237, 0.5);
2736
}
2737
2738
.events-button .event-time {
2739
  font-feature-settings: 'tnum';
2740
  font-size: 11pt;
2741
  color: rgba(233, 233, 237, 0.5);
2742
}
2743
2744
.world-clocks-button .world-clocks-grid {
2745
  spacing-rows: 6px;
2746
  spacing-columns: 12px;
2747
}
2748
2749
.world-clocks-button .world-clocks-header {
2750
  color: rgba(233, 233, 237, 0.5);
2751
}
2752
2753
.world-clocks-button .world-clocks-city {
2754
  font-weight: bold;
2755
  font-size: 12pt;
2756
  color: rgba(233, 233, 237, 0.7);
2757
}
2758
2759
.world-clocks-button .world-clocks-time {
2760
  font-feature-settings: 'tnum';
2761
  font-size: 12pt;
2762
  color: #e9e9ed;
2763
}
2764
2765
.world-clocks-button .world-clocks-time:ltr {
2766
  text-align: right;
2767
}
2768
2769
.world-clocks-button .world-clocks-time:rtl {
2770
  text-align: left;
2771
}
2772
2773
.world-clocks-button .world-clocks-timezone {
2774
  font-feature-settings: 'tnum';
2775
  font-size: 11pt;
2776
  color: rgba(233, 233, 237, 0.5);
2777
}
2778
2779
.world-clocks-grid,
2780
.weather-grid {
2781
  spacing-rows: 0.4em;
2782
  spacing-columns: 0.8em;
2783
}
2784
2785
.weather-button .weather-box {
2786
  spacing: 10px;
2787
}
2788
2789
.weather-button .weather-header-box {
2790
  spacing: 6px;
2791
}
2792
2793
.weather-button .weather-header {
2794
  font-weight: bold;
2795
  color: rgba(233, 233, 237, 0.7);
2796
}
2797
2798
.weather-button .weather-header.location {
2799
  font-weight: normal;
2800
  font-size: 11pt;
2801
  color: rgba(233, 233, 237, 0.5);
2802
}
2803
2804
.weather-button .weather-grid {
2805
  spacing-rows: 6px;
2806
  spacing-columns: 12px;
2807
}
2808
2809
.weather-button .weather-forecast-time {
2810
  font-feature-settings: 'tnum';
2811
  font-size: 10pt;
2812
  font-weight: normal;
2813
  padding-top: 0.2em;
2814
  padding-bottom: 0.4em;
2815
  color: rgba(233, 233, 237, 0.7);
2816
}
2817
2818
.weather-button .weather-forecast-icon {
2819
  icon-size: 32px;
2820
}
2821
2822
.weather-button .weather-forecast-temp {
2823
  font-weight: bold;
2824
}
2825
2826
/* Check Boxes */
2827
.check-box StBoxLayout {
2828
  spacing: 0.8em;
2829
}
2830
2831
.check-box StBin {
2832
  width: 24px;
2833
  height: 24px;
2834
  padding: 3px;
2835
  border-radius: 9999px;
2836
}
2837
2838
.check-box StIcon {
2839
  icon-size: 0;
2840
  padding: 0;
2841
  color: transparent !important;
2842
  border: none !important;
2843
  background-color: transparent !important;
2844
}
2845
2846
.check-box StBin, .check-box:focus StBin {
2847
  background-image: url("assets/checkbox-off.svg");
2848
  background-color: tranparent;
2849
  box-shadow: none;
2850
}
2851
2852
.check-box:hover StBin {
2853
  background-image: url("assets/checkbox-off-hover.svg");
2854
  box-shadow: 0 0 0 6px rgba(233, 233, 237, 0.04);
2855
}
2856
2857
.check-box:active StBin {
2858
  background-image: url("assets/checkbox-off-active.svg");
2859
}
2860
2861
.check-box:checked StBin, .check-box:focus:checked StBin {
2862
  background-image: url("assets/checkbox.svg");
2863
}
2864
2865
/* Dash */
2866
#dash {
2867
  margin-top: 16px;
2868
}
2869
2870
#dash .dash-background {
2871
  background-color: rgba(50, 52, 73, 0.65);
2872
  box-shadow: inset 0 0 0 1px rgba(233, 233, 237, 0.12);
2873
  border: none;
2874
  /* remove black border on ubuntu */
2875
  padding: 4px 3px;
2876
  border-radius: 23px;
2877
}
2878
2879
#dash .dash-item-container .placeholder {
2880
  background-image: none;
2881
  background-size: contain;
2882
  height: 32px;
2883
}
2884
2885
#dash .dash-item-container .empty-dash-drop-target {
2886
  width: 32px;
2887
  height: 32px;
2888
}
2889
2890
#dash .dash-item-container .show-apps,
2891
#dash .dash-item-container .overview-tile,
2892
#dash .dash-item-container .grid-search-result {
2893
  background: none;
2894
  box-shadow: none;
2895
  border: none;
2896
  border-radius: 0;
2897
  padding: 0;
2898
  margin: 0 2px;
2899
  padding-bottom: 16px;
2900
}
2901
2902
#dash .dash-item-container .show-apps .overview-icon,
2903
#dash .dash-item-container .overview-tile .overview-icon,
2904
#dash .dash-item-container .grid-search-result .overview-icon {
2905
  border-radius: 18px;
2906
  padding: 6px;
2907
  spacing: 6px;
2908
  text-align: center;
2909
  transition-duration: 100ms;
2910
  background-color: transparent;
2911
  color: #e9e9ed;
2912
}
2913
2914
#dash .dash-item-container .show-apps:focus .overview-icon,
2915
#dash .dash-item-container .overview-tile:focus .overview-icon,
2916
#dash .dash-item-container .grid-search-result:focus .overview-icon {
2917
  background-color: rgba(233, 233, 237, 0.12);
2918
}
2919
2920
#dash .dash-item-container .show-apps:hover .overview-icon,
2921
#dash .dash-item-container .overview-tile:hover .overview-icon,
2922
#dash .dash-item-container .grid-search-result:hover .overview-icon {
2923
  background-color: rgba(233, 233, 237, 0.15);
2924
  box-shadow: inset 0 0 0 1px rgba(233, 233, 237, 0.15);
2925
}
2926
2927
#dash .dash-item-container .show-apps:active .overview-icon,
2928
#dash .dash-item-container .overview-tile:active .overview-icon,
2929
#dash .dash-item-container .grid-search-result:active .overview-icon {
2930
  background-color: rgba(233, 233, 237, 0.3);
2931
}
2932
2933
#dash .dash-item-container .show-apps:checked .overview-icon,
2934
#dash .dash-item-container .overview-tile:checked .overview-icon,
2935
#dash .dash-item-container .grid-search-result:checked .overview-icon {
2936
  background-color: rgba(233, 233, 237, 0.12);
2937
}
2938
2939
#dash .dash-item-container .app-well-app-running-dot,
2940
#dash .dash-item-container .app-grid-running-dot {
2941
  margin-bottom: 12px;
2942
  offset-y: 8px;
2943
  width: 6px;
2944
  height: 6px;
2945
  border-radius: 9999px;
2946
  background-color: #e9e9ed;
2947
}
2948
2949
#dash .dash-separator {
2950
  width: 1px;
2951
  margin-left: 4px;
2952
  margin-right: 4px;
2953
  background-color: rgba(233, 233, 237, 0.25);
2954
}
2955
2956
#dash .dash-separator,
2957
#dash .dash-background {
2958
  margin-bottom: 16px;
2959
}
2960
2961
.dash-label {
2962
  color: #e9e9ed;
2963
  background-color: rgba(50, 52, 73, 0.65);
2964
  border-radius: 12px;
2965
  padding: 6px 12px;
2966
  box-shadow: none;
2967
  border: none;
2968
  text-align: center;
2969
  -y-offset: 12px;
2970
  -x-offset: 8px;
2971
}
2972
2973
/* Modal Dialogs */
2974
.modal-dialog, .candidate-popup-content {
2975
  background-color: #292e42;
2976
  border-radius: 18px;
2977
  border: none;
2978
  box-shadow: inset 0 0.5px rgba(233, 233, 237, 0.1);
2979
}
2980
2981
.modal-dialog-button:last-child, .modal-dialog-linked-button:last-child {
2982
  background-color: #27a1b9;
2983
  color: #1a1b26;
2984
}
2985
2986
.modal-dialog-button:hover:last-child, .modal-dialog-linked-button:hover:last-child {
2987
  background-color: #39bbd5;
2988
  color: #1a1b26;
2989
}
2990
2991
.modal-dialog-button:active:last-child, .modal-dialog-linked-button:active:last-child {
2992
  background-color: #238fa4;
2993
  color: #1a1b26;
2994
}
2995
2996
.modal-dialog-button:insensitive:last-child, .modal-dialog-linked-button:insensitive:last-child {
2997
  background-color: rgba(39, 161, 185, 0.05);
2998
  color: rgba(39, 161, 185, 0.35);
2999
}
3000
3001
.headline {
3002
  font-size: 13pt;
3003
}
3004
3005
.modal-dialog {
3006
  color: rgba(233, 233, 237, 0.7);
3007
  padding: 12px;
3008
}
3009
3010
.modal-dialog-button, .modal-dialog-linked-button {
3011
  min-height: 32px !important;
3012
  padding: 6px !important;
3013
  margin: 0 !important;
3014
  border: none !important;
3015
  border-radius: 12px;
3016
}
3017
3018
.modal-dialog-button:first-child, .modal-dialog-linked-button:first-child {
3019
  background-color: rgba(233, 233, 237, 0.04);
3020
}
3021
3022
.modal-dialog-button:first-child:focus, .modal-dialog-linked-button:first-child:focus {
3023
  color: #e9e9ed;
3024
  background-color: rgba(233, 233, 237, 0.08);
3025
  box-shadow: none !important;
3026
}
3027
3028
.modal-dialog-button:first-child:hover, .modal-dialog-linked-button:first-child:hover {
3029
  color: #e9e9ed;
3030
  background-color: rgba(233, 233, 237, 0.12);
3031
}
3032
3033
.modal-dialog-button:first-child:active, .modal-dialog-linked-button:first-child:active {
3034
  color: #e9e9ed;
3035
  background-color: rgba(233, 233, 237, 0.2);
3036
  box-shadow: none !important;
3037
}
3038
3039
.modal-dialog .modal-dialog-button-box {
3040
  padding-top: 6px;
3041
}
3042
3043
.modal-dialog .modal-dialog-content-box {
3044
  margin: 6px;
3045
  spacing: 6px;
3046
  max-width: 28em;
3047
}
3048
3049
.end-session-dialog {
3050
  width: 26em;
3051
}
3052
3053
.end-session-dialog .end-session-dialog-battery-warning,
3054
.end-session-dialog .dialog-list-title {
3055
  color: #8c6c3e;
3056
  background-color: rgba(140, 108, 62, 0.1);
3057
  padding: 9px;
3058
  border-radius: 12px;
3059
  margin: 4px 0;
3060
}
3061
3062
.message-dialog-content {
3063
  spacing: 18px;
3064
}
3065
3066
.message-dialog-content .message-dialog-title {
3067
  text-align: center;
3068
}
3069
3070
.message-dialog-content .message-dialog-description {
3071
  text-align: center;
3072
}
3073
3074
.dialog-list {
3075
  spacing: 18px;
3076
}
3077
3078
.dialog-list .dialog-list-title {
3079
  text-align: center;
3080
}
3081
3082
.dialog-list .dialog-list-scrollview {
3083
  max-height: 200px;
3084
}
3085
3086
.dialog-list .dialog-list-box {
3087
  spacing: 1em;
3088
}
3089
3090
.dialog-list .dialog-list-box .dialog-list-item {
3091
  spacing: 1em;
3092
}
3093
3094
.dialog-list .dialog-list-box .dialog-list-item .dialog-list-item-title {
3095
  font-weight: bold;
3096
}
3097
3098
.dialog-list .dialog-list-box .dialog-list-item .dialog-list-item-description {
3099
  color: rgba(233, 233, 237, 0.7);
3100
}
3101
3102
.run-dialog {
3103
  width: 26em;
3104
  padding-bottom: 6px;
3105
}
3106
3107
.run-dialog .run-dialog-entry {
3108
  padding: 12px 9px;
3109
}
3110
3111
.run-dialog .run-dialog-description {
3112
  text-align: center;
3113
  color: rgba(233, 233, 237, 0.7);
3114
}
3115
3116
.prompt-dialog {
3117
  width: 28em;
3118
}
3119
3120
.prompt-dialog .prompt-dialog-password-grid {
3121
  spacing-rows: 8px;
3122
  spacing-columns: 4px;
3123
}
3124
3125
.prompt-dialog .prompt-dialog-password-grid .prompt-dialog-password-entry {
3126
  width: auto;
3127
}
3128
3129
.prompt-dialog .prompt-dialog-password-grid .prompt-dialog-password-entry:ltr {
3130
  margin-left: 20px;
3131
}
3132
3133
.prompt-dialog .prompt-dialog-password-grid .prompt-dialog-password-entry:rtl {
3134
  margin-right: 20px;
3135
}
3136
3137
.prompt-dialog .prompt-dialog-password-layout {
3138
  spacing: 8px;
3139
}
3140
3141
.prompt-dialog .prompt-dialog-password-entry {
3142
  width: 20em;
3143
  padding: 12px 9px;
3144
}
3145
3146
.prompt-dialog .prompt-dialog-error-label,
3147
.prompt-dialog .prompt-dialog-info-label,
3148
.prompt-dialog .prompt-dialog-null-label {
3149
  text-align: center;
3150
}
3151
3152
.prompt-dialog .prompt-dialog-error-label {
3153
  color: #8c6c3e;
3154
}
3155
3156
.polkit-dialog-user-layout {
3157
  text-align: center;
3158
  spacing: 8px;
3159
  margin-bottom: 6px;
3160
}
3161
3162
.polkit-dialog-user-layout .polkit-dialog-user-root-label {
3163
  color: #8c6c3e;
3164
}
3165
3166
.audio-device-selection-dialog {
3167
  min-width: 24em;
3168
}
3169
3170
.audio-device-selection-dialog .audio-selection-box {
3171
  spacing: 12px;
3172
}
3173
3174
.audio-device-selection-dialog .audio-selection-box .audio-selection-device {
3175
  border: 1px solid rgba(233, 233, 237, 0.12);
3176
  border-radius: 12px;
3177
}
3178
3179
.audio-device-selection-dialog .audio-selection-box .audio-selection-device:hover, .audio-device-selection-dialog .audio-selection-box .audio-selection-device:focus {
3180
  background-color: rgba(233, 233, 237, 0.12);
3181
}
3182
3183
.audio-device-selection-dialog .audio-selection-box .audio-selection-device:active {
3184
  background-color: #27a1b9;
3185
  color: #e9e9ed;
3186
}
3187
3188
.audio-device-selection-dialog .audio-selection-box .audio-selection-device .audio-selection-device-box {
3189
  padding: 12px;
3190
  spacing: 12px;
3191
}
3192
3193
.audio-device-selection-dialog .audio-selection-box .audio-selection-device .audio-selection-device-icon {
3194
  icon-size: 64px;
3195
}
3196
3197
.welcome-dialog-image {
3198
  background-image: url("resource:///org/gnome/shell/theme/gnome-shell-start.svg");
3199
  background-size: contain;
3200
  height: 300px;
3201
  width: 300px;
3202
}
3203
3204
/* Access portal dialog */
3205
.access-dialog {
3206
  text-align: center;
3207
}
3208
3209
/* Modal Dialogs */
3210
.modal-dialog, .candidate-popup-content {
3211
  background-color: #292e42;
3212
  border-radius: 18px;
3213
  border: none;
3214
  box-shadow: inset 0 0.5px rgba(233, 233, 237, 0.1);
3215
}
3216
3217
.modal-dialog-linked-button:last-child, .modal-dialog-button:last-child {
3218
  background-color: #27a1b9;
3219
  color: #1a1b26;
3220
}
3221
3222
.modal-dialog-linked-button:hover:last-child, .modal-dialog-button:hover:last-child {
3223
  background-color: #39bbd5;
3224
  color: #1a1b26;
3225
}
3226
3227
.modal-dialog-linked-button:active:last-child, .modal-dialog-button:active:last-child {
3228
  background-color: #238fa4;
3229
  color: #1a1b26;
3230
}
3231
3232
.modal-dialog-linked-button:insensitive:last-child, .modal-dialog-button:insensitive:last-child {
3233
  background-color: rgba(39, 161, 185, 0.05);
3234
  color: rgba(39, 161, 185, 0.35);
3235
}
3236
3237
.headline {
3238
  font-size: 13pt;
3239
}
3240
3241
.modal-dialog {
3242
  color: rgba(233, 233, 237, 0.7);
3243
  padding: 12px;
3244
  margin: 0;
3245
}
3246
3247
.modal-dialog-button, .modal-dialog-linked-button {
3248
  min-height: 32px !important;
3249
  padding: 6px !important;
3250
  margin: 0 !important;
3251
  border: none !important;
3252
  border-radius: 12px;
3253
}
3254
3255
.modal-dialog-button:first-child, .modal-dialog-linked-button:first-child {
3256
  background-color: rgba(233, 233, 237, 0.04);
3257
}
3258
3259
.modal-dialog-button:first-child:focus, .modal-dialog-linked-button:first-child:focus {
3260
  color: #e9e9ed;
3261
  background-color: rgba(233, 233, 237, 0.08);
3262
  box-shadow: none !important;
3263
}
3264
3265
.modal-dialog-button:first-child:hover, .modal-dialog-linked-button:first-child:hover {
3266
  color: #e9e9ed;
3267
  background-color: rgba(233, 233, 237, 0.12);
3268
}
3269
3270
.modal-dialog-button:first-child:active, .modal-dialog-linked-button:first-child:active {
3271
  color: #e9e9ed;
3272
  background-color: rgba(233, 233, 237, 0.2);
3273
  box-shadow: none !important;
3274
}
3275
3276
.modal-dialog .modal-dialog-button-box {
3277
  padding-top: 6px;
3278
}
3279
3280
.modal-dialog .modal-dialog-content-box {
3281
  margin: 6px;
3282
  spacing: 6px;
3283
  max-width: 28em;
3284
}
3285
3286
.end-session-dialog {
3287
  width: 26em;
3288
}
3289
3290
.end-session-dialog .end-session-dialog-battery-warning,
3291
.end-session-dialog .dialog-list-title {
3292
  color: #8c6c3e;
3293
  background-color: rgba(140, 108, 62, 0.1);
3294
  padding: 9px;
3295
  border-radius: 12px;
3296
  margin: 4px 0;
3297
}
3298
3299
.message-dialog-content {
3300
  spacing: 18px;
3301
}
3302
3303
.message-dialog-content .message-dialog-title {
3304
  text-align: center;
3305
}
3306
3307
.message-dialog-content .message-dialog-description {
3308
  text-align: center;
3309
}
3310
3311
.dialog-list {
3312
  spacing: 18px;
3313
}
3314
3315
.dialog-list .dialog-list-title {
3316
  text-align: center;
3317
}
3318
3319
.dialog-list .dialog-list-scrollview {
3320
  max-height: 200px;
3321
}
3322
3323
.dialog-list .dialog-list-box {
3324
  spacing: 1em;
3325
}
3326
3327
.dialog-list .dialog-list-box .dialog-list-item {
3328
  spacing: 1em;
3329
}
3330
3331
.dialog-list .dialog-list-box .dialog-list-item .dialog-list-item-title {
3332
  font-weight: bold;
3333
}
3334
3335
.dialog-list .dialog-list-box .dialog-list-item .dialog-list-item-description {
3336
  color: rgba(233, 233, 237, 0.7);
3337
}
3338
3339
.run-dialog {
3340
  width: 26em;
3341
  padding-bottom: 6px;
3342
}
3343
3344
.run-dialog .run-dialog-entry {
3345
  padding: 12px 9px;
3346
}
3347
3348
.run-dialog .run-dialog-description {
3349
  text-align: center;
3350
  color: rgba(233, 233, 237, 0.7);
3351
}
3352
3353
.prompt-dialog {
3354
  width: 28em;
3355
}
3356
3357
.prompt-dialog .prompt-dialog-password-grid {
3358
  spacing-rows: 8px;
3359
  spacing-columns: 4px;
3360
}
3361
3362
.prompt-dialog .prompt-dialog-password-grid .prompt-dialog-password-entry {
3363
  width: auto;
3364
}
3365
3366
.prompt-dialog .prompt-dialog-password-grid .prompt-dialog-password-entry:ltr {
3367
  margin-left: 20px;
3368
}
3369
3370
.prompt-dialog .prompt-dialog-password-grid .prompt-dialog-password-entry:rtl {
3371
  margin-right: 20px;
3372
}
3373
3374
.prompt-dialog .prompt-dialog-password-layout {
3375
  spacing: 8px;
3376
}
3377
3378
.prompt-dialog .prompt-dialog-password-entry {
3379
  width: 20em;
3380
  padding: 12px 9px;
3381
}
3382
3383
.prompt-dialog .prompt-dialog-error-label,
3384
.prompt-dialog .prompt-dialog-info-label,
3385
.prompt-dialog .prompt-dialog-null-label {
3386
  text-align: center;
3387
}
3388
3389
.prompt-dialog .prompt-dialog-error-label {
3390
  color: #8c6c3e;
3391
}
3392
3393
.polkit-dialog-user-layout {
3394
  text-align: center;
3395
  spacing: 8px;
3396
  margin-bottom: 6px;
3397
}
3398
3399
.polkit-dialog-user-layout .polkit-dialog-user-root-label {
3400
  color: #8c6c3e;
3401
}
3402
3403
.audio-device-selection-dialog {
3404
  min-width: 24em;
3405
}
3406
3407
.audio-device-selection-dialog .audio-selection-box {
3408
  spacing: 12px;
3409
}
3410
3411
.audio-device-selection-dialog .audio-selection-box .audio-selection-device {
3412
  border: 1px solid rgba(233, 233, 237, 0.12);
3413
  border-radius: 12px;
3414
}
3415
3416
.audio-device-selection-dialog .audio-selection-box .audio-selection-device:hover, .audio-device-selection-dialog .audio-selection-box .audio-selection-device:focus {
3417
  background-color: rgba(233, 233, 237, 0.12);
3418
}
3419
3420
.audio-device-selection-dialog .audio-selection-box .audio-selection-device:active {
3421
  background-color: #27a1b9;
3422
  color: #e9e9ed;
3423
}
3424
3425
.audio-device-selection-dialog .audio-selection-box .audio-selection-device .audio-selection-device-box {
3426
  padding: 12px;
3427
  spacing: 12px;
3428
}
3429
3430
.audio-device-selection-dialog .audio-selection-box .audio-selection-device .audio-selection-device-icon {
3431
  icon-size: 64px;
3432
}
3433
3434
.welcome-dialog-image {
3435
  background-image: url("resource:///org/gnome/shell/theme/gnome-shell-start.svg");
3436
  background-size: contain;
3437
  height: 300px;
3438
  width: 300px;
3439
}
3440
3441
/* Access portal dialog */
3442
.access-dialog {
3443
  text-align: center;
3444
}
3445
3446
/* Message List */
3447
.message-list {
3448
  width: 29em;
3449
  text-shadow: none;
3450
  border: solid rgba(233, 233, 237, 0.12);
3451
  padding: 0;
3452
}
3453
3454
.message-list:ltr {
3455
  margin-left: 0;
3456
  margin-right: 8px;
3457
  padding-right: 10px;
3458
  border-right-width: 0;
3459
}
3460
3461
.message-list:rtl {
3462
  margin-right: 0;
3463
  margin-left: 8px;
3464
  padding-left: 10px;
3465
  border-left-width: 0;
3466
}
3467
3468
.message-list .message-list-placeholder {
3469
  spacing: 12px;
3470
  color: rgba(233, 233, 237, 0.32);
3471
}
3472
3473
.message-list .message-list-placeholder > StIcon {
3474
  icon-size: 96px;
3475
  margin-bottom: 12px;
3476
  -st-icon-style: symbolic;
3477
}
3478
3479
.message-list-sections {
3480
  margin: 0;
3481
  padding-bottom: 6px;
3482
}
3483
3484
.message-list-sections:ltr {
3485
  margin-right: 0;
3486
}
3487
3488
.message-list-sections:rtl {
3489
  margin-left: 0;
3490
}
3491
3492
.message-list-section,
3493
.message-list-sections,
3494
.message-list-section-list {
3495
  spacing: 6px;
3496
}
3497
3498
.message-list-controls {
3499
  margin: 8px 16px 0;
3500
  padding: 6px;
3501
  spacing: 6px;
3502
}
3503
3504
.message-list-controls .dnd-button {
3505
  border-width: 2px;
3506
  border-color: transparent;
3507
  border-radius: 32px;
3508
  border-style: solid;
3509
}
3510
3511
.message-list-controls .dnd-button:focus {
3512
  border-color: rgba(39, 161, 185, 0.6);
3513
}
3514
3515
.message {
3516
  padding: 0;
3517
  margin: 3px;
3518
  border-radius: 20px;
3519
}
3520
3521
.popup-menu .message {
3522
  border-radius: 12px;
3523
}
3524
3525
.popup-menu .message .notification-button:first-child:ltr {
3526
  border-radius: 0 0 0 12px;
3527
}
3528
3529
.popup-menu .message .notification-button:last-child:ltr {
3530
  border-radius: 0 0 12px;
3531
}
3532
3533
.popup-menu .message .notification-button:first-child:rtl {
3534
  border-radius: 0 0 12px;
3535
}
3536
3537
.popup-menu .message .notification-button:last-child:rtl {
3538
  border-radius: 0 0 0 12px;
3539
}
3540
3541
.popup-menu .message .notification-button:first-child:last-child {
3542
  border-radius: 0 0 12px 12px;
3543
}
3544
3545
.message .message-header {
3546
  padding: 0 0.409em;
3547
  margin: 6px;
3548
  margin-bottom: 0;
3549
  spacing: 6px;
3550
  color: rgba(233, 233, 237, 0.5);
3551
}
3552
3553
.message .message-header .message-source-icon {
3554
  icon-size: 1.091em;
3555
  -st-icon-style: symbolic;
3556
}
3557
3558
.message .message-header .message-header-content {
3559
  spacing: 6px;
3560
  min-height: 1.637em;
3561
  padding-bottom: 6px;
3562
}
3563
3564
.message .message-header .message-header-content .message-source-title {
3565
  font-weight: bold;
3566
}
3567
3568
.message .message-header .message-header-content .event-time {
3569
  padding-bottom: 0.068em;
3570
  color: rgba(233, 233, 237, 0.5);
3571
}
3572
3573
.message .message-header .message-header-content .event-time:ltr {
3574
  text-align: right;
3575
}
3576
3577
.message .message-header .message-header-content .event-time:rtl {
3578
  text-align: left;
3579
}
3580
3581
.message .message-header .message-expand-button,
3582
.message .message-header .message-close-button {
3583
  color: #e9e9ed;
3584
  background-color: rgba(233, 233, 237, 0.04);
3585
  padding: 4px;
3586
  border: none;
3587
}
3588
3589
.message .message-header .message-expand-button, .message .message-header .message-expand-button:hover, .message .message-header .message-expand-button:active,
3590
.message .message-header .message-close-button,
3591
.message .message-header .message-close-button:hover,
3592
.message .message-header .message-close-button:active {
3593
  color: #e9e9ed;
3594
}
3595
3596
.message .message-header .message-expand-button:hover, .message .message-header .message-expand-button:focus,
3597
.message .message-header .message-close-button:hover,
3598
.message .message-header .message-close-button:focus {
3599
  background-color: rgba(233, 233, 237, 0.12);
3600
}
3601
3602
.message .message-header .message-expand-button:active, .message .message-header .message-expand-button:active:hover,
3603
.message .message-header .message-close-button:active,
3604
.message .message-header .message-close-button:active:hover {
3605
  background-color: rgba(233, 233, 237, 0.3);
3606
}
3607
3608
.message .message-header .message-expand-button:insensitive,
3609
.message .message-header .message-close-button:insensitive {
3610
  background-color: rgba(233, 233, 237, 0.04);
3611
}
3612
3613
.message .message-header .message-expand-button {
3614
  padding: 4px;
3615
  border: none;
3616
}
3617
3618
.message .message-header .message-expand-button:ltr {
3619
  margin-right: 6px;
3620
}
3621
3622
.message .message-header .message-expand-button:rtl {
3623
  margin-left: 6px;
3624
}
3625
3626
.message .message-box {
3627
  padding: 6px;
3628
  margin: 6px;
3629
  margin-top: 0;
3630
  spacing: 6px;
3631
}
3632
3633
.message .message-box .message-icon {
3634
  icon-size: 48px;
3635
  -st-icon-style: symbolic;
3636
}
3637
3638
.message .message-box .message-icon:ltr {
3639
  margin-right: 6px;
3640
}
3641
3642
.message .message-box .message-icon:rtl {
3643
  margin-left: 6px;
3644
}
3645
3646
.message .message-box .message-icon.message-themed-icon {
3647
  border-radius: 9999px;
3648
  icon-size: 16px;
3649
  min-width: 48px;
3650
  min-height: 48px;
3651
  color: rgba(233, 233, 237, 0.5);
3652
  background-color: rgba(233, 233, 237, 0.12);
3653
}
3654
3655
.message .message-box:first-child {
3656
  margin-top: 12px;
3657
}
3658
3659
.message .message-box .message-content {
3660
  spacing: 4px;
3661
}
3662
3663
.message .message-box .message-content .message-title {
3664
  font-weight: bold;
3665
}
3666
3667
.url-highlighter {
3668
  link-color: #4aafca;
3669
}
3670
3671
.message-media-control {
3672
  margin: 4px 6px;
3673
  padding: 12px;
3674
  border-radius: 9999px;
3675
  border: none;
3676
  color: rgba(233, 233, 237, 0.7);
3677
}
3678
3679
.message-media-control:hover, .message-media-control:focus {
3680
  background-color: rgba(233, 233, 237, 0.12);
3681
}
3682
3683
.message-media-control:active {
3684
  background-color: rgba(233, 233, 237, 0.3);
3685
}
3686
3687
.message-media-control:hover, .message-media-control:focus, .message-media-control:active {
3688
  color: #e9e9ed;
3689
}
3690
3691
.message-media-control:insensitive {
3692
  color: rgba(233, 233, 237, 0.5);
3693
}
3694
3695
.message-media-control StIcon {
3696
  icon-size: 16px;
3697
}
3698
3699
.media-message .message-icon {
3700
  border-radius: 6px !important;
3701
}
3702
3703
.media-message .message-icon.message-themed-icon {
3704
  icon-size: 32px !important;
3705
}
3706
3707
/* Message List */
3708
.message-list {
3709
  width: 29em;
3710
  text-shadow: none;
3711
  border: solid rgba(233, 233, 237, 0.12);
3712
  padding: 0;
3713
}
3714
3715
.message-list:ltr {
3716
  margin-left: 0;
3717
  margin-right: 8px;
3718
  padding-right: 10px;
3719
  border-right-width: 0;
3720
}
3721
3722
.message-list:rtl {
3723
  margin-right: 0;
3724
  margin-left: 8px;
3725
  padding-left: 10px;
3726
  border-left-width: 0;
3727
}
3728
3729
.message-list .message-list-placeholder {
3730
  spacing: 12px;
3731
  color: rgba(233, 233, 237, 0.32);
3732
}
3733
3734
.message-list .message-list-placeholder > StIcon {
3735
  icon-size: 96px;
3736
  margin-bottom: 12px;
3737
  -st-icon-style: symbolic;
3738
}
3739
3740
.message-list-sections {
3741
  margin: 0;
3742
  padding-bottom: 6px;
3743
}
3744
3745
.message-list-sections:ltr {
3746
  margin-right: 0;
3747
}
3748
3749
.message-list-sections:rtl {
3750
  margin-left: 0;
3751
}
3752
3753
.message-list-section,
3754
.message-list-sections,
3755
.message-list-section-list {
3756
  spacing: 6px;
3757
}
3758
3759
.message-list-controls {
3760
  margin: 8px 16px 0;
3761
  padding: 6px;
3762
  spacing: 6px;
3763
}
3764
3765
.message-list-controls .dnd-button {
3766
  border-width: 2px;
3767
  border-color: transparent;
3768
  border-radius: 32px;
3769
  border-style: solid;
3770
}
3771
3772
.message-list-controls .dnd-button:focus {
3773
  border-color: rgba(39, 161, 185, 0.6);
3774
}
3775
3776
.message {
3777
  padding: 0;
3778
  margin: 3px;
3779
  border-radius: 20px;
3780
}
3781
3782
.popup-menu .message {
3783
  border-radius: 12px;
3784
}
3785
3786
.message .message-header {
3787
  padding: 0 0.409em;
3788
  margin: 6px;
3789
  margin-bottom: 0;
3790
  spacing: 6px;
3791
  color: rgba(233, 233, 237, 0.5);
3792
}
3793
3794
.message .message-header .message-source-icon {
3795
  icon-size: 1.091em;
3796
  -st-icon-style: symbolic;
3797
}
3798
3799
.message .message-header .message-header-content {
3800
  spacing: 6px;
3801
  min-height: 1.637em;
3802
  padding-bottom: 6px;
3803
}
3804
3805
.message .message-header .message-header-content .message-source-title {
3806
  font-weight: bold;
3807
}
3808
3809
.message .message-header .message-header-content .event-time {
3810
  padding-bottom: 0.068em;
3811
  color: rgba(233, 233, 237, 0.5);
3812
}
3813
3814
.message .message-header .message-header-content .event-time:ltr {
3815
  text-align: right;
3816
}
3817
3818
.message .message-header .message-header-content .event-time:rtl {
3819
  text-align: left;
3820
}
3821
3822
.message .message-header .message-expand-button,
3823
.message .message-header .message-close-button {
3824
  color: #e9e9ed;
3825
  background-color: rgba(233, 233, 237, 0.04);
3826
  padding: 4px;
3827
  border: none;
3828
}
3829
3830
.message .message-header .message-expand-button, .message .message-header .message-expand-button:hover,
3831
.message .message-header .message-close-button,
3832
.message .message-header .message-close-button:hover {
3833
  color: #e9e9ed;
3834
}
3835
3836
.message .message-header .message-expand-button:hover, .message .message-header .message-expand-button:focus,
3837
.message .message-header .message-close-button:hover,
3838
.message .message-header .message-close-button:focus {
3839
  background-color: rgba(233, 233, 237, 0.12);
3840
}
3841
3842
.message .message-header .message-expand-button:active, .message .message-header .message-expand-button:active:hover,
3843
.message .message-header .message-close-button:active,
3844
.message .message-header .message-close-button:active:hover {
3845
  background-color: #27a1b9;
3846
  color: #e9e9ed;
3847
}
3848
3849
.message .message-header .message-expand-button:insensitive,
3850
.message .message-header .message-close-button:insensitive {
3851
  background-color: rgba(233, 233, 237, 0.04);
3852
}
3853
3854
.message .message-header .message-expand-button {
3855
  padding: 4px;
3856
  border: none;
3857
}
3858
3859
.message .message-header .message-expand-button:ltr {
3860
  margin-right: 6px;
3861
}
3862
3863
.message .message-header .message-expand-button:rtl {
3864
  margin-left: 6px;
3865
}
3866
3867
.message .message-box {
3868
  padding: 6px;
3869
  margin: 6px;
3870
  margin-top: 0;
3871
  spacing: 6px;
3872
}
3873
3874
.message .message-box .message-icon {
3875
  icon-size: 48px;
3876
  -st-icon-style: symbolic;
3877
}
3878
3879
.message .message-box .message-icon:ltr {
3880
  margin-right: 6px;
3881
}
3882
3883
.message .message-box .message-icon:rtl {
3884
  margin-left: 6px;
3885
}
3886
3887
.message .message-box .message-icon.message-themed-icon {
3888
  border-radius: 9999px;
3889
  icon-size: 16px;
3890
  min-width: 48px;
3891
  min-height: 48px;
3892
  color: rgba(233, 233, 237, 0.5);
3893
  background-color: rgba(233, 233, 237, 0.12);
3894
}
3895
3896
.message .message-box:first-child {
3897
  margin-top: 12px;
3898
}
3899
3900
.message .message-box .message-content {
3901
  spacing: 4px;
3902
}
3903
3904
.message .message-box .message-content .message-title {
3905
  font-weight: bold;
3906
}
3907
3908
.url-highlighter {
3909
  link-color: #4aafca;
3910
}
3911
3912
.message-media-control {
3913
  margin: 4px 6px;
3914
  padding: 12px;
3915
  border-radius: 9999px;
3916
  border: none;
3917
  color: rgba(233, 233, 237, 0.7);
3918
}
3919
3920
.message-media-control:hover, .message-media-control:focus {
3921
  background-color: rgba(233, 233, 237, 0.12);
3922
}
3923
3924
.message-media-control:active {
3925
  background-color: rgba(233, 233, 237, 0.3);
3926
}
3927
3928
.message-media-control:hover, .message-media-control:focus, .message-media-control:active {
3929
  color: #e9e9ed;
3930
}
3931
3932
.message-media-control:insensitive {
3933
  color: rgba(233, 233, 237, 0.5);
3934
}
3935
3936
.message-media-control StIcon {
3937
  icon-size: 16px;
3938
}
3939
3940
.media-message .message-icon {
3941
  border-radius: 6px !important;
3942
}
3943
3944
.media-message .message-icon.message-themed-icon {
3945
  icon-size: 32px !important;
3946
}
3947
3948
/* Message List */
3949
.message-list {
3950
  width: 29em;
3951
  text-shadow: none;
3952
  border: solid rgba(233, 233, 237, 0.12);
3953
  padding: 0;
3954
}
3955
3956
.message-list:ltr {
3957
  margin-left: 2px;
3958
  margin-right: 8px;
3959
  padding-right: 10px;
3960
  border-right-width: 0;
3961
}
3962
3963
.message-list:rtl {
3964
  margin-right: 0;
3965
  margin-left: 8px;
3966
  padding-left: 10px;
3967
  border-left-width: 0;
3968
}
3969
3970
.message-list .message-list-placeholder {
3971
  spacing: 12px;
3972
  color: rgba(233, 233, 237, 0.32);
3973
}
3974
3975
.message-list .message-list-placeholder > StIcon {
3976
  icon-size: 96px;
3977
  margin-bottom: 12px;
3978
  -st-icon-style: symbolic;
3979
}
3980
3981
.message-view {
3982
  -st-vfade-offset: 24px;
3983
}
3984
3985
.message-view:ltr {
3986
  margin-right: 12px;
3987
}
3988
3989
.message-view:rtl {
3990
  margin-left: 12px;
3991
}
3992
3993
.message-view .message {
3994
  margin-bottom: 12px !important;
3995
}
3996
3997
.message-list-controls {
3998
  margin: 8px 16px 0;
3999
  padding: 6px;
4000
  spacing: 6px;
4001
}
4002
4003
.message-list-controls .dnd-button {
4004
  border-width: 2px;
4005
  border-color: transparent;
4006
  border-radius: 32px;
4007
  border-style: solid;
4008
}
4009
4010
.message-list-controls .dnd-button:focus {
4011
  border-color: rgba(39, 161, 185, 0.6);
4012
}
4013
4014
.message-notification-group {
4015
  spacing: 12px;
4016
}
4017
4018
.message-notification-group .message-group-header {
4019
  padding: 6px;
4020
}
4021
4022
.message-notification-group .message-group-header .message-group-title {
4023
  margin: 0 4px;
4024
}
4025
4026
.message-notification-group .message-collapse-button {
4027
  color: #e9e9ed;
4028
  background-color: rgba(233, 233, 237, 0.2);
4029
  padding: 4px !important;
4030
  border: 4px transparent solid;
4031
}
4032
4033
.message-notification-group .message-collapse-button:hover {
4034
  background-color: rgba(233, 233, 237, 0.3);
4035
}
4036
4037
.message-notification-group .message-collapse-button:active {
4038
  background-color: rgba(233, 233, 237, 0.2);
4039
}
4040
4041
.message {
4042
  padding: 0;
4043
  margin: 3px;
4044
  border-radius: 20px;
4045
}
4046
4047
.popup-menu .message {
4048
  border-radius: 12px;
4049
  /* padding: $base_padding; */
4050
  /* margin: $base_margin; */
4051
  color: rgba(233, 233, 237, 0.5);
4052
  background-color: #242635;
4053
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.04);
4054
  border: 1px solid rgba(233, 233, 237, 0.04);
4055
  /* &:insensitive {
4056
			color: $text-disabled;
4057
			background-color: lighten($background, 5%);
4058
			box-shadow: none !important;
4059
		} */
4060
}
4061
4062
.popup-menu .message:hover, .popup-menu .message:focus {
4063
  color: rgba(39, 161, 185, 0.5);
4064
  background-color: #262838;
4065
  box-shadow: 0 2px 2px rgba(0, 0, 0, 0.05) !important;
4066
  border: 1px solid rgba(233, 233, 237, 0.06);
4067
}
4068
4069
.popup-menu .message:active {
4070
  color: #e9e9ed;
4071
  background-color: #242635;
4072
  box-shadow: none !important;
4073
}
4074
4075
.message:second-in-stack {
4076
  background-color: #242635;
4077
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.04);
4078
  border: 1px solid rgba(233, 233, 237, 0.03);
4079
}
4080
4081
.message:lower-in-stack {
4082
  background-color: #242635;
4083
  box-shadow: none;
4084
  border-color: transparent;
4085
}
4086
4087
.message .message-header {
4088
  padding: 0 0.409em;
4089
  margin: 6px;
4090
  margin-bottom: 0;
4091
  spacing: 6px;
4092
  color: rgba(233, 233, 237, 0.5);
4093
  /* .message-close-button {
4094
			margin-left: $base_padding * 0.5;
4095
			padding: 4px;
4096
		} */
4097
}
4098
4099
.message .message-header:ltr {
4100
  padding-right: 0;
4101
}
4102
4103
.message .message-header:rtl {
4104
  padding-left: 0;
4105
}
4106
4107
.message .message-header .message-source-icon {
4108
  icon-size: 1.091em;
4109
  -st-icon-style: symbolic;
4110
}
4111
4112
.message .message-header .message-header-content {
4113
  spacing: 6px;
4114
  min-height: 1.637em;
4115
  padding-bottom: 6px;
4116
}
4117
4118
.message .message-header .message-header-content .message-source-title {
4119
  font-weight: bold;
4120
}
4121
4122
.message .message-header .message-header-content .event-time {
4123
  padding-bottom: 0.068em;
4124
  color: rgba(233, 233, 237, 0.5);
4125
}
4126
4127
.message .message-header .message-header-content .event-time:ltr {
4128
  text-align: right;
4129
}
4130
4131
.message .message-header .message-header-content .event-time:rtl {
4132
  text-align: left;
4133
}
4134
4135
.message .message-header .message-expand-button,
4136
.message .message-header .message-close-button {
4137
  color: #e9e9ed;
4138
  background-color: rgba(233, 233, 237, 0.04);
4139
  padding: 4px;
4140
  border: none;
4141
}
4142
4143
.message .message-header .message-expand-button, .message .message-header .message-expand-button:hover,
4144
.message .message-header .message-close-button,
4145
.message .message-header .message-close-button:hover {
4146
  color: #e9e9ed;
4147
}
4148
4149
.message .message-header .message-expand-button:hover, .message .message-header .message-expand-button:focus,
4150
.message .message-header .message-close-button:hover,
4151
.message .message-header .message-close-button:focus {
4152
  background-color: rgba(233, 233, 237, 0.12);
4153
}
4154
4155
.message .message-header .message-expand-button:active, .message .message-header .message-expand-button:active:hover,
4156
.message .message-header .message-close-button:active,
4157
.message .message-header .message-close-button:active:hover {
4158
  background-color: #27a1b9;
4159
  color: #e9e9ed;
4160
}
4161
4162
.message .message-header .message-expand-button:insensitive,
4163
.message .message-header .message-close-button:insensitive {
4164
  background-color: rgba(233, 233, 237, 0.04);
4165
}
4166
4167
.message .message-header .message-expand-button {
4168
  padding: 4px;
4169
  border: none;
4170
}
4171
4172
.message .message-header .message-expand-button:ltr {
4173
  margin-right: 6px;
4174
}
4175
4176
.message .message-header .message-expand-button:rtl {
4177
  margin-left: 6px;
4178
}
4179
4180
.message .message-box {
4181
  padding: 6px;
4182
  margin: 6px;
4183
  margin-top: 0;
4184
  spacing: 6px;
4185
}
4186
4187
.message .message-box .message-icon {
4188
  icon-size: 48px;
4189
  -st-icon-style: symbolic;
4190
}
4191
4192
.message .message-box .message-icon:ltr {
4193
  margin-right: 6px;
4194
}
4195
4196
.message .message-box .message-icon:rtl {
4197
  margin-left: 6px;
4198
}
4199
4200
.message .message-box .message-icon.message-themed-icon {
4201
  border-radius: 9999px;
4202
  icon-size: 16px;
4203
  min-width: 48px;
4204
  min-height: 48px;
4205
  color: rgba(233, 233, 237, 0.5);
4206
  background-color: rgba(233, 233, 237, 0.12);
4207
}
4208
4209
.message .message-box:first-child {
4210
  margin-top: 12px;
4211
}
4212
4213
.message .message-box .message-content {
4214
  spacing: 4px;
4215
}
4216
4217
.message .message-box .message-content .message-title {
4218
  font-weight: bold;
4219
}
4220
4221
.url-highlighter {
4222
  link-color: #4aafca;
4223
}
4224
4225
.message-media-control {
4226
  margin: 4px 6px;
4227
  padding: 12px;
4228
  border-radius: 9999px;
4229
  border: none;
4230
  color: rgba(233, 233, 237, 0.7);
4231
}
4232
4233
.message-media-control:hover, .message-media-control:focus {
4234
  background-color: rgba(233, 233, 237, 0.12);
4235
}
4236
4237
.message-media-control:active {
4238
  background-color: rgba(233, 233, 237, 0.3);
4239
}
4240
4241
.message-media-control:hover, .message-media-control:focus, .message-media-control:active {
4242
  color: #e9e9ed;
4243
}
4244
4245
.message-media-control:insensitive {
4246
  color: rgba(233, 233, 237, 0.5);
4247
}
4248
4249
.message-media-control StIcon {
4250
  icon-size: 16px;
4251
}
4252
4253
.media-message .message-icon {
4254
  border-radius: 6px !important;
4255
}
4256
4257
.media-message .message-icon.message-themed-icon {
4258
  icon-size: 32px !important;
4259
}
4260
4261
.workspace-animation {
4262
  background-color: #1a1b26;
4263
}
4264
4265
.calendar .calendar-change-month-back,
4266
.calendar .calendar-change-month-forward {
4267
  padding: 0 2px;
4268
}
4269
4270
/* Notifications & Message Tray */
4271
.notification-banner {
4272
  min-height: 64px;
4273
  width: 34em;
4274
  margin: 20px;
4275
  border-radius: 12px;
4276
  color: rgba(233, 233, 237, 0.7);
4277
  background-color: #292e42;
4278
  border: none;
4279
  text-shadow: none;
4280
  box-shadow: 0 3px 5px rgba(0, 0, 0, 0.25);
4281
  border-radius: 18px;
4282
}
4283
4284
.notification-banner:hover, .notification-banner:active {
4285
  color: #e9e9ed;
4286
  background-color: #292e42;
4287
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.25);
4288
  margin: 20px;
4289
}
4290
4291
.notification-banner:focus {
4292
  color: #e9e9ed;
4293
  background-color: #292e42;
4294
}
4295
4296
.notification-buttons-bin {
4297
  background-color: transparent;
4298
  padding-top: 0;
4299
  border: none;
4300
  border-top: 1px solid rgba(233, 233, 237, 0.12);
4301
  spacing: 0;
4302
}
4303
4304
.notification-button {
4305
  min-height: 44px;
4306
  padding: 0 18px;
4307
  background-color: transparent;
4308
  color: rgba(233, 233, 237, 0.7);
4309
  font-weight: 500;
4310
  border: none;
4311
}
4312
4313
.notification-button:focus {
4314
  background-color: transparent;
4315
  color: #e9e9ed;
4316
  box-shadow: inset 0 0 0 2px rgba(233, 233, 237, 0.12);
4317
}
4318
4319
.notification-button:hover, .notification-button:focus:hover {
4320
  background-color: rgba(233, 233, 237, 0.12);
4321
  color: #e9e9ed;
4322
  box-shadow: none;
4323
}
4324
4325
.notification-button:active {
4326
  background-color: rgba(233, 233, 237, 0.3);
4327
  color: #e9e9ed;
4328
}
4329
4330
.notification-button:first-child:ltr {
4331
  border-radius: 0 0 0 18px;
4332
}
4333
4334
.notification-button:last-child:ltr {
4335
  border-radius: 0 0 18px;
4336
  margin-right: 0 !important;
4337
}
4338
4339
.notification-button:first-child:rtl {
4340
  border-radius: 0 0 18px;
4341
}
4342
4343
.notification-button:last-child:rtl {
4344
  border-radius: 0 0 0 18px;
4345
  margin-left: 0 !important;
4346
}
4347
4348
.notification-button:first-child:last-child {
4349
  border-radius: 0 0 18px 18px;
4350
  margin-left: 0 !important;
4351
  margin-right: 0 !important;
4352
}
4353
4354
/* Notifications & Message Tray */
4355
.notification-banner {
4356
  min-height: 64px;
4357
  width: 34em;
4358
  margin: 12px 8px 8px;
4359
  border-radius: 12px;
4360
  color: rgba(233, 233, 237, 0.7);
4361
  background-color: #292e42;
4362
  text-shadow: none;
4363
  border-radius: 18px;
4364
  border: none;
4365
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.25);
4366
}
4367
4368
.notification-banner:hover, .notification-banner:active, .notification-banner:focus {
4369
  color: #e9e9ed;
4370
  background-color: #292e42;
4371
}
4372
4373
.notification-buttons-bin {
4374
  spacing: 0;
4375
}
4376
4377
.notification-button {
4378
  min-height: 44px;
4379
  padding: 0 18px;
4380
  margin: 0;
4381
  background-color: transparent;
4382
  color: rgba(233, 233, 237, 0.7);
4383
  font-weight: 500;
4384
  border: none;
4385
  border-radius: 12px;
4386
}
4387
4388
.notification-button:focus {
4389
  background-color: transparent;
4390
  color: #e9e9ed;
4391
  box-shadow: inset 0 0 0 2px rgba(233, 233, 237, 0.12);
4392
}
4393
4394
.notification-button:hover, .notification-button:focus:hover {
4395
  background-color: rgba(233, 233, 237, 0.12);
4396
  color: #e9e9ed;
4397
  box-shadow: none;
4398
}
4399
4400
.notification-button:active {
4401
  background-color: rgba(233, 233, 237, 0.3);
4402
  color: #e9e9ed;
4403
}
4404
4405
.controls-manager,
4406
.secondary-monitor-workspaces {
4407
  spacing: 12px;
4408
}
4409
4410
#overviewGroup {
4411
  background-color: #111118;
4412
}
4413
4414
.osd-window {
4415
  spacing: 12px;
4416
  padding: 12px 18px;
4417
  margin-bottom: 4em;
4418
}
4419
4420
.osd-window > * {
4421
  spacing: 8px;
4422
}
4423
4424
.osd-window StIcon {
4425
  icon-size: 32px;
4426
}
4427
4428
.osd-window StLabel:ltr {
4429
  margin-right: 6px;
4430
}
4431
4432
.osd-window StLabel:rtl {
4433
  margin-left: 6px;
4434
}
4435
4436
#appMenu {
4437
  spacing: 6px;
4438
}
4439
4440
#appMenu .label-shadow {
4441
  color: transparent;
4442
}
4443
4444
#appMenu .panel-status-menu-box {
4445
  padding: 0 6px;
4446
  spacing: 6px;
4447
}
4448
4449
.popup-menu .popup-menu-item {
4450
  padding: 9px 12px;
4451
}
4452
4453
.popup-separator-menu-item {
4454
  padding: 3px 0 !important;
4455
}
4456
4457
.popup-separator-menu-item .popup-menu-ornament {
4458
  width: 0 !important;
4459
}
4460
4461
.popup-separator-menu-item .popup-separator-menu-item-separator {
4462
  height: 1px;
4463
  background-color: rgba(233, 233, 237, 0.12);
4464
  margin: 6px 32px;
4465
  padding: 0 !important;
4466
}
4467
4468
.popup-sub-menu .popup-separator-menu-item .popup-separator-menu-item-separator {
4469
  padding: 0 !important;
4470
  margin: 0 32px 0 0;
4471
  height: 1px;
4472
}
4473
4474
.popup-menu-ornament {
4475
  icon-size: 16px !important;
4476
  width: 16px;
4477
}
4478
4479
/* Quick Settings */
4480
.quick-settings {
4481
  padding: 18px !important;
4482
  border-radius: 24px !important;
4483
  margin-top: 6px !important;
4484
}
4485
4486
.quick-settings .icon-button, .quick-settings .background-app-item .close-button, .background-app-item .quick-settings .close-button, .quick-settings .message .message-header .message-expand-button, .message .message-header .quick-settings .message-expand-button,
4487
.quick-settings .message .message-header .message-close-button,
4488
.message .message-header .quick-settings .message-close-button, .quick-settings .message-notification-group .message-collapse-button, .message-notification-group .quick-settings .message-collapse-button,
4489
.quick-settings .button {
4490
  padding: 10.5px;
4491
}
4492
4493
.quick-settings .icon-button > StIcon, .quick-settings .background-app-item .close-button > StIcon, .background-app-item .quick-settings .close-button > StIcon, .quick-settings .message .message-header .message-expand-button > StIcon, .message .message-header .quick-settings .message-expand-button > StIcon,
4494
.quick-settings .message .message-header .message-close-button > StIcon,
4495
.message .message-header .quick-settings .message-close-button > StIcon, .quick-settings .message-notification-group .message-collapse-button > StIcon, .message-notification-group .quick-settings .message-collapse-button > StIcon,
4496
.quick-settings .button > StIcon {
4497
  icon-size: 16px;
4498
}
4499
4500
.quick-settings-grid {
4501
  spacing-rows: 12px;
4502
  spacing-columns: 12px;
4503
}
4504
4505
.quick-toggle,
4506
.quick-menu-toggle {
4507
  border-radius: 12px;
4508
  min-width: 12em;
4509
  max-width: 12em;
4510
  min-height: 44px;
4511
  border: none;
4512
  margin: 1px;
4513
}
4514
4515
.quick-toggle {
4516
  background-color: rgba(233, 233, 237, 0.08) !important;
4517
  /* Move padding into the box; this is to allow menu arrows
4518
     to extend to the border */
4519
}
4520
4521
.quick-toggle:hover {
4522
  background-color: rgba(233, 233, 237, 0.12) !important;
4523
}
4524
4525
.quick-toggle:active {
4526
  background-color: rgba(233, 233, 237, 0.15) !important;
4527
}
4528
4529
.quick-toggle:checked {
4530
  background-color: rgba(39, 161, 185, 0.95) !important;
4531
  color: #1a1b26;
4532
}
4533
4534
.quick-toggle:checked:hover {
4535
  background-color: #75bece !important;
4536
  color: #1a1b26;
4537
}
4538
4539
.quick-toggle:checked:active {
4540
  background-color: #4eafc3 !important;
4541
  color: #1a1b26;
4542
}
4543
4544
.quick-toggle > StBoxLayout {
4545
  spacing: 6px;
4546
}
4547
4548
.quick-toggle.button {
4549
  padding: 0;
4550
}
4551
4552
.quick-toggle > StBoxLayout {
4553
  padding: 0 12px;
4554
}
4555
4556
.quick-toggle:ltr > StBoxLayout {
4557
  padding-left: 15px;
4558
}
4559
4560
.quick-toggle:rtl > StBoxLayout {
4561
  padding-right: 15px;
4562
}
4563
4564
.quick-toggle .quick-toggle-title {
4565
  font-weight: bold;
4566
}
4567
4568
.quick-toggle StBoxLayout > .quick-toggle-subtitle {
4569
  font-weight: normal;
4570
  font-size: 12px;
4571
}
4572
4573
.quick-toggle .quick-toggle-icon {
4574
  icon-size: 16px;
4575
}
4576
4577
.quick-menu-toggle .quick-toggle {
4578
  min-width: auto;
4579
  max-width: auto;
4580
}
4581
4582
.quick-menu-toggle .quick-toggle:ltr {
4583
  border-radius: 12px 0 0 12px;
4584
}
4585
4586
.quick-menu-toggle .quick-toggle:ltr > StBoxLayout {
4587
  padding-right: 9px;
4588
}
4589
4590
.quick-menu-toggle .quick-toggle:rtl {
4591
  border-radius: 0 12px 12px 0;
4592
}
4593
4594
.quick-menu-toggle .quick-toggle:rtr > StBoxLayout {
4595
  padding-left: 9px;
4596
}
4597
4598
.quick-menu-toggle .quick-toggle:ltr:last-child {
4599
  border-radius: 12px;
4600
}
4601
4602
.quick-menu-toggle .quick-toggle:rtl:last-child {
4603
  border-radius: 12px;
4604
}
4605
4606
.quick-menu-toggle .quick-toggle-arrow {
4607
  background-color: rgba(233, 233, 237, 0.08) !important;
4608
  padding: 6px 10.5px;
4609
  border: none !important;
4610
  color: #e9e9ed;
4611
  margin: 1px;
4612
}
4613
4614
.quick-menu-toggle .quick-toggle-arrow:hover {
4615
  background-color: rgba(233, 233, 237, 0.12) !important;
4616
}
4617
4618
.quick-menu-toggle .quick-toggle-arrow:active {
4619
  background-color: rgba(233, 233, 237, 0.15) !important;
4620
}
4621
4622
.quick-menu-toggle .quick-toggle-arrow:checked {
4623
  background-color: rgba(39, 161, 185, 0.75) !important;
4624
  color: #1a1b26;
4625
}
4626
4627
.quick-menu-toggle .quick-toggle-arrow:checked:hover {
4628
  background-color: #75bece !important;
4629
  color: #1a1b26;
4630
}
4631
4632
.quick-menu-toggle .quick-toggle-arrow:checked:active {
4633
  background-color: #4eafc3 !important;
4634
  color: #1a1b26;
4635
}
4636
4637
.quick-menu-toggle .quick-toggle-arrow:ltr {
4638
  border-radius: 0 12px 12px 0;
4639
}
4640
4641
.quick-menu-toggle .quick-toggle-arrow:rtl {
4642
  border-radius: 12px 0 0 12px;
4643
}
4644
4645
.quick-slider > StBoxLayout {
4646
  spacing: 6px;
4647
}
4648
4649
.quick-slider .slider-bin {
4650
  min-height: 16px;
4651
  padding: 6px;
4652
  border-radius: 9999px;
4653
}
4654
4655
.quick-slider .slider-bin:focus {
4656
  color: #e9e9ed;
4657
  background-color: rgba(233, 233, 237, 0.08);
4658
  box-shadow: none !important;
4659
}
4660
4661
.quick-slider .quick-toggle-icon {
4662
  icon-size: 16px;
4663
}
4664
4665
.quick-slider .icon-button, .quick-slider .background-app-item .close-button, .background-app-item .quick-slider .close-button, .quick-slider .message .message-header .message-expand-button, .message .message-header .quick-slider .message-expand-button,
4666
.quick-slider .message .message-header .message-close-button,
4667
.message .message-header .quick-slider .message-close-button, .quick-slider .message-notification-group .message-collapse-button, .message-notification-group .quick-slider .message-collapse-button {
4668
  background-color: rgba(233, 233, 237, 0.08) !important;
4669
  color: #27a1b9 !important;
4670
  border-radius: 12px;
4671
  padding: 9px;
4672
}
4673
4674
.quick-slider .icon-button:hover, .quick-slider .background-app-item .close-button:hover, .background-app-item .quick-slider .close-button:hover, .quick-slider .message .message-header .message-expand-button:hover, .message .message-header .quick-slider .message-expand-button:hover,
4675
.quick-slider .message .message-header .message-close-button:hover,
4676
.message .message-header .quick-slider .message-close-button:hover, .quick-slider .message-notification-group .message-collapse-button:hover, .message-notification-group .quick-slider .message-collapse-button:hover {
4677
  background-color: rgba(233, 233, 237, 0.12) !important;
4678
}
4679
4680
.quick-slider .icon-button:active, .quick-slider .background-app-item .close-button:active, .background-app-item .quick-slider .close-button:active, .quick-slider .message .message-header .message-expand-button:active, .message .message-header .quick-slider .message-expand-button:active,
4681
.quick-slider .message .message-header .message-close-button:active,
4682
.message .message-header .quick-slider .message-close-button:active, .quick-slider .message-notification-group .message-collapse-button:active, .message-notification-group .quick-slider .message-collapse-button:active {
4683
  background-color: rgba(233, 233, 237, 0.04);
4684
}
4685
4686
.quick-toggle-menu {
4687
  background-color: #292e42 !important;
4688
  color: #e9e9ed !important;
4689
  border-radius: 24px !important;
4690
  padding: 12px;
4691
  margin: 12px 18px 0;
4692
}
4693
4694
.quick-toggle-menu .popup-menu-item {
4695
  border-radius: 12px !important;
4696
}
4697
4698
.quick-toggle-menu .popup-menu-item:focus, .quick-toggle-menu .popup-menu-item:hover, .quick-toggle-menu .popup-menu-item.selected {
4699
  color: #27a1b9 !important;
4700
  background-color: rgba(233, 233, 237, 0.1) !important;
4701
}
4702
4703
.quick-toggle-menu .popup-menu-item:active {
4704
  color: #e9e9ed !important;
4705
  background-color: rgba(233, 233, 237, 0.2) !important;
4706
}
4707
4708
.quick-toggle-menu .popup-menu-item > StIcon {
4709
  -st-icon-style: symbolic;
4710
}
4711
4712
.quick-toggle-menu .header {
4713
  spacing-rows: 3px;
4714
  spacing-columns: 12px;
4715
  padding-bottom: 12px;
4716
}
4717
4718
.quick-toggle-menu .header .icon {
4719
  icon-size: 24px;
4720
  border-radius: 12px;
4721
  padding: 9px;
4722
  background-color: rgba(233, 233, 237, 0.12) !important;
4723
}
4724
4725
.quick-toggle-menu .header .icon.active {
4726
  background-color: #27a1b9 !important;
4727
  color: #e9e9ed;
4728
}
4729
4730
.quick-settings-system-item > StBoxLayout {
4731
  spacing: 12px;
4732
}
4733
4734
.quick-settings-system-item .icon-button, .quick-settings-system-item .background-app-item .close-button, .background-app-item .quick-settings-system-item .close-button, .quick-settings-system-item .message .message-header .message-expand-button, .message .message-header .quick-settings-system-item .message-expand-button,
4735
.quick-settings-system-item .message .message-header .message-close-button,
4736
.message .message-header .quick-settings-system-item .message-close-button, .quick-settings-system-item .message-notification-group .message-collapse-button, .message-notification-group .quick-settings-system-item .message-collapse-button {
4737
  background-color: rgba(233, 233, 237, 0.08);
4738
  color: #27a1b9 !important;
4739
  border-radius: 12px;
4740
}
4741
4742
.quick-settings-system-item .icon-button > StIcon, .quick-settings-system-item .background-app-item .close-button > StIcon, .background-app-item .quick-settings-system-item .close-button > StIcon, .quick-settings-system-item .message .message-header .message-expand-button > StIcon, .message .message-header .quick-settings-system-item .message-expand-button > StIcon,
4743
.quick-settings-system-item .message .message-header .message-close-button > StIcon,
4744
.message .message-header .quick-settings-system-item .message-close-button > StIcon, .quick-settings-system-item .message-notification-group .message-collapse-button > StIcon, .message-notification-group .quick-settings-system-item .message-collapse-button > StIcon {
4745
  -st-icon-style: symbolic;
4746
  icon-size: 16px;
4747
}
4748
4749
.quick-settings-system-item .power-item {
4750
  color: #27a1b9 !important;
4751
  min-height: 0;
4752
  min-width: 0;
4753
}
4754
4755
.quick-settings-system-item .power-item:insensitive {
4756
  color: #e9e9ed;
4757
  background-color: #323449;
4758
  box-shadow: none !important;
4759
  background-color: transparent;
4760
}
4761
4762
.nm-network-item .wireless-secure-icon {
4763
  icon-size: 8px;
4764
}
4765
4766
.bt-device-item .popup-menu-icon {
4767
  -st-icon-style: symbolic;
4768
}
4769
4770
.bt-menu-placeholder.popup-menu-item {
4771
  text-align: center;
4772
  padding: 2em 4em;
4773
}
4774
4775
.device-subtitle {
4776
  color: rgba(233, 233, 237, 0.5);
4777
}
4778
4779
.background-apps-quick-toggle {
4780
  min-height: 40px;
4781
  background-color: transparent;
4782
}
4783
4784
.background-apps-quick-toggle StIcon {
4785
  icon-size: 16px !important;
4786
}
4787
4788
.background-app-item .popup-menu-icon {
4789
  icon-size: 32px !important;
4790
  -st-icon-style: regular !important;
4791
}
4792
4793
.background-app-item .close-button {
4794
  padding: 6px;
4795
}
4796
4797
.background-app-item.popup-inactive-menu-item {
4798
  color: #e9e9ed;
4799
}
4800
4801
/* Quick Settings */
4802
.quick-settings {
4803
  padding: 18px !important;
4804
  border-radius: 24px !important;
4805
  margin-top: 6px !important;
4806
}
4807
4808
.quick-settings .icon-button, .quick-settings .message .message-header .message-expand-button, .message .message-header .quick-settings .message-expand-button,
4809
.quick-settings .message .message-header .message-close-button,
4810
.message .message-header .quick-settings .message-close-button, .quick-settings .message-notification-group .message-collapse-button, .message-notification-group .quick-settings .message-collapse-button, .quick-settings .background-app-item .close-button, .background-app-item .quick-settings .close-button,
4811
.quick-settings .button {
4812
  padding: 10.5px;
4813
}
4814
4815
.quick-settings .icon-button > StIcon, .quick-settings .message .message-header .message-expand-button > StIcon, .message .message-header .quick-settings .message-expand-button > StIcon,
4816
.quick-settings .message .message-header .message-close-button > StIcon,
4817
.message .message-header .quick-settings .message-close-button > StIcon, .quick-settings .message-notification-group .message-collapse-button > StIcon, .message-notification-group .quick-settings .message-collapse-button > StIcon, .quick-settings .background-app-item .close-button > StIcon, .background-app-item .quick-settings .close-button > StIcon,
4818
.quick-settings .button > StIcon {
4819
  icon-size: 16px;
4820
}
4821
4822
.quick-settings-grid {
4823
  spacing-rows: 12px;
4824
  spacing-columns: 12px;
4825
}
4826
4827
.quick-toggle,
4828
.quick-toggle-has-menu {
4829
  border-radius: 12px;
4830
  min-width: 12em;
4831
  max-width: 12em;
4832
  min-height: 44px;
4833
  border: none;
4834
  margin: 1px;
4835
}
4836
4837
.quick-toggle {
4838
  background-color: rgba(233, 233, 237, 0.12) !important;
4839
  color: #1a1b26;
4840
  /* Move padding into the box; this is to allow menu arrows
4841
     to extend to the border */
4842
}
4843
4844
.quick-toggle:hover {
4845
  background-color: rgba(39, 161, 185, 0.25) !important;
4846
  color: #1a1b26;
4847
}
4848
4849
.quick-toggle:active {
4850
  background-color: rgba(39, 161, 185, 0.5) !important;
4851
}
4852
4853
.quick-toggle:checked {
4854
  background-color: rgba(39, 161, 185, 0.95) !important;
4855
  color: #1a1b26;
4856
}
4857
4858
.quick-toggle:checked:hover {
4859
  background-color: #75bece !important;
4860
  color: #1a1b26;
4861
}
4862
4863
.quick-toggle:checked:active {
4864
  background-color: #4eafc3 !important;
4865
  color: #1a1b26;
4866
}
4867
4868
.quick-toggle > StBoxLayout {
4869
  spacing: 6px;
4870
}
4871
4872
.quick-toggle.button {
4873
  padding: 0;
4874
}
4875
4876
.quick-toggle > StBoxLayout {
4877
  padding: 0 12px;
4878
}
4879
4880
.quick-toggle:ltr > StBoxLayout {
4881
  padding-left: 15px;
4882
}
4883
4884
.quick-toggle:rtl > StBoxLayout {
4885
  padding-right: 15px;
4886
}
4887
4888
.quick-toggle .quick-toggle-title {
4889
  font-weight: bold;
4890
}
4891
4892
.quick-toggle .quick-toggle-subtitle {
4893
  font-weight: normal;
4894
  font-size: 12px;
4895
}
4896
4897
.quick-toggle .quick-toggle-icon {
4898
  icon-size: 16px;
4899
}
4900
4901
.quick-toggle-has-menu .quick-toggle {
4902
  min-width: auto;
4903
  max-width: auto;
4904
}
4905
4906
.quick-toggle-has-menu .quick-toggle:ltr {
4907
  border-radius: 12px 0 0 12px;
4908
}
4909
4910
.quick-toggle-has-menu .quick-toggle:ltr {
4911
  padding-right: 9px;
4912
}
4913
4914
.quick-toggle-has-menu .quick-toggle:rtl {
4915
  border-radius: 0 12px 12px 0;
4916
}
4917
4918
.quick-toggle-has-menu .quick-toggle:rtr {
4919
  padding-left: 9px;
4920
}
4921
4922
.quick-toggle-has-menu .quick-toggle:ltr:last-child {
4923
  border-radius: 12px;
4924
}
4925
4926
.quick-toggle-has-menu .quick-toggle:rtl:last-child {
4927
  border-radius: 12px;
4928
}
4929
4930
.quick-toggle-has-menu .quick-toggle-menu-button {
4931
  padding: 6px 10.5px;
4932
  border: none !important;
4933
  margin: 1px;
4934
}
4935
4936
.quick-toggle-has-menu .quick-toggle-menu-button:ltr {
4937
  border-radius: 0 12px 12px 0;
4938
}
4939
4940
.quick-toggle-has-menu .quick-toggle-menu-button:rtl {
4941
  border-radius: 12px 0 0 12px;
4942
}
4943
4944
.quick-toggle-has-menu .quick-toggle-separator {
4945
  width: 0;
4946
}
4947
4948
.quick-toggle-has-menu .quick-toggle-menu-button {
4949
  background-color: rgba(233, 233, 237, 0.12) !important;
4950
  color: #e9e9ed;
4951
}
4952
4953
.quick-toggle-has-menu .quick-toggle-menu-button:hover {
4954
  background-color: rgba(39, 161, 185, 0.25) !important;
4955
  color: #e9e9ed;
4956
}
4957
4958
.quick-toggle-has-menu .quick-toggle-menu-button:active {
4959
  background-color: rgba(233, 233, 237, 0.15) !important;
4960
}
4961
4962
.quick-toggle-has-menu .quick-toggle-menu-button:checked {
4963
  background-color: rgba(39, 161, 185, 0.75) !important;
4964
  color: #1a1b26;
4965
}
4966
4967
.quick-toggle-has-menu .quick-toggle-menu-button:checked:hover {
4968
  background-color: #75bece !important;
4969
  color: #1a1b26;
4970
}
4971
4972
.quick-toggle-has-menu .quick-toggle-menu-button:checked:active {
4973
  background-color: #4eafc3 !important;
4974
  color: #1a1b26;
4975
}
4976
4977
.quick-slider > StBoxLayout {
4978
  spacing: 6px;
4979
}
4980
4981
.quick-slider .slider-bin {
4982
  min-height: 16px;
4983
  padding: 6px;
4984
  border-radius: 9999px;
4985
}
4986
4987
.quick-slider .slider-bin:focus {
4988
  color: #e9e9ed;
4989
  background-color: rgba(233, 233, 237, 0.08);
4990
  box-shadow: none !important;
4991
}
4992
4993
.quick-slider .quick-toggle-icon {
4994
  icon-size: 16px;
4995
}
4996
4997
.quick-slider .icon-button, .quick-slider .message .message-header .message-expand-button, .message .message-header .quick-slider .message-expand-button,
4998
.quick-slider .message .message-header .message-close-button,
4999
.message .message-header .quick-slider .message-close-button, .quick-slider .message-notification-group .message-collapse-button, .message-notification-group .quick-slider .message-collapse-button, .quick-slider .background-app-item .close-button, .background-app-item .quick-slider .close-button {
5000
  background-color: rgba(233, 233, 237, 0.08) !important;
5001
  color: #27a1b9 !important;
5002
  border-radius: 12px;
5003
  padding: 9px;
5004
}
5005
5006
.quick-slider .icon-button:hover, .quick-slider .message .message-header .message-expand-button:hover, .message .message-header .quick-slider .message-expand-button:hover,
5007
.quick-slider .message .message-header .message-close-button:hover,
5008
.message .message-header .quick-slider .message-close-button:hover, .quick-slider .message-notification-group .message-collapse-button:hover, .message-notification-group .quick-slider .message-collapse-button:hover, .quick-slider .background-app-item .close-button:hover, .background-app-item .quick-slider .close-button:hover {
5009
  background-color: rgba(233, 233, 237, 0.12) !important;
5010
}
5011
5012
.quick-slider .icon-button:active, .quick-slider .message .message-header .message-expand-button:active, .message .message-header .quick-slider .message-expand-button:active,
5013
.quick-slider .message .message-header .message-close-button:active,
5014
.message .message-header .quick-slider .message-close-button:active, .quick-slider .message-notification-group .message-collapse-button:active, .message-notification-group .quick-slider .message-collapse-button:active, .quick-slider .background-app-item .close-button:active, .background-app-item .quick-slider .close-button:active {
5015
  background-color: rgba(233, 233, 237, 0.04);
5016
}
5017
5018
.quick-toggle-menu {
5019
  background-color: #292e42 !important;
5020
  color: #e9e9ed !important;
5021
  border-radius: 24px !important;
5022
  padding: 12px;
5023
  margin: 12px 18px 0;
5024
}
5025
5026
.quick-toggle-menu .popup-menu-item {
5027
  border-radius: 12px !important;
5028
}
5029
5030
.quick-toggle-menu .popup-menu-item:focus, .quick-toggle-menu .popup-menu-item:hover, .quick-toggle-menu .popup-menu-item.selected {
5031
  color: #27a1b9 !important;
5032
  background-color: rgba(233, 233, 237, 0.1) !important;
5033
}
5034
5035
.quick-toggle-menu .popup-menu-item:active {
5036
  color: #e9e9ed !important;
5037
  background-color: rgba(233, 233, 237, 0.2) !important;
5038
}
5039
5040
.quick-toggle-menu .popup-menu-item > StIcon {
5041
  -st-icon-style: symbolic;
5042
}
5043
5044
.quick-toggle-menu .header {
5045
  spacing-rows: 3px;
5046
  spacing-columns: 12px;
5047
  padding-bottom: 12px;
5048
}
5049
5050
.quick-toggle-menu .header .icon {
5051
  icon-size: 24px;
5052
  border-radius: 12px;
5053
  padding: 9px;
5054
  background-color: rgba(233, 233, 237, 0.12) !important;
5055
}
5056
5057
.quick-toggle-menu .header .icon.active {
5058
  background-color: #27a1b9 !important;
5059
  color: #e9e9ed;
5060
}
5061
5062
.quick-settings-system-item > StBoxLayout {
5063
  spacing: 12px;
5064
}
5065
5066
.quick-settings-system-item .icon-button, .quick-settings-system-item .message .message-header .message-expand-button, .message .message-header .quick-settings-system-item .message-expand-button,
5067
.quick-settings-system-item .message .message-header .message-close-button,
5068
.message .message-header .quick-settings-system-item .message-close-button, .quick-settings-system-item .message-notification-group .message-collapse-button, .message-notification-group .quick-settings-system-item .message-collapse-button, .quick-settings-system-item .background-app-item .close-button, .background-app-item .quick-settings-system-item .close-button {
5069
  background-color: rgba(233, 233, 237, 0.08);
5070
  color: #27a1b9 !important;
5071
  border-radius: 12px;
5072
}
5073
5074
.quick-settings-system-item .icon-button > StIcon, .quick-settings-system-item .message .message-header .message-expand-button > StIcon, .message .message-header .quick-settings-system-item .message-expand-button > StIcon,
5075
.quick-settings-system-item .message .message-header .message-close-button > StIcon,
5076
.message .message-header .quick-settings-system-item .message-close-button > StIcon, .quick-settings-system-item .message-notification-group .message-collapse-button > StIcon, .message-notification-group .quick-settings-system-item .message-collapse-button > StIcon, .quick-settings-system-item .background-app-item .close-button > StIcon, .background-app-item .quick-settings-system-item .close-button > StIcon {
5077
  -st-icon-style: symbolic;
5078
  icon-size: 16px;
5079
}
5080
5081
.quick-settings-system-item .power-item {
5082
  color: #27a1b9 !important;
5083
  min-height: 0;
5084
  min-width: 0;
5085
}
5086
5087
.quick-settings-system-item .power-item:insensitive {
5088
  color: #e9e9ed;
5089
  background-color: #323449;
5090
  box-shadow: none !important;
5091
  background-color: transparent;
5092
}
5093
5094
.nm-network-item .wireless-secure-icon {
5095
  icon-size: 8px;
5096
}
5097
5098
.bt-device-item .popup-menu-icon {
5099
  -st-icon-style: symbolic;
5100
}
5101
5102
.bt-menu-placeholder.popup-menu-item {
5103
  text-align: center;
5104
  padding: 2em 4em;
5105
}
5106
5107
.device-subtitle {
5108
  color: rgba(233, 233, 237, 0.5);
5109
}
5110
5111
.background-apps-quick-toggle {
5112
  min-height: 40px;
5113
  background-color: transparent;
5114
}
5115
5116
.background-apps-quick-toggle StIcon {
5117
  icon-size: 16px !important;
5118
}
5119
5120
.background-app-item .popup-menu-icon {
5121
  icon-size: 32px !important;
5122
  -st-icon-style: regular !important;
5123
}
5124
5125
.background-app-item .close-button {
5126
  padding: 6px;
5127
}
5128
5129
.background-app-item.popup-inactive-menu-item {
5130
  color: #e9e9ed;
5131
}
5132
5133
.search-entry {
5134
  margin-top: 24px;
5135
  margin-bottom: 6px;
5136
}
5137
5138
/* Search */
5139
.list-search-result, .search-provider-icon {
5140
  border-radius: 12px;
5141
  padding: 6px;
5142
  transition-duration: 100ms;
5143
  text-align: center;
5144
  background-color: transparent;
5145
}
5146
5147
.list-search-result:focus, .search-provider-icon:focus, .list-search-result:hover, .search-provider-icon:hover, .list-search-result:selected, .search-provider-icon:selected {
5148
  background-color: rgba(233, 233, 237, 0.12);
5149
  transition-duration: 0;
5150
}
5151
5152
.list-search-result:active, .search-provider-icon:active, .list-search-result:checked, .search-provider-icon:checked {
5153
  background-color: rgba(233, 233, 237, 0.2);
5154
}
5155
5156
#searchResults {
5157
  margin: 0 4px;
5158
}
5159
5160
#searchResultsContent {
5161
  max-width: 1044px;
5162
}
5163
5164
.search-section {
5165
  spacing: 18px;
5166
}
5167
5168
.search-section .search-section-separator {
5169
  height: 8px;
5170
  background-color: transparent;
5171
}
5172
5173
.search-section-content {
5174
  border-radius: 27px;
5175
  padding: 12px;
5176
  margin: 0 12px;
5177
  border: none;
5178
  box-shadow: none;
5179
  background: none;
5180
  text-shadow: none;
5181
  color: rgba(233, 233, 237, 0.7);
5182
  background-color: rgba(233, 233, 237, 0.12);
5183
}
5184
5185
.search-statustext {
5186
  color: rgba(233, 233, 237, 0.5);
5187
}
5188
5189
.grid-search-results {
5190
  spacing: 30px;
5191
  margin: 0 12px;
5192
}
5193
5194
.search-provider-icon:ltr {
5195
  margin-right: 4px;
5196
}
5197
5198
.search-provider-icon:rtl {
5199
  margin-left: 4px;
5200
}
5201
5202
.search-provider-icon .list-search-provider-content {
5203
  spacing: 12px;
5204
}
5205
5206
.search-provider-icon .list-search-provider-content .list-search-provider-details {
5207
  width: 120px;
5208
  color: rgba(233, 233, 237, 0.7);
5209
}
5210
5211
.list-search-results {
5212
  spacing: 6px;
5213
}
5214
5215
.list-search-result .list-search-result-content {
5216
  spacing: 6px;
5217
}
5218
5219
.list-search-result .list-search-result-title {
5220
  spacing: 12px;
5221
}
5222
5223
.list-search-result .list-search-result-description {
5224
  color: rgba(233, 233, 237, 0.7);
5225
}
5226
5227
.icon-label-button-container {
5228
  spacing: 6px;
5229
}
5230
5231
.icon-label-button-container StIcon {
5232
  icon-size: 32px;
5233
}
5234
5235
.screenshot-ui-panel {
5236
  border-radius: 39px;
5237
  padding: 18px;
5238
  padding-bottom: 12px;
5239
  margin-bottom: 4em;
5240
  spacing: 12px;
5241
}
5242
5243
.screenshot-ui-close-button {
5244
  padding: 6px !important;
5245
  margin-top: 12px;
5246
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.15);
5247
}
5248
5249
.screenshot-ui-close-button.left {
5250
  margin-left: 12px;
5251
}
5252
5253
.screenshot-ui-close-button.right {
5254
  margin-right: 12px;
5255
}
5256
5257
.screenshot-ui-type-button {
5258
  min-width: 48px;
5259
  padding: 12px 18px !important;
5260
  border-radius: 21px;
5261
}
5262
5263
.screenshot-ui-capture-button {
5264
  width: 36px;
5265
  height: 36px;
5266
  border-radius: 9999px;
5267
  border: 4px #e9e9ed;
5268
  padding: 4px;
5269
}
5270
5271
.screenshot-ui-capture-button .screenshot-ui-capture-button-circle {
5272
  background-color: #e9e9ed;
5273
  transition-duration: 200ms;
5274
  border-radius: 9999px;
5275
}
5276
5277
.screenshot-ui-capture-button .screenshot-ui-capture-button-circle:hover, .screenshot-ui-capture-button .screenshot-ui-capture-button-circle:focus {
5278
  background-color: rgba(233, 233, 237, 0.12);
5279
}
5280
5281
.screenshot-ui-capture-button:hover .screenshot-ui-capture-button-circle, .screenshot-ui-capture-button:focus .screenshot-ui-capture-button-circle {
5282
  background-color: #bfbfcb;
5283
}
5284
5285
.screenshot-ui-capture-button:active .screenshot-ui-capture-button-circle {
5286
  background-color: #616176;
5287
}
5288
5289
.screenshot-ui-capture-button:cast .screenshot-ui-capture-button-circle {
5290
  background-color: #f52a65;
5291
}
5292
5293
.screenshot-ui-capture-button:cast:hover .screenshot-ui-capture-button-circle, .screenshot-ui-capture-button:cast:focus .screenshot-ui-capture-button-circle {
5294
  background-color: #f64277;
5295
}
5296
5297
.screenshot-ui-capture-button:cast:active .screenshot-ui-capture-button-circle {
5298
  background-color: #f00b4e;
5299
}
5300
5301
.screenshot-ui-shot-cast-container {
5302
  background-color: #242635;
5303
  border-radius: 18px;
5304
  padding: 3px;
5305
  spacing: 3px;
5306
}
5307
5308
.screenshot-ui-shot-cast-container:ltr {
5309
  margin-left: 3px;
5310
}
5311
5312
.screenshot-ui-shot-cast-container:rtl {
5313
  margin-right: 3px;
5314
}
5315
5316
.screenshot-ui-shot-cast-button {
5317
  padding: 6px 12px;
5318
  background-color: transparent;
5319
  border-radius: 15px;
5320
}
5321
5322
.screenshot-ui-shot-cast-button:hover, .screenshot-ui-shot-cast-button:focus {
5323
  background-color: #2f3144;
5324
}
5325
5326
.screenshot-ui-shot-cast-button:active {
5327
  background-color: rgba(233, 233, 237, 0.3);
5328
}
5329
5330
.screenshot-ui-shot-cast-button:checked {
5331
  background-color: #e9e9ed;
5332
  color: #1a1b26;
5333
}
5334
5335
.screenshot-ui-shot-cast-button:insensitive {
5336
  color: rgba(233, 233, 237, 0.5);
5337
}
5338
5339
.screenshot-ui-shot-cast-button StIcon {
5340
  icon-size: 16px;
5341
}
5342
5343
.screenshot-ui-show-pointer-button {
5344
  border-radius: 9999px;
5345
  padding: 12px !important;
5346
}
5347
5348
.screenshot-ui-show-pointer-button StIcon {
5349
  icon-size: 16px;
5350
}
5351
5352
.screenshot-ui-area-indicator-shade {
5353
  background-color: rgba(0, 0, 0, 0.3);
5354
}
5355
5356
.screenshot-ui-area-selector .screenshot-ui-area-indicator-shade {
5357
  background-color: rgba(0, 0, 0, 0.5);
5358
}
5359
5360
.screenshot-ui-area-selector .screenshot-ui-area-indicator-selection {
5361
  border: 2px solid #e9e9ed;
5362
}
5363
5364
.screenshot-ui-area-selector-handle {
5365
  border-radius: 9999px;
5366
  background-color: #27a1b9;
5367
  box-shadow: 0 1px 3px 2px rgba(0, 0, 0, 0.2);
5368
  width: 24px;
5369
  height: 24px;
5370
}
5371
5372
.screenshot-ui-window-selector {
5373
  background-color: #292e42;
5374
}
5375
5376
.screenshot-ui-window-selector .screenshot-ui-window-selector-window-container {
5377
  margin: 100px;
5378
}
5379
5380
.screenshot-ui-window-selector:primary-monitor .screenshot-ui-window-selector-window-container {
5381
  margin-bottom: 200px;
5382
}
5383
5384
.screenshot-ui-window-selector-window-border {
5385
  transition-duration: 200ms;
5386
  border-radius: 18px;
5387
  border: 6px transparent;
5388
}
5389
5390
.screenshot-ui-window-selector-check {
5391
  transition-duration: 200ms;
5392
  color: transparent;
5393
  border-radius: 9999px;
5394
  border-width: 12px;
5395
  icon-size: 24px;
5396
}
5397
5398
.screenshot-ui-window-selector-window:hover .screenshot-ui-window-selector-window-border {
5399
  border-color: #1a6a7a;
5400
}
5401
5402
.screenshot-ui-window-selector-window:checked .screenshot-ui-window-selector-window-border {
5403
  border-color: #27a1b9;
5404
  background-color: rgba(39, 161, 185, 0.2);
5405
}
5406
5407
.screenshot-ui-window-selector-window:checked .screenshot-ui-window-selector-check {
5408
  color: #e9e9ed;
5409
  background-color: #27a1b9;
5410
}
5411
5412
.screenshot-ui-screen-selector {
5413
  transition-duration: 200ms;
5414
  background-color: rgba(0, 0, 0, 0.5);
5415
}
5416
5417
.screenshot-ui-screen-selector:hover {
5418
  background-color: rgba(0, 0, 0, 0.3);
5419
}
5420
5421
.screenshot-ui-screen-selector:active {
5422
  background-color: rgba(0, 0, 0, 0.7);
5423
}
5424
5425
.screenshot-ui-screen-selector:checked {
5426
  background-color: transparent;
5427
  border: 2px solid #e9e9ed;
5428
}
5429
5430
.screenshot-ui-tooltip {
5431
  color: #e9e9ed;
5432
  background-color: #1a1b26;
5433
  border-radius: 9999px;
5434
  padding: 6px 12px;
5435
  text-align: center;
5436
  -y-offset: 24px;
5437
}
5438
5439
/* Switches */
5440
.toggle-switch {
5441
  width: 46px;
5442
  height: 24px;
5443
  background-size: contain;
5444
  background-image: url("assets/toggle-off.svg");
5445
  transition-duration: 100ms;
5446
  color: transparent;
5447
}
5448
5449
.toggle-switch:checked {
5450
  background-image: url("assets/toggle-on.svg");
5451
  color: transparent;
5452
}
5453
5454
.toggle-switch:checked .handle {
5455
  background: none;
5456
}
5457
5458
.toggle-switch StIcon {
5459
  icon-size: 0;
5460
}
5461
5462
.toggle-switch .handle {
5463
  margin: 0;
5464
  width: 0;
5465
  height: 0;
5466
  background: none;
5467
  box-shadow: none;
5468
  transition-duration: 0;
5469
}
5470
5471
.window-picker {
5472
  spacing: 6px;
5473
}
5474
5475
.window-caption {
5476
  color: #e9e9ed;
5477
  background-color: #1a1b26;
5478
  border-radius: 9999px;
5479
  padding: 6px 12px;
5480
}
5481
5482
.window-close, .screenshot-ui-close-button {
5483
  background-color: #292e42;
5484
  color: #e9e9ed;
5485
  border-radius: 9999px;
5486
  padding: 3px;
5487
  height: 30px;
5488
  width: 30px;
5489
  box-shadow: -1px 1px 5px 0px rgba(0, 0, 0, 0.5);
5490
  transition-duration: 300ms;
5491
}
5492
5493
.window-close:hover, .screenshot-ui-close-button:hover {
5494
  color: #e9e9ed;
5495
  background-color: #353b55;
5496
}
5497
5498
.window-close:active, .screenshot-ui-close-button:active {
5499
  color: #e9e9ed;
5500
  background-color: #1d212f;
5501
}
5502
5503
.workspace-background {
5504
  border-radius: 30px;
5505
  background-color: #1a1b26;
5506
  box-shadow: 0 4px 16px 4px rgba(0, 0, 0, 0.3);
5507
}
5508
5509
/* Workspace pager */
5510
.workspace-thumbnails {
5511
  visible-width: 32px;
5512
  spacing: 6px;
5513
  padding: 6px;
5514
}
5515
5516
.workspace-thumbnails .workspace-thumbnail {
5517
  color: rgba(233, 233, 237, 0.7);
5518
  background-color: rgba(233, 233, 237, 0.12);
5519
  border: none;
5520
  border-radius: 12px;
5521
}
5522
5523
.workspace-thumbnails .placeholder {
5524
  background-image: url("assets/dash-placeholder.svg");
5525
  background-size: contain;
5526
  width: 18px;
5527
  height: 24px;
5528
}
5529
5530
.workspace-thumbnail-indicator {
5531
  border: 3px solid #27a1b9;
5532
  border-radius: 3px;
5533
  padding: 0px;
5534
}
5535
5536
.bottom #dashtodockDashScrollview,
5537
.top #dashtodockDashScrollview {
5538
  -st-hfade-offset: 24px;
5539
}
5540
5541
.left #dashtodockDashScrollview,
5542
.right #dashtodockDashScrollview {
5543
  -st-vfade-offset: 24px;
5544
}
5545
5546
#dashtodockContainer {
5547
  background-color: transparent;
5548
}
5549
5550
#dashtodockContainer .number-overlay {
5551
  color: #e9e9ed;
5552
  background-color: rgba(0, 0, 0, 0.75);
5553
  text-align: center;
5554
}
5555
5556
#dashtodockContainer .notification-badge {
5557
  color: #e9e9ed;
5558
  background-color: #27a1b9;
5559
  box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.25);
5560
  border-radius: 9999px;
5561
  margin: 2px;
5562
  padding: 0.25em 0.6em;
5563
  font-weight: bold;
5564
  text-align: center;
5565
}
5566
5567
#dashtodockContainer.straight-corner #dash, #dashtodockContainer.shrink.straight-corner #dash {
5568
  border-radius: 0;
5569
  margin: 0;
5570
}
5571
5572
#dashtodockContainer.straight-corner #dash .dash-background, #dashtodockContainer.shrink.straight-corner #dash .dash-background {
5573
  border-radius: 0;
5574
}
5575
5576
#dashtodockContainer.extended.top #dash, #dashtodockContainer.extended.bottom #dash, #dashtodockContainer.extended.right #dash, #dashtodockContainer.extended.left #dash {
5577
  margin-left: 0;
5578
  margin-right: 0;
5579
  margin-top: 0;
5580
  margin-bottom: 0;
5581
  padding: 0 0;
5582
}
5583
5584
#dashtodockContainer.extended.top #dash .dash-background, #dashtodockContainer.extended.bottom #dash .dash-background, #dashtodockContainer.extended.right #dash .dash-background, #dashtodockContainer.extended.left #dash .dash-background {
5585
  border-radius: 0;
5586
  margin-left: 0;
5587
  margin-right: 0;
5588
  margin-top: 0;
5589
  margin-bottom: 0;
5590
}
5591
5592
#dashtodockContainer.left #dash, #dashtodockContainer.right #dash {
5593
  margin-top: 0;
5594
  padding: 12px 0;
5595
}
5596
5597
#dashtodockContainer.left #dash .dash-background, #dashtodockContainer.right #dash .dash-background {
5598
  margin-bottom: 0;
5599
}
5600
5601
#dashtodockContainer.left .dash-item-container .app-well-app,
5602
#dashtodockContainer.left .show-apps, #dashtodockContainer.right .dash-item-container .app-well-app,
5603
#dashtodockContainer.right .show-apps {
5604
  padding: 6px;
5605
}
5606
5607
#dashtodockContainer.left #dash {
5608
  margin-left: 6px;
5609
}
5610
5611
#dashtodockContainer.right #dash {
5612
  margin-right: 6px;
5613
}
5614
5615
#dashtodockContainer.dashtodock #dash .dash-background {
5616
  background-color: rgba(26, 27, 38, 0.6);
5617
}
5618
5619
#dashtodockContainer #dash .dash-background {
5620
  background-color: rgba(26, 27, 38, 0.85);
5621
}
5622
5623
#dashtodockContainer .app-well-app-running-dot {
5624
  background-color: rgba(233, 233, 237, 0.3) !important;
5625
}
5626
5627
#dashtodockContainer StWidget.focused .app-well-app-running-dot {
5628
  background-color: #e1e2e7 !important;
5629
}
5630
5631
#dashtodockContainer:overview #dash .app-well-app-running-dot {
5632
  background-color: rgba(233, 233, 237, 0.3) !important;
5633
}
5634
5635
#dashtodockContainer:overview #dash StWidget.focused .app-well-app-running-dot {
5636
  background-color: #e9e9ed !important;
5637
}
5638
5639
#dashtodockContainer .show-apps .overview-icon,
5640
#dashtodockContainer .app-well-app .overview-icon {
5641
  color: rgba(233, 233, 237, 0.7);
5642
}
5643
5644
#dashtodockContainer .show-apps:hover .overview-icon, #dashtodockContainer .show-apps:focus .overview-icon, #dashtodockContainer .show-apps:selected .overview-icon,
5645
#dashtodockContainer .app-well-app:hover .overview-icon,
5646
#dashtodockContainer .app-well-app:focus .overview-icon,
5647
#dashtodockContainer .app-well-app:selected .overview-icon {
5648
  background-color: rgba(233, 233, 237, 0.12);
5649
}
5650
5651
#dashtodockContainer .show-apps:active .overview-icon, #dashtodockContainer .show-apps:checked .overview-icon,
5652
#dashtodockContainer .app-well-app:active .overview-icon,
5653
#dashtodockContainer .app-well-app:checked .overview-icon {
5654
  background-color: rgba(233, 233, 237, 0.3);
5655
}
5656
5657
#dashtodockContainer:overview #dash .show-apps .overview-icon, #dashtodockContainer:overview #dash .app-well-app .overview-icon {
5658
  color: rgba(233, 233, 237, 0.7);
5659
}
5660
5661
#dashtodockContainer:overview #dash .show-apps:hover .overview-icon, #dashtodockContainer:overview #dash .show-apps:focus .overview-icon, #dashtodockContainer:overview #dash .show-apps:selected .overview-icon, #dashtodockContainer:overview #dash .app-well-app:hover .overview-icon, #dashtodockContainer:overview #dash .app-well-app:focus .overview-icon, #dashtodockContainer:overview #dash .app-well-app:selected .overview-icon {
5662
  background-color: rgba(233, 233, 237, 0.12);
5663
}
5664
5665
#dashtodockContainer:overview #dash .show-apps:active .overview-icon, #dashtodockContainer:overview #dash .show-apps:checked .overview-icon, #dashtodockContainer:overview #dash .app-well-app:active .overview-icon, #dashtodockContainer:overview #dash .app-well-app:checked .overview-icon {
5666
  background-color: rgba(233, 233, 237, 0.3);
5667
}
5668
5669
#dashtodockContainer .app-well-app-running-dot {
5670
  background-color: rgba(233, 233, 237, 0.3);
5671
}
5672
5673
#dashtodockContainer StWidget.focused .app-well-app-running-dot {
5674
  background-color: #e1e2e7;
5675
}
5676
5677
#dashtodockContainer.opaque #dash .dash-background {
5678
  background-color: rgba(26, 27, 38, 0.6);
5679
}
5680
5681
#dashtodockContainer.transparent #dash .dash-background {
5682
  background-color: rgba(26, 27, 38, 0.35);
5683
}
5684
5685
#dashtodockContainer:overview #dash .dash-background {
5686
  background-color: rgba(233, 233, 237, 0.12);
5687
  border: 2px solid transparent;
5688
}
5689
5690
#dashtodockContainer.opaque:overview #dash .dash-background, #dashtodockContainer.transparent:overview #dash .dash-background {
5691
  background-color: transparent !important;
5692
  box-shadow: none !important;
5693
}
5694
5695
#dashtodockContainer.extended:overview #dash .dash-background, #dashtodockContainer.opaque.extended:overview #dash .dash-background, #dashtodockContainer.transparent.extended:overview #dash .dash-background {
5696
  background-color: rgba(26, 27, 38, 0.6);
5697
}
5698
5699
#dashtodockContainer.running-dots .dash-item-container > StButton, #dashtodockContainer.dashtodock .dash-item-container > StButton {
5700
  transition-duration: 250ms;
5701
  background-size: contain;
5702
}
5703
5704
#dashtodockContainer.extended .app-well-app .overview-icon,
5705
#dashtodockContainer.extended .show-apps .overview-icon, #dashtodockContainer.extended:overview .app-well-app .overview-icon,
5706
#dashtodockContainer.extended:overview .show-apps .overview-icon {
5707
  border-radius: 12px;
5708
}
5709
5710
#dashtodockContainer .metro .overview-icon {
5711
  border-radius: 0;
5712
}
5713
5714
.dashtodock-app-well-preview-menu-item {
5715
  padding: 1em 1em 0.5em 1em;
5716
}
5717
5718
#dashtodockPreviewSeparator.popup-separator-menu-item-horizontal {
5719
  background-color: rgba(233, 233, 237, 0.25);
5720
  width: 1px;
5721
  height: auto;
5722
  border-right-width: 1px;
5723
  margin: 32px 0;
5724
}
5725
5726
.openweather-button, .openweather-button-action, .openweather-menu-button-container, .openweather-button-box {
5727
  border: 1px solid transparent;
5728
}
5729
5730
.openweather-provider {
5731
  padding: 0 16px;
5732
  font-weight: 500;
5733
  border: 1px solid transparent;
5734
}
5735
5736
.openweather-current-icon, .openweather-current-summary, .openweather-current-summarybox {
5737
  background: none;
5738
  color: #e9e9ed;
5739
}
5740
5741
.openweather-current-databox-values {
5742
  background: none;
5743
  color: rgba(233, 233, 237, 0.5);
5744
}
5745
5746
.openweather-current-databox-captions {
5747
  background: none;
5748
  color: rgba(233, 233, 237, 0.5);
5749
}
5750
5751
.openweather-forecast-icon, .openweather-forecast-summary {
5752
  background: none;
5753
  color: rgba(233, 233, 237, 0.7);
5754
}
5755
5756
.openweather-forecast-day, .openweather-forecast-temperature {
5757
  background: none;
5758
  color: rgba(233, 233, 237, 0.5);
5759
}
5760
5761
.openweather-sunrise-icon, .openweather-sunset-icon, .openweather-build-icon {
5762
  color: rgba(233, 233, 237, 0.7);
5763
}
5764
5765
.cosmic-dock #dock {
5766
  border-radius: 16px !important;
5767
  border: none !important;
5768
  margin: 6px !important;
5769
  background-color: rgba(50, 52, 73, 0.65) !important;
5770
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.08) !important;
5771
}
5772
5773
.cosmic-dock #dock .dash-background {
5774
  background-color: transparent !important;
5775
  margin-bottom: 0 !important;
5776
  padding: 0;
5777
  box-shadow: none !important;
5778
}
5779
5780
.cosmic-application-dialog {
5781
  border-radius: 18px;
5782
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.08);
5783
  background-color: #292e42;
5784
  color: #e9e9ed;
5785
}
5786
5787
.cosmic-application-dialog .overview-icon {
5788
  color: #e9e9ed;
5789
}
5790
5791
.cosmic-applications-separator {
5792
  background: rgba(233, 233, 237, 0.12);
5793
}
5794
5795
.cosmic-folder-edit-button {
5796
  box-shadow: none;
5797
  border-radius: 12px;
5798
  border-width: 0;
5799
  color: #e9e9ed;
5800
  background: rgba(233, 233, 237, 0.04);
5801
}
5802
5803
.cosmic-folder-edit-button .cosmic-folder-edit-button:hover {
5804
  background: rgba(233, 233, 237, 0.12);
5805
}
5806
5807
.cosmic-applications-icon {
5808
  color: rgba(233, 233, 237, 0.7);
5809
}
5810
5811
.cosmic-applications-folder-title {
5812
  color: rgba(233, 233, 237, 0.7);
5813
}
5814
5815
.cosmic-applications-available {
5816
  color: #e9e9ed;
5817
}
5818
5819
.pop-shell-active-hint {
5820
  border-style: solid;
5821
  border-color: #8c6c3e;
5822
  border-radius: 12px;
5823
  box-shadow: none;
5824
}
5825
5826
.pop-shell-overlay {
5827
  background-color: rgba(39, 161, 185, 0.3);
5828
}
5829
5830
.pop-shell-search-element:select {
5831
  background: rgba(233, 233, 237, 0.12);
5832
  border-radius: 12px;
5833
  color: #e9e9ed;
5834
}
5835
5836
.pop-shell-tab {
5837
  border: 1px solid rgba(233, 233, 237, 0.12);
5838
  color: #e9e9ed;
5839
}
5840
5841
.pop-shell-tab-active {
5842
  background: #8c6c3e;
5843
}
5844
5845
.pop-shell-tab-inactive {
5846
  background: rgba(140, 108, 62, 0.35);
5847
}
5848
5849
.pop-shell-tab-urgent {
5850
  background: #f52a65;
5851
}
5852
5853
#panel.light-panel .panel-button,
5854
#panel.dark-panel .panel-button,
5855
#panel.transparent-panel .panel-button {
5856
  color: rgba(233, 233, 237, 0.7) !important;
5857
}
5858
5859
#panel.light-panel .panel-button.clock-display .clock,
5860
#panel.dark-panel .panel-button.clock-display .clock,
5861
#panel.transparent-panel .panel-button.clock-display .clock {
5862
  color: rgba(233, 233, 237, 0.7) !important;
5863
}
5864
5865
#panel.light-panel .panel-button:hover,
5866
#panel.dark-panel .panel-button:hover,
5867
#panel.transparent-panel .panel-button:hover {
5868
  color: rgba(233, 233, 237, 0.7) !important;
5869
  background-color: rgba(233, 233, 237, 0.12) !important;
5870
}
5871
5872
#panel.light-panel .panel-button:hover.clock-display .clock,
5873
#panel.dark-panel .panel-button:hover.clock-display .clock,
5874
#panel.transparent-panel .panel-button:hover.clock-display .clock {
5875
  background-color: rgba(233, 233, 237, 0.12) !important;
5876
}
5877
5878
#panel.light-panel .panel-button:active, #panel.light-panel .panel-button:checked, #panel.light-panel .panel-button:focus,
5879
#panel.dark-panel .panel-button:active,
5880
#panel.dark-panel .panel-button:checked,
5881
#panel.dark-panel .panel-button:focus,
5882
#panel.transparent-panel .panel-button:active,
5883
#panel.transparent-panel .panel-button:checked,
5884
#panel.transparent-panel .panel-button:focus {
5885
  color: #e9e9ed !important;
5886
  background-color: rgba(233, 233, 237, 0.3) !important;
5887
}
5888
5889
#panel.light-panel .panel-button:active.clock-display .clock, #panel.light-panel .panel-button:checked.clock-display .clock, #panel.light-panel .panel-button:focus.clock-display .clock,
5890
#panel.dark-panel .panel-button:active.clock-display .clock,
5891
#panel.dark-panel .panel-button:checked.clock-display .clock,
5892
#panel.dark-panel .panel-button:focus.clock-display .clock,
5893
#panel.transparent-panel .panel-button:active.clock-display .clock,
5894
#panel.transparent-panel .panel-button:checked.clock-display .clock,
5895
#panel.transparent-panel .panel-button:focus.clock-display .clock {
5896
  background-color: rgba(233, 233, 237, 0.3) !important;
5897
}
5898
5899
#panel.light-panel .panel-button:hover.clock-display, #panel.light-panel .panel-button:active.clock-display, #panel.light-panel .panel-button:overview.clock-display, #panel.light-panel .panel-button:focus.clock-display, #panel.light-panel .panel-button:checked.clock-display,
5900
#panel.dark-panel .panel-button:hover.clock-display,
5901
#panel.dark-panel .panel-button:active.clock-display,
5902
#panel.dark-panel .panel-button:overview.clock-display,
5903
#panel.dark-panel .panel-button:focus.clock-display,
5904
#panel.dark-panel .panel-button:checked.clock-display,
5905
#panel.transparent-panel .panel-button:hover.clock-display,
5906
#panel.transparent-panel .panel-button:active.clock-display,
5907
#panel.transparent-panel .panel-button:overview.clock-display,
5908
#panel.transparent-panel .panel-button:focus.clock-display,
5909
#panel.transparent-panel .panel-button:checked.clock-display {
5910
  background-color: transparent !important;
5911
}
5912
5913
#panel.light-panel .panel-button:hover.clock-display .clock, #panel.light-panel .panel-button:active.clock-display .clock, #panel.light-panel .panel-button:overview.clock-display .clock, #panel.light-panel .panel-button:focus.clock-display .clock, #panel.light-panel .panel-button:checked.clock-display .clock,
5914
#panel.dark-panel .panel-button:hover.clock-display .clock,
5915
#panel.dark-panel .panel-button:active.clock-display .clock,
5916
#panel.dark-panel .panel-button:overview.clock-display .clock,
5917
#panel.dark-panel .panel-button:focus.clock-display .clock,
5918
#panel.dark-panel .panel-button:checked.clock-display .clock,
5919
#panel.transparent-panel .panel-button:hover.clock-display .clock,
5920
#panel.transparent-panel .panel-button:active.clock-display .clock,
5921
#panel.transparent-panel .panel-button:overview.clock-display .clock,
5922
#panel.transparent-panel .panel-button:focus.clock-display .clock,
5923
#panel.transparent-panel .panel-button:checked.clock-display .clock {
5924
  color: #e9e9ed !important;
5925
}
5926
5927
.overview-components-transparent .search-entry,
5928
.overview-components-light .search-entry,
5929
.overview-components-dark .search-entry {
5930
  caret-color: #e9e9ed !important;
5931
}
5932
5933
.overview-components-transparent .search-entry .search-entry-icon,
5934
.overview-components-light .search-entry .search-entry-icon,
5935
.overview-components-dark .search-entry .search-entry-icon {
5936
  color: rgba(233, 233, 237, 0.7) !important;
5937
}
5938
5939
.overview-components-transparent .search-entry StLabel.hint-text,
5940
.overview-components-light .search-entry StLabel.hint-text,
5941
.overview-components-dark .search-entry StLabel.hint-text {
5942
  color: rgba(233, 233, 237, 0.3) !important;
5943
}
5944
5945
.overview-components-transparent .search-section-content,
5946
.overview-components-light .search-section-content,
5947
.overview-components-dark .search-section-content {
5948
  border-radius: 16px;
5949
}
5950
5951
.overview-components-transparent .search-section-separator,
5952
.overview-components-light .search-section-separator,
5953
.overview-components-dark .search-section-separator {
5954
  height: 0 !important;
5955
  background-color: transparent !important;
5956
}