Merge "mw.Feedback: If the message is posted remotely, link the title correctly"
[lhc/web/wiklou.git] / resources / lib / oojs-ui / oojs-ui-core-wikimediaui.css
1 /*!
2 * OOUI v0.25.1
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-01-17T01:47:20Z
10 */
11 /**
12 * WikimediaUI Base v0.10.0
13 * Wikimedia Foundation user interface base variables
14 */
15 .oo-ui-element-hidden {
16 display: none !important;
17 }
18 .oo-ui-buttonElement {
19 display: inline-block;
20 line-height: normal;
21 vertical-align: middle;
22 }
23 .oo-ui-buttonElement > .oo-ui-buttonElement-button {
24 cursor: pointer;
25 display: inline-block;
26 -webkit-box-sizing: border-box;
27 -moz-box-sizing: border-box;
28 box-sizing: border-box;
29 vertical-align: middle;
30 font-family: inherit;
31 font-size: inherit;
32 white-space: nowrap;
33 -webkit-touch-callout: none;
34 -webkit-user-select: none;
35 -moz-user-select: none;
36 -ms-user-select: none;
37 user-select: none;
38 }
39 .oo-ui-buttonElement > .oo-ui-buttonElement-button::-moz-focus-inner {
40 border-color: transparent;
41 padding: 0;
42 }
43 .oo-ui-buttonElement.oo-ui-widget-disabled > .oo-ui-buttonElement-button {
44 cursor: default;
45 }
46 .oo-ui-buttonElement-frameless {
47 position: relative;
48 }
49 .oo-ui-buttonElement-framed > .oo-ui-buttonElement-button {
50 vertical-align: top;
51 text-align: center;
52 }
53 .oo-ui-buttonElement > .oo-ui-buttonElement-button {
54 position: relative;
55 border-radius: 2px;
56 padding-top: 2.34375em;
57 font-weight: bold;
58 text-decoration: none;
59 }
60 .oo-ui-buttonElement > .oo-ui-buttonElement-button:focus {
61 outline: 0;
62 }
63 .oo-ui-buttonElement > input.oo-ui-buttonElement-button {
64 -webkit-appearance: none;
65 }
66 .oo-ui-buttonElement.oo-ui-labelElement > .oo-ui-buttonElement-button {
67 line-height: 1;
68 }
69 .oo-ui-buttonElement.oo-ui-labelElement > input.oo-ui-buttonElement-button,
70 .oo-ui-buttonElement.oo-ui-labelElement > .oo-ui-buttonElement-button > .oo-ui-labelElement-label {
71 line-height: 1.172em;
72 }
73 .oo-ui-buttonElement.oo-ui-labelElement.oo-ui-indicatorElement > .oo-ui-buttonElement-button {
74 padding-right: 2.5em;
75 }
76 .oo-ui-buttonElement.oo-ui-indicatorElement.oo-ui-labelElement > .oo-ui-buttonElement-button > .oo-ui-indicatorElement-indicator,
77 .oo-ui-buttonElement.oo-ui-indicatorElement.oo-ui-iconElement > .oo-ui-buttonElement-button > .oo-ui-indicatorElement-indicator {
78 right: 0.9375em;
79 }
80 .oo-ui-buttonElement.oo-ui-widget-enabled > .oo-ui-buttonElement-button {
81 -webkit-transition: background-color 100ms, color 100ms, border-color 100ms, box-shadow 100ms;
82 -moz-transition: background-color 100ms, color 100ms, border-color 100ms, box-shadow 100ms;
83 transition: background-color 100ms, color 100ms, border-color 100ms, box-shadow 100ms;
84 }
85 .oo-ui-buttonElement.oo-ui-widget-enabled > .oo-ui-buttonElement-button > .oo-ui-iconElement-icon,
86 .oo-ui-buttonElement.oo-ui-widget-enabled > .oo-ui-buttonElement-button > .oo-ui-indicatorElement-indicator {
87 opacity: 0.87;
88 -webkit-transition: opacity 100ms;
89 -moz-transition: opacity 100ms;
90 transition: opacity 100ms;
91 }
92 .oo-ui-buttonElement.oo-ui-widget-enabled > .oo-ui-buttonElement-button > .oo-ui-iconElement-icon.oo-ui-image-invert,
93 .oo-ui-buttonElement.oo-ui-widget-enabled > .oo-ui-buttonElement-button > .oo-ui-indicatorElement-indicator.oo-ui-image-invert {
94 opacity: 1;
95 }
96 .oo-ui-buttonElement.oo-ui-widget-enabled > .oo-ui-buttonElement-button:hover > .oo-ui-iconElement-icon,
97 .oo-ui-buttonElement.oo-ui-widget-enabled > .oo-ui-buttonElement-button:hover > .oo-ui-indicatorElement-indicator {
98 opacity: 0.73;
99 }
100 .oo-ui-buttonElement.oo-ui-widget-enabled > .oo-ui-buttonElement-button:hover > .oo-ui-iconElement-icon.oo-ui-image-invert,
101 .oo-ui-buttonElement.oo-ui-widget-enabled > .oo-ui-buttonElement-button:hover > .oo-ui-indicatorElement-indicator.oo-ui-image-invert {
102 opacity: 1;
103 }
104 .oo-ui-buttonElement.oo-ui-widget-enabled.oo-ui-buttonElement-pressed > .oo-ui-buttonElement-button > .oo-ui-iconElement-icon,
105 .oo-ui-buttonElement.oo-ui-widget-enabled.oo-ui-buttonElement-pressed > .oo-ui-buttonElement-button > .oo-ui-indicatorElement-indicator {
106 opacity: 1;
107 }
108 .oo-ui-buttonElement-frameless.oo-ui-iconElement:first-child {
109 margin-left: -0.234375em;
110 }
111 .oo-ui-buttonElement-frameless.oo-ui-iconElement > .oo-ui-buttonElement-button {
112 min-width: 1.875em;
113 min-height: 1.875em;
114 border-color: #fff;
115 border-color: transparent;
116 border-style: solid;
117 border-width: 1px;
118 padding-top: 2.34375em;
119 padding-left: 2.34375em;
120 }
121 .oo-ui-buttonElement-frameless.oo-ui-iconElement > .oo-ui-buttonElement-button > .oo-ui-iconElement-icon {
122 left: 0.234375em;
123 }
124 .oo-ui-buttonElement-frameless.oo-ui-labelElement:first-child {
125 margin-left: -0.3125em;
126 }
127 .oo-ui-buttonElement-frameless.oo-ui-labelElement.oo-ui-iconElement:first-child {
128 margin-left: -0.234375em;
129 }
130 .oo-ui-buttonElement-frameless.oo-ui-labelElement > .oo-ui-buttonElement-button {
131 border-color: #fff;
132 border-color: transparent;
133 border-style: solid;
134 border-width: 1px;
135 padding: 0.625em 0.3125em 0.546875em;
136 }
137 .oo-ui-buttonElement-frameless.oo-ui-labelElement.oo-ui-iconElement > .oo-ui-buttonElement-button {
138 padding-left: 2.34375em;
139 }
140 .oo-ui-buttonElement-frameless.oo-ui-indicatorElement > .oo-ui-buttonElement-button {
141 min-width: 12px;
142 min-height: 12px;
143 padding-top: 0;
144 }
145 .oo-ui-buttonElement-frameless.oo-ui-indicatorElement.oo-ui-iconElement > .oo-ui-buttonElement-button {
146 padding-left: 4.21875em;
147 padding-top: 2.34375em;
148 }
149 .oo-ui-buttonElement-frameless.oo-ui-indicatorElement.oo-ui-labelElement > .oo-ui-buttonElement-button {
150 padding-left: 0.3125em;
151 padding-top: 0.625em;
152 }
153 .oo-ui-buttonElement-frameless.oo-ui-indicatorElement.oo-ui-iconElement.oo-ui-labelElement > .oo-ui-buttonElement-button {
154 padding-left: 2.34375em;
155 }
156 .oo-ui-buttonElement-frameless.oo-ui-widget-enabled > .oo-ui-buttonElement-button {
157 color: #222;
158 }
159 .oo-ui-buttonElement-frameless.oo-ui-widget-enabled > .oo-ui-buttonElement-button:hover {
160 color: #444;
161 }
162 .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-iconElement > .oo-ui-buttonElement-button:focus,
163 .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-labelElement > .oo-ui-buttonElement-button:focus {
164 border-color: #36c;
165 box-shadow: inset 0 0 0 1px #36c;
166 }
167 .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-iconElement > .oo-ui-buttonElement-button:focus:active,
168 .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-labelElement > .oo-ui-buttonElement-button:focus:active {
169 border-color: #fff;
170 border-color: transparent;
171 box-shadow: none;
172 }
173 .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-indicatorElement:not( .oo-ui-iconElement ):not( .oo-ui-labelElement ) > .oo-ui-buttonElement-button {
174 border-radius: 1px;
175 }
176 .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-indicatorElement:not( .oo-ui-iconElement ):not( .oo-ui-labelElement ) > .oo-ui-buttonElement-button:focus {
177 box-shadow: 0 0 0 2px #36c;
178 }
179 .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-indicatorElement:not( .oo-ui-iconElement ):not( .oo-ui-labelElement ) > .oo-ui-buttonElement-button:focus:active {
180 box-shadow: none;
181 }
182 .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-buttonElement-pressed > input.oo-ui-buttonElement-button,
183 .oo-ui-buttonElement-frameless.oo-ui-widget-enabled > .oo-ui-buttonElement-button:active {
184 color: #000;
185 border-color: #fff;
186 border-color: transparent;
187 box-shadow: none;
188 }
189 .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button {
190 color: #36c;
191 }
192 .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:hover {
193 color: #447ff5;
194 }
195 .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:active,
196 .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:active:focus,
197 .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive.oo-ui-buttonElement-pressed > .oo-ui-buttonElement-button {
198 color: #2a4b8d;
199 box-shadow: none;
200 }
201 .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button {
202 color: #d33;
203 }
204 .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button:hover {
205 color: #ff4242;
206 }
207 .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button:active,
208 .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button:active:focus,
209 .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive.oo-ui-buttonElement-pressed > .oo-ui-buttonElement-button {
210 color: #b32424;
211 box-shadow: none;
212 }
213 .oo-ui-buttonElement-frameless.oo-ui-widget-enabled[class*='oo-ui-flaggedElement'] > .oo-ui-buttonElement-button > .oo-ui-iconElement-icon,
214 .oo-ui-buttonElement-frameless.oo-ui-widget-enabled[class*='oo-ui-flaggedElement'] > .oo-ui-buttonElement-button > .oo-ui-indicatorElement-indicator {
215 opacity: 1;
216 }
217 .oo-ui-buttonElement-frameless.oo-ui-widget-enabled[class*='oo-ui-flaggedElement'] > .oo-ui-buttonElement-button:hover > .oo-ui-iconElement-icon,
218 .oo-ui-buttonElement-frameless.oo-ui-widget-enabled[class*='oo-ui-flaggedElement'] > .oo-ui-buttonElement-button:hover > .oo-ui-indicatorElement-indicator {
219 opacity: 0.73;
220 }
221 .oo-ui-buttonElement-frameless.oo-ui-widget-disabled > .oo-ui-buttonElement-button {
222 color: #72777d;
223 }
224 .oo-ui-buttonElement-frameless.oo-ui-widget-disabled > .oo-ui-buttonElement-button > .oo-ui-iconElement-icon,
225 .oo-ui-buttonElement-frameless.oo-ui-widget-disabled > .oo-ui-buttonElement-button > .oo-ui-indicatorElement-indicator {
226 opacity: 0.51;
227 }
228 .oo-ui-buttonElement-framed > .oo-ui-buttonElement-button {
229 border-style: solid;
230 border-width: 1px;
231 border-radius: 2px;
232 padding-left: 0.9375em;
233 padding-right: 0.9375em;
234 }
235 .oo-ui-buttonElement-framed.oo-ui-iconElement > .oo-ui-buttonElement-button {
236 padding-top: 2.34375em;
237 padding-bottom: 0;
238 padding-left: 2.03125em;
239 }
240 .oo-ui-buttonElement-framed.oo-ui-iconElement > .oo-ui-buttonElement-button > .oo-ui-iconElement-icon {
241 left: 0.546875em;
242 }
243 .oo-ui-buttonElement-framed.oo-ui-iconElement.oo-ui-labelElement > .oo-ui-buttonElement-button,
244 .oo-ui-buttonElement-framed.oo-ui-iconElement.oo-ui-indicatorElement > .oo-ui-buttonElement-button {
245 padding-left: 2.5em;
246 }
247 .oo-ui-buttonElement-framed.oo-ui-iconElement.oo-ui-labelElement > .oo-ui-buttonElement-button > .oo-ui-iconElement-icon,
248 .oo-ui-buttonElement-framed.oo-ui-iconElement.oo-ui-indicatorElement > .oo-ui-buttonElement-button > .oo-ui-iconElement-icon {
249 left: 0.46875em;
250 }
251 .oo-ui-buttonElement-framed.oo-ui-indicatorElement > .oo-ui-buttonElement-button {
252 padding-top: 2.34375em;
253 padding-right: 2.03125em;
254 padding-bottom: 0;
255 }
256 .oo-ui-buttonElement-framed.oo-ui-indicatorElement > .oo-ui-buttonElement-button > .oo-ui-indicatorElement-indicator {
257 right: 1.015625em;
258 }
259 .oo-ui-buttonElement-framed.oo-ui-indicatorElement.oo-ui-labelElement > .oo-ui-buttonElement-button,
260 .oo-ui-buttonElement-framed.oo-ui-indicatorElement.oo-ui-iconElement > .oo-ui-buttonElement-button {
261 padding-right: 2.5em;
262 }
263 .oo-ui-buttonElement-framed.oo-ui-labelElement > .oo-ui-buttonElement-button {
264 padding-top: 0.625em;
265 padding-bottom: 0.546875em;
266 }
267 .oo-ui-buttonElement-framed.oo-ui-widget-disabled > .oo-ui-buttonElement-button {
268 background-color: #c8ccd1;
269 color: #fff;
270 border-color: #c8ccd1;
271 }
272 .oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button {
273 background-color: #f8f9fa;
274 color: #222;
275 border-color: #a2a9b1;
276 }
277 .oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button:hover {
278 background-color: #fff;
279 color: #444;
280 border-color: #a2a9b1;
281 }
282 .oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button:focus {
283 border-color: #36c;
284 box-shadow: inset 0 0 0 1px #36c;
285 }
286 .oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button:active,
287 .oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button:active:focus,
288 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-buttonElement-pressed > .oo-ui-buttonElement-button {
289 background-color: #c8ccd1;
290 color: #000;
291 border-color: #72777d;
292 box-shadow: none;
293 }
294 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-buttonElement-active > .oo-ui-buttonElement-button {
295 background-color: #2a4b8d;
296 color: #fff;
297 border-color: #2a4b8d;
298 }
299 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-buttonElement-active > .oo-ui-buttonElement-button:focus {
300 border-color: #36c;
301 box-shadow: inset 0 0 0 1px #36c, inset 0 0 0 2px #fff;
302 }
303 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button {
304 color: #36c;
305 }
306 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:hover {
307 background-color: #fff;
308 border-color: #447ff5;
309 }
310 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:active,
311 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:active:focus,
312 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive.oo-ui-buttonElement-pressed > .oo-ui-buttonElement-button,
313 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive.oo-ui-buttonElement-active > .oo-ui-buttonElement-button,
314 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive.oo-ui-popupToolGroup-active > .oo-ui-buttonElement-button {
315 background-color: #eff3fa;
316 color: #2a4b8d;
317 border-color: #2a4b8d;
318 box-shadow: none;
319 }
320 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:focus {
321 border-color: #36c;
322 box-shadow: inset 0 0 0 1px #36c;
323 }
324 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button {
325 color: #d73333;
326 }
327 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button:hover {
328 background-color: #fff;
329 border-color: #ff4242;
330 }
331 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button:active,
332 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button:active:focus,
333 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive.oo-ui-buttonElement-pressed > .oo-ui-buttonElement-button,
334 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive.oo-ui-buttonElement-active > .oo-ui-buttonElement-button,
335 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive.oo-ui-popupToolGroup-active > .oo-ui-buttonElement-button {
336 background-color: #ffffff;
337 color: #b32424;
338 border-color: #b32424;
339 box-shadow: none;
340 }
341 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button:focus {
342 border-color: #d33;
343 box-shadow: inset 0 0 0 1px #d33;
344 }
345 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button {
346 color: #fff;
347 background-color: #36c;
348 border-color: #36c;
349 }
350 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:hover {
351 background-color: #447ff5;
352 border-color: #447ff5;
353 }
354 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:active,
355 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:active:focus,
356 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-buttonElement-pressed > .oo-ui-buttonElement-button,
357 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-buttonElement-active > .oo-ui-buttonElement-button,
358 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-popupToolGroup-active > .oo-ui-buttonElement-button {
359 color: #fff;
360 background-color: #2a4b8d;
361 border-color: #2a4b8d;
362 box-shadow: none;
363 }
364 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:focus {
365 border-color: #36c;
366 box-shadow: inset 0 0 0 1px #36c, inset 0 0 0 2px #fff;
367 }
368 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button {
369 color: #fff;
370 background-color: #d33;
371 border-color: #d33;
372 }
373 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button:hover {
374 background-color: #ff4242;
375 border-color: #ff4242;
376 }
377 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button:active,
378 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button:active:focus,
379 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive.oo-ui-buttonElement-pressed > .oo-ui-buttonElement-button,
380 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive.oo-ui-buttonElement-active > .oo-ui-buttonElement-button,
381 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive.oo-ui-popupToolGroup-active > .oo-ui-buttonElement-button {
382 color: #fff;
383 background-color: #b32424;
384 border-color: #b32424;
385 box-shadow: none;
386 }
387 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button:focus {
388 border-color: #d33;
389 box-shadow: inset 0 0 0 1px #d33, inset 0 0 0 2px #fff;
390 }
391 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary > .oo-ui-buttonElement-button > .oo-ui-iconElement-icon,
392 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary > .oo-ui-buttonElement-button > .oo-ui-indicatorElement-indicator {
393 opacity: 1;
394 }
395 .oo-ui-clippableElement-clippable {
396 -webkit-box-sizing: border-box;
397 -moz-box-sizing: border-box;
398 box-sizing: border-box;
399 min-height: 3.125em;
400 }
401 .oo-ui-floatableElement {
402 position: absolute;
403 }
404 .oo-ui-iconElement .oo-ui-iconElement-icon,
405 .oo-ui-iconElement.oo-ui-iconElement-icon {
406 background-size: contain;
407 background-position: center center;
408 background-repeat: no-repeat;
409 position: absolute;
410 top: 0;
411 min-width: 24px;
412 width: 1.875em;
413 min-height: 24px;
414 height: 100%;
415 }
416 .oo-ui-indicatorElement .oo-ui-indicatorElement-indicator,
417 .oo-ui-indicatorElement.oo-ui-indicatorElement-indicator {
418 background-size: contain;
419 background-position: center center;
420 background-repeat: no-repeat;
421 position: absolute;
422 top: 0;
423 min-width: 12px;
424 width: 0.9375em;
425 min-height: 12px;
426 height: 100%;
427 }
428 .oo-ui-labelElement .oo-ui-labelElement-label-highlight {
429 font-weight: bold;
430 }
431 .oo-ui-pendingElement-pending {
432 background-image: /* @embed */ url(themes/wikimediaui/images/textures/pending.gif);
433 }
434 .oo-ui-fieldLayout {
435 display: block;
436 margin-top: 1.25em;
437 }
438 .oo-ui-fieldLayout:before,
439 .oo-ui-fieldLayout:after {
440 content: ' ';
441 display: table;
442 }
443 .oo-ui-fieldLayout:after {
444 clear: both;
445 }
446 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-left > .oo-ui-fieldLayout-body > .oo-ui-fieldLayout-header,
447 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-right > .oo-ui-fieldLayout-body > .oo-ui-fieldLayout-header,
448 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-left > .oo-ui-fieldLayout-body > .oo-ui-fieldLayout-help,
449 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-right > .oo-ui-fieldLayout-body > .oo-ui-fieldLayout-help,
450 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-left > .oo-ui-fieldLayout-body > .oo-ui-fieldLayout-field,
451 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-right > .oo-ui-fieldLayout-body > .oo-ui-fieldLayout-field {
452 display: block;
453 float: left;
454 }
455 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-right > .oo-ui-fieldLayout-body > .oo-ui-fieldLayout-header {
456 text-align: right;
457 }
458 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-inline > .oo-ui-fieldLayout-body {
459 display: table;
460 width: 100%;
461 }
462 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-inline > .oo-ui-fieldLayout-body > .oo-ui-fieldLayout-header,
463 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-inline > .oo-ui-fieldLayout-body > .oo-ui-fieldLayout-field {
464 display: table-cell;
465 vertical-align: middle;
466 }
467 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-inline > .oo-ui-fieldLayout-body > .oo-ui-fieldLayout-field {
468 width: 1px;
469 }
470 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-top > .oo-ui-fieldLayout-body > .oo-ui-fieldLayout-header,
471 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-top > .oo-ui-fieldLayout-body > .oo-ui-fieldLayout-field {
472 display: block;
473 }
474 .oo-ui-fieldLayout .oo-ui-fieldLayout-help {
475 float: right;
476 }
477 .oo-ui-fieldLayout .oo-ui-fieldLayout-help > .oo-ui-popupWidget > .oo-ui-popupWidget-popup {
478 z-index: 1;
479 }
480 .oo-ui-fieldLayout.oo-ui-labelElement,
481 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-inline {
482 margin-top: 0.9375em;
483 }
484 .oo-ui-fieldLayout:first-child,
485 .oo-ui-fieldLayout.oo-ui-labelElement:first-child,
486 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-inline:first-child {
487 margin-top: 0;
488 }
489 .oo-ui-fieldLayout.oo-ui-labelElement > .oo-ui-fieldLayout-body > .oo-ui-fieldLayout-header {
490 padding-bottom: 0.3125em;
491 }
492 .oo-ui-fieldLayout.oo-ui-labelElement > .oo-ui-fieldLayout-body > .oo-ui-fieldLayout-header > .oo-ui-labelElement-label {
493 line-height: 1.4;
494 }
495 .oo-ui-fieldLayout.oo-ui-labelElement.oo-ui-fieldLayout-align-top > .oo-ui-fieldLayout-body > .oo-ui-fieldLayout-header,
496 .oo-ui-fieldLayout.oo-ui-labelElement.oo-ui-fieldLayout-align-inline > .oo-ui-fieldLayout-body {
497 max-width: 50em;
498 }
499 .oo-ui-fieldLayout.oo-ui-labelElement.oo-ui-fieldLayout-align-left > .oo-ui-fieldLayout-body > .oo-ui-fieldLayout-header,
500 .oo-ui-fieldLayout.oo-ui-labelElement.oo-ui-fieldLayout-align-right > .oo-ui-fieldLayout-body > .oo-ui-fieldLayout-header {
501 width: 35%;
502 margin-right: 5%;
503 }
504 .oo-ui-fieldLayout.oo-ui-labelElement.oo-ui-fieldLayout-align-left > .oo-ui-fieldLayout-body > .oo-ui-fieldLayout-header > .oo-ui-labelElement-label,
505 .oo-ui-fieldLayout.oo-ui-labelElement.oo-ui-fieldLayout-align-right > .oo-ui-fieldLayout-body > .oo-ui-fieldLayout-header > .oo-ui-labelElement-label {
506 display: block;
507 padding-top: 0.3125em;
508 }
509 .oo-ui-fieldLayout.oo-ui-labelElement.oo-ui-fieldLayout-align-left > .oo-ui-fieldLayout-body > .oo-ui-fieldLayout-help,
510 .oo-ui-fieldLayout.oo-ui-labelElement.oo-ui-fieldLayout-align-right > .oo-ui-fieldLayout-body > .oo-ui-fieldLayout-help {
511 margin-right: 0;
512 margin-left: -1.875em;
513 }
514 .oo-ui-fieldLayout.oo-ui-labelElement.oo-ui-fieldLayout-align-left > .oo-ui-fieldLayout-body > .oo-ui-fieldLayout-field,
515 .oo-ui-fieldLayout.oo-ui-labelElement.oo-ui-fieldLayout-align-right > .oo-ui-fieldLayout-body > .oo-ui-fieldLayout-field {
516 width: 60%;
517 }
518 .oo-ui-fieldLayout.oo-ui-labelElement.oo-ui-fieldLayout-align-inline > .oo-ui-fieldLayout-body > .oo-ui-fieldLayout-header {
519 padding: 0.3125em 0 0.3125em 0.46875em;
520 }
521 .oo-ui-fieldLayout .oo-ui-fieldLayout-help {
522 margin-right: 0;
523 }
524 .oo-ui-fieldLayout .oo-ui-fieldLayout-help:last-child {
525 margin-right: 0;
526 }
527 .oo-ui-fieldLayout .oo-ui-fieldLayout-help .oo-ui-buttonElement-button {
528 padding-top: 1.71875em;
529 padding-left: 1.71875em;
530 }
531 .oo-ui-fieldLayout .oo-ui-fieldLayout-help .oo-ui-buttonElement-button .oo-ui-iconElement-icon {
532 left: 0;
533 }
534 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-top .oo-ui-fieldLayout-help,
535 .oo-ui-fieldLayout.oo-ui-fieldLayout-align-inline .oo-ui-fieldLayout-help {
536 margin-top: -0.46875em;
537 margin-right: -0.3125em;
538 }
539 .oo-ui-fieldLayout-messages {
540 list-style: none none;
541 margin: 0.25em 0 0 0.25em;
542 padding: 0;
543 }
544 .oo-ui-fieldLayout-messages > li {
545 margin: 0;
546 padding: 0;
547 display: table;
548 }
549 .oo-ui-fieldLayout-messages .oo-ui-iconElement.oo-ui-iconElement-icon {
550 display: table-cell;
551 position: static;
552 top: auto;
553 height: 1.875em;
554 }
555 .oo-ui-fieldLayout-messages .oo-ui-labelWidget {
556 display: table-cell;
557 padding: 0.1em 0 0.1em 0.3125em;
558 line-height: 1.4;
559 vertical-align: middle;
560 }
561 .oo-ui-fieldLayout.oo-ui-fieldLayout-messages.oo-ui-iconElement .oo-ui-iconElement-icon {
562 display: table-cell;
563 }
564 .oo-ui-fieldLayout-disabled > .oo-ui-fieldLayout-body > .oo-ui-fieldLayout-header > .oo-ui-labelElement-label {
565 color: #72777d;
566 }
567 .oo-ui-actionFieldLayout-input,
568 .oo-ui-actionFieldLayout-button {
569 display: table-cell;
570 vertical-align: middle;
571 }
572 .oo-ui-actionFieldLayout-input {
573 padding-right: 1em;
574 }
575 .oo-ui-actionFieldLayout-button {
576 width: 1%;
577 white-space: nowrap;
578 }
579 .oo-ui-actionFieldLayout.oo-ui-fieldLayout-align-top {
580 max-width: 50em;
581 }
582 .oo-ui-actionFieldLayout .oo-ui-actionFieldLayout-button .oo-ui-buttonElement-frameless {
583 margin-left: 0.3125em;
584 }
585 .oo-ui-fieldsetLayout {
586 position: relative;
587 min-width: 0;
588 margin: 0;
589 border: 0;
590 padding: 0.01px 0 0 0;
591 }
592 body:not( :-moz-handler-blocked ) .oo-ui-fieldsetLayout {
593 display: table-cell;
594 }
595 .oo-ui-fieldsetLayout > .oo-ui-fieldsetLayout-header {
596 display: none;
597 }
598 .oo-ui-fieldsetLayout.oo-ui-iconElement > .oo-ui-fieldsetLayout-header,
599 .oo-ui-fieldsetLayout.oo-ui-labelElement > .oo-ui-fieldsetLayout-header {
600 color: inherit;
601 display: inline-table;
602 box-sizing: border-box;
603 padding: 0;
604 white-space: normal;
605 float: left;
606 width: 100%;
607 }
608 .oo-ui-fieldsetLayout-group {
609 clear: both;
610 }
611 .oo-ui-fieldsetLayout .oo-ui-fieldsetLayout-help {
612 float: right;
613 }
614 .oo-ui-fieldsetLayout .oo-ui-fieldsetLayout-help > .oo-ui-popupWidget > .oo-ui-popupWidget-popup {
615 z-index: 1;
616 }
617 .oo-ui-fieldsetLayout .oo-ui-fieldsetLayout-header {
618 max-width: 50em;
619 }
620 .oo-ui-fieldsetLayout .oo-ui-fieldsetLayout-header .oo-ui-iconElement-icon {
621 height: 1.875em;
622 }
623 .oo-ui-fieldsetLayout.oo-ui-iconElement > .oo-ui-fieldsetLayout-header .oo-ui-iconElement-icon {
624 display: block;
625 }
626 .oo-ui-fieldsetLayout + .oo-ui-fieldsetLayout,
627 .oo-ui-fieldsetLayout + .oo-ui-formLayout {
628 margin-top: 2em;
629 }
630 .oo-ui-fieldsetLayout.oo-ui-labelElement > .oo-ui-fieldsetLayout-header > .oo-ui-labelElement-label {
631 display: inline-block;
632 margin-bottom: 0.54347826em;
633 font-size: 1.15em;
634 font-weight: bold;
635 line-height: 1.4;
636 }
637 .oo-ui-fieldsetLayout.oo-ui-iconElement > .oo-ui-fieldsetLayout-header > .oo-ui-labelElement-label {
638 padding-left: 1.76630435em;
639 line-height: 1.63043478em;
640 }
641 .oo-ui-fieldsetLayout .oo-ui-fieldsetLayout-help {
642 margin-right: 0;
643 margin-top: -0.234375em;
644 margin-right: -0.3125em;
645 }
646 .oo-ui-fieldsetLayout .oo-ui-fieldsetLayout-help:last-child {
647 margin-right: 0;
648 }
649 .oo-ui-fieldsetLayout .oo-ui-fieldsetLayout-help:last-child {
650 margin-right: -0.3125em;
651 }
652 .oo-ui-fieldsetLayout .oo-ui-fieldsetLayout-help .oo-ui-buttonElement-button {
653 padding-top: 1.71875em;
654 padding-left: 1.71875em;
655 }
656 .oo-ui-fieldsetLayout .oo-ui-fieldsetLayout-help .oo-ui-buttonElement-button .oo-ui-iconElement-icon {
657 left: 0;
658 }
659 .oo-ui-formLayout + .oo-ui-fieldsetLayout,
660 .oo-ui-formLayout + .oo-ui-formLayout {
661 margin-top: 2em;
662 }
663 .oo-ui-panelLayout {
664 position: relative;
665 }
666 .oo-ui-panelLayout-scrollable {
667 overflow: auto;
668 }
669 .oo-ui-panelLayout-expanded {
670 position: absolute;
671 top: 0;
672 left: 0;
673 right: 0;
674 bottom: 0;
675 }
676 .oo-ui-panelLayout-padded {
677 padding: 1.25em;
678 }
679 .oo-ui-panelLayout-padded.oo-ui-formLayout > .oo-ui-fieldsetLayout .oo-ui-labelElement-label,
680 .oo-ui-panelLayout-padded.oo-ui-formLayout > .oo-ui-fieldsetLayout .oo-ui-iconElement-icon {
681 margin-top: -0.25em;
682 }
683 .oo-ui-panelLayout-framed {
684 border: 1px solid #a2a9b1;
685 border-radius: 2px;
686 }
687 .oo-ui-panelLayout-padded.oo-ui-panelLayout-framed {
688 margin: 1em 0;
689 }
690 .oo-ui-horizontalLayout > .oo-ui-widget {
691 display: inline-block;
692 vertical-align: middle;
693 }
694 .oo-ui-horizontalLayout > .oo-ui-layout {
695 display: inline-block;
696 }
697 .oo-ui-horizontalLayout > .oo-ui-layout,
698 .oo-ui-horizontalLayout > .oo-ui-widget {
699 margin-right: 0.5em;
700 }
701 .oo-ui-horizontalLayout > .oo-ui-layout:last-child,
702 .oo-ui-horizontalLayout > .oo-ui-widget:last-child {
703 margin-right: 0;
704 }
705 .oo-ui-horizontalLayout > .oo-ui-layout {
706 margin-top: 0;
707 }
708 .oo-ui-horizontalLayout > .oo-ui-widget {
709 margin-bottom: 0.5em;
710 }
711 .oo-ui-widget .oo-ui-iconElement-icon,
712 .oo-ui-widget .oo-ui-indicatorElement-indicator,
713 .oo-ui-widget.oo-ui-iconElement .oo-ui-widget .oo-ui-iconElement-icon,
714 .oo-ui-widget.oo-ui-indicatorElement .oo-ui-widget .oo-ui-indicatorElement-indicator {
715 display: none;
716 }
717 .oo-ui-widget.oo-ui-iconElement .oo-ui-iconElement-icon,
718 .oo-ui-widget.oo-ui-iconElement > * > .oo-ui-iconElement-icon,
719 .oo-ui-widget.oo-ui-iconElement .oo-ui-iconElement .oo-ui-iconElement-icon,
720 .oo-ui-widget.oo-ui-indicatorElement > .oo-ui-indicatorElement-indicator,
721 .oo-ui-widget.oo-ui-indicatorElement > * > .oo-ui-indicatorElement-indicator,
722 .oo-ui-widget.oo-ui-indicatorElement .oo-ui-indicatorElement .oo-ui-indicatorElement-indicator {
723 display: block;
724 }
725 .oo-ui-optionWidget {
726 position: relative;
727 display: block;
728 }
729 .oo-ui-optionWidget.oo-ui-widget-enabled {
730 cursor: pointer;
731 }
732 .oo-ui-optionWidget.oo-ui-widget-disabled {
733 cursor: default;
734 }
735 .oo-ui-optionWidget.oo-ui-labelElement > .oo-ui-labelElement-label {
736 display: block;
737 white-space: nowrap;
738 text-overflow: ellipsis;
739 overflow: hidden;
740 }
741 .oo-ui-optionWidget .oo-ui-labelElement-label {
742 line-height: 1.6;
743 }
744 .oo-ui-optionWidget-selected .oo-ui-buttonElement-button > .oo-ui-iconElement-icon {
745 opacity: 1;
746 }
747 .oo-ui-optionWidget.oo-ui-widget-disabled {
748 color: #72777d;
749 }
750 .oo-ui-decoratedOptionWidget {
751 padding: 0.703125em 0.9375em 0.625em;
752 line-height: 1;
753 }
754 .oo-ui-decoratedOptionWidget.oo-ui-iconElement {
755 padding-left: 2.96875em;
756 }
757 .oo-ui-decoratedOptionWidget.oo-ui-iconElement .oo-ui-iconElement-icon {
758 left: 0.9375em;
759 }
760 .oo-ui-decoratedOptionWidget .oo-ui-labelElement-label {
761 line-height: 1.172em;
762 }
763 .oo-ui-decoratedOptionWidget.oo-ui-indicatorElement {
764 padding-right: 2.5em;
765 }
766 .oo-ui-decoratedOptionWidget.oo-ui-indicatorElement .oo-ui-indicatorElement-indicator {
767 right: 0.9375em;
768 }
769 .oo-ui-decoratedOptionWidget.oo-ui-widget-disabled .oo-ui-iconElement-icon,
770 .oo-ui-decoratedOptionWidget.oo-ui-widget-disabled .oo-ui-indicatorElement-indicator {
771 opacity: 0.51;
772 }
773 .oo-ui-radioSelectWidget:focus {
774 outline: 0;
775 }
776 .oo-ui-radioSelectWidget:focus [type='radio']:checked + span:before {
777 border-color: #fff;
778 }
779 .oo-ui-radioOptionWidget {
780 display: table;
781 width: 100%;
782 padding: 0.3125em 0;
783 }
784 .oo-ui-radioOptionWidget .oo-ui-radioInputWidget,
785 .oo-ui-radioOptionWidget.oo-ui-labelElement > .oo-ui-labelElement-label {
786 display: table-cell;
787 vertical-align: middle;
788 }
789 .oo-ui-radioOptionWidget .oo-ui-radioInputWidget {
790 width: 1px;
791 }
792 .oo-ui-radioOptionWidget.oo-ui-labelElement > .oo-ui-labelElement-label {
793 white-space: normal;
794 }
795 .oo-ui-radioOptionWidget.oo-ui-labelElement .oo-ui-labelElement-label {
796 padding-left: 0.46875em;
797 }
798 .oo-ui-radioOptionWidget .oo-ui-radioInputWidget {
799 margin-right: 0;
800 }
801 .oo-ui-labelWidget {
802 display: inline-block;
803 }
804 .oo-ui-iconWidget {
805 display: inline-block;
806 vertical-align: middle;
807 line-height: 2.5;
808 }
809 .oo-ui-iconWidget.oo-ui-iconElement.oo-ui-iconElement-icon {
810 display: inline-block;
811 position: static;
812 top: auto;
813 height: 1.875em;
814 }
815 .oo-ui-iconWidget.oo-ui-widget-disabled {
816 opacity: 0.51;
817 }
818 .oo-ui-indicatorWidget {
819 display: inline-block;
820 vertical-align: middle;
821 line-height: 2.5;
822 margin: 0.46875em;
823 }
824 .oo-ui-indicatorWidget.oo-ui-indicatorElement.oo-ui-indicatorElement-indicator {
825 display: inline-block;
826 position: static;
827 top: auto;
828 height: 0.9375em;
829 }
830 .oo-ui-indicatorWidget.oo-ui-widget-disabled {
831 opacity: 0.51;
832 }
833 .oo-ui-buttonWidget {
834 margin-right: 0.5em;
835 }
836 .oo-ui-buttonWidget:last-child {
837 margin-right: 0;
838 }
839 .oo-ui-buttonGroupWidget {
840 display: inline-block;
841 white-space: nowrap;
842 border-radius: 2px;
843 margin-right: 0.5em;
844 z-index: 0;
845 position: relative;
846 }
847 .oo-ui-buttonGroupWidget .oo-ui-buttonWidget.oo-ui-buttonElement-active .oo-ui-buttonElement-button {
848 cursor: default;
849 }
850 .oo-ui-buttonGroupWidget:last-child {
851 margin-right: 0;
852 }
853 .oo-ui-buttonGroupWidget .oo-ui-buttonElement {
854 margin-right: 0;
855 z-index: 0;
856 }
857 .oo-ui-buttonGroupWidget .oo-ui-buttonElement:last-child {
858 margin-right: 0;
859 }
860 .oo-ui-buttonGroupWidget .oo-ui-buttonElement-framed .oo-ui-buttonElement-button {
861 margin-left: -1px;
862 border-radius: 0;
863 }
864 .oo-ui-buttonGroupWidget .oo-ui-buttonElement-framed:first-child .oo-ui-buttonElement-button {
865 margin-left: 0;
866 border-bottom-left-radius: 2px;
867 border-top-left-radius: 2px;
868 }
869 .oo-ui-buttonGroupWidget .oo-ui-buttonElement-framed:last-child .oo-ui-buttonElement-button {
870 border-bottom-right-radius: 2px;
871 border-top-right-radius: 2px;
872 }
873 .oo-ui-buttonGroupWidget .oo-ui-buttonElement-framed.oo-ui-widget-disabled + .oo-ui-widget-disabled > .oo-ui-buttonElement-button {
874 border-left-color: #fff;
875 }
876 .oo-ui-buttonGroupWidget.oo-ui-widget-enabled .oo-ui-buttonElement.oo-ui-widget-enabled > .oo-ui-buttonElement-button:active {
877 z-index: 1;
878 }
879 .oo-ui-buttonGroupWidget.oo-ui-widget-enabled .oo-ui-buttonElement.oo-ui-widget-enabled > .oo-ui-buttonElement-button:focus {
880 z-index: 2;
881 }
882 .oo-ui-buttonGroupWidget.oo-ui-widget-enabled .oo-ui-buttonElement.oo-ui-buttonElement-active > .oo-ui-buttonElement-button {
883 z-index: 3;
884 }
885 .oo-ui-buttonGroupWidget.oo-ui-widget-enabled .oo-ui-buttonElement.oo-ui-widget-disabled > .oo-ui-buttonElement-button {
886 z-index: -1;
887 }
888 .oo-ui-buttonGroupWidget.oo-ui-widget-enabled .oo-ui-buttonElement.oo-ui-toggleWidget-on + .oo-ui-toggleWidget-on > .oo-ui-buttonElement-button,
889 .oo-ui-buttonGroupWidget.oo-ui-widget-enabled .oo-ui-buttonElement.oo-ui-toggleWidget-on + .oo-ui-toggleWidget-on > .oo-ui-buttonElement-button:active {
890 border-left-color: #a2a9b1;
891 z-index: 3;
892 }
893 .oo-ui-popupWidget {
894 position: absolute;
895 }
896 .oo-ui-popupWidget-popup {
897 position: relative;
898 overflow: hidden;
899 z-index: 1;
900 }
901 .oo-ui-popupWidget-anchor {
902 display: none;
903 z-index: 1;
904 }
905 .oo-ui-popupWidget-anchored .oo-ui-popupWidget-anchor {
906 display: block;
907 position: absolute;
908 background-repeat: no-repeat;
909 }
910 .oo-ui-popupWidget-anchored .oo-ui-popupWidget-anchor:before,
911 .oo-ui-popupWidget-anchored .oo-ui-popupWidget-anchor:after {
912 content: '';
913 position: absolute;
914 width: 0;
915 height: 0;
916 border-style: solid;
917 border-color: transparent;
918 }
919 .oo-ui-popupWidget-anchored-top .oo-ui-popupWidget-anchor {
920 left: 0;
921 }
922 .oo-ui-popupWidget-anchored-top .oo-ui-popupWidget-anchor:before,
923 .oo-ui-popupWidget-anchored-top .oo-ui-popupWidget-anchor:after {
924 border-top: 0;
925 }
926 .oo-ui-popupWidget-anchored-bottom .oo-ui-popupWidget-anchor {
927 left: 0;
928 }
929 .oo-ui-popupWidget-anchored-bottom .oo-ui-popupWidget-anchor:before,
930 .oo-ui-popupWidget-anchored-bottom .oo-ui-popupWidget-anchor:after {
931 border-bottom: 0;
932 }
933 .oo-ui-popupWidget-anchored-start .oo-ui-popupWidget-anchor {
934 top: 0;
935 }
936 .oo-ui-popupWidget-anchored-start .oo-ui-popupWidget-anchor:before,
937 .oo-ui-popupWidget-anchored-start .oo-ui-popupWidget-anchor:after {
938 border-left: 0;
939 }
940 .oo-ui-popupWidget-anchored-end .oo-ui-popupWidget-anchor {
941 top: 0;
942 }
943 .oo-ui-popupWidget-anchored-end .oo-ui-popupWidget-anchor:before,
944 .oo-ui-popupWidget-anchored-end .oo-ui-popupWidget-anchor:after {
945 border-right: 0;
946 }
947 .oo-ui-popupWidget-head {
948 -webkit-touch-callout: none;
949 -webkit-user-select: none;
950 -moz-user-select: none;
951 -ms-user-select: none;
952 user-select: none;
953 }
954 .oo-ui-popupWidget-head > .oo-ui-buttonWidget {
955 position: absolute;
956 }
957 .oo-ui-popupWidget-head > .oo-ui-labelElement-label {
958 float: left;
959 cursor: default;
960 }
961 .oo-ui-popupWidget-body {
962 clear: both;
963 }
964 .oo-ui-popupWidget-body.oo-ui-clippableElement-clippable {
965 min-height: 1em;
966 }
967 .oo-ui-popupWidget-popup {
968 background-color: #fff;
969 border: 1px solid #a2a9b1;
970 border-radius: 2px;
971 box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.25);
972 }
973 .oo-ui-popupWidget-anchored-top {
974 margin-top: 9px;
975 }
976 .oo-ui-popupWidget-anchored-top .oo-ui-popupWidget-anchor {
977 top: -9px;
978 }
979 .oo-ui-popupWidget-anchored-top .oo-ui-popupWidget-anchor:before {
980 bottom: -10px;
981 left: -9px;
982 border-bottom-color: #a2a9b1;
983 border-width: 10px;
984 }
985 .oo-ui-popupWidget-anchored-top .oo-ui-popupWidget-anchor:after {
986 bottom: -10px;
987 left: -8px;
988 border-bottom-color: #fff;
989 border-width: 9px;
990 }
991 .oo-ui-popupWidget-anchored-bottom {
992 margin-bottom: 9px;
993 }
994 .oo-ui-popupWidget-anchored-bottom .oo-ui-popupWidget-anchor {
995 bottom: -9px;
996 }
997 .oo-ui-popupWidget-anchored-bottom .oo-ui-popupWidget-anchor:before {
998 top: -10px;
999 left: -9px;
1000 border-top-color: #a2a9b1;
1001 border-width: 10px;
1002 }
1003 .oo-ui-popupWidget-anchored-bottom .oo-ui-popupWidget-anchor:after {
1004 top: -10px;
1005 left: -8px;
1006 border-top-color: #fff;
1007 border-width: 9px;
1008 }
1009 .oo-ui-popupWidget-anchored-start {
1010 margin-left: 9px;
1011 }
1012 .oo-ui-popupWidget-anchored-start .oo-ui-popupWidget-anchor {
1013 left: -9px;
1014 }
1015 .oo-ui-popupWidget-anchored-start .oo-ui-popupWidget-anchor:before {
1016 right: -10px;
1017 top: -9px;
1018 border-right-color: #a2a9b1;
1019 border-width: 10px;
1020 }
1021 .oo-ui-popupWidget-anchored-start .oo-ui-popupWidget-anchor:after {
1022 right: -10px;
1023 top: -8px;
1024 border-right-color: #fff;
1025 border-width: 9px;
1026 }
1027 .oo-ui-popupWidget-anchored-end {
1028 margin-right: 9px;
1029 }
1030 .oo-ui-popupWidget-anchored-end .oo-ui-popupWidget-anchor {
1031 right: -9px;
1032 }
1033 .oo-ui-popupWidget-anchored-end .oo-ui-popupWidget-anchor:before {
1034 left: -10px;
1035 top: -9px;
1036 border-left-color: #a2a9b1;
1037 border-width: 10px;
1038 }
1039 .oo-ui-popupWidget-anchored-end .oo-ui-popupWidget-anchor:after {
1040 left: -10px;
1041 top: -8px;
1042 border-left-color: #fff;
1043 border-width: 9px;
1044 }
1045 .oo-ui-popupWidget-transitioning .oo-ui-popupWidget-popup {
1046 -webkit-transition: width 100ms, height 100ms, left 100ms;
1047 -moz-transition: width 100ms, height 100ms, left 100ms;
1048 transition: width 100ms, height 100ms, left 100ms;
1049 }
1050 .oo-ui-popupWidget-head > .oo-ui-labelElement-label {
1051 margin: 0.703125em 2.5em 0.625em 0.9375em;
1052 line-height: 1.172em;
1053 }
1054 .oo-ui-popupWidget-head > .oo-ui-buttonWidget {
1055 right: 0;
1056 }
1057 .oo-ui-popupWidget-body {
1058 line-height: 1.4;
1059 }
1060 .oo-ui-popupWidget-body-padded {
1061 margin: 0.703125em 0.9375em 0.625em;
1062 }
1063 .oo-ui-popupWidget-body-padded > :first-child {
1064 margin-top: 0;
1065 }
1066 .oo-ui-popupWidget-footer {
1067 margin: 0.703125em 0.9375em 0.625em;
1068 }
1069 .oo-ui-popupButtonWidget {
1070 position: relative;
1071 }
1072 .oo-ui-popupButtonWidget .oo-ui-popupWidget {
1073 cursor: auto;
1074 }
1075 .oo-ui-inputWidget {
1076 margin-right: 0.5em;
1077 }
1078 .oo-ui-inputWidget:last-child {
1079 margin-right: 0;
1080 }
1081 .oo-ui-buttonInputWidget > button,
1082 .oo-ui-buttonInputWidget > input {
1083 background-color: transparent;
1084 margin: 0;
1085 border: 0;
1086 padding: 0;
1087 }
1088 .oo-ui-checkboxInputWidget {
1089 position: relative;
1090 line-height: 1.5625em;
1091 white-space: nowrap;
1092 display: inline-block;
1093 }
1094 .oo-ui-checkboxInputWidget * {
1095 font: inherit;
1096 vertical-align: middle;
1097 }
1098 .oo-ui-checkboxInputWidget [type='checkbox'] {
1099 position: relative;
1100 max-width: none;
1101 width: 1.5625em;
1102 height: 1.5625em;
1103 margin: 0;
1104 opacity: 0;
1105 z-index: 1;
1106 }
1107 .oo-ui-checkboxInputWidget [type='checkbox'] + span {
1108 background-color: #fff;
1109 background-origin: border-box;
1110 background-position: center center;
1111 background-repeat: no-repeat;
1112 background-size: 0 0;
1113 -webkit-box-sizing: border-box;
1114 -moz-box-sizing: border-box;
1115 box-sizing: border-box;
1116 position: absolute;
1117 left: 0;
1118 width: 1.5625em;
1119 height: 1.5625em;
1120 border: 1px solid #72777d;
1121 border-radius: 2px;
1122 }
1123 .oo-ui-checkboxInputWidget [type='checkbox']:checked + span {
1124 background-image: url('themes/wikimediaui/images/icons/check-invert.png');
1125 background-image: linear-gradient(transparent, transparent), /* @embed */ url('themes/wikimediaui/images/icons/check-invert.svg');
1126 background-size: 90% 90%;
1127 }
1128 .oo-ui-checkboxInputWidget [type='checkbox']:disabled + span {
1129 background-color: #c8ccd1;
1130 border-color: #c8ccd1;
1131 }
1132 .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox'] {
1133 cursor: pointer;
1134 }
1135 .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox'] + span {
1136 cursor: pointer;
1137 -webkit-transition: background-color 100ms, background-size 100ms, border-color 100ms, box-shadow 100ms;
1138 -moz-transition: background-color 100ms, background-size 100ms, border-color 100ms, box-shadow 100ms;
1139 transition: background-color 100ms, background-size 100ms, border-color 100ms, box-shadow 100ms;
1140 }
1141 .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox']:focus + span {
1142 border-color: #36c;
1143 box-shadow: inset 0 0 0 1px #36c;
1144 }
1145 .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox']:hover + span {
1146 border-color: #36c;
1147 }
1148 .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox']:active + span {
1149 background-color: #2a4b8d;
1150 border-color: #2a4b8d;
1151 box-shadow: inset 0 0 0 1px #2a4b8d;
1152 }
1153 .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox']:checked + span {
1154 background-color: #36c;
1155 border-color: #36c;
1156 }
1157 .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox']:checked:focus + span {
1158 background-color: #36c;
1159 border-color: #36c;
1160 box-shadow: inset 0 0 0 1px #36c, inset 0 0 0 2px #fff;
1161 }
1162 .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox']:checked:hover + span {
1163 background-color: #447ff5;
1164 border-color: #447ff5;
1165 }
1166 .oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox']:checked:active + span {
1167 background-color: #2a4b8d;
1168 border-color: #2a4b8d;
1169 box-shadow: inset 0 0 0 1px #2a4b8d;
1170 }
1171 .oo-ui-checkboxMultiselectInputWidget .oo-ui-fieldLayout {
1172 margin-top: 0.3125em;
1173 }
1174 .oo-ui-checkboxMultiselectInputWidget .oo-ui-fieldLayout .oo-ui-fieldLayout-body .oo-ui-labelElement-label {
1175 line-height: 1.5;
1176 }
1177 .oo-ui-dropdownInputWidget {
1178 position: relative;
1179 vertical-align: middle;
1180 -webkit-box-sizing: border-box;
1181 -moz-box-sizing: border-box;
1182 box-sizing: border-box;
1183 width: 100%;
1184 max-width: 50em;
1185 }
1186 .oo-ui-dropdownInputWidget .oo-ui-dropdownWidget,
1187 .oo-ui-dropdownInputWidget.oo-ui-dropdownInputWidget-php select {
1188 display: block;
1189 }
1190 .oo-ui-dropdownInputWidget select {
1191 display: none;
1192 background-position: -9999em 0;
1193 background-repeat: no-repeat;
1194 width: 100%;
1195 -webkit-box-sizing: border-box;
1196 -moz-box-sizing: border-box;
1197 box-sizing: border-box;
1198 }
1199 .oo-ui-dropdownInputWidget.oo-ui-widget-enabled select {
1200 cursor: pointer;
1201 }
1202 .oo-ui-dropdownInputWidget-php {
1203 border-right: 1px solid #a2a9b1;
1204 border-radius: 2px;
1205 overflow-x: hidden;
1206 }
1207 .oo-ui-dropdownInputWidget select {
1208 -webkit-appearance: none;
1209 -moz-appearance: none;
1210 -webkit-box-sizing: border-box;
1211 -moz-box-sizing: border-box;
1212 box-sizing: border-box;
1213 border: 1px solid #a2a9b1;
1214 border-radius: 2px;
1215 padding: 0.625em 0.9375em 0.546875em;
1216 font-size: inherit;
1217 font-family: inherit;
1218 vertical-align: middle;
1219 }
1220 .oo-ui-dropdownInputWidget select::-ms-expand {
1221 display: none;
1222 }
1223 .oo-ui-dropdownInputWidget select:not( [no-ie] ) {
1224 background-position: right 1.75em center;
1225 width: calc( 100% + 1em );
1226 height: 2.5em;
1227 padding: 0 0 0 0.9375em;
1228 }
1229 .oo-ui-dropdownInputWidget option {
1230 font-size: inherit;
1231 font-family: inherit;
1232 height: 1.5em;
1233 padding: 0.625em 0.9375em;
1234 }
1235 .oo-ui-dropdownInputWidget.oo-ui-widget-enabled select {
1236 background-color: #f8f9fa;
1237 color: #222;
1238 -webkit-transition: background-color 100ms, border-color 100ms, box-shadow 100ms;
1239 -moz-transition: background-color 100ms, border-color 100ms, box-shadow 100ms;
1240 transition: background-color 100ms, border-color 100ms, box-shadow 100ms;
1241 }
1242 .oo-ui-dropdownInputWidget.oo-ui-widget-enabled select:hover {
1243 background-color: #fff;
1244 color: #444;
1245 border-color: #a2a9b1;
1246 }
1247 .oo-ui-dropdownInputWidget.oo-ui-widget-enabled select:active {
1248 color: #000;
1249 border-color: #72777d;
1250 }
1251 .oo-ui-dropdownInputWidget.oo-ui-widget-enabled select:focus {
1252 border-color: #36c;
1253 outline: 0;
1254 box-shadow: inset 0 0 0 1px #36c;
1255 }
1256 .oo-ui-dropdownInputWidget.oo-ui-widget-disabled select {
1257 background-color: #eaecf0;
1258 color: #72777d;
1259 border-color: #c8ccd1;
1260 }
1261 .oo-ui-radioInputWidget {
1262 position: relative;
1263 line-height: 1.5625em;
1264 white-space: nowrap;
1265 display: inline-block;
1266 }
1267 .oo-ui-radioInputWidget * {
1268 font: inherit;
1269 vertical-align: middle;
1270 }
1271 .oo-ui-radioInputWidget [type='radio'] {
1272 position: relative;
1273 max-width: none;
1274 width: 1.5625em;
1275 height: 1.5625em;
1276 margin: 0;
1277 opacity: 0;
1278 z-index: 1;
1279 }
1280 .oo-ui-radioInputWidget [type='radio'] + span {
1281 background-color: #fff;
1282 position: absolute;
1283 left: 0;
1284 -webkit-box-sizing: border-box;
1285 -moz-box-sizing: border-box;
1286 box-sizing: border-box;
1287 width: 1.5625em;
1288 height: 1.5625em;
1289 border: 1px solid #72777d;
1290 border-radius: 100%;
1291 }
1292 .oo-ui-radioInputWidget [type='radio'] + span:before {
1293 content: ' ';
1294 position: absolute;
1295 top: -4px;
1296 left: -4px;
1297 right: -4px;
1298 bottom: -4px;
1299 border: 1px solid transparent;
1300 border-radius: 100%;
1301 }
1302 .oo-ui-radioInputWidget [type='radio']:checked + span,
1303 .oo-ui-radioInputWidget [type='radio']:checked:hover + span,
1304 .oo-ui-radioInputWidget [type='radio']:checked:focus:hover + span {
1305 border-width: 0.46875em;
1306 }
1307 .oo-ui-radioInputWidget [type='radio']:disabled + span {
1308 background-color: #c8ccd1;
1309 border-color: #c8ccd1;
1310 }
1311 .oo-ui-radioInputWidget [type='radio']:disabled:checked + span {
1312 background-color: #fff;
1313 }
1314 .oo-ui-radioInputWidget.oo-ui-widget-enabled [type='radio'] {
1315 cursor: pointer;
1316 }
1317 .oo-ui-radioInputWidget.oo-ui-widget-enabled [type='radio'] + span {
1318 cursor: pointer;
1319 -webkit-transition: background-color 100ms, border-color 100ms, border-width 100ms;
1320 -moz-transition: background-color 100ms, border-color 100ms, border-width 100ms;
1321 transition: background-color 100ms, border-color 100ms, border-width 100ms;
1322 }
1323 .oo-ui-radioInputWidget.oo-ui-widget-enabled [type='radio']:hover + span {
1324 border-color: #36c;
1325 }
1326 .oo-ui-radioInputWidget.oo-ui-widget-enabled [type='radio']:active + span {
1327 background-color: #2a4b8d;
1328 border-color: #2a4b8d;
1329 }
1330 .oo-ui-radioInputWidget.oo-ui-widget-enabled [type='radio']:checked + span {
1331 border-color: #36c;
1332 }
1333 .oo-ui-radioInputWidget.oo-ui-widget-enabled [type='radio']:checked:focus + span:before {
1334 border-color: #fff;
1335 }
1336 .oo-ui-radioInputWidget.oo-ui-widget-enabled [type='radio']:checked:hover + span {
1337 border-color: #447ff5;
1338 }
1339 .oo-ui-radioInputWidget.oo-ui-widget-enabled [type='radio']:checked:active + span {
1340 border-color: #2a4b8d;
1341 box-shadow: inset 0 0 0 1px #2a4b8d;
1342 }
1343 .oo-ui-radioInputWidget.oo-ui-widget-enabled [type='radio']:checked:active + span:before {
1344 border-color: #2a4b8d;
1345 }
1346 .oo-ui-radioSelectInputWidget .oo-ui-fieldLayout {
1347 margin-top: 0.3125em;
1348 }
1349 .oo-ui-radioSelectInputWidget .oo-ui-fieldLayout .oo-ui-fieldLayout-body .oo-ui-labelElement-label {
1350 line-height: 1.5;
1351 }
1352 .oo-ui-textInputWidget {
1353 position: relative;
1354 vertical-align: middle;
1355 -webkit-box-sizing: border-box;
1356 -moz-box-sizing: border-box;
1357 box-sizing: border-box;
1358 width: 100%;
1359 max-width: 50em;
1360 }
1361 .oo-ui-textInputWidget input,
1362 .oo-ui-textInputWidget textarea {
1363 display: block;
1364 width: 100%;
1365 -webkit-box-sizing: border-box;
1366 -moz-box-sizing: border-box;
1367 box-sizing: border-box;
1368 }
1369 .oo-ui-textInputWidget textarea {
1370 overflow: auto;
1371 resize: none;
1372 }
1373 .oo-ui-textInputWidget [type='number'] {
1374 -moz-appearance: textfield;
1375 }
1376 .oo-ui-textInputWidget [type='number']::-webkit-outer-spin-button,
1377 .oo-ui-textInputWidget [type='number']::-webkit-inner-spin-button {
1378 -webkit-appearance: none;
1379 margin: 0;
1380 }
1381 .oo-ui-textInputWidget [type='search'] {
1382 -webkit-appearance: none;
1383 }
1384 .oo-ui-textInputWidget [type='search']::-ms-clear {
1385 display: none;
1386 }
1387 .oo-ui-textInputWidget [type='search']::-webkit-search-decoration,
1388 .oo-ui-textInputWidget [type='search']::-webkit-search-cancel-button {
1389 display: none;
1390 }
1391 .oo-ui-textInputWidget.oo-ui-widget-enabled > .oo-ui-iconElement-icon,
1392 .oo-ui-textInputWidget.oo-ui-widget-enabled > .oo-ui-indicatorElement-indicator {
1393 cursor: text;
1394 }
1395 .oo-ui-textInputWidget.oo-ui-widget-enabled.oo-ui-textInputWidget-type-search > .oo-ui-indicatorElement-indicator {
1396 cursor: pointer;
1397 }
1398 .oo-ui-textInputWidget.oo-ui-widget-disabled > * {
1399 -webkit-touch-callout: none;
1400 -webkit-user-select: none;
1401 -moz-user-select: none;
1402 -ms-user-select: none;
1403 user-select: none;
1404 }
1405 .oo-ui-textInputWidget.oo-ui-labelElement > .oo-ui-labelElement-label {
1406 display: block;
1407 }
1408 .oo-ui-textInputWidget > .oo-ui-iconElement-icon,
1409 .oo-ui-textInputWidget-labelPosition-before > .oo-ui-labelElement-label {
1410 left: 0;
1411 }
1412 .oo-ui-textInputWidget > .oo-ui-indicatorElement-indicator,
1413 .oo-ui-textInputWidget-labelPosition-after > .oo-ui-labelElement-label {
1414 right: 0;
1415 }
1416 .oo-ui-textInputWidget > .oo-ui-labelElement-label {
1417 position: absolute;
1418 top: 0;
1419 }
1420 .oo-ui-textInputWidget-php > .oo-ui-iconElement-icon,
1421 .oo-ui-textInputWidget-php > .oo-ui-indicatorElement-indicator,
1422 .oo-ui-textInputWidget-php > .oo-ui-labelElement-label {
1423 pointer-events: none;
1424 }
1425 .oo-ui-textInputWidget input,
1426 .oo-ui-textInputWidget textarea {
1427 -webkit-appearance: none;
1428 margin: 0;
1429 font-size: inherit;
1430 font-family: inherit;
1431 background-color: #fff;
1432 color: #000;
1433 border: 1px solid #a2a9b1;
1434 border-radius: 2px;
1435 padding: 0.625em 0.625em 0.546875em;
1436 }
1437 .oo-ui-textInputWidget input {
1438 line-height: 1.172em;
1439 }
1440 .oo-ui-textInputWidget textarea {
1441 line-height: 1.275;
1442 }
1443 .oo-ui-textInputWidget .oo-ui-pendingElement-pending {
1444 background-color: transparent;
1445 }
1446 .oo-ui-textInputWidget.oo-ui-widget-enabled input,
1447 .oo-ui-textInputWidget.oo-ui-widget-enabled textarea {
1448 box-shadow: inset 0 0 0 1px transparent;
1449 -webkit-transition: border-color 200ms cubic-bezier(0.4, 0.55, 0.55, 1), box-shadow 200ms cubic-bezier(0.4, 0.55, 0.55, 1);
1450 -moz-transition: border-color 200ms cubic-bezier(0.4, 0.55, 0.55, 1), box-shadow 200ms cubic-bezier(0.4, 0.55, 0.55, 1);
1451 transition: border-color 200ms cubic-bezier(0.4, 0.55, 0.55, 1), box-shadow 200ms cubic-bezier(0.4, 0.55, 0.55, 1);
1452 }
1453 .oo-ui-textInputWidget.oo-ui-widget-enabled input::-webkit-input-placeholder,
1454 .oo-ui-textInputWidget.oo-ui-widget-enabled textarea::-webkit-input-placeholder {
1455 color: #72777d;
1456 opacity: 1;
1457 }
1458 .oo-ui-textInputWidget.oo-ui-widget-enabled input:-ms-input-placeholder,
1459 .oo-ui-textInputWidget.oo-ui-widget-enabled textarea:-ms-input-placeholder {
1460 color: #72777d;
1461 opacity: 1;
1462 }
1463 .oo-ui-textInputWidget.oo-ui-widget-enabled input::-moz-placeholder,
1464 .oo-ui-textInputWidget.oo-ui-widget-enabled textarea::-moz-placeholder {
1465 color: #72777d;
1466 opacity: 1;
1467 }
1468 .oo-ui-textInputWidget.oo-ui-widget-enabled input:-moz-placeholder,
1469 .oo-ui-textInputWidget.oo-ui-widget-enabled textarea:-moz-placeholder {
1470 color: #72777d;
1471 opacity: 1;
1472 }
1473 .oo-ui-textInputWidget.oo-ui-widget-enabled input::placeholder,
1474 .oo-ui-textInputWidget.oo-ui-widget-enabled textarea::placeholder {
1475 color: #72777d;
1476 opacity: 1;
1477 }
1478 .oo-ui-textInputWidget.oo-ui-widget-enabled input:focus,
1479 .oo-ui-textInputWidget.oo-ui-widget-enabled textarea:focus {
1480 outline: 0;
1481 border-color: #36c;
1482 box-shadow: inset 0 0 0 1px #36c;
1483 }
1484 .oo-ui-textInputWidget.oo-ui-widget-enabled input[readonly],
1485 .oo-ui-textInputWidget.oo-ui-widget-enabled textarea[readonly] {
1486 background-color: #f8f9fa;
1487 }
1488 .oo-ui-textInputWidget.oo-ui-widget-enabled:hover input,
1489 .oo-ui-textInputWidget.oo-ui-widget-enabled:hover textarea {
1490 border-color: #72777d;
1491 }
1492 .oo-ui-textInputWidget.oo-ui-widget-enabled:hover input:focus,
1493 .oo-ui-textInputWidget.oo-ui-widget-enabled:hover textarea:focus {
1494 border-color: #36c;
1495 }
1496 @media screen and (min-width: 0) {
1497 .oo-ui-textInputWidget.oo-ui-widget-enabled textarea:focus {
1498 outline: 1px solid #36c;
1499 outline-offset: -2px;
1500 }
1501 }
1502 .oo-ui-textInputWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-invalid input,
1503 .oo-ui-textInputWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-invalid textarea {
1504 border-color: #d33;
1505 }
1506 .oo-ui-textInputWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-invalid input:hover,
1507 .oo-ui-textInputWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-invalid textarea:hover {
1508 border-color: #d33;
1509 }
1510 .oo-ui-textInputWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-invalid input:focus,
1511 .oo-ui-textInputWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-invalid textarea:focus {
1512 border-color: #d33;
1513 box-shadow: inset 0 0 0 1px #d33;
1514 }
1515 .oo-ui-textInputWidget.oo-ui-widget-disabled input,
1516 .oo-ui-textInputWidget.oo-ui-widget-disabled textarea {
1517 background-color: #eaecf0;
1518 -webkit-text-fill-color: #72777d;
1519 color: #72777d;
1520 text-shadow: 0 1px 1px #fff;
1521 border-color: #c8ccd1;
1522 }
1523 .oo-ui-textInputWidget.oo-ui-widget-disabled > .oo-ui-iconElement-icon,
1524 .oo-ui-textInputWidget.oo-ui-widget-disabled > .oo-ui-indicatorElement-indicator {
1525 opacity: 0.51;
1526 }
1527 .oo-ui-textInputWidget.oo-ui-widget-disabled > .oo-ui-labelElement-label {
1528 color: #72777d;
1529 text-shadow: 0 1px 1px #fff;
1530 }
1531 .oo-ui-textInputWidget.oo-ui-iconElement input,
1532 .oo-ui-textInputWidget.oo-ui-iconElement textarea {
1533 padding-left: 2.5em;
1534 }
1535 .oo-ui-textInputWidget.oo-ui-iconElement > .oo-ui-iconElement-icon {
1536 left: 0.46875em;
1537 }
1538 .oo-ui-textInputWidget.oo-ui-iconElement textarea + .oo-ui-iconElement-icon {
1539 max-height: 2.5em;
1540 }
1541 .oo-ui-textInputWidget > .oo-ui-labelElement-label {
1542 color: #72777d;
1543 margin-top: 1px;
1544 padding: 0.625em 0.9375em 0.546875em 0.625em;
1545 line-height: 1.172em;
1546 }
1547 .oo-ui-textInputWidget.oo-ui-indicatorElement input,
1548 .oo-ui-textInputWidget.oo-ui-indicatorElement textarea {
1549 padding-right: 2.1875em;
1550 }
1551 .oo-ui-textInputWidget.oo-ui-indicatorElement.oo-ui-textInputWidget-labelPosition-after > .oo-ui-labelElement-label {
1552 padding-right: 0;
1553 }
1554 .oo-ui-textInputWidget.oo-ui-indicatorElement > .oo-ui-indicatorElement-indicator {
1555 max-height: 2.5em;
1556 margin-right: 0.9375em;
1557 }
1558 .oo-ui-textInputWidget-labelPosition-after.oo-ui-indicatorElement > .oo-ui-labelElement-label {
1559 margin-right: 2.5em;
1560 }
1561 .oo-ui-textInputWidget-labelPosition-before.oo-ui-iconElement > .oo-ui-labelElement-label {
1562 padding-left: 2.5em;
1563 }
1564 .oo-ui-menuSelectWidget {
1565 position: absolute;
1566 width: 100%;
1567 z-index: 4;
1568 background-color: #fff;
1569 margin-top: -1px;
1570 margin-bottom: -1px;
1571 border: 1px solid #a2a9b1;
1572 border-radius: 0 0 2px 2px;
1573 box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.25);
1574 }
1575 .oo-ui-menuSelectWidget.oo-ui-clippableElement-clippable {
1576 min-height: 2.6em;
1577 }
1578 .oo-ui-menuSelectWidget-invisible {
1579 display: none;
1580 }
1581 .oo-ui-menuOptionWidget {
1582 -webkit-transition: background-color 100ms, color 100ms;
1583 -moz-transition: background-color 100ms, color 100ms;
1584 transition: background-color 100ms, color 100ms;
1585 }
1586 .oo-ui-menuOptionWidget.oo-ui-optionWidget-highlighted {
1587 background-color: #eaecf0;
1588 color: #000;
1589 }
1590 .oo-ui-menuOptionWidget.oo-ui-optionWidget-selected {
1591 background-color: #eaf3ff;
1592 color: #36c;
1593 }
1594 .oo-ui-menuOptionWidget.oo-ui-optionWidget-selected.oo-ui-menuOptionWidget.oo-ui-optionWidget-highlighted,
1595 .oo-ui-menuOptionWidget.oo-ui-optionWidget-pressed.oo-ui-menuOptionWidget.oo-ui-optionWidget-highlighted {
1596 background-color: rgba(41, 98, 204, 0.1);
1597 color: #36c;
1598 }
1599 .oo-ui-menuSectionOptionWidget {
1600 color: #72777d;
1601 padding: 0.703125em 0.9375em 0.3125em;
1602 font-weight: bold;
1603 }
1604 .oo-ui-menuSectionOptionWidget.oo-ui-widget-enabled {
1605 cursor: default;
1606 }
1607 .oo-ui-menuSectionOptionWidget ~ .oo-ui-menuOptionWidget {
1608 padding-left: 1.875em;
1609 }
1610 .oo-ui-menuSectionOptionWidget ~ .oo-ui-menuOptionWidget.oo-ui-iconElement {
1611 padding-left: 3.90625em;
1612 }
1613 .oo-ui-menuSectionOptionWidget ~ .oo-ui-menuOptionWidget.oo-ui-iconElement .oo-ui-iconElement-icon {
1614 left: 1.875em;
1615 }
1616 .oo-ui-dropdownWidget {
1617 display: inline-block;
1618 position: relative;
1619 width: 100%;
1620 max-width: 50em;
1621 margin-right: 0.5em;
1622 }
1623 .oo-ui-dropdownWidget-handle {
1624 position: relative;
1625 width: 100%;
1626 display: block;
1627 white-space: nowrap;
1628 overflow: hidden;
1629 text-overflow: ellipsis;
1630 cursor: default;
1631 -webkit-touch-callout: none;
1632 -webkit-user-select: none;
1633 -moz-user-select: none;
1634 -ms-user-select: none;
1635 user-select: none;
1636 -webkit-box-sizing: border-box;
1637 -moz-box-sizing: border-box;
1638 box-sizing: border-box;
1639 }
1640 .oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle {
1641 cursor: pointer;
1642 }
1643 .oo-ui-dropdownWidget:last-child {
1644 margin-right: 0;
1645 }
1646 .oo-ui-dropdownWidget-handle {
1647 min-height: 2.5em;
1648 border: 1px solid #a2a9b1;
1649 border-radius: 2px;
1650 padding: 0.625em 0.9375em 0.546875em;
1651 line-height: 1;
1652 }
1653 .oo-ui-dropdownWidget-handle .oo-ui-iconElement-icon {
1654 left: 0.46875em;
1655 }
1656 .oo-ui-dropdownWidget-handle .oo-ui-indicatorElement-indicator {
1657 right: 0.9375em;
1658 }
1659 .oo-ui-dropdownWidget-handle .oo-ui-labelElement-label {
1660 line-height: 1.172em;
1661 }
1662 .oo-ui-dropdownWidget.oo-ui-iconElement .oo-ui-dropdownWidget-handle {
1663 padding-left: 2.5em;
1664 }
1665 .oo-ui-dropdownWidget.oo-ui-indicatorElement .oo-ui-dropdownWidget-handle {
1666 padding-right: 1.875em;
1667 }
1668 .oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle {
1669 background-color: #f8f9fa;
1670 color: #222;
1671 -webkit-transition: background-color 100ms, border-color 100ms, box-shadow 100ms;
1672 -moz-transition: background-color 100ms, border-color 100ms, box-shadow 100ms;
1673 transition: background-color 100ms, border-color 100ms, box-shadow 100ms;
1674 }
1675 .oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle:hover {
1676 background-color: #fff;
1677 color: #444;
1678 border-color: #a2a9b1;
1679 }
1680 .oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle:hover .oo-ui-iconElement-icon,
1681 .oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle:hover .oo-ui-indicatorElement-indicator {
1682 opacity: 0.73;
1683 }
1684 .oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle:active {
1685 color: #000;
1686 border-color: #72777d;
1687 }
1688 .oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle:focus {
1689 border-color: #36c;
1690 outline: 0;
1691 box-shadow: inset 0 0 0 1px #36c;
1692 }
1693 .oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle .oo-ui-iconElement-icon,
1694 .oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle .oo-ui-indicatorElement-indicator {
1695 opacity: 0.87;
1696 -webkit-transition: opacity 100ms;
1697 -moz-transition: opacity 100ms;
1698 transition: opacity 100ms;
1699 }
1700 .oo-ui-dropdownWidget.oo-ui-widget-enabled.oo-ui-dropdownWidget-open .oo-ui-dropdownWidget-handle {
1701 background-color: #fff;
1702 }
1703 .oo-ui-dropdownWidget.oo-ui-widget-enabled.oo-ui-dropdownWidget-open .oo-ui-dropdownWidget-handle .oo-ui-iconElement-icon,
1704 .oo-ui-dropdownWidget.oo-ui-widget-enabled.oo-ui-dropdownWidget-open .oo-ui-dropdownWidget-handle .oo-ui-indicatorElement-indicator {
1705 opacity: 1;
1706 }
1707 .oo-ui-dropdownWidget.oo-ui-widget-disabled .oo-ui-dropdownWidget-handle {
1708 color: #72777d;
1709 text-shadow: 0 1px 1px #fff;
1710 border-color: #c8ccd1;
1711 background-color: #eaecf0;
1712 }
1713 .oo-ui-dropdownWidget.oo-ui-widget-disabled .oo-ui-dropdownWidget-handle:focus {
1714 outline: 0;
1715 }
1716 .oo-ui-dropdownWidget.oo-ui-widget-disabled .oo-ui-dropdownWidget-handle .oo-ui-indicatorElement-indicator {
1717 opacity: 0.15;
1718 }
1719 .oo-ui-comboBoxInputWidget {
1720 display: inline-block;
1721 position: relative;
1722 }
1723 .oo-ui-comboBoxInputWidget-field {
1724 display: table;
1725 width: 100%;
1726 table-layout: fixed;
1727 }
1728 .oo-ui-comboBoxInputWidget .oo-ui-inputWidget-input {
1729 display: table-cell;
1730 vertical-align: middle;
1731 position: relative;
1732 overflow: hidden;
1733 }
1734 .oo-ui-comboBoxInputWidget-dropdownButton {
1735 display: table-cell;
1736 }
1737 .oo-ui-comboBoxInputWidget-dropdownButton > .oo-ui-buttonElement-button {
1738 display: block;
1739 overflow: hidden;
1740 }
1741 .oo-ui-comboBoxInputWidget.oo-ui-comboBoxInputWidget-empty .oo-ui-comboBoxInputWidget-dropdownButton {
1742 display: none;
1743 }
1744 .oo-ui-comboBoxInputWidget-php ::-webkit-calendar-picker-indicator {
1745 opacity: 0;
1746 position: absolute;
1747 right: 0;
1748 top: 0;
1749 width: 2.5em;
1750 height: 2.5em;
1751 padding: 0;
1752 }
1753 .oo-ui-comboBoxInputWidget-php > .oo-ui-indicatorWidget {
1754 display: block;
1755 position: absolute;
1756 top: 0;
1757 height: 100%;
1758 pointer-events: none;
1759 }
1760 .oo-ui-comboBoxInputWidget input {
1761 height: 2.5em;
1762 border-top-right-radius: 0;
1763 border-bottom-right-radius: 0;
1764 border-right-width: 0;
1765 }
1766 .oo-ui-comboBoxInputWidget.oo-ui-comboBoxInputWidget-empty input,
1767 .oo-ui-comboBoxInputWidget-php input {
1768 border-top-right-radius: 2px;
1769 border-bottom-right-radius: 2px;
1770 border-right-width: 1px;
1771 }
1772 .oo-ui-comboBoxInputWidget-dropdownButton.oo-ui-indicatorElement {
1773 width: 2.5em;
1774 }
1775 .oo-ui-comboBoxInputWidget-dropdownButton.oo-ui-indicatorElement .oo-ui-buttonElement-button {
1776 min-width: 2.5em;
1777 min-height: 2.5em;
1778 padding-left: 0;
1779 }
1780 .oo-ui-comboBoxInputWidget-dropdownButton.oo-ui-indicatorElement .oo-ui-buttonElement-button > .oo-ui-indicatorElement-indicator {
1781 right: 0.703125em;
1782 }
1783 .oo-ui-comboBoxInputWidget-dropdownButton.oo-ui-indicatorElement .oo-ui-buttonElement-button,
1784 .oo-ui-comboBoxInputWidget-dropdownButton.oo-ui-indicatorElement .oo-ui-buttonElement-button:focus {
1785 border-top-left-radius: 0;
1786 border-bottom-left-radius: 0;
1787 }
1788 .oo-ui-comboBoxInputWidget-php .oo-ui-indicatorWidget.oo-ui-indicatorElement.oo-ui-indicatorElement-indicator {
1789 display: block;
1790 position: absolute;
1791 top: 0;
1792 height: 100%;
1793 right: 0.9375em;
1794 margin: 0;
1795 }
1796 .oo-ui-comboBoxInputWidget-open .oo-ui-comboBoxInputWidget-dropdownButton > .oo-ui-buttonElement-button {
1797 background-color: #fff;
1798 }
1799 .oo-ui-comboBoxInputWidget-open .oo-ui-comboBoxInputWidget-dropdownButton > .oo-ui-buttonElement-button .oo-ui-indicatorElement-indicator {
1800 opacity: 1;
1801 }
1802 .oo-ui-comboBoxInputWidget.oo-ui-widget-disabled .oo-ui-indicatorElement-indicator {
1803 opacity: 1;
1804 }
1805 .oo-ui-multioptionWidget {
1806 position: relative;
1807 display: block;
1808 }
1809 .oo-ui-multioptionWidget.oo-ui-widget-enabled {
1810 cursor: pointer;
1811 }
1812 .oo-ui-multioptionWidget.oo-ui-widget-disabled {
1813 cursor: default;
1814 }
1815 .oo-ui-multioptionWidget.oo-ui-labelElement .oo-ui-labelElement-label {
1816 display: block;
1817 white-space: nowrap;
1818 text-overflow: ellipsis;
1819 overflow: hidden;
1820 }
1821 .oo-ui-multioptionWidget.oo-ui-widget-disabled {
1822 color: #72777d;
1823 }
1824 .oo-ui-checkboxMultioptionWidget {
1825 display: table;
1826 width: 100%;
1827 padding: 0.3125em 0;
1828 }
1829 .oo-ui-checkboxMultioptionWidget .oo-ui-checkboxInputWidget,
1830 .oo-ui-checkboxMultioptionWidget.oo-ui-labelElement > .oo-ui-labelElement-label {
1831 display: table-cell;
1832 vertical-align: middle;
1833 }
1834 .oo-ui-checkboxMultioptionWidget .oo-ui-checkboxInputWidget {
1835 width: 1px;
1836 }
1837 .oo-ui-checkboxMultioptionWidget.oo-ui-labelElement > .oo-ui-labelElement-label {
1838 white-space: normal;
1839 }
1840 .oo-ui-checkboxMultioptionWidget.oo-ui-labelElement .oo-ui-labelElement-label {
1841 padding-left: 0.46875em;
1842 }
1843 .oo-ui-checkboxMultioptionWidget .oo-ui-checkboxInputWidget {
1844 margin-right: 0;
1845 }
1846 .oo-ui-progressBarWidget {
1847 -webkit-box-sizing: border-box;
1848 -moz-box-sizing: border-box;
1849 box-sizing: border-box;
1850 max-width: 50em;
1851 background-color: #fff;
1852 border: 1px solid #a2a9b1;
1853 border-radius: 2px;
1854 overflow: hidden;
1855 }
1856 .oo-ui-progressBarWidget-bar {
1857 height: 1em;
1858 -webkit-transition: width 200ms;
1859 -moz-transition: width 200ms;
1860 transition: width 200ms;
1861 }
1862 .oo-ui-progressBarWidget-indeterminate .oo-ui-progressBarWidget-bar {
1863 -webkit-animation: oo-ui-progressBarWidget-slide 2s infinite linear;
1864 -moz-animation: oo-ui-progressBarWidget-slide 2s infinite linear;
1865 animation: oo-ui-progressBarWidget-slide 2s infinite linear;
1866 width: 40%;
1867 -webkit-transform: translate(-25%);
1868 -moz-transform: translate(-25%);
1869 -ms-transform: translate(-25%);
1870 transform: translate(-25%);
1871 border-left-width: 1px;
1872 }
1873 .oo-ui-progressBarWidget.oo-ui-widget-enabled .oo-ui-progressBarWidget-bar {
1874 background-color: #36c;
1875 }
1876 .oo-ui-progressBarWidget.oo-ui-widget-disabled .oo-ui-progressBarWidget-bar {
1877 background-color: #c8ccd1;
1878 }
1879 @-webkit-keyframes oo-ui-progressBarWidget-slide {
1880 from {
1881 -webkit-transform: translate(-100%);
1882 -moz-transform: translate(-100%);
1883 -ms-transform: translate(-100%);
1884 transform: translate(-100%);
1885 }
1886 to {
1887 -webkit-transform: translate(350%);
1888 -moz-transform: translate(350%);
1889 -ms-transform: translate(350%);
1890 transform: translate(350%);
1891 }
1892 }
1893 @-moz-keyframes oo-ui-progressBarWidget-slide {
1894 from {
1895 -webkit-transform: translate(-100%);
1896 -moz-transform: translate(-100%);
1897 -ms-transform: translate(-100%);
1898 transform: translate(-100%);
1899 }
1900 to {
1901 -webkit-transform: translate(350%);
1902 -moz-transform: translate(350%);
1903 -ms-transform: translate(350%);
1904 transform: translate(350%);
1905 }
1906 }
1907 @keyframes oo-ui-progressBarWidget-slide {
1908 from {
1909 -webkit-transform: translate(-100%);
1910 -moz-transform: translate(-100%);
1911 -ms-transform: translate(-100%);
1912 transform: translate(-100%);
1913 }
1914 to {
1915 -webkit-transform: translate(350%);
1916 -moz-transform: translate(350%);
1917 -ms-transform: translate(350%);
1918 transform: translate(350%);
1919 }
1920 }
1921 .oo-ui-defaultOverlay {
1922 position: absolute;
1923 top: 0;
1924 /* @noflip */
1925 left: 0;
1926 }