1.wvui-button {
2  box-sizing: border-box;
3  min-width: 32px;
4  min-height: 32px;
5  max-width: 28.75em;
6  margin: 0;
7  border-width: 1px;
8  border-style: solid;
9  border-radius: 2px;
10  padding-right: 12px;
11  padding-left: 12px;
12  overflow: visible;
13  font-family: inherit;
14  font-size: inherit;
15  font-weight: bold;
16  text-transform: none;
17  white-space: nowrap;
18  -webkit-transition-property: border-color, background-color, color, box-shadow;
19  transition-property: border-color, background-color, color, box-shadow;
20  -webkit-transition-duration: 100ms;
21          transition-duration: 100ms;
22}
23.wvui-button::-moz-focus-inner {
24  border: 0;
25  padding: 0;
26}
27.wvui-button:focus {
28  outline: 0;
29}
30.wvui-button:not( [ disabled ] ) {
31  color: #202122;
32  cursor: pointer;
33}
34.wvui-button:not( [ disabled ] ):focus {
35  border-color: #36c;
36  box-shadow: inset 0 0 0 1px #36c;
37  outline: 1px solid transparent;
38}
39.wvui-button:not( [ disabled ] ):active {
40  background-color: #c8ccd1;
41  color: #000;
42  box-shadow: none;
43}
44.wvui-button[disabled] {
45  border-color: transparent;
46}
47.wvui-button .wvui-icon {
48  color: inherit;
49}
50.wvui-button--framed:not( [ disabled ] ) {
51  background-color: #f8f9fa;
52  border-color: #a2a9b1;
53}
54.wvui-button--framed:not( [ disabled ] ):hover {
55  background-color: #fff;
56  color: #404244;
57}
58.wvui-button--framed:not( [ disabled ] ):active {
59  background-color: #c8ccd1;
60  color: #000;
61  border-color: #72777d;
62}
63.wvui-button--framed[disabled] {
64  background-color: #c8ccd1;
65  color: #fff;
66}
67.wvui-button--type-primary.wvui-button--action-progressive:not( [ disabled ] ) {
68  background-color: #36c;
69  color: #fff;
70  border-color: #36c;
71}
72.wvui-button--type-primary.wvui-button--action-progressive:not( [ disabled ] ):hover {
73  background-color: #447ff5;
74  border-color: #447ff5;
75}
76.wvui-button--type-primary.wvui-button--action-progressive:not( [ disabled ] ):focus {
77  background-color: #36c;
78  border-color: #36c;
79  box-shadow: inset 0 0 0 1px #36c, inset 0 0 0 2px #fff;
80}
81.wvui-button--type-primary.wvui-button--action-progressive:not( [ disabled ] ):active {
82  background-color: #2a4b8d;
83  border-color: #2a4b8d;
84  box-shadow: none;
85}
86.wvui-button--type-primary.wvui-button--action-destructive:not( [ disabled ] ) {
87  background-color: #d33;
88  color: #fff;
89  border-color: #d33;
90}
91.wvui-button--type-primary.wvui-button--action-destructive:not( [ disabled ] ):hover {
92  background-color: #ff4242;
93  border-color: #ff4242;
94}
95.wvui-button--type-primary.wvui-button--action-destructive:not( [ disabled ] ):focus {
96  background-color: #d33;
97  border-color: #d33;
98  box-shadow: inset 0 0 0 1px #d33, inset 0 0 0 2px #fff;
99}
100.wvui-button--type-primary.wvui-button--action-destructive:not( [ disabled ] ):active {
101  background-color: #b32424;
102  border-color: #b32424;
103  box-shadow: none;
104}
105.wvui-button--type-normal.wvui-button--action-progressive:not( [ disabled ] ) {
106  color: #36c;
107}
108.wvui-button--type-normal.wvui-button--action-progressive:not( [ disabled ] ):hover {
109  color: #447ff5;
110  border-color: #447ff5;
111}
112.wvui-button--type-normal.wvui-button--action-progressive:not( [ disabled ] ):focus {
113  color: #36c;
114  border-color: #36c;
115  box-shadow: inset 0 0 0 1px #36c, inset 0 0 0 2px #fff;
116}
117.wvui-button--type-normal.wvui-button--action-progressive:not( [ disabled ] ):active {
118  background-color: #eff3fa;
119  color: #2a4b8d;
120  border-color: #2a4b8d;
121  box-shadow: none;
122}
123.wvui-button--type-normal.wvui-button--action-destructive:not( [ disabled ] ) {
124  color: #d33;
125}
126.wvui-button--type-normal.wvui-button--action-destructive:not( [ disabled ] ):hover {
127  color: #ff4242;
128  border-color: #ff4242;
129}
130.wvui-button--type-normal.wvui-button--action-destructive:not( [ disabled ] ):focus {
131  color: #d33;
132  border-color: #d33;
133  box-shadow: inset 0 0 0 1px #d33, inset 0 0 0 2px #fff;
134}
135.wvui-button--type-normal.wvui-button--action-destructive:not( [ disabled ] ):active {
136  background-color: #ffffff;
137  color: #b32424;
138  border-color: #b32424;
139  box-shadow: none;
140}
141.wvui-button--type-quiet {
142  background-color: transparent;
143  border-color: transparent;
144}
145.wvui-button--type-quiet:not( [ disabled ] ):hover {
146  background-color: rgba(0, 24, 73, 0.02745098);
147}
148.wvui-button--type-quiet:not( [ disabled ] ):focus {
149  border-color: #36c;
150  box-shadow: inset 0 0 0 1px #36c, inset 0 0 0 2px #fff;
151}
152.wvui-button--type-quiet:not( [ disabled ] ):active {
153  background-color: rgba(0, 36, 73, 0.08235294);
154  border-color: #72777d;
155  box-shadow: none;
156}
157.wvui-button--type-quiet.wvui-button--action-progressive:not( [ disabled ] ) {
158  color: #36c;
159}
160.wvui-button--type-quiet.wvui-button--action-progressive:not( [ disabled ] ):hover {
161  background-color: rgba(52, 123, 255, 0.2);
162  color: #447ff5;
163}
164.wvui-button--type-quiet.wvui-button--action-progressive:not( [ disabled ] ):focus {
165  color: #36c;
166  border-color: #36c;
167  box-shadow: inset 0 0 0 1px #36c, inset 0 0 0 2px #fff;
168}
169.wvui-button--type-quiet.wvui-button--action-progressive:not( [ disabled ] ):active {
170  background-color: #2a4b8d;
171  color: #fff;
172  border-color: #2a4b8d;
173  box-shadow: none;
174}
175.wvui-button--type-quiet.wvui-button--action-destructive:not( [ disabled ] ) {
176  color: #d33;
177}
178.wvui-button--type-quiet.wvui-button--action-destructive:not( [ disabled ] ):hover {
179  background-color: rgba(209, 29, 19, 0.2);
180  color: #ff4242;
181}
182.wvui-button--type-quiet.wvui-button--action-destructive:not( [ disabled ] ):focus {
183  color: #d33;
184  border-color: #d33;
185  box-shadow: inset 0 0 0 1px #d33, inset 0 0 0 2px #fff;
186}
187.wvui-button--type-quiet.wvui-button--action-destructive:not( [ disabled ] ):active {
188  background-color: #b32424;
189  color: #fff;
190  border-color: #b32424;
191  box-shadow: none;
192}
193.wvui-button--type-quiet[disabled] {
194  color: #72777d;
195}
196
197.wvui-checkbox {
198  position: relative;
199  z-index: 0;
200  line-height: 1.42857143em;
201  cursor: pointer;
202}
203.wvui-checkbox__label-content {
204  display: inline-block;
205  padding-left: 1.92857143em;
206}
207.wvui-checkbox:not( .wvui-checkbox--inline) {
208  display: block;
209  margin-bottom: 12px;
210}
211.wvui-checkbox:not( .wvui-checkbox--inline):last-child {
212  margin-bottom: 0;
213}
214.wvui-checkbox--inline {
215  margin-right: 16px;
216  white-space: nowrap;
217}
218.wvui-checkbox--inline:last-child {
219  margin-right: 0;
220}
221.wvui-checkbox--inline span[class$='__label-content'] {
222  display: inline;
223}
224.wvui-checkbox[aria-disabled='true'] {
225  cursor: default;
226}
227.wvui-checkbox__icon {
228  background-color: #fff;
229  position: absolute;
230  left: 0;
231  box-sizing: border-box;
232  width: 1.42857143em;
233  height: 1.42857143em;
234  border: 1px solid #72777d;
235}
236.wvui-checkbox__input {
237  opacity: 0;
238  position: absolute;
239  left: 0;
240  z-index: 1;
241  width: 1.42857143em;
242  height: 1.42857143em;
243  margin: 0;
244  font-size: inherit;
245  cursor: inherit;
246}
247.wvui-checkbox__icon {
248  background-size: 0 0;
249  border-radius: 2px;
250  -webkit-transition-property: background-color, border-color, box-shadow;
251  transition-property: background-color, border-color, box-shadow;
252  -webkit-transition-duration: 100ms;
253          transition-duration: 100ms;
254}
255.wvui-checkbox__input:focus + .wvui-checkbox__icon {
256  border-color: #36c;
257  box-shadow: inset 0 0 0 1px #36c;
258  outline: 1px solid transparent;
259}
260.wvui-checkbox__input:hover + .wvui-checkbox__icon {
261  border-color: #447ff5;
262}
263.wvui-checkbox__input:indeterminate + .wvui-checkbox__icon:before {
264  content: ' ';
265  background-color: #fff;
266  position: absolute;
267  top: 50%;
268  right: 0.21428571em;
269  left: 0.21428571em;
270  height: 2px;
271  margin-top: -1px;
272}
273.wvui-checkbox__input:checked + .wvui-checkbox__icon {
274  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20"><title>check</title><g fill="%23fff"><path d="M7 14.17L2.83 10l-1.41 1.41L7 17 19 5l-1.41-1.42z"/></g></svg>');
275  background-position: center;
276  background-repeat: no-repeat;
277  background-size: 1em 1em;
278}
279.wvui-checkbox__input:disabled + .wvui-checkbox__icon {
280  background-color: #c8ccd1;
281  border-color: #c8ccd1;
282  box-shadow: none;
283}
284.wvui-checkbox__input:disabled ~ .wvui-checkbox__label-content {
285  color: #72777d;
286}
287.wvui-checkbox__input:checked:enabled + .wvui-checkbox__icon,
288.wvui-checkbox__input:indeterminate:enabled + .wvui-checkbox__icon {
289  background-color: #36c;
290  border-color: #36c;
291}
292.wvui-checkbox__input:checked:enabled:focus + .wvui-checkbox__icon,
293.wvui-checkbox__input:indeterminate:enabled:focus + .wvui-checkbox__icon {
294  background-color: #36c;
295  border-color: #36c;
296  box-shadow: inset 0 0 0 1px #36c, inset 0 0 0 2px #fff;
297}
298.wvui-checkbox__input:checked:enabled:hover + .wvui-checkbox__icon,
299.wvui-checkbox__input:indeterminate:enabled:hover + .wvui-checkbox__icon {
300  background-color: #447ff5;
301  border-color: #447ff5;
302}
303.wvui-checkbox:active .wvui-checkbox__input:enabled + .wvui-checkbox__icon {
304  background-color: #2a4b8d;
305  border-color: #2a4b8d;
306  box-shadow: inset 0 0 0 1px #2a4b8d;
307}
308.wvui-checkbox:active .wvui-checkbox__input:enabled:checked + .wvui-checkbox__icon {
309  background-color: #2a4b8d;
310  border-color: #2a4b8d;
311  box-shadow: inset 0 0 0 1px #2a4b8d;
312}
313
314.wvui-icon {
315  color: #202122;
316  display: -webkit-inline-box;
317  display: inline-flex;
318  /* stylelint-disable-line plugin/no-unsupported-browser-features */
319  -webkit-box-align: center;
320          align-items: center;
321  -webkit-box-pack: center;
322          justify-content: center;
323  vertical-align: middle;
324}
325[dir='rtl'] .wvui-icon--flip-for-rtl svg {
326  -webkit-transform: scaleX(-1);
327          transform: scaleX(-1);
328}
329
330.wvui-options-menu {
331  background-color: #fff;
332  box-sizing: border-box;
333  margin: 0;
334  border: 1px solid #a2a9b1;
335  border-radius: 0 0 2px 2px;
336  padding: 0;
337}
338.wvui-options-menu__item {
339  color: #202122;
340  list-style: none;
341  padding: 6px 12px;
342  overflow: hidden;
343  line-height: 1.42857143em;
344  text-overflow: ellipsis;
345  white-space: nowrap;
346  -webkit-transition-property: background-color, color;
347  transition-property: background-color, color;
348  -webkit-transition-duration: 100ms;
349          transition-duration: 100ms;
350}
351.wvui-options-menu__item--enabled {
352  cursor: pointer;
353}
354.wvui-options-menu__item--enabled:hover {
355  background-color: #eaecf0;
356}
357.wvui-options-menu__item--active,
358.wvui-options-menu__item--active:hover {
359  background-color: #eaf3ff;
360  color: #000;
361}
362.wvui-options-menu__item--highlighted {
363  background-color: #eaecf0;
364}
365.wvui-options-menu__item--selected,
366.wvui-options-menu__item--selected:hover {
367  background-color: #eaf3ff;
368}
369.wvui-options-menu__item--active.wvui-options-menu__item--selected {
370  color: #36c;
371}
372.wvui-options-menu__item--disabled {
373  color: #72777d;
374  cursor: default;
375}
376
377.wvui-dropdown {
378  display: inline-block;
379  position: relative;
380  min-width: 280px;
381}
382.wvui-dropdown__indicator {
383  color: #202122;
384  position: absolute;
385  top: 50%;
386  -webkit-transform: translateY(-50%);
387          transform: translateY(-50%);
388  right: 12px;
389  -webkit-transition-property: color;
390  transition-property: color;
391  -webkit-transition-duration: 100ms;
392          transition-duration: 100ms;
393}
394.wvui-dropdown__indicator svg {
395  width: 0.85714286em;
396  height: 0.85714286em;
397}
398.wvui-dropdown__handle {
399  background-color: #f8f9fa;
400  color: #202122;
401  position: relative;
402  box-sizing: border-box;
403  min-height: 2.28571429em;
404  width: 100%;
405  border: 1px solid #a2a9b1;
406  border-radius: 2px;
407  padding: 5px calc(2 * 12px + 0.85714286em) 5px 12px;
408  line-height: 1.42857143em;
409  -webkit-transition-property: background-color, color, border-color, box-shadow;
410  transition-property: background-color, color, border-color, box-shadow;
411  -webkit-transition-duration: 100ms;
412          transition-duration: 100ms;
413  cursor: pointer;
414}
415.wvui-dropdown__handle:hover {
416  background-color: #fff;
417  color: #404244;
418  border-color: #a2a9b1;
419}
420.wvui-dropdown__handle:hover .wvui-dropdown__indicator {
421  color: #404244;
422}
423.wvui-dropdown__handle:focus {
424  border-color: #36c;
425  box-shadow: inset 0 0 0 1px #36c, inset 0 0 0 2px #fff;
426  outline: 0;
427}
428.wvui-dropdown__handle:active {
429  color: #000;
430  border-color: #72777d;
431}
432.wvui-dropdown__menu {
433  position: absolute;
434  left: 0;
435  z-index: 4;
436  width: 100%;
437  margin-top: -1px;
438}
439.wvui-dropdown--open .wvui-dropdown__handle {
440  background-color: #fff;
441}
442.wvui-dropdown--open .wvui-dropdown__handle:hover .wvui-dropdown__indicator {
443  color: #202122;
444}
445.wvui-dropdown--disabled .wvui-dropdown__handle {
446  background-color: #eaecf0;
447  color: #72777d;
448  border-color: #c8ccd1;
449  text-shadow: 0 1px 1px #fff;
450  cursor: default;
451}
452.wvui-dropdown--disabled .wvui-dropdown__handle:hover .wvui-dropdown__indicator {
453  color: #72777d;
454}
455.wvui-dropdown--disabled .wvui-dropdown__indicator {
456  color: #72777d;
457}
458
459.wvui-input {
460  position: relative;
461  box-sizing: border-box;
462}
463.wvui-input__start-icon,
464.wvui-input__end-icon {
465  color: #54595d;
466  position: absolute;
467  top: 0;
468  min-height: 20px;
469  height: 100%;
470}
471.wvui-input__start-icon {
472  left: 1px;
473  width: 36px;
474  pointer-events: none;
475}
476.wvui-input__end-icon {
477  right: 1px;
478  width: 36px;
479}
480.wvui-input--clearable .wvui-input__end-icon {
481  width: calc(8px * 2 + 0.85714286em);
482  cursor: pointer;
483}
484.wvui-input--clearable .wvui-input__end-icon svg {
485  width: 0.85714286em;
486}
487.wvui-input__input {
488  display: block;
489  box-sizing: border-box;
490  width: 100%;
491  height: 2.28571429em;
492  margin: 0;
493  border-width: 1px;
494  border-style: solid;
495  border-radius: 2px;
496  padding: 5px 8px;
497  font-family: inherit;
498  font-size: inherit;
499  line-height: 1.42857143em;
500}
501.wvui-input__input:not( [ disabled ] ) {
502  background-color: #fff;
503  color: #000;
504  border-color: #a2a9b1;
505  box-shadow: inset 0 0 0 1px transparent;
506  -webkit-transition-property: border-color, box-shadow;
507  transition-property: border-color, box-shadow;
508  -webkit-transition-duration: 250ms;
509          transition-duration: 250ms;
510}
511.wvui-input__input:not( [ disabled ] ):hover {
512  border-color: #72777d;
513}
514.wvui-input__input:not( [ disabled ] ):focus {
515  border-color: #36c;
516  box-shadow: inset 0 0 0 1px #36c;
517  outline: 0;
518}
519.wvui-input__input:not( [ disabled ] ):focus ~ .wvui-input__start-icon,
520.wvui-input__input:not( [ disabled ] ):focus ~ .wvui-input__end-icon {
521  opacity: 1;
522}
523.wvui-input__input[disabled] {
524  background-color: #eaecf0;
525  color: #72777d;
526  -webkit-text-fill-color: #72777d;
527  border-color: #c8ccd1;
528  text-shadow: 0 1px 1px #fff;
529}
530.wvui-input__input[disabled] ~ .wvui-input__start-icon,
531.wvui-input__input[disabled] ~ .wvui-input__end-icon {
532  opacity: 0.51;
533  pointer-events: none;
534}
535.wvui-input__input::-webkit-input-placeholder {
536  color: #72777d;
537  opacity: 1;
538}
539.wvui-input__input:-ms-input-placeholder {
540  color: #72777d;
541  opacity: 1;
542}
543.wvui-input__input::placeholder {
544  color: #72777d;
545  opacity: 1;
546}
547.wvui-input__input::-ms-clear {
548  display: none;
549}
550.wvui-input__input[type='search'] {
551  /* stylelint-disable plugin/no-unsupported-browser-features */
552  /* autoprefixer: ignore next */
553  -webkit-appearance: none;
554  /* autoprefixer: ignore next */
555  -moz-appearance: textfield;
556  /* stylelint-enable plugin/no-unsupported-browser-features */
557}
558.wvui-input__input[type='search']::-webkit-search-decoration,
559.wvui-input__input[type='search']::-webkit-search-cancel-button {
560  display: none;
561}
562.wvui-input--has-start-icon .wvui-input__input {
563  padding-left: 36px;
564}
565.wvui-input--has-end-icon .wvui-input__input {
566  padding-right: 36px;
567}
568
569.wvui-progress-bar {
570  background-color: #fff;
571  box-sizing: border-box;
572  max-width: 50em;
573  border: 1px solid #a2a9b1;
574  border-radius: 16px;
575  box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.15);
576  overflow-x: hidden;
577}
578.wvui-progress-bar__bar {
579  background-color: #36c;
580  width: 40%;
581  height: 1.14285714em;
582  -webkit-animation: wvui-progress-bar__bar--slide 2s infinite linear;
583          animation: wvui-progress-bar__bar--slide 2s infinite linear;
584}
585@-webkit-keyframes wvui-progress-bar__bar--slide {
586from {
587    -webkit-transform: translate(-100%);
588            transform: translate(-100%);
589}
590to {
591    -webkit-transform: translate(350%);
592            transform: translate(350%);
593}
594}
595@keyframes wvui-progress-bar__bar--slide {
596from {
597    -webkit-transform: translate(-100%);
598            transform: translate(-100%);
599}
600to {
601    -webkit-transform: translate(350%);
602            transform: translate(350%);
603}
604}
605
606.wvui-radio {
607  position: relative;
608  z-index: 0;
609  line-height: 1.42857143em;
610  cursor: pointer;
611  /* stylelint-disable no-descending-specificity */
612  /* stylelint-enable no-descending-specificity */
613}
614.wvui-radio__label-content {
615  display: inline-block;
616  padding-left: 1.92857143em;
617}
618.wvui-radio:not( .wvui-radio--inline) {
619  display: block;
620  margin-bottom: 12px;
621}
622.wvui-radio:not( .wvui-radio--inline):last-child {
623  margin-bottom: 0;
624}
625.wvui-radio--inline {
626  margin-right: 16px;
627  white-space: nowrap;
628}
629.wvui-radio--inline:last-child {
630  margin-right: 0;
631}
632.wvui-radio--inline span[class$='__label-content'] {
633  display: inline;
634}
635.wvui-radio[aria-disabled='true'] {
636  cursor: default;
637}
638.wvui-radio__icon {
639  background-color: #fff;
640  position: absolute;
641  left: 0;
642  box-sizing: border-box;
643  width: 1.42857143em;
644  height: 1.42857143em;
645  border: 1px solid #72777d;
646}
647.wvui-radio__input {
648  opacity: 0;
649  position: absolute;
650  left: 0;
651  z-index: 1;
652  width: 1.42857143em;
653  height: 1.42857143em;
654  margin: 0;
655  font-size: inherit;
656  cursor: inherit;
657}
658.wvui-radio__icon {
659  border-radius: 50%;
660  -webkit-transition-property: background-color, border-color, border-width;
661  transition-property: background-color, border-color, border-width;
662  -webkit-transition-duration: 100ms;
663          transition-duration: 100ms;
664}
665.wvui-radio__icon:before {
666  content: ' ';
667  position: absolute;
668  top: -4px;
669  right: -4px;
670  bottom: -4px;
671  left: -4px;
672  border: 1px solid transparent;
673  border-radius: 50%;
674}
675.wvui-radio__input:enabled:hover + .wvui-radio__icon,
676.wvui-radio__input:enabled:checked:hover + .wvui-radio__icon {
677  border-color: #447ff5;
678}
679.wvui-radio__input:enabled:checked + .wvui-radio__icon {
680  border-width: 0.42857143em;
681  border-color: #36c;
682}
683.wvui-radio__input:enabled:checked:focus + .wvui-radio__icon:before {
684  border-color: #fff;
685}
686.wvui-radio__input:disabled ~ .wvui-radio__label-content {
687  color: #72777d;
688}
689.wvui-radio__input:disabled + .wvui-radio__icon {
690  background-color: #c8ccd1;
691  border-color: #c8ccd1;
692}
693.wvui-radio__input:disabled:checked + .wvui-radio__icon {
694  background-color: #fff;
695  border-width: 0.42857143em;
696}
697.wvui-radio:active .wvui-radio__input:enabled + .wvui-radio__icon {
698  background-color: #2a4b8d;
699  border-color: #2a4b8d;
700}
701.wvui-radio:active .wvui-radio__input:enabled:checked + .wvui-radio__icon {
702  background-color: #fff;
703  border-color: #2a4b8d;
704}
705.wvui-radio:active .wvui-radio__input:enabled:checked + .wvui-radio__icon:before {
706  border-color: #2a4b8d;
707}
708
709.wvui-toggle-button {
710  box-sizing: border-box;
711  min-width: 32px;
712  min-height: 32px;
713  max-width: 28.75em;
714  margin: 0;
715  border-width: 1px;
716  border-style: solid;
717  border-radius: 2px;
718  padding-right: 12px;
719  padding-left: 12px;
720  overflow: visible;
721  font-family: inherit;
722  font-size: inherit;
723  font-weight: bold;
724  text-transform: none;
725  white-space: nowrap;
726  -webkit-transition: border-color 100ms, background-color 100ms, color 100ms, box-shadow 100ms;
727  transition: border-color 100ms, background-color 100ms, color 100ms, box-shadow 100ms;
728}
729.wvui-toggle-button::-moz-focus-inner {
730  border: 0;
731  padding: 0;
732}
733.wvui-toggle-button:focus {
734  outline: 0;
735}
736.wvui-toggle-button:not( [ disabled ] ) {
737  background-color: #f8f9fa;
738  color: #202122;
739  border-color: #a2a9b1;
740  cursor: pointer;
741}
742.wvui-toggle-button:not( [ disabled ] ):focus {
743  border-color: #36c;
744  box-shadow: inset 0 0 0 1px #36c;
745  outline: 1px solid transparent;
746}
747.wvui-toggle-button:not( [ disabled ] ):hover {
748  background-color: #fff;
749  color: #404244;
750}
751.wvui-toggle-button:not( [ disabled ] ):active {
752  background-color: #c8ccd1;
753  color: #000;
754  border-color: #72777d;
755  box-shadow: none;
756}
757.wvui-toggle-button[disabled] {
758  background-color: #c8ccd1;
759  color: #fff;
760  border-color: #c8ccd1;
761}
762.wvui-toggle-button--active:disabled {
763  background-color: #919fb9;
764}
765.wvui-toggle-button--active:not( [ disabled ] ) {
766  background-color: #2a4b8d;
767  color: #fff;
768  border-color: #2a4b8d;
769}
770.wvui-toggle-button--active:not( [ disabled ] ):focus {
771  border-color: #36c;
772  box-shadow: inset 0 0 0 1px #36c, inset 0 0 0 2px #fff;
773}
774.wvui-toggle-button--active:not( [ disabled ] ):hover {
775  background-color: #2a4b8d;
776  color: #fff;
777}
778
779.wvui-typeahead-suggestion__title {
780  color: #202122;
781  display: block;
782  margin: 0 0 2px 0;
783  font-size: 1.14285714em;
784  font-weight: 700;
785}
786.wvui-typeahead-suggestion__match {
787  font-weight: 400;
788}
789
790.wvui-typeahead-suggestion {
791  display: -webkit-box;
792  display: flex;
793  -webkit-box-align: center;
794          align-items: center;
795  padding: 8px 12px;
796  text-decoration: none;
797  -webkit-hyphens: auto;
798      -ms-hyphens: auto;
799          hyphens: auto;
800  word-break: break-word;
801  word-wrap: break-word;
802}
803.wvui-typeahead-suggestion--active {
804  background-color: #eaecf0;
805}
806.wvui-typeahead-suggestion__thumbnail-placeholder,
807.wvui-typeahead-suggestion__thumbnail {
808  background-position: center;
809  background-repeat: no-repeat;
810  background-size: cover;
811  flex-shrink: 0;
812  width: 2.57142857em;
813  height: 2.57142857em;
814  margin-right: 12px;
815  border-radius: 2px;
816  box-shadow: 0 0 1px 1px #eaecf0;
817}
818.wvui-typeahead-suggestion__thumbnail {
819  display: inline-block;
820}
821.wvui-typeahead-suggestion__thumbnail-placeholder {
822  background-color: #f8f9fa;
823  display: -webkit-inline-box;
824  display: inline-flex;
825  -webkit-box-align: center;
826          align-items: center;
827  -webkit-box-pack: center;
828          justify-content: center;
829}
830.wvui-typeahead-suggestion__thumbnail-icon {
831  color: #54595d;
832}
833.wvui-typeahead-suggestion__text {
834  overflow: hidden;
835}
836.wvui-typeahead-suggestion__text .wvui-typeahead-suggestion__description {
837  color: #72777d;
838  display: block;
839  overflow: hidden;
840  font-size: 1em;
841  text-overflow: ellipsis;
842  white-space: nowrap;
843}
844
845.wvui-typeahead-search {
846  background-color: #fff;
847  border: 1px solid #a2a9b1;
848  border-radius: 2px;
849}
850.wvui-typeahead-search__form {
851  display: -webkit-box;
852  display: flex;
853}
854.wvui-typeahead-search__wrapper {
855  -webkit-box-flex: 1;
856          flex-grow: 1;
857  position: relative;
858  margin: -1px;
859}
860.wvui-typeahead-search__submit {
861  opacity: 0;
862  position: relative;
863  flex-shrink: 0;
864  margin: -1px -1px -1px 0;
865  border-top-left-radius: 0;
866  border-bottom-left-radius: 0;
867  -webkit-transition-property: opacity;
868  transition-property: opacity;
869  -webkit-transition-duration: 100ms;
870          transition-duration: 100ms;
871}
872.wvui-typeahead-search__submit:hover {
873  z-index: 1;
874}
875.wvui-typeahead-search__submit:focus {
876  opacity: 1;
877  z-index: 1;
878}
879.wvui-typeahead-search__suggestions {
880  background-color: #fff;
881  list-style: none;
882  display: none;
883  position: absolute;
884  top: 2.28571429em;
885  right: 0;
886  left: 0;
887  box-sizing: border-box;
888  margin: 0;
889  border: 1px solid #a2a9b1;
890  border-top-width: 0;
891  border-radius: 0 0 2px 2px;
892  padding: 0;
893  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.25);
894}
895.wvui-typeahead-search__suggestions__footer {
896  color: #202122;
897  display: -webkit-box;
898  display: flex;
899  -webkit-box-align: center;
900          align-items: center;
901  border-top: 1px solid #c8ccd1;
902  padding: 8px 12px 8px 36px;
903  text-decoration: none;
904  cursor: pointer;
905}
906.wvui-typeahead-search__suggestions__footer:visited,
907.wvui-typeahead-search__suggestions__footer:active {
908  color: #202122;
909}
910.wvui-typeahead-search__suggestions__footer .wvui-icon {
911  color: #54595d;
912  width: auto;
913  height: 2.57142857em;
914  margin-right: 12px;
915}
916.wvui-typeahead-search__suggestions__footer--active {
917  background-color: #eaecf0;
918}
919.wvui-typeahead-search__suggestions__footer__text {
920  font-size: 1.14285714em;
921}
922.wvui-typeahead-search__suggestion {
923  padding-left: 36px;
924}
925.wvui-typeahead-search .wvui-input__input {
926  border-right-color: transparent;
927}
928.wvui-typeahead-search--has-value .wvui-input__input {
929  border-bottom-left-radius: 0;
930}
931.wvui-typeahead-search--active .wvui-typeahead-search__submit,
932.wvui-typeahead-search:hover .wvui-typeahead-search__submit {
933  opacity: 1;
934}
935.wvui-typeahead-search--active .wvui-typeahead-search__input,
936.wvui-typeahead-search:hover .wvui-typeahead-search__input {
937  z-index: 1;
938}
939.wvui-typeahead-search--active .wvui-input__input,
940.wvui-typeahead-search:hover .wvui-input__input {
941  border-top-right-radius: 0;
942  border-bottom-right-radius: 0;
943}
944.wvui-typeahead-search--expanded .wvui-typeahead-search__suggestions {
945  display: block;
946}
947.wvui-typeahead-search--show-thumbnail .wvui-input__input {
948  padding-left: 2.57142857em;
949}
950.wvui-typeahead-search--show-thumbnail .wvui-input__start-icon {
951  width: 2.57142857em;
952}
953.wvui-typeahead-search--show-thumbnail .wvui-input__input:focus {
954  position: relative;
955  left: -24px;
956  width: calc(100% + 24px);
957  padding-left: calc(12px + 2.57142857em + 12px);
958}
959.wvui-typeahead-search--show-thumbnail .wvui-input__input:focus + .wvui-input__start-icon {
960  left: -11px;
961}
962.wvui-typeahead-search--show-thumbnail .wvui-typeahead-search__suggestions {
963  left: -24px;
964}
965.wvui-typeahead-search--show-thumbnail .wvui-typeahead-search__suggestion {
966  padding-right: 12px;
967  padding-left: 12px;
968}
969.wvui-typeahead-search--show-thumbnail .wvui-typeahead-search__suggestions__footer {
970  padding-right: 12px;
971  padding-left: 12px;
972}
973.wvui-typeahead-search--show-thumbnail .wvui-typeahead-search__suggestions__footer__text,
974.wvui-typeahead-search--show-thumbnail .wvui-typeahead-search__suggestions__footer__text__query {
975  -webkit-hyphens: auto;
976      -ms-hyphens: auto;
977          hyphens: auto;
978  word-break: break-word;
979  word-wrap: break-word;
980}
981.wvui-typeahead-search--show-thumbnail .wvui-typeahead-search__suggestions-footer-article-icon {
982  flex-shrink: 0;
983  width: 2.57142857em;
984}
985
986