Update OOUI to v0.27.6
[lhc/web/wiklou.git] / resources / lib / oojs-ui / oojs-ui-widgets-wikimediaui.css
1 /*!
2 * OOUI v0.27.6
3 * https://www.mediawiki.org/wiki/OOUI
4 *
5 * Copyright 2011–2018 OOUI Team and other contributors.
6 * Released under the MIT license
7 * http://oojs.mit-license.org
8 *
9 * Date: 2018-08-01T22:18:03Z
10 */
11 /**
12 * WikimediaUI Base v0.10.0
13 * Wikimedia Foundation user interface base variables
14 */
15 .oo-ui-draggableElement-handle:not( .oo-ui-draggableElement-undraggable ).oo-ui-widget {
16 cursor: move;
17 cursor: url(images/grab.cur );
18 cursor: -webkit-grab;
19 cursor: -moz-grab;
20 cursor: grab;
21 }
22 .oo-ui-draggableElement-handle:not( .oo-ui-draggableElement-undraggable ):active {
23 cursor: url(images/grabbing.cur );
24 cursor: -webkit-grabbing;
25 cursor: -moz-grabbing;
26 cursor: grabbing;
27 }
28 .oo-ui-draggableElement-handle.oo-ui-widget-disabled,
29 .oo-ui-widget-disabled .oo-ui-draggableElement-handle {
30 cursor: default;
31 }
32 .oo-ui-draggableElement-placeholder {
33 opacity: 0.2;
34 }
35 .oo-ui-draggableGroupElement-horizontal .oo-ui-draggableElement {
36 display: inline-block;
37 }
38 .oo-ui-bookletLayout-stackLayout.oo-ui-stackLayout-continuous > .oo-ui-panelLayout-scrollable {
39 overflow: hidden;
40 }
41 .oo-ui-bookletLayout-stackLayout > .oo-ui-panelLayout {
42 width: 100%;
43 -webkit-box-sizing: border-box;
44 -moz-box-sizing: border-box;
45 box-sizing: border-box;
46 }
47 .oo-ui-bookletLayout-outlinePanel-editable > .oo-ui-outlineSelectWidget {
48 height: auto;
49 position: absolute;
50 top: 0;
51 left: 0;
52 right: 0;
53 bottom: 2.5em;
54 overflow: auto;
55 }
56 .oo-ui-bookletLayout-outlinePanel > .oo-ui-outlineControlsWidget {
57 position: absolute;
58 bottom: 0;
59 left: 0;
60 right: 0;
61 height: 2.5em;
62 }
63 .oo-ui-bookletLayout-stackLayout > .oo-ui-panelLayout {
64 padding: 1.42857143em;
65 }
66 .oo-ui-bookletLayout-outlinePanel > .oo-ui-outlineControlsWidget {
67 border-top: 1px solid #c8ccd1;
68 }
69 .oo-ui-bookletLayout > .oo-ui-menuLayout-menu {
70 border-right: 1px solid #c8ccd1;
71 }
72 .oo-ui-indexLayout {
73 /* Use two classes to ensure increased specificity over menuLayout */
74 }
75 .oo-ui-indexLayout.oo-ui-menuLayout > .oo-ui-menuLayout-menu {
76 height: auto;
77 }
78 .oo-ui-indexLayout.oo-ui-menuLayout-expanded.oo-ui-menuLayout > .oo-ui-menuLayout-menu {
79 height: 3em;
80 white-space: nowrap;
81 }
82 .oo-ui-indexLayout.oo-ui-menuLayout-expanded.oo-ui-menuLayout > .oo-ui-menuLayout-content {
83 top: 3em;
84 }
85 .oo-ui-indexLayout-stackLayout > .oo-ui-panelLayout {
86 padding: 1.42857143em;
87 }
88 .oo-ui-indexLayout.oo-ui-menuLayout-expanded > .oo-ui-menuLayout-menu {
89 height: 2.75em;
90 }
91 .oo-ui-indexLayout.oo-ui-menuLayout-expanded > .oo-ui-menuLayout-content {
92 top: 2.75em;
93 }
94 .oo-ui-menuLayout {
95 top: 0;
96 left: 0;
97 right: 0;
98 bottom: 0;
99 }
100 .oo-ui-menuLayout-expanded,
101 .oo-ui-menuLayout-expanded > .oo-ui-menuLayout-menu,
102 .oo-ui-menuLayout-expanded > .oo-ui-menuLayout-content {
103 position: absolute;
104 }
105 .oo-ui-menuLayout-expanded > .oo-ui-menuLayout-menu {
106 z-index: 1;
107 }
108 .oo-ui-menuLayout-static.oo-ui-menuLayout-after,
109 .oo-ui-menuLayout-static.oo-ui-menuLayout-before {
110 display: table;
111 width: 100%;
112 }
113 .oo-ui-menuLayout-static.oo-ui-menuLayout-after > .oo-ui-menuLayout-menu,
114 .oo-ui-menuLayout-static.oo-ui-menuLayout-before > .oo-ui-menuLayout-menu,
115 .oo-ui-menuLayout-static.oo-ui-menuLayout-after > .oo-ui-menuLayout-content,
116 .oo-ui-menuLayout-static.oo-ui-menuLayout-before > .oo-ui-menuLayout-content {
117 display: table-cell;
118 vertical-align: top;
119 }
120 .oo-ui-menuLayout > .oo-ui-menuLayout-menu,
121 .oo-ui-menuLayout > .oo-ui-menuLayout-content {
122 -webkit-transition: height 200ms ease, width 200ms ease, top 200ms ease, left 200ms ease, right 200ms ease, bottom 200ms ease;
123 -moz-transition: height 200ms ease, width 200ms ease, top 200ms ease, left 200ms ease, right 200ms ease, bottom 200ms ease;
124 transition: height 200ms ease, width 200ms ease, top 200ms ease, left 200ms ease, right 200ms ease, bottom 200ms ease;
125 }
126 .oo-ui-menuLayout > .oo-ui-menuLayout-menu {
127 height: 18em;
128 width: 18em;
129 }
130 .oo-ui-menuLayout > .oo-ui-menuLayout-content {
131 top: 18em;
132 left: 18em;
133 right: 18em;
134 bottom: 18em;
135 }
136 .oo-ui-menuLayout.oo-ui-menuLayout-hideMenu > .oo-ui-menuLayout-menu {
137 width: 0 !important;
138 height: 0 !important;
139 overflow: hidden;
140 }
141 .oo-ui-menuLayout.oo-ui-menuLayout-hideMenu > .oo-ui-menuLayout-content {
142 top: 0 !important;
143 left: 0 !important;
144 right: 0 !important;
145 bottom: 0 !important;
146 }
147 .oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-top > .oo-ui-menuLayout-menu {
148 width: auto !important;
149 left: 0;
150 top: 0;
151 right: 0;
152 }
153 .oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-top > .oo-ui-menuLayout-content {
154 right: 0 !important;
155 bottom: 0 !important;
156 left: 0 !important;
157 }
158 .oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-after > .oo-ui-menuLayout-menu {
159 height: auto !important;
160 top: 0;
161 right: 0;
162 bottom: 0;
163 }
164 .oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-after > .oo-ui-menuLayout-content {
165 bottom: 0 !important;
166 left: 0 !important;
167 top: 0 !important;
168 }
169 .oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-bottom > .oo-ui-menuLayout-menu {
170 width: auto !important;
171 right: 0;
172 bottom: 0;
173 left: 0;
174 }
175 .oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-bottom > .oo-ui-menuLayout-content {
176 left: 0 !important;
177 top: 0 !important;
178 right: 0 !important;
179 }
180 .oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-before > .oo-ui-menuLayout-menu {
181 height: auto !important;
182 bottom: 0;
183 left: 0;
184 top: 0;
185 }
186 .oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-before > .oo-ui-menuLayout-content {
187 top: 0 !important;
188 right: 0 !important;
189 bottom: 0 !important;
190 }
191 .oo-ui-stackLayout-continuous > .oo-ui-panelLayout {
192 display: block;
193 position: relative;
194 }
195 .oo-ui-buttonSelectWidget {
196 display: inline-block;
197 white-space: nowrap;
198 border-radius: 2px;
199 margin-right: 0.5em;
200 z-index: 0;
201 position: relative;
202 }
203 .oo-ui-buttonSelectWidget:last-child {
204 margin-right: 0;
205 }
206 .oo-ui-buttonSelectWidget:focus {
207 outline: 0;
208 }
209 .oo-ui-buttonSelectWidget .oo-ui-buttonOptionWidget .oo-ui-buttonElement-button {
210 margin-left: -1px;
211 border-radius: 0;
212 }
213 .oo-ui-buttonSelectWidget .oo-ui-buttonOptionWidget:first-child .oo-ui-buttonElement-button {
214 margin-left: 0;
215 border-bottom-left-radius: 2px;
216 border-top-left-radius: 2px;
217 }
218 .oo-ui-buttonSelectWidget .oo-ui-buttonOptionWidget:last-child .oo-ui-buttonElement-button {
219 border-bottom-right-radius: 2px;
220 border-top-right-radius: 2px;
221 }
222 .oo-ui-buttonSelectWidget .oo-ui-buttonOptionWidget.oo-ui-widget-disabled + .oo-ui-widget-disabled > .oo-ui-buttonElement-button {
223 border-left-color: #fff;
224 }
225 .oo-ui-buttonSelectWidget.oo-ui-widget-enabled:focus .oo-ui-buttonOptionWidget.oo-ui-optionWidget-selected .oo-ui-buttonElement-button {
226 border-color: #36c;
227 box-shadow: inset 0 0 0 1px #36c, inset 0 0 0 2px #fff;
228 }
229 .oo-ui-buttonSelectWidget.oo-ui-widget-enabled .oo-ui-buttonElement.oo-ui-widget-enabled > .oo-ui-buttonElement-button:hover,
230 .oo-ui-buttonSelectWidget.oo-ui-widget-enabled .oo-ui-buttonElement.oo-ui-widget-enabled > .oo-ui-buttonElement-button:active {
231 z-index: 1;
232 }
233 .oo-ui-buttonSelectWidget.oo-ui-widget-enabled .oo-ui-buttonElement.oo-ui-buttonElement-active > .oo-ui-buttonElement-button {
234 z-index: 3;
235 }
236 .oo-ui-buttonSelectWidget.oo-ui-widget-enabled .oo-ui-buttonElement.oo-ui-widget-disabled > .oo-ui-buttonElement-button {
237 z-index: -1;
238 }
239 .oo-ui-buttonOptionWidget {
240 display: inline-block;
241 }
242 .oo-ui-buttonOptionWidget.oo-ui-buttonElement-active .oo-ui-buttonElement-button {
243 cursor: default;
244 }
245 .oo-ui-toggleButtonWidget {
246 margin-right: 0.5em;
247 }
248 .oo-ui-toggleButtonWidget:last-child {
249 margin-right: 0;
250 }
251 .oo-ui-toggleSwitchWidget {
252 position: relative;
253 display: inline-block;
254 vertical-align: middle;
255 overflow: hidden;
256 -webkit-box-sizing: border-box;
257 -moz-box-sizing: border-box;
258 box-sizing: border-box;
259 -webkit-transform: translateZ(0);
260 transform: translateZ(0);
261 background-color: #f8f9fa;
262 width: 3.5em;
263 min-height: 26px;
264 height: 2em;
265 border: 1px solid #72777d;
266 border-radius: 1em;
267 margin-right: 0.5em;
268 -webkit-transition: background-color 250ms, border-color 250ms;
269 -moz-transition: background-color 250ms, border-color 250ms;
270 transition: background-color 250ms, border-color 250ms;
271 }
272 .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled {
273 cursor: pointer;
274 }
275 .oo-ui-toggleSwitchWidget-grip {
276 position: absolute;
277 display: block;
278 -webkit-box-sizing: border-box;
279 -moz-box-sizing: border-box;
280 box-sizing: border-box;
281 }
282 .oo-ui-toggleSwitchWidget:last-child {
283 margin-right: 0;
284 }
285 .oo-ui-toggleSwitchWidget:before {
286 content: '';
287 display: block;
288 position: absolute;
289 top: 1px;
290 left: 1px;
291 bottom: 1px;
292 right: 1px;
293 border: 1px solid transparent;
294 border-radius: 1em;
295 z-index: 1;
296 -webkit-transition: border-color 250ms;
297 -moz-transition: border-color 250ms;
298 transition: border-color 250ms;
299 }
300 .oo-ui-toggleSwitchWidget-grip {
301 top: 0.35714286em;
302 min-width: 16px;
303 width: 1.14285714em;
304 min-height: 16px;
305 height: 1.14285714em;
306 border-radius: 1.14285714em;
307 -webkit-transition: background-color 250ms, left 100ms, margin-left 100ms;
308 -moz-transition: background-color 250ms, left 100ms, margin-left 100ms;
309 transition: background-color 250ms, left 100ms, margin-left 100ms;
310 }
311 .oo-ui-toggleSwitchWidget-glow {
312 display: none;
313 }
314 .oo-ui-toggleSwitchWidget.oo-ui-toggleWidget-off .oo-ui-toggleSwitchWidget-grip {
315 left: 0.35714286em;
316 margin-left: 0;
317 }
318 .oo-ui-toggleSwitchWidget.oo-ui-toggleWidget-on .oo-ui-toggleSwitchWidget-grip {
319 left: 1.9em;
320 margin-left: -2px;
321 }
322 .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled .oo-ui-toggleSwitchWidget-grip {
323 background-color: #f8f9fa;
324 border: 1px solid #72777d;
325 }
326 .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:hover {
327 background-color: #fff;
328 border-color: #447ff5;
329 }
330 .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:hover .oo-ui-toggleSwitchWidget-grip {
331 background-color: #fff;
332 border-color: #447ff5;
333 }
334 .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:active,
335 .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:active:hover,
336 .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:active:focus {
337 background-color: #2a4b8d;
338 border-color: #2a4b8d;
339 box-shadow: inset 0 0 0 1px #2a4b8d;
340 }
341 .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:active .oo-ui-toggleSwitchWidget-grip,
342 .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:active:hover .oo-ui-toggleSwitchWidget-grip,
343 .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:active:focus .oo-ui-toggleSwitchWidget-grip {
344 background-color: #fff;
345 border-color: #fff;
346 box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1);
347 }
348 .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:focus {
349 border-color: #36c;
350 box-shadow: inset 0 0 0 1px #36c;
351 outline: 0;
352 }
353 .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:focus .oo-ui-toggleSwitchWidget-grip {
354 border-color: #36c;
355 }
356 .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled.oo-ui-toggleWidget-on {
357 background-color: #36c;
358 border-color: #36c;
359 }
360 .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled.oo-ui-toggleWidget-on .oo-ui-toggleSwitchWidget-grip {
361 background-color: #fff;
362 border-color: #fff;
363 box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1);
364 }
365 .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled.oo-ui-toggleWidget-on:hover {
366 background-color: #447ff5;
367 border-color: #447ff5;
368 }
369 .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled.oo-ui-toggleWidget-on:active,
370 .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled.oo-ui-toggleWidget-on:active:hover {
371 background-color: #2a4b8d;
372 border-color: #2a4b8d;
373 }
374 .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled.oo-ui-toggleWidget-on:focus {
375 border-color: #36c;
376 }
377 .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled.oo-ui-toggleWidget-on:focus:before {
378 border-color: #fff;
379 }
380 .oo-ui-toggleSwitchWidget.oo-ui-widget-disabled {
381 background-color: #c8ccd1;
382 border-color: #c8ccd1;
383 outline: 0;
384 }
385 .oo-ui-toggleSwitchWidget.oo-ui-widget-disabled.oo-ui-toggleWidget-off .oo-ui-toggleSwitchWidget-grip {
386 border: 1px solid #fff;
387 box-shadow: inset 0 0 0 1px #fff;
388 }
389 .oo-ui-toggleSwitchWidget.oo-ui-widget-disabled.oo-ui-toggleWidget-on .oo-ui-toggleSwitchWidget-grip {
390 background-color: #fff;
391 }
392 .oo-ui-selectFileWidget {
393 display: inline-block;
394 vertical-align: middle;
395 width: 100%;
396 max-width: 50em;
397 margin-right: 0.5em;
398 }
399 .oo-ui-selectFileWidget-selectButton {
400 display: table-cell;
401 }
402 .oo-ui-selectFileWidget-selectButton > .oo-ui-buttonElement-button {
403 position: relative;
404 overflow: hidden;
405 }
406 .oo-ui-selectFileWidget-selectButton > .oo-ui-buttonElement-button > [type='file'] {
407 position: absolute;
408 top: 0;
409 bottom: 0;
410 left: 0;
411 right: 0;
412 width: 100%;
413 height: 100%;
414 opacity: 0;
415 z-index: 1;
416 cursor: pointer;
417 padding-top: 100px;
418 }
419 .oo-ui-selectFileWidget-selectButton.oo-ui-widget-disabled > .oo-ui-buttonElement-button > [type='file'] {
420 display: none;
421 }
422 .oo-ui-selectFileWidget-info {
423 width: 100%;
424 display: table-cell;
425 vertical-align: middle;
426 position: relative;
427 overflow: hidden;
428 -webkit-box-sizing: border-box;
429 -moz-box-sizing: border-box;
430 box-sizing: border-box;
431 }
432 .oo-ui-widget-disabled .oo-ui-selectFileWidget-info {
433 cursor: default;
434 -webkit-touch-callout: none;
435 -webkit-user-select: none;
436 -moz-user-select: none;
437 -ms-user-select: none;
438 user-select: none;
439 }
440 .oo-ui-selectFileWidget-label {
441 position: absolute;
442 top: 0;
443 bottom: 0;
444 left: 0;
445 right: 0;
446 text-overflow: ellipsis;
447 }
448 .oo-ui-selectFileWidget-clearButton {
449 position: absolute;
450 z-index: 2;
451 }
452 .oo-ui-selectFileWidget-dropTarget {
453 position: relative;
454 cursor: default;
455 height: 8.815em;
456 }
457 .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-dropLabel,
458 .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-selectButton {
459 display: none;
460 }
461 .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-thumbnail {
462 width: 7.815em;
463 position: absolute;
464 top: 0.5em;
465 bottom: 0.5em;
466 left: 0.5em;
467 background-position: center center;
468 background-repeat: no-repeat;
469 background-size: contain;
470 }
471 .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-thumbnail.oo-ui-pendingElement-pending {
472 background-repeat: repeat;
473 background-size: auto;
474 }
475 .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-thumbnail > .oo-ui-selectFileWidget-noThumbnail-icon {
476 opacity: 0.4;
477 height: 7.815em;
478 width: 7.815em;
479 }
480 .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-info {
481 display: block;
482 height: 100%;
483 width: auto;
484 margin-left: 8.815em;
485 border: 0;
486 }
487 .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-label {
488 display: block;
489 position: relative;
490 top: inherit;
491 }
492 .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-fileName {
493 display: block;
494 }
495 .oo-ui-selectFileWidget-empty.oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-thumbnail,
496 .oo-ui-selectFileWidget-empty.oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-info {
497 display: none;
498 }
499 .oo-ui-selectFileWidget-empty.oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-selectButton {
500 display: block;
501 margin: 2.2em 1em 1em;
502 }
503 .oo-ui-selectFileWidget-empty.oo-ui-selectFileWidget-dropTarget,
504 .oo-ui-selectFileWidget-notsupported.oo-ui-selectFileWidget-dropTarget {
505 text-align: center;
506 }
507 .oo-ui-selectFileWidget-empty.oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-info,
508 .oo-ui-selectFileWidget-notsupported.oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-info {
509 margin: 0;
510 }
511 .oo-ui-selectFileWidget-empty .oo-ui-selectFileWidget-clearButton,
512 .oo-ui-selectFileWidget-notsupported .oo-ui-selectFileWidget-clearButton {
513 display: none;
514 }
515 .oo-ui-selectFileWidget-empty.oo-ui-widget-enabled .oo-ui-selectFileWidget-label {
516 cursor: default;
517 }
518 .oo-ui-selectFileWidget-empty.oo-ui-widget-enabled .oo-ui-selectFileWidget-dropLabel {
519 display: block;
520 }
521 .oo-ui-selectFileWidget-empty.oo-ui-widget-disabled.oo-ui-selectFileWidget-dropTarget,
522 .oo-ui-selectFileWidget-notsupported.oo-ui-selectFileWidget-dropTarget {
523 -webkit-touch-callout: none;
524 -webkit-user-select: none;
525 -moz-user-select: none;
526 -ms-user-select: none;
527 user-select: none;
528 }
529 .oo-ui-selectFileWidget-empty.oo-ui-widget-disabled.oo-ui-selectFileWidget-dropTarget,
530 .oo-ui-selectFileWidget-notsupported.oo-ui-selectFileWidget-dropTarget,
531 .oo-ui-selectFileWidget-empty.oo-ui-widget-disabled.oo-ui-selectFileWidget-dropTarget .oo-ui-buttonElement-button,
532 .oo-ui-selectFileWidget-notsupported.oo-ui-selectFileWidget-dropTarget .oo-ui-buttonElement-button {
533 cursor: no-drop;
534 }
535 .oo-ui-selectFileWidget-notsupported.oo-ui-selectFileWidget-dropTarget {
536 height: auto;
537 }
538 .oo-ui-selectFileWidget:last-child {
539 margin-right: 0;
540 }
541 .oo-ui-selectFileWidget-selectButton > .oo-ui-buttonElement-button {
542 border-radius: 0 2px 2px 0;
543 }
544 .oo-ui-selectFileWidget-info {
545 background-color: #fff;
546 border: 1px solid #a2a9b1;
547 border-radius: 2px 0 0 2px;
548 border-right-width: 0;
549 }
550 .oo-ui-selectFileWidget-info > .oo-ui-iconElement-icon {
551 display: none;
552 top: -1px;
553 left: 0.57142857em;
554 min-height: 2.28571429em;
555 margin-left: -1px;
556 }
557 .oo-ui-selectFileWidget-info > .oo-ui-indicatorElement-indicator {
558 display: none;
559 top: -1px;
560 right: 0.85714286em;
561 min-height: 2.28571429em;
562 }
563 .oo-ui-selectFileWidget-label {
564 -webkit-box-sizing: border-box;
565 -moz-box-sizing: border-box;
566 box-sizing: border-box;
567 display: block;
568 right: 1.92857143em;
569 padding-top: 0.57142857em;
570 padding-left: 0.57142857em;
571 padding-bottom: 0.5em;
572 white-space: nowrap;
573 }
574 .oo-ui-selectFileWidget.oo-ui-labelElement .oo-ui-selectFileWidget-label {
575 line-height: 1.07142857em;
576 }
577 .oo-ui-selectFileWidget-fileName {
578 display: block;
579 overflow: hidden;
580 text-overflow: ellipsis;
581 }
582 .oo-ui-selectFileWidget-clearButton {
583 top: -1px;
584 right: 0;
585 margin-right: 0;
586 }
587 .oo-ui-selectFileWidget-clearButton .oo-ui-buttonElement-button > .oo-ui-iconElement-icon {
588 height: 2.28571429em;
589 }
590 .oo-ui-selectFileWidget-empty .oo-ui-selectFileWidget-label {
591 color: #72777d;
592 }
593 .oo-ui-selectFileWidget.oo-ui-iconElement .oo-ui-selectFileWidget-label {
594 left: 2.64285714em;
595 }
596 .oo-ui-selectFileWidget.oo-ui-indicatorElement .oo-ui-selectFileWidget-label {
597 right: 3.14285714em;
598 padding-left: 0;
599 }
600 .oo-ui-selectFileWidget.oo-ui-indicatorElement .oo-ui-selectFileWidget-clearButton {
601 right: 2.00714286em;
602 }
603 .oo-ui-selectFileWidget-empty.oo-ui-indicatorElement .oo-ui-selectFileWidget-label,
604 .oo-ui-selectFileWidget-notsupported.oo-ui-indicatorElement .oo-ui-selectFileWidget-label {
605 right: 2em;
606 }
607 .oo-ui-selectFileWidget-dropTarget {
608 background-color: #fff;
609 border: 1px solid #a2a9b1;
610 border-radius: 2px;
611 vertical-align: middle;
612 overflow: hidden;
613 }
614 .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-selectButton > .oo-ui-buttonElement-button {
615 border-radius: 2px;
616 }
617 .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-label {
618 overflow: inherit;
619 white-space: normal;
620 }
621 .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-fileName {
622 padding-right: 2.64285714em;
623 }
624 .oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-clearButton {
625 top: 0;
626 }
627 .oo-ui-selectFileWidget-empty.oo-ui-widget-enabled.oo-ui-selectFileWidget-dropTarget {
628 background-color: #fff;
629 border-style: dashed;
630 -webkit-transition: background-color 250ms, color 250ms, border-color 250ms;
631 -moz-transition: background-color 250ms, color 250ms, border-color 250ms;
632 transition: background-color 250ms, color 250ms, border-color 250ms;
633 }
634 .oo-ui-selectFileWidget-empty.oo-ui-widget-enabled.oo-ui-selectFileWidget-dropTarget:hover {
635 border-color: #72777d;
636 }
637 .oo-ui-selectFileWidget-supported.oo-ui-widget-enabled.oo-ui-selectFileWidget-canDrop.oo-ui-selectFileWidget-dropTarget {
638 background-color: #eaf3ff;
639 color: #36c;
640 }
641 .oo-ui-selectFileWidget.oo-ui-widget-disabled .oo-ui-selectFileWidget-info,
642 .oo-ui-selectFileWidget-empty.oo-ui-widget-disabled .oo-ui-selectFileWidget-info {
643 background-color: #eaecf0;
644 color: #72777d;
645 border-color: #c8ccd1;
646 text-shadow: 0 1px 1px #fff;
647 }
648 .oo-ui-selectFileWidget.oo-ui-widget-disabled .oo-ui-selectFileWidget-info > .oo-ui-iconElement-icon,
649 .oo-ui-selectFileWidget-empty.oo-ui-widget-disabled .oo-ui-selectFileWidget-info > .oo-ui-iconElement-icon {
650 opacity: 0.51;
651 }
652 .oo-ui-selectFileWidget.oo-ui-widget-disabled .oo-ui-selectFileWidget-info > .oo-ui-indicatorElement-indicator,
653 .oo-ui-selectFileWidget-empty.oo-ui-widget-disabled .oo-ui-selectFileWidget-info > .oo-ui-indicatorElement-indicator {
654 opacity: 0.15;
655 }
656 .oo-ui-selectFileWidget.oo-ui-widget-disabled.oo-ui-selectFileWidget-dropTarget,
657 .oo-ui-selectFileWidget-empty.oo-ui-widget-disabled.oo-ui-selectFileWidget-dropTarget {
658 background-color: #eaecf0;
659 border-color: #c8ccd1;
660 }
661 .oo-ui-selectFileWidget-notsupported .oo-ui-selectFileWidget-info {
662 background-color: #eaecf0;
663 color: #222;
664 border-color: #c8ccd1;
665 }
666 .oo-ui-selectFileWidget-notsupported.oo-ui-selectFileWidget-dropTarget {
667 background-color: #eaecf0;
668 border-color: #c8ccd1;
669 }
670 .oo-ui-selectFileWidget-notsupported.oo-ui-selectFileWidget-dropTarget .oo-ui-selectFileWidget-label {
671 padding: 1em 0.85714286em;
672 }
673 .oo-ui-widget-disabled .oo-ui-selectFileWidget-dropLabel {
674 display: none;
675 }
676 .oo-ui-outlineSelectWidget {
677 height: 100%;
678 }
679 .oo-ui-outlineSelectWidget:focus {
680 box-shadow: inset 0 0 0 2px #36c;
681 }
682 .oo-ui-outlineOptionWidget {
683 -webkit-touch-callout: none;
684 -webkit-user-select: none;
685 -moz-user-select: none;
686 -ms-user-select: none;
687 user-select: none;
688 padding: 1em 0.85714286em 0.92857143em;
689 -webkit-transition: background-color 100ms, color 100ms;
690 -moz-transition: background-color 100ms, color 100ms;
691 transition: background-color 100ms, color 100ms;
692 }
693 .oo-ui-outlineOptionWidget.oo-ui-optionWidget-highlighted {
694 background-color: #eaecf0;
695 color: #000;
696 }
697 .oo-ui-outlineOptionWidget.oo-ui-optionWidget-selected {
698 background-color: #eaf3ff;
699 color: #36c;
700 }
701 .oo-ui-outlineOptionWidget.oo-ui-optionWidget-pressed {
702 background-color: rgba(41, 98, 204, 0.1);
703 color: #36c;
704 }
705 .oo-ui-outlineOptionWidget.oo-ui-indicatorElement .oo-ui-labelElement-label {
706 padding-right: 1.5em;
707 }
708 .oo-ui-outlineOptionWidget.oo-ui-indicatorElement .oo-ui-indicatorElement-indicator {
709 opacity: 0.5;
710 }
711 .oo-ui-outlineOptionWidget-level-1 {
712 padding-left: 2.571em;
713 }
714 .oo-ui-outlineOptionWidget-level-1.oo-ui-iconElement {
715 padding-left: 4.429em;
716 }
717 .oo-ui-outlineOptionWidget-level-1.oo-ui-iconElement .oo-ui-iconElement-icon {
718 left: 2.571em;
719 }
720 .oo-ui-outlineOptionWidget-level-2 {
721 padding-left: 5.142em;
722 }
723 .oo-ui-outlineOptionWidget-level-2.oo-ui-iconElement {
724 padding-left: 6.857em;
725 }
726 .oo-ui-outlineOptionWidget-level-2.oo-ui-iconElement .oo-ui-iconElement-icon {
727 left: 4.429em;
728 }
729 .oo-ui-outlineControlsWidget {
730 background-color: #fff;
731 }
732 .oo-ui-outlineControlsWidget-items,
733 .oo-ui-outlineControlsWidget-movers {
734 float: left;
735 -webkit-box-sizing: border-box;
736 -moz-box-sizing: border-box;
737 box-sizing: border-box;
738 }
739 .oo-ui-outlineControlsWidget-items {
740 float: left;
741 }
742 .oo-ui-outlineControlsWidget-items .oo-ui-buttonWidget {
743 float: left;
744 }
745 .oo-ui-outlineControlsWidget-movers {
746 float: right;
747 }
748 .oo-ui-outlineControlsWidget-movers .oo-ui-buttonWidget {
749 float: right;
750 }
751 .oo-ui-outlineControlsWidget-items > .oo-ui-buttonWidget,
752 .oo-ui-outlineControlsWidget-movers > .oo-ui-buttonWidget {
753 height: 2.28571429em;
754 width: 2.28571429em;
755 margin: 0 !important;
756 /* stylelint-disable-line declaration-no-important */
757 }
758 .oo-ui-tabSelectWidget {
759 text-align: left;
760 overflow-x: auto;
761 overflow-y: hidden;
762 background-color: #eaecf0;
763 }
764 .oo-ui-tabSelectWidget.oo-ui-widget-enabled:focus {
765 outline: 0;
766 }
767 .oo-ui-tabOptionWidget {
768 display: inline-block;
769 -webkit-box-sizing: border-box;
770 -moz-box-sizing: border-box;
771 box-sizing: border-box;
772 vertical-align: bottom;
773 color: #222;
774 margin: 0.42857143em 0 0 0.42857143em;
775 border-color: transparent;
776 border-style: solid;
777 border-width: 1px 1px 0 1px;
778 border-top-left-radius: 2px;
779 border-top-right-radius: 2px;
780 padding: 0 0.57142857em;
781 font-weight: bold;
782 line-height: 1;
783 -webkit-transition: background-color 100ms, color 100ms, border-color 100ms;
784 -moz-transition: background-color 100ms, color 100ms, border-color 100ms;
785 transition: background-color 100ms, color 100ms, border-color 100ms;
786 }
787 .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected {
788 background-color: #fff;
789 color: #000;
790 }
791 .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected .oo-ui-labelElement-label {
792 border-bottom-color: #fff;
793 }
794 .oo-ui-tabOptionWidget .oo-ui-labelElement-label {
795 border-bottom: 2px solid transparent;
796 padding: 0.57142857em 0.35714286em 0.35714286em;
797 line-height: 1.07142857em;
798 -webkit-transition: border-color 100ms;
799 -moz-transition: border-color 100ms;
800 transition: border-color 100ms;
801 }
802 .oo-ui-tabOptionWidget.oo-ui-widget-enabled:hover {
803 background-color: rgba(255, 255, 255, 0.3);
804 }
805 .oo-ui-tabOptionWidget.oo-ui-widget-enabled:active {
806 background-color: rgba(255, 255, 255, 0.8);
807 }
808 .oo-ui-tabOptionWidget.oo-ui-widget-enabled.oo-ui-optionWidget-selected:hover {
809 background-color: #fff;
810 }
811 .oo-ui-tabSelectWidget.oo-ui-widget-enabled:focus .oo-ui-tabOptionWidget.oo-ui-widget-enabled.oo-ui-optionWidget-selected .oo-ui-labelElement-label {
812 border-bottom-color: #36c;
813 }
814 .oo-ui-tagMultiselectWidget {
815 display: inline-block;
816 position: relative;
817 width: 100%;
818 max-width: 50em;
819 vertical-align: top;
820 }
821 .oo-ui-tagMultiselectWidget-handle {
822 width: 100%;
823 display: block;
824 position: relative;
825 }
826 .oo-ui-tagMultiselectWidget-handle > .oo-ui-iconElement-icon,
827 .oo-ui-tagMultiselectWidget-handle > .oo-ui-indicatorElement-indicator {
828 position: absolute;
829 top: 0;
830 height: 100%;
831 }
832 .oo-ui-tagMultiselectWidget-content {
833 position: relative;
834 }
835 .oo-ui-tagMultiselectWidget-group {
836 display: inline;
837 }
838 .oo-ui-tagMultiselectWidget-outlined {
839 width: 100%;
840 }
841 .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-inlined .oo-ui-tagMultiselectWidget-handle {
842 cursor: text;
843 }
844 .oo-ui-tagMultiselectWidget.oo-ui-widget-disabled .oo-ui-tagMultiselectWidget-content > input {
845 display: none;
846 }
847 .oo-ui-tagMultiselectWidget-focusTrap {
848 display: inline-block;
849 height: 1px;
850 width: 1px;
851 }
852 .oo-ui-tagMultiselectWidget-focusTrap:focus {
853 outline: 0;
854 }
855 .oo-ui-tagMultiselectWidget-handle {
856 -webkit-box-sizing: border-box;
857 -moz-box-sizing: border-box;
858 box-sizing: border-box;
859 min-height: 2.28571429em;
860 margin-right: 0.5em;
861 border: 1px solid #a2a9b1;
862 border-radius: 2px;
863 padding: 0 0.57142857em;
864 line-height: 1;
865 }
866 .oo-ui-tagMultiselectWidget-handle:last-child {
867 margin-right: 0;
868 }
869 .oo-ui-tagMultiselectWidget-handle > .oo-ui-tagMultiselectWidget-content > input {
870 background-color: transparent;
871 color: #000;
872 border: 0;
873 padding: 0.57142857em 0 0.5em 0.35714286em;
874 font-family: inherit;
875 font-size: inherit;
876 line-height: 1.07142857em;
877 vertical-align: top;
878 }
879 .oo-ui-tagMultiselectWidget-handle > .oo-ui-tagMultiselectWidget-content > input::-webkit-input-placeholder {
880 color: #72777d;
881 opacity: 1;
882 }
883 .oo-ui-tagMultiselectWidget-handle > .oo-ui-tagMultiselectWidget-content > input:-ms-input-placeholder {
884 color: #72777d;
885 opacity: 1;
886 }
887 .oo-ui-tagMultiselectWidget-handle > .oo-ui-tagMultiselectWidget-content > input::-moz-placeholder {
888 color: #72777d;
889 opacity: 1;
890 }
891 .oo-ui-tagMultiselectWidget-handle > .oo-ui-tagMultiselectWidget-content > input:-moz-placeholder {
892 color: #72777d;
893 opacity: 1;
894 }
895 .oo-ui-tagMultiselectWidget-handle > .oo-ui-tagMultiselectWidget-content > input::placeholder {
896 color: #72777d;
897 opacity: 1;
898 }
899 .oo-ui-tagMultiselectWidget-handle > .oo-ui-tagMultiselectWidget-content > input:focus {
900 outline: 0;
901 }
902 .oo-ui-tagMultiselectWidget-handle > .oo-ui-tagMultiselectWidget-content .oo-ui-tagMultiselectWidget-group:empty + input {
903 margin-left: 0;
904 }
905 .oo-ui-tagMultiselectWidget-handle .oo-ui-tagMultiselectWidget-group {
906 display: inline-block;
907 max-width: 100%;
908 margin-top: 0.28571429em;
909 margin-left: -0.14285714em;
910 }
911 .oo-ui-tagMultiselectWidget.oo-ui-iconElement .oo-ui-tagMultiselectWidget-handle {
912 padding-left: 2.02857143em;
913 }
914 .oo-ui-tagMultiselectWidget.oo-ui-iconElement .oo-ui-tagMultiselectWidget-handle > .oo-ui-iconElement-icon {
915 left: 0;
916 margin: 0 0.3em;
917 }
918 .oo-ui-tagMultiselectWidget.oo-ui-indicatorElement .oo-ui-tagMultiselectWidget-handle {
919 padding-right: 2.40714286em;
920 }
921 .oo-ui-tagMultiselectWidget.oo-ui-indicatorElement .oo-ui-tagMultiselectWidget-handle > .oo-ui-indicatorElement-indicator {
922 right: 0;
923 margin: 0 0.775em;
924 }
925 .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled .oo-ui-tagMultiselectWidget-handle {
926 background-color: #fff;
927 -webkit-transition: border-color 250ms, box-shadow 250ms;
928 -moz-transition: border-color 250ms, box-shadow 250ms;
929 transition: border-color 250ms, box-shadow 250ms;
930 }
931 .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-inlined:hover .oo-ui-tagMultiselectWidget-handle {
932 border-color: #72777d;
933 }
934 .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-inlined.oo-ui-tagMultiselectWidget-focus .oo-ui-tagMultiselectWidget-handle {
935 border-color: #36c;
936 outline: 0;
937 box-shadow: inset 0 0 0 1px #36c;
938 }
939 .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined .oo-ui-tagMultiselectWidget-handle {
940 background-color: #f8f9fa;
941 border-bottom: 0;
942 border-bottom-left-radius: 0;
943 border-bottom-right-radius: 0;
944 }
945 .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined .oo-ui-tagItemWidget.oo-ui-widget-enabled {
946 background-color: #fff;
947 }
948 .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined .oo-ui-inputWidget-input {
949 border-top-left-radius: 0;
950 border-top-right-radius: 0;
951 }
952 .oo-ui-tagMultiselectWidget.oo-ui-widget-disabled .oo-ui-tagMultiselectWidget-handle {
953 color: #72777d;
954 text-shadow: 0 1px 1px #fff;
955 border-color: #c8ccd1;
956 background-color: #eaecf0;
957 }
958 .oo-ui-tagMultiselectWidget.oo-ui-widget-disabled .oo-ui-tagMultiselectWidget-handle > .oo-ui-iconElement-icon {
959 opacity: 0.51;
960 }
961 .oo-ui-tagMultiselectWidget.oo-ui-widget-disabled .oo-ui-tagMultiselectWidget-handle > .oo-ui-indicatorElement-indicator {
962 opacity: 0.15;
963 }
964 .oo-ui-tagItemWidget {
965 position: relative;
966 display: inline-block;
967 cursor: default;
968 white-space: nowrap;
969 -webkit-box-sizing: border-box;
970 -moz-box-sizing: border-box;
971 box-sizing: border-box;
972 width: auto;
973 max-width: 100%;
974 height: 1.57142857em;
975 margin: 0 0.28571429em 0.28571429em 0;
976 border: 1px solid #a2a9b1;
977 border-radius: 1.57142857em;
978 padding: 0 0.42857143em;
979 line-height: 1.57142857em;
980 vertical-align: middle;
981 }
982 .oo-ui-tagItemWidget.oo-ui-labelElement .oo-ui-labelElement-label {
983 display: inline-block;
984 max-width: 100%;
985 text-overflow: ellipsis;
986 overflow: hidden;
987 }
988 .oo-ui-tagItemWidget.oo-ui-labelElement:not( .oo-ui-tagItemWidget-fixed ) .oo-ui-labelElement-label {
989 cursor: text;
990 }
991 .oo-ui-tagItemWidget.oo-ui-widget-enabled {
992 color: #222;
993 -webkit-transition: background-color 100ms, color 100ms, border-color 100ms, box-shadow 100ms;
994 -moz-transition: background-color 100ms, color 100ms, border-color 100ms, box-shadow 100ms;
995 transition: background-color 100ms, color 100ms, border-color 100ms, box-shadow 100ms;
996 }
997 .oo-ui-tagItemWidget.oo-ui-widget-enabled:hover {
998 background-color: #fff;
999 color: #444;
1000 border-color: #a2a9b1;
1001 }
1002 .oo-ui-tagItemWidget.oo-ui-widget-enabled:focus {
1003 border-color: #36c;
1004 box-shadow: inset 0 0 0 1px #36c;
1005 outline: 0;
1006 }
1007 .oo-ui-tagItemWidget.oo-ui-widget-enabled:not( .oo-ui-tagItemWidget-fixed ) {
1008 background-color: #f8f9fa;
1009 padding-right: 1.64285714em;
1010 }
1011 .oo-ui-tagItemWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-invalid {
1012 border-color: #d33;
1013 }
1014 .oo-ui-tagItemWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-invalid:hover {
1015 border-color: #d33;
1016 }
1017 .oo-ui-tagItemWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-invalid:focus {
1018 border-color: #d33;
1019 box-shadow: inset 0 0 0 1px #d33;
1020 }
1021 .oo-ui-tagItemWidget.oo-ui-widget-enabled > .oo-ui-buttonElement {
1022 display: block;
1023 position: absolute;
1024 top: 0;
1025 right: 0;
1026 }
1027 .oo-ui-tagItemWidget.oo-ui-widget-enabled .oo-ui-buttonElement-button {
1028 border: 0;
1029 border-radius: 1.57142857em;
1030 padding-top: 1.42857143em;
1031 padding-left: 1.42857143em;
1032 -webkit-transition: background-color 100ms;
1033 -moz-transition: background-color 100ms;
1034 transition: background-color 100ms;
1035 }
1036 .oo-ui-tagItemWidget.oo-ui-widget-enabled .oo-ui-buttonElement-button:hover {
1037 background-color: #fff;
1038 }
1039 .oo-ui-tagItemWidget.oo-ui-widget-enabled .oo-ui-buttonElement-button:active {
1040 background-color: #c8ccd1;
1041 }
1042 .oo-ui-tagItemWidget.oo-ui-widget-enabled .oo-ui-buttonElement-button .oo-ui-icon-close {
1043 left: 0.28571429em;
1044 min-width: 12px;
1045 width: 0.85714286em;
1046 }
1047 .oo-ui-tagItemWidget.oo-ui-widget-enabled .oo-ui-buttonElement-button .oo-ui-labelElement-label,
1048 .oo-ui-tagItemWidget.oo-ui-widget-enabled .oo-ui-buttonElement-button .oo-ui-indicatorElement-indicator {
1049 display: none;
1050 }
1051 .oo-ui-tagItemWidget.oo-ui-widget-disabled {
1052 background-color: #eaecf0;
1053 color: #72777d;
1054 border-color: #c8ccd1;
1055 text-shadow: 0 1px 1px #fff;
1056 }
1057 .oo-ui-tagItemWidget.oo-ui-widget-disabled:focus {
1058 outline: 0;
1059 }
1060 .oo-ui-tagItemWidget.oo-ui-widget-disabled > .oo-ui-buttonElement {
1061 display: none;
1062 }
1063 .oo-ui-capsuleMultiselectWidget {
1064 display: inline-block;
1065 position: relative;
1066 width: 100%;
1067 max-width: 50em;
1068 vertical-align: top;
1069 }
1070 .oo-ui-capsuleMultiselectWidget-handle {
1071 width: 100%;
1072 display: block;
1073 position: relative;
1074 }
1075 .oo-ui-capsuleMultiselectWidget-content {
1076 position: relative;
1077 }
1078 .oo-ui-capsuleMultiselectWidget.oo-ui-widget-disabled .oo-ui-capsuleMultiselectWidget-content > input {
1079 display: none;
1080 }
1081 .oo-ui-capsuleMultiselectWidget-group {
1082 display: inline;
1083 }
1084 .oo-ui-capsuleMultiselectWidget-popup > .oo-ui-popupWidget-popup > .oo-ui-popupWidget-body > * {
1085 display: block;
1086 }
1087 .oo-ui-capsuleMultiselectWidget-focusTrap {
1088 display: inline-block;
1089 height: 1px;
1090 width: 1px;
1091 }
1092 .oo-ui-capsuleMultiselectWidget-focusTrap:focus {
1093 outline: 0;
1094 }
1095 .oo-ui-capsuleMultiselectWidget-handle {
1096 -webkit-box-sizing: border-box;
1097 -moz-box-sizing: border-box;
1098 box-sizing: border-box;
1099 min-height: 2.28571429em;
1100 margin-right: 0.5em;
1101 border: 1px solid #a2a9b1;
1102 border-radius: 2px;
1103 padding: 0 0.57142857em;
1104 line-height: 1;
1105 }
1106 .oo-ui-capsuleMultiselectWidget-handle:last-child {
1107 margin-right: 0;
1108 }
1109 .oo-ui-capsuleMultiselectWidget-handle > .oo-ui-capsuleMultiselectWidget-content > input {
1110 background-color: transparent;
1111 color: #000;
1112 border: 0;
1113 padding: 0.57142857em 0 0.5em;
1114 font-family: inherit;
1115 font-size: inherit;
1116 line-height: 1.07142857em;
1117 vertical-align: top;
1118 }
1119 .oo-ui-capsuleMultiselectWidget-handle > .oo-ui-capsuleMultiselectWidget-content > input::-webkit-input-placeholder {
1120 color: #72777d;
1121 opacity: 1;
1122 }
1123 .oo-ui-capsuleMultiselectWidget-handle > .oo-ui-capsuleMultiselectWidget-content > input:-ms-input-placeholder {
1124 color: #72777d;
1125 opacity: 1;
1126 }
1127 .oo-ui-capsuleMultiselectWidget-handle > .oo-ui-capsuleMultiselectWidget-content > input::-moz-placeholder {
1128 color: #72777d;
1129 opacity: 1;
1130 }
1131 .oo-ui-capsuleMultiselectWidget-handle > .oo-ui-capsuleMultiselectWidget-content > input:-moz-placeholder {
1132 color: #72777d;
1133 opacity: 1;
1134 }
1135 .oo-ui-capsuleMultiselectWidget-handle > .oo-ui-capsuleMultiselectWidget-content > input::placeholder {
1136 color: #72777d;
1137 opacity: 1;
1138 }
1139 .oo-ui-capsuleMultiselectWidget-handle > .oo-ui-capsuleMultiselectWidget-content > input:focus {
1140 outline: 0;
1141 }
1142 .oo-ui-capsuleMultiselectWidget-handle > .oo-ui-capsuleMultiselectWidget-content .oo-ui-capsuleMultiselectWidget-group:empty + input {
1143 margin-left: 0;
1144 }
1145 .oo-ui-capsuleMultiselectWidget-handle .oo-ui-capsuleMultiselectWidget-group {
1146 display: inline-block;
1147 max-width: 100%;
1148 margin-top: 0.28571429em;
1149 margin-left: -0.14285714em;
1150 }
1151 .oo-ui-capsuleMultiselectWidget.oo-ui-iconElement .oo-ui-capsuleMultiselectWidget-handle {
1152 padding-left: 2.64285714em;
1153 }
1154 .oo-ui-capsuleMultiselectWidget.oo-ui-iconElement .oo-ui-capsuleMultiselectWidget-handle > .oo-ui-iconElement-icon {
1155 left: 0.57142857em;
1156 }
1157 .oo-ui-capsuleMultiselectWidget.oo-ui-indicatorElement .oo-ui-capsuleMultiselectWidget-handle {
1158 padding-right: 2.57142857em;
1159 }
1160 .oo-ui-capsuleMultiselectWidget.oo-ui-indicatorElement .oo-ui-capsuleMultiselectWidget-handle > .oo-ui-indicatorElement-indicator {
1161 right: 0.85714286em;
1162 }
1163 .oo-ui-capsuleMultiselectWidget-popup {
1164 margin-top: -1px;
1165 margin-bottom: -1px;
1166 }
1167 .oo-ui-capsuleMultiselectWidget-popup > .oo-ui-popupWidget-popup {
1168 border: 0;
1169 }
1170 .oo-ui-capsuleMultiselectWidget.oo-ui-widget-enabled .oo-ui-capsuleMultiselectWidget-handle {
1171 background-color: #fff;
1172 cursor: text;
1173 -webkit-transition: border-color 250ms, box-shadow 250ms;
1174 -moz-transition: border-color 250ms, box-shadow 250ms;
1175 transition: border-color 250ms, box-shadow 250ms;
1176 }
1177 .oo-ui-capsuleMultiselectWidget.oo-ui-widget-enabled:hover .oo-ui-capsuleMultiselectWidget-handle {
1178 border-color: #72777d;
1179 }
1180 .oo-ui-capsuleMultiselectWidget.oo-ui-widget-enabled.oo-ui-capsuleMultiselectWidget-open .oo-ui-capsuleMultiselectWidget-handle {
1181 border-color: #36c;
1182 outline: 0;
1183 box-shadow: inset 0 0 0 1px #36c;
1184 }
1185 .oo-ui-capsuleMultiselectWidget.oo-ui-widget-disabled .oo-ui-capsuleMultiselectWidget-handle {
1186 color: #72777d;
1187 text-shadow: 0 1px 1px #fff;
1188 border-color: #c8ccd1;
1189 background-color: #eaecf0;
1190 }
1191 .oo-ui-capsuleMultiselectWidget.oo-ui-widget-disabled .oo-ui-capsuleMultiselectWidget-handle > .oo-ui-iconElement-icon {
1192 opacity: 0.51;
1193 }
1194 .oo-ui-capsuleMultiselectWidget.oo-ui-widget-disabled .oo-ui-capsuleMultiselectWidget-handle > .oo-ui-indicatorElement-indicator {
1195 opacity: 0.15;
1196 }
1197 .oo-ui-capsuleItemWidget {
1198 position: relative;
1199 display: inline-block;
1200 cursor: default;
1201 white-space: nowrap;
1202 -webkit-box-sizing: border-box;
1203 -moz-box-sizing: border-box;
1204 box-sizing: border-box;
1205 width: auto;
1206 max-width: 100%;
1207 height: 1.57142857em;
1208 margin: 0 0.28571429em 0.28571429em 0;
1209 border: 1px solid #a2a9b1;
1210 border-radius: 1.57142857em;
1211 padding: 0 0.42857143em;
1212 line-height: 1.57142857em;
1213 vertical-align: middle;
1214 }
1215 .oo-ui-capsuleItemWidget.oo-ui-labelElement .oo-ui-labelElement-label {
1216 display: inline-block;
1217 text-overflow: ellipsis;
1218 overflow: hidden;
1219 cursor: text;
1220 }
1221 .oo-ui-capsuleItemWidget.oo-ui-widget-enabled {
1222 background-color: #f8f9fa;
1223 color: #222;
1224 padding-right: 1.64285714em;
1225 -webkit-transition: background-color 100ms, color 100ms, border-color 100ms, box-shadow 100ms;
1226 -moz-transition: background-color 100ms, color 100ms, border-color 100ms, box-shadow 100ms;
1227 transition: background-color 100ms, color 100ms, border-color 100ms, box-shadow 100ms;
1228 }
1229 .oo-ui-capsuleItemWidget.oo-ui-widget-enabled:hover {
1230 background-color: #fff;
1231 color: #444;
1232 border-color: #a2a9b1;
1233 }
1234 .oo-ui-capsuleItemWidget.oo-ui-widget-enabled:focus {
1235 border-color: #36c;
1236 box-shadow: inset 0 0 0 1px #36c;
1237 outline: 0;
1238 }
1239 .oo-ui-capsuleItemWidget.oo-ui-widget-enabled > .oo-ui-buttonElement {
1240 display: block;
1241 position: absolute;
1242 top: 0;
1243 right: 0;
1244 }
1245 .oo-ui-capsuleItemWidget.oo-ui-widget-enabled .oo-ui-buttonElement-button {
1246 border: 0;
1247 border-radius: 1.57142857em;
1248 padding-top: 1.42857143em;
1249 padding-left: 1.42857143em;
1250 -webkit-transition: background-color 100ms;
1251 -moz-transition: background-color 100ms;
1252 transition: background-color 100ms;
1253 }
1254 .oo-ui-capsuleItemWidget.oo-ui-widget-enabled .oo-ui-buttonElement-button:hover {
1255 background-color: #fff;
1256 }
1257 .oo-ui-capsuleItemWidget.oo-ui-widget-enabled .oo-ui-buttonElement-button:active {
1258 background-color: #c8ccd1;
1259 }
1260 .oo-ui-capsuleItemWidget.oo-ui-widget-enabled .oo-ui-buttonElement-button .oo-ui-icon-close {
1261 left: 0.28571429em;
1262 min-width: 12px;
1263 width: 0.85714286em;
1264 }
1265 .oo-ui-capsuleItemWidget.oo-ui-widget-enabled .oo-ui-buttonElement-button .oo-ui-labelElement-label,
1266 .oo-ui-capsuleItemWidget.oo-ui-widget-enabled .oo-ui-buttonElement-button .oo-ui-indicatorElement-indicator {
1267 display: none;
1268 }
1269 .oo-ui-capsuleItemWidget.oo-ui-widget-disabled {
1270 background-color: #eaecf0;
1271 color: #72777d;
1272 border-color: #c8ccd1;
1273 text-shadow: 0 1px 1px #fff;
1274 }
1275 .oo-ui-capsuleItemWidget.oo-ui-widget-disabled > .oo-ui-buttonElement {
1276 display: none;
1277 }
1278 .oo-ui-searchWidget-query {
1279 position: absolute;
1280 top: 0;
1281 left: 0;
1282 right: 0;
1283 }
1284 .oo-ui-searchWidget-query .oo-ui-textInputWidget {
1285 width: 100%;
1286 }
1287 .oo-ui-searchWidget-results {
1288 position: absolute;
1289 bottom: 0;
1290 left: 0;
1291 right: 0;
1292 overflow-x: hidden;
1293 overflow-y: auto;
1294 }
1295 .oo-ui-searchWidget-query {
1296 height: 4em;
1297 padding: 0 1.42857143em;
1298 border-bottom: 1px solid #c8ccd1;
1299 box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.1);
1300 }
1301 .oo-ui-searchWidget-query .oo-ui-textInputWidget {
1302 margin: 0.85714286em 0;
1303 }
1304 .oo-ui-searchWidget-results {
1305 top: 4em;
1306 padding: 1.14285714em;
1307 line-height: 0;
1308 }