resources/lib/oojs-ui/oojs-ui-widgets-wikimediaui.css

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