resources/lib/ooui/oojs-ui-toolbars-wikimediaui.css

   1 /*!
   2  * OOUI v0.32.0
   3  * https://www.mediawiki.org/wiki/OOUI
   4  *
   5  * Copyright 2011–2019 OOUI Team and other contributors.
   6  * Released under the MIT license
   7  * http://oojs.mit-license.org
   8  *
   9  * Date: 2019-05-29T00:38:49Z
  10  */
  11 .oo-ui-tool {
  12   -webkit-box-sizing: border-box;
  13   -moz-box-sizing: border-box;
  14   box-sizing: border-box;
  15 }
  16 .oo-ui-tool > .oo-ui-tool-link > .oo-ui-tool-checkIcon {
  17   display: none;
  18 }
  19 .oo-ui-tool .oo-ui-tool-link {
  20   position: relative;
  21   -webkit-box-sizing: border-box;
  22   -moz-box-sizing: border-box;
  23   box-sizing: border-box;
  24   padding-top: 3em;
  25   padding-left: 3em;
  26 }
  27 .oo-ui-toolbar-narrow .oo-ui-tool .oo-ui-tool-link {
  28   padding-left: 2.85714286em;
  29 }
  30 .oo-ui-tool.oo-ui-tool-with-label .oo-ui-tool-link {
  31   padding: 0.85714286em 0.85714286em 0.85714286em 0.85714286em;
  32 }
  33 .oo-ui-tool.oo-ui-tool-with-icon.oo-ui-tool-with-label .oo-ui-tool-link {
  34   padding: 0.85714286em 0.85714286em 0.85714286em 2.64285714em;
  35 }
  36 .oo-ui-tool .oo-ui-iconElement-icon {
  37   display: block;
  38   left: 0.78571429em;
  39 }
  40 .oo-ui-toolbar-narrow .oo-ui-tool .oo-ui-iconElement-icon {
  41   left: 0.71428571em;
  42 }
  43 .oo-ui-tool .oo-ui-tool-title {
  44   line-height: 1.28571429em;
  45 }
  46 .oo-ui-tool.oo-ui-widget-enabled .oo-ui-tool-link {
  47   -webkit-transition: background-color 100ms;
  48   -moz-transition: background-color 100ms;
  49   transition: background-color 100ms;
  50 }
  51 .oo-ui-tool.oo-ui-widget-enabled .oo-ui-tool-link:focus {
  52   outline: 1px solid #36c;
  53   box-shadow: inset 0 0 0 1px #36c;
  54   z-index: 1;
  55 }
  56 .oo-ui-tool.oo-ui-widget-enabled .oo-ui-iconElement-icon {
  57   opacity: 0.87;
  58   -webkit-transition: opacity 100ms;
  59   -moz-transition: opacity 100ms;
  60   transition: opacity 100ms;
  61   -webkit-transform: translateZ(0);
  62   transform: translateZ(0);
  63 }
  64 .oo-ui-tool.oo-ui-widget-enabled .oo-ui-tool-title {
  65   -webkit-transition: color 100ms;
  66   -moz-transition: color 100ms;
  67   transition: color 100ms;
  68 }
  69 .oo-ui-tool.oo-ui-widget-enabled:hover .oo-ui-iconElement-icon {
  70   opacity: 1;
  71 }
  72 .oo-ui-tool.oo-ui-widget-enabled[class*='oo-ui-flaggedElement'] .oo-ui-iconElement-icon {
  73   opacity: 1;
  74 }
  75 .oo-ui-tool.oo-ui-widget-enabled > .oo-ui-tool-link {
  76   color: inherit;
  77 }
  78 .oo-ui-tool.oo-ui-widget-enabled > .oo-ui-tool-link:hover {
  79   background-color: #eaecf0;
  80 }
  81 .oo-ui-tool.oo-ui-widget-enabled > .oo-ui-tool-link:active,
  82 .oo-ui-tool.oo-ui-widget-enabled > .oo-ui-tool-link:active:focus,
  83 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-tool-active > .oo-ui-tool-link,
  84 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-popupToolGroup-active > .oo-ui-tool-link {
  85   background-color: #eff3fa;
  86   color: #36c;
  87   box-shadow: none;
  88 }
  89 .oo-ui-tool.oo-ui-widget-enabled > .oo-ui-tool-link:focus {
  90   outline: 1px solid #36c;
  91   box-shadow: inset 0 0 0 1px #36c;
  92 }
  93 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-tool-link {
  94   color: #36c;
  95 }
  96 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-tool-link:hover {
  97   background-color: #eaecf0;
  98 }
  99 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-tool-link:active,
 100 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-tool-link:active:focus,
 101 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive.oo-ui-tool-active > .oo-ui-tool-link,
 102 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive.oo-ui-popupToolGroup-active > .oo-ui-tool-link {
 103   background-color: #eff3fa;
 104   color: #2a4b8d;
 105   box-shadow: none;
 106 }
 107 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-tool-link:focus {
 108   outline: 1px solid #36c;
 109   box-shadow: inset 0 0 0 1px #36c;
 110 }
 111 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive > .oo-ui-tool-link {
 112   color: #d73333;
 113 }
 114 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive > .oo-ui-tool-link:hover {
 115   background-color: #eaecf0;
 116 }
 117 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive > .oo-ui-tool-link:active,
 118 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive > .oo-ui-tool-link:active:focus,
 119 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive.oo-ui-tool-active > .oo-ui-tool-link,
 120 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive.oo-ui-popupToolGroup-active > .oo-ui-tool-link {
 121   background-color: #ffffff;
 122   color: #b32424;
 123   box-shadow: none;
 124 }
 125 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive > .oo-ui-tool-link:focus {
 126   outline: 1px solid #d33;
 127   box-shadow: inset 0 0 0 1px #d33;
 128 }
 129 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-tool-link {
 130   color: #fff;
 131   background-color: #36c;
 132 }
 133 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-tool-link:hover {
 134   background-color: #447ff5;
 135 }
 136 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-tool-link:active,
 137 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-tool-link:active:focus,
 138 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-tool-active > .oo-ui-tool-link {
 139   color: #fff;
 140   background-color: #2a4b8d;
 141   box-shadow: none;
 142 }
 143 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-tool-link:focus {
 144   outline: 1px solid #36c;
 145   box-shadow: inset 0 0 0 1px #36c, inset 0 0 0 2px #fff;
 146 }
 147 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-widget-disabled > .oo-ui-tool-link,
 148 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-widget-disabled > .oo-ui-tool-link:active,
 149 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-widget-disabled > .oo-ui-tool-link:active:focus {
 150   background-color: #c8ccd1;
 151   color: #fff;
 152 }
 153 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive > .oo-ui-tool-link {
 154   color: #fff;
 155   background-color: #d33;
 156 }
 157 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive > .oo-ui-tool-link:hover {
 158   background-color: #ff4242;
 159 }
 160 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive > .oo-ui-tool-link:active,
 161 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive > .oo-ui-tool-link:active:focus,
 162 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive.oo-ui-tool-active > .oo-ui-tool-link {
 163   color: #fff;
 164   background-color: #b32424;
 165   box-shadow: none;
 166 }
 167 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive > .oo-ui-tool-link:focus {
 168   outline: 1px solid #d33;
 169   box-shadow: inset 0 0 0 1px #d33, inset 0 0 0 2px #fff;
 170 }
 171 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive.oo-ui-widget-disabled > .oo-ui-tool-link,
 172 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive.oo-ui-widget-disabled > .oo-ui-tool-link:active,
 173 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive.oo-ui-widget-disabled > .oo-ui-tool-link:active:focus {
 174   background-color: #c8ccd1;
 175   color: #fff;
 176 }
 177 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary > .oo-ui-tool-link > .oo-ui-iconElement-icon,
 178 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary > .oo-ui-tool-link > .oo-ui-indicatorElement-indicator {
 179   opacity: 1;
 180 }
 181
 182 .oo-ui-popupTool-popup.oo-ui-popupWidget {
 183   z-index: 4;
 184 }
 185
 186 .oo-ui-toolGroupTool > .oo-ui-toolGroup {
 187   border-right: 0;
 188 }
 189
 190 .oo-ui-toolGroup {
 191   display: inline-block;
 192   vertical-align: middle;
 193   -webkit-box-sizing: border-box;
 194   -moz-box-sizing: border-box;
 195   box-sizing: border-box;
 196   border-right: 1px solid #eaecf0;
 197 }
 198 .oo-ui-toolGroup-empty {
 199   display: none;
 200 }
 201 .oo-ui-toolGroup-tools .oo-ui-tool-link {
 202   text-decoration: none;
 203   cursor: pointer;
 204 }
 205 .oo-ui-toolGroup-tools.oo-ui-toolGroup-disabled-tools .oo-ui-tool-link,
 206 .oo-ui-toolGroup-tools .oo-ui-widget-disabled > .oo-ui-tool-link {
 207   outline: 0;
 208   cursor: default;
 209 }
 210 .oo-ui-toolbar-actions .oo-ui-toolGroup {
 211   border-right: 0;
 212   border-left: 1px solid #eaecf0;
 213 }
 214 .oo-ui-toolbar-actions .oo-ui-toolGroup.oo-ui-barToolGroup {
 215   border-right-width: 0;
 216 }
 217 .oo-ui-toolGroup.oo-ui-widget-disabled:not( .oo-ui-flaggedElement-primary ) .oo-ui-indicatorElement-indicator,
 218 .oo-ui-toolGroup.oo-ui-widget-disabled:not( .oo-ui-flaggedElement-primary ) .oo-ui-iconElement-icon {
 219   opacity: 0.34 !important;
 220 }
 221
 222 .oo-ui-barToolGroup-tools > .oo-ui-tool {
 223   display: inline-block;
 224   position: relative;
 225   vertical-align: top;
 226 }
 227 .oo-ui-barToolGroup-tools > .oo-ui-tool > .oo-ui-tool-link {
 228   display: block;
 229 }
 230 .oo-ui-barToolGroup-tools > .oo-ui-tool > .oo-ui-tool-link .oo-ui-tool-accel {
 231   display: none;
 232 }
 233 .oo-ui-barToolGroup-tools > .oo-ui-tool.oo-ui-iconElement > .oo-ui-tool-link .oo-ui-tool-title {
 234   display: none;
 235 }
 236 .oo-ui-barToolGroup-tools > .oo-ui-tool.oo-ui-iconElement.oo-ui-tool-with-label > .oo-ui-tool-link .oo-ui-tool-title {
 237   display: inline-block;
 238 }
 239 .oo-ui-barToolGroup-tools > .oo-ui-tool + .oo-ui-tool {
 240   margin-left: -2px;
 241 }
 242 .oo-ui-barToolGroup-tools.oo-ui-toolGroup-enabled-tools .oo-ui-tool.oo-ui-widget-disabled .oo-ui-iconElement-icon,
 243 .oo-ui-barToolGroup-tools.oo-ui-toolGroup-disabled-tools .oo-ui-tool .oo-ui-iconElement-icon {
 244   opacity: 0.34;
 245 }
 246 .oo-ui-barToolGroup-tools.oo-ui-toolGroup-enabled-tools .oo-ui-tool.oo-ui-widget-disabled.oo-ui-flaggedElement-primary > .oo-ui-tool-link,
 247 .oo-ui-barToolGroup-tools.oo-ui-toolGroup-disabled-tools .oo-ui-tool.oo-ui-flaggedElement-primary > .oo-ui-tool-link {
 248   background-color: #c8ccd1;
 249   border-color: #c8ccd1;
 250 }
 251 .oo-ui-barToolGroup-tools.oo-ui-toolGroup-enabled-tools .oo-ui-tool.oo-ui-widget-disabled.oo-ui-flaggedElement-primary > .oo-ui-tool-link .oo-ui-tool-title,
 252 .oo-ui-barToolGroup-tools.oo-ui-toolGroup-disabled-tools .oo-ui-tool.oo-ui-flaggedElement-primary > .oo-ui-tool-link .oo-ui-tool-title {
 253   color: #fff;
 254 }
 255 .oo-ui-barToolGroup-tools.oo-ui-toolGroup-enabled-tools .oo-ui-tool.oo-ui-widget-disabled.oo-ui-flaggedElement-primary.oo-ui-tool-active > .oo-ui-tool-link,
 256 .oo-ui-barToolGroup-tools.oo-ui-toolGroup-disabled-tools .oo-ui-tool.oo-ui-flaggedElement-primary.oo-ui-tool-active > .oo-ui-tool-link {
 257   background-color: #919fb9;
 258 }
 259 .oo-ui-barToolGroup-tools.oo-ui-toolGroup-enabled-tools .oo-ui-tool.oo-ui-widget-disabled.oo-ui-flaggedElement-primary .oo-ui-iconElement-icon,
 260 .oo-ui-barToolGroup-tools.oo-ui-toolGroup-disabled-tools .oo-ui-tool.oo-ui-flaggedElement-primary .oo-ui-iconElement-icon {
 261   opacity: 1;
 262 }
 263 .oo-ui-barToolGroup-tools.oo-ui-toolGroup-enabled-tools .oo-ui-tool.oo-ui-widget-disabled > .oo-ui-tool-link .oo-ui-tool-title,
 264 .oo-ui-barToolGroup-tools.oo-ui-toolGroup-disabled-tools .oo-ui-tool > .oo-ui-tool-link .oo-ui-tool-title {
 265   color: #72777d;
 266 }
 267
 268 .oo-ui-popupToolGroup {
 269   position: relative;
 270   min-width: 3em;
 271 }
 272 .oo-ui-popupToolGroup-handle {
 273   display: block;
 274   cursor: pointer;
 275 }
 276 .oo-ui-popupToolGroup-handle .oo-ui-labelElement-label:not( :empty ) {
 277   display: inline-block;
 278 }
 279 .oo-ui-popupToolGroup.oo-ui-widget-disabled .oo-ui-popupToolGroup-handle {
 280   outline: 0;
 281   cursor: default;
 282 }
 283 .oo-ui-popupToolGroup-tools {
 284   display: none;
 285   position: absolute;
 286   z-index: 4;
 287 }
 288 .oo-ui-popupToolGroup-tools.oo-ui-popupToolGroup-active-tools {
 289   display: block;
 290 }
 291 .oo-ui-popupToolGroup-tools .oo-ui-tool-link {
 292   display: table;
 293   width: 100%;
 294   vertical-align: middle;
 295   white-space: nowrap;
 296 }
 297 .oo-ui-popupToolGroup-tools .oo-ui-tool-link .oo-ui-tool-accel,
 298 .oo-ui-popupToolGroup-tools .oo-ui-tool-link .oo-ui-tool-title {
 299   display: table-cell;
 300   vertical-align: middle;
 301 }
 302 .oo-ui-popupToolGroup-tools .oo-ui-tool-link .oo-ui-tool-accel {
 303   text-align: right;
 304 }
 305 .oo-ui-toolbar-narrow .oo-ui-popupToolGroup {
 306   min-width: 2.85714286em;
 307 }
 308 .oo-ui-popupToolGroup.oo-ui-indicatorElement:not( .oo-ui-labelElement ):not( .oo-ui-iconElement ) {
 309   min-width: 1.85714286em;
 310 }
 311 .oo-ui-popupToolGroup-handle {
 312   -webkit-box-sizing: border-box;
 313   -moz-box-sizing: border-box;
 314   box-sizing: border-box;
 315 }
 316 .oo-ui-popupToolGroup-handle .oo-ui-iconElement-icon {
 317   left: 0.78571429em;
 318 }
 319 .oo-ui-toolbar-narrow .oo-ui-popupToolGroup-handle .oo-ui-iconElement-icon {
 320   left: 0.64285714em;
 321 }
 322 .oo-ui-popupToolGroup-handle .oo-ui-indicatorElement-indicator {
 323   background-position: center 52%;
 324   right: 0.57142857em;
 325 }
 326 .oo-ui-toolbar-narrow .oo-ui-popupToolGroup-handle .oo-ui-indicatorElement-indicator {
 327   right: 0.28571429em;
 328 }
 329 .oo-ui-popupToolGroup.oo-ui-iconElement .oo-ui-popupToolGroup-handle,
 330 .oo-ui-popupToolGroup.oo-ui-indicatorElement .oo-ui-popupToolGroup-handle {
 331   padding-top: 3em;
 332 }
 333 .oo-ui-popupToolGroup.oo-ui-iconElement.oo-ui-indicatorElement .oo-ui-popupToolGroup-handle {
 334   padding-left: 3em;
 335 }
 336 .oo-ui-toolbar-narrow .oo-ui-popupToolGroup.oo-ui-iconElement.oo-ui-indicatorElement .oo-ui-popupToolGroup-handle {
 337   padding-left: 2.85714286em;
 338 }
 339 .oo-ui-popupToolGroup.oo-ui-labelElement .oo-ui-popupToolGroup-handle {
 340   padding: 0.85714286em 0.85714286em;
 341 }
 342 .oo-ui-popupToolGroup.oo-ui-labelElement .oo-ui-popupToolGroup-handle .oo-ui-labelElement-label {
 343   line-height: 1.28571429em;
 344 }
 345 .oo-ui-toolbar-narrow .oo-ui-popupToolGroup.oo-ui-labelElement .oo-ui-popupToolGroup-handle {
 346   padding-left: 0.71428571em;
 347   padding-right: 0.71428571em;
 348 }
 349 .oo-ui-popupToolGroup.oo-ui-iconElement.oo-ui-labelElement .oo-ui-popupToolGroup-handle {
 350   padding-left: 2.64285714em;
 351 }
 352 .oo-ui-toolbar-narrow .oo-ui-popupToolGroup.oo-ui-iconElement.oo-ui-labelElement .oo-ui-popupToolGroup-handle {
 353   padding-left: 2.5em;
 354 }
 355 .oo-ui-popupToolGroup.oo-ui-labelElement.oo-ui-indicatorElement .oo-ui-popupToolGroup-handle {
 356   padding-right: 1.85714286em;
 357 }
 358 .oo-ui-toolbar-narrow .oo-ui-popupToolGroup.oo-ui-labelElement.oo-ui-indicatorElement .oo-ui-popupToolGroup-handle {
 359   padding-right: 1.28571429em;
 360 }
 361 .oo-ui-popupToolGroup.oo-ui-indicatorElement .oo-ui-popupToolGroup-handle {
 362   padding-right: 1.14285714em;
 363 }
 364 .oo-ui-toolbar-narrow .oo-ui-popupToolGroup.oo-ui-indicatorElement .oo-ui-popupToolGroup-handle {
 365   padding-right: 0.85714286em;
 366 }
 367 .oo-ui-popupToolGroup:not( .oo-ui-labelElement ):not( .oo-ui-iconElement ) .oo-ui-indicatorElement-indicator {
 368   opacity: 1;
 369 }
 370 .oo-ui-popupToolGroup-header {
 371   color: #72777d;
 372   padding: 0 0.85714286em;
 373   font-weight: bold;
 374   line-height: 2.28571429em;
 375 }
 376 .oo-ui-toolbar-narrow .oo-ui-popupToolGroup-header {
 377   padding: 0 0.71428571em;
 378 }
 379 .oo-ui-popupToolGroup-tools {
 380   background-color: #fff;
 381   min-width: 16em;
 382   margin: 0 -1px;
 383   border: 1px solid #c8ccd1;
 384   box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.25);
 385 }
 386 .oo-ui-popupToolGroup-tools .oo-ui-tool-link {
 387   padding: 0.85714286em 0.85714286em;
 388 }
 389 .oo-ui-toolbar-narrow .oo-ui-popupToolGroup-tools .oo-ui-tool-link {
 390   padding-left: 0.71428571em;
 391   padding-right: 0.71428571em;
 392 }
 393 .oo-ui-popupToolGroup-tools .oo-ui-tool-link .oo-ui-tool-accel {
 394   color: #72777d;
 395   line-height: 1.28571429em;
 396 }
 397 .oo-ui-popupToolGroup-tools .oo-ui-tool-link .oo-ui-tool-accel:not( :empty ) {
 398   padding-left: 1.28571429em;
 399 }
 400 .oo-ui-toolbar-narrow .oo-ui-popupToolGroup-tools .oo-ui-tool-link .oo-ui-tool-accel:not( :empty ) {
 401   padding-left: 1.14285714em;
 402 }
 403 .oo-ui-popupToolGroup-tools .oo-ui-iconElement .oo-ui-tool-link {
 404   padding-left: 2.64285714em;
 405 }
 406 .oo-ui-toolbar-narrow .oo-ui-popupToolGroup-tools .oo-ui-iconElement .oo-ui-tool-link {
 407   padding-left: 2.5em;
 408 }
 409 .oo-ui-popupToolGroup.oo-ui-widget-enabled > .oo-ui-popupToolGroup-handle {
 410   -webkit-transition: background-color 100ms, box-shadow 100ms;
 411   -moz-transition: background-color 100ms, box-shadow 100ms;
 412   transition: background-color 100ms, box-shadow 100ms;
 413 }
 414 .oo-ui-popupToolGroup.oo-ui-widget-enabled > .oo-ui-popupToolGroup-handle:hover {
 415   background-color: #eaecf0;
 416 }
 417 .oo-ui-popupToolGroup.oo-ui-widget-enabled > .oo-ui-popupToolGroup-handle:active {
 418   background-color: #eaf3ff;
 419 }
 420 .oo-ui-popupToolGroup.oo-ui-widget-enabled > .oo-ui-popupToolGroup-handle .oo-ui-iconElement-icon,
 421 .oo-ui-popupToolGroup.oo-ui-widget-enabled > .oo-ui-popupToolGroup-handle .oo-ui-indicatorElement-indicator {
 422   opacity: 0.87;
 423   -webkit-transition: opacity 100ms;
 424   -moz-transition: opacity 100ms;
 425   transition: opacity 100ms;
 426   -webkit-transform: translateZ(0);
 427   transform: translateZ(0);
 428 }
 429 .oo-ui-popupToolGroup.oo-ui-widget-enabled > .oo-ui-popupToolGroup-handle:hover .oo-ui-iconElement-icon,
 430 .oo-ui-popupToolGroup.oo-ui-widget-enabled > .oo-ui-popupToolGroup-handle:active .oo-ui-iconElement-icon,
 431 .oo-ui-popupToolGroup.oo-ui-widget-enabled > .oo-ui-popupToolGroup-handle:hover .oo-ui-indicatorElement-indicator,
 432 .oo-ui-popupToolGroup.oo-ui-widget-enabled > .oo-ui-popupToolGroup-handle:active .oo-ui-indicatorElement-indicator {
 433   opacity: 1;
 434 }
 435 .oo-ui-popupToolGroup.oo-ui-widget-enabled > .oo-ui-popupToolGroup-handle:focus {
 436   outline: 1px solid #36c;
 437   box-shadow: inset 0 0 0 1px #36c;
 438 }
 439 .oo-ui-popupToolGroup.oo-ui-widget-enabled[class*='oo-ui-flaggedElement'] > .oo-ui-popupToolGroup-handle .oo-ui-iconElement-icon,
 440 .oo-ui-popupToolGroup.oo-ui-widget-enabled[class*='oo-ui-flaggedElement'] > .oo-ui-popupToolGroup-handle:hover .oo-ui-iconElement-icon {
 441   opacity: 1;
 442 }
 443 .oo-ui-toolbar-actions .oo-ui-popupToolGroup.oo-ui-widget-enabled > .oo-ui-popupToolGroup-handle {
 444   border-right: 1px solid transparent;
 445   -webkit-transition: background-color 100ms, border-color 100ms, box-shadow 100ms;
 446   -moz-transition: background-color 100ms, border-color 100ms, box-shadow 100ms;
 447   transition: background-color 100ms, border-color 100ms, box-shadow 100ms;
 448 }
 449 .oo-ui-toolbar-actions .oo-ui-popupToolGroup.oo-ui-widget-enabled > .oo-ui-popupToolGroup-handle:hover {
 450   border-right-color: #eaecf0;
 451 }
 452 .oo-ui-toolbar-actions .oo-ui-popupToolGroup.oo-ui-widget-enabled > .oo-ui-popupToolGroup-handle:active {
 453   border-right-color: #eaf3ff;
 454 }
 455 .oo-ui-toolbar-actions .oo-ui-popupToolGroup.oo-ui-widget-enabled > .oo-ui-popupToolGroup-handle:focus {
 456   border-right-color: #36c;
 457 }
 458 .oo-ui-popupToolGroup.oo-ui-popupToolGroup-active > .oo-ui-popupToolGroup-handle {
 459   background-color: #eaf3ff;
 460   color: #36c;
 461 }
 462 .oo-ui-popupToolGroup.oo-ui-popupToolGroup-active > .oo-ui-popupToolGroup-handle:hover {
 463   background-color: rgba(41, 98, 204, 0.1);
 464   color: #36c;
 465 }
 466 .oo-ui-popupToolGroup-tools .oo-ui-tool-active.oo-ui-widget-enabled .oo-ui-tool-link .oo-ui-tool-title {
 467   color: #36c;
 468 }
 469 .oo-ui-popupToolGroup-tools .oo-ui-tool.oo-ui-widget-enabled .oo-ui-tool-link:focus {
 470   outline: 0;
 471   box-shadow: inset 0 0 0 2px #36c;
 472 }
 473 .oo-ui-popupToolGroup.oo-ui-flaggedElement-progressive > .oo-ui-popupToolGroup-handle {
 474   color: #36c;
 475 }
 476 .oo-ui-popupToolGroup.oo-ui-flaggedElement-progressive > .oo-ui-popupToolGroup-handle:hover {
 477   background-color: #fff;
 478 }
 479 .oo-ui-popupToolGroup.oo-ui-flaggedElement-progressive > .oo-ui-popupToolGroup-handle:active,
 480 .oo-ui-popupToolGroup.oo-ui-flaggedElement-progressive > .oo-ui-popupToolGroup-handle:active:focus,
 481 .oo-ui-popupToolGroup.oo-ui-flaggedElement-progressive.oo-ui-tool-active > .oo-ui-popupToolGroup-handle,
 482 .oo-ui-popupToolGroup.oo-ui-flaggedElement-progressive.oo-ui-popupToolGroup-active > .oo-ui-popupToolGroup-handle {
 483   background-color: #eff3fa;
 484   color: #2a4b8d;
 485   box-shadow: none;
 486 }
 487 .oo-ui-popupToolGroup.oo-ui-flaggedElement-progressive > .oo-ui-popupToolGroup-handle:focus {
 488   outline: 1px solid #36c;
 489   box-shadow: inset 0 0 0 1px #36c;
 490 }
 491 .oo-ui-popupToolGroup.oo-ui-flaggedElement-destructive > .oo-ui-popupToolGroup-handle {
 492   color: #d73333;
 493 }
 494 .oo-ui-popupToolGroup.oo-ui-flaggedElement-destructive > .oo-ui-popupToolGroup-handle:hover {
 495   background-color: #fff;
 496 }
 497 .oo-ui-popupToolGroup.oo-ui-flaggedElement-destructive > .oo-ui-popupToolGroup-handle:active,
 498 .oo-ui-popupToolGroup.oo-ui-flaggedElement-destructive > .oo-ui-popupToolGroup-handle:active:focus,
 499 .oo-ui-popupToolGroup.oo-ui-flaggedElement-destructive.oo-ui-tool-active > .oo-ui-popupToolGroup-handle,
 500 .oo-ui-popupToolGroup.oo-ui-flaggedElement-destructive.oo-ui-popupToolGroup-active > .oo-ui-popupToolGroup-handle {
 501   background-color: #ffffff;
 502   color: #b32424;
 503   box-shadow: none;
 504 }
 505 .oo-ui-popupToolGroup.oo-ui-flaggedElement-destructive > .oo-ui-popupToolGroup-handle:focus {
 506   outline: 1px solid #d33;
 507   box-shadow: inset 0 0 0 1px #d33;
 508 }
 509 .oo-ui-popupToolGroup.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-popupToolGroup-handle {
 510   color: #fff;
 511   background-color: #36c;
 512 }
 513 .oo-ui-popupToolGroup.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-popupToolGroup-handle:hover {
 514   background-color: #447ff5;
 515 }
 516 .oo-ui-popupToolGroup.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-popupToolGroup-handle:active,
 517 .oo-ui-popupToolGroup.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-popupToolGroup-handle:active:focus,
 518 .oo-ui-popupToolGroup.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-tool-active > .oo-ui-popupToolGroup-handle {
 519   color: #fff;
 520   background-color: #2a4b8d;
 521   box-shadow: none;
 522 }
 523 .oo-ui-popupToolGroup.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-popupToolGroup-handle:focus {
 524   outline: 1px solid #36c;
 525   box-shadow: inset 0 0 0 1px #36c, inset 0 0 0 2px #fff;
 526 }
 527 .oo-ui-popupToolGroup.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-widget-disabled > .oo-ui-popupToolGroup-handle,
 528 .oo-ui-popupToolGroup.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-widget-disabled > .oo-ui-popupToolGroup-handle:active,
 529 .oo-ui-popupToolGroup.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-widget-disabled > .oo-ui-popupToolGroup-handle:active:focus {
 530   background-color: #c8ccd1;
 531   color: #fff;
 532 }
 533 .oo-ui-popupToolGroup.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive > .oo-ui-popupToolGroup-handle {
 534   color: #fff;
 535   background-color: #d33;
 536 }
 537 .oo-ui-popupToolGroup.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive > .oo-ui-popupToolGroup-handle:hover {
 538   background-color: #ff4242;
 539 }
 540 .oo-ui-popupToolGroup.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive > .oo-ui-popupToolGroup-handle:active,
 541 .oo-ui-popupToolGroup.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive > .oo-ui-popupToolGroup-handle:active:focus,
 542 .oo-ui-popupToolGroup.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive.oo-ui-tool-active > .oo-ui-popupToolGroup-handle {
 543   color: #fff;
 544   background-color: #b32424;
 545   box-shadow: none;
 546 }
 547 .oo-ui-popupToolGroup.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive > .oo-ui-popupToolGroup-handle:focus {
 548   outline: 1px solid #d33;
 549   box-shadow: inset 0 0 0 1px #d33, inset 0 0 0 2px #fff;
 550 }
 551 .oo-ui-popupToolGroup.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive.oo-ui-widget-disabled > .oo-ui-popupToolGroup-handle,
 552 .oo-ui-popupToolGroup.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive.oo-ui-widget-disabled > .oo-ui-popupToolGroup-handle:active,
 553 .oo-ui-popupToolGroup.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive.oo-ui-widget-disabled > .oo-ui-popupToolGroup-handle:active:focus {
 554   background-color: #c8ccd1;
 555   color: #fff;
 556 }
 557 .oo-ui-popupToolGroup.oo-ui-flaggedElement-primary > .oo-ui-popupToolGroup-handle > .oo-ui-iconElement-icon,
 558 .oo-ui-popupToolGroup.oo-ui-flaggedElement-primary > .oo-ui-popupToolGroup-handle > .oo-ui-indicatorElement-indicator {
 559   opacity: 1;
 560 }
 561
 562 .oo-ui-listToolGroup-tools .oo-ui-tool {
 563   display: block;
 564   -webkit-box-sizing: border-box;
 565   -moz-box-sizing: border-box;
 566   box-sizing: border-box;
 567 }
 568 .oo-ui-listToolGroup-tools .oo-ui-tool.oo-ui-widget-enabled:hover {
 569   background-color: #eaecf0;
 570   color: #000;
 571 }
 572 .oo-ui-listToolGroup-tools .oo-ui-tool-active.oo-ui-widget-enabled {
 573   background-color: #eaf3ff;
 574 }
 575 .oo-ui-listToolGroup-tools .oo-ui-tool-active.oo-ui-widget-enabled:hover {
 576   background-color: rgba(41, 98, 204, 0.1);
 577 }
 578 .oo-ui-listToolGroup-tools .oo-ui-tool-active.oo-ui-widget-enabled .oo-ui-tool-link .oo-ui-tool-title {
 579   color: #36c;
 580 }
 581 .oo-ui-listToolGroup.oo-ui-widget-disabled,
 582 .oo-ui-listToolGroup-tools .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-title {
 583   color: #72777d;
 584 }
 585
 586 .oo-ui-menuToolGroup-tools .oo-ui-tool {
 587   display: block;
 588 }
 589 .oo-ui-menuToolGroup .oo-ui-popupToolGroup-handle {
 590   min-width: 140px;
 591 }
 592 .oo-ui-toolbar-narrow .oo-ui-menuToolGroup .oo-ui-popupToolGroup-handle {
 593   min-width: 100px;
 594 }
 595 .oo-ui-menuToolGroup-tools .oo-ui-tool-link .oo-ui-iconElement-icon {
 596   left: 0.78571429em;
 597 }
 598 .oo-ui-toolbar-narrow .oo-ui-menuToolGroup-tools .oo-ui-tool-link .oo-ui-iconElement-icon {
 599   left: 0.71428571em;
 600 }
 601 .oo-ui-menuToolGroup-tools .oo-ui-tool.oo-ui-widget-enabled:hover {
 602   background-color: rgba(41, 98, 204, 0.1);
 603 }
 604 .oo-ui-menuToolGroup-tools .oo-ui-tool.oo-ui-tool-active {
 605   background-color: #eaf3ff;
 606 }
 607 .oo-ui-menuToolGroup.oo-ui-widget-disabled,
 608 .oo-ui-menuToolGroup-tools .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-title {
 609   color: #72777d;
 610 }
 611
 612 .oo-ui-toolbar {
 613   clear: both;
 614 }
 615 .oo-ui-toolbar-bar {
 616   line-height: 1;
 617   position: relative;
 618 }
 619 .oo-ui-toolbar-tools,
 620 .oo-ui-toolbar-actions {
 621   -webkit-touch-callout: none;
 622   -webkit-user-select: none;
 623   -moz-user-select: none;
 624   -ms-user-select: none;
 625   user-select: none;
 626 }
 627 .oo-ui-toolbar-tools {
 628   display: inline;
 629 }
 630 .oo-ui-toolbar-popups {
 631   position: absolute;
 632 }
 633 .oo-ui-toolbar-tools,
 634 .oo-ui-toolbar-popups {
 635   white-space: nowrap;
 636 }
 637 .oo-ui-toolbar-tools .oo-ui-tool,
 638 .oo-ui-toolbar-popups .oo-ui-tool,
 639 .oo-ui-toolbar-tools .oo-ui-popupTool-popup,
 640 .oo-ui-toolbar-popups .oo-ui-popupTool-popup {
 641   white-space: normal;
 642 }
 643 .oo-ui-toolbar-narrow .oo-ui-toolbar-tools,
 644 .oo-ui-toolbar-narrow.oo-ui-toolbar-popups {
 645   white-space: normal;
 646 }
 647 .oo-ui-toolbar-actions {
 648   float: right;
 649 }
 650 .oo-ui-toolbar-actions .oo-ui-toolbar,
 651 .oo-ui-toolbar-actions .oo-ui-buttonElement.oo-ui-labelElement > input.oo-ui-buttonElement-button,
 652 .oo-ui-toolbar-actions .oo-ui-buttonElement.oo-ui-labelElement > .oo-ui-buttonElement-button > .oo-ui-labelElement-label {
 653   display: inline-block;
 654 }
 655 .oo-ui-toolbar-actions .oo-ui-popupWidget {
 656   -webkit-touch-callout: default;
 657   -webkit-user-select: text;
 658   -moz-user-select: text;
 659   -ms-user-select: text;
 660   user-select: text;
 661 }
 662 .oo-ui-toolbar-bar {
 663   background-color: #fff;
 664   color: #222;
 665 }
 666 .oo-ui-toolbar-position-top > .oo-ui-toolbar-bar {
 667   border-bottom: 1px solid #c8ccd1;
 668   box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.1);
 669 }
 670 .oo-ui-toolbar-position-bottom > .oo-ui-toolbar-bar {
 671   border-top: 1px solid #c8ccd1;
 672   box-shadow: 0 -1px 1px 0 rgba(0, 0, 0, 0.1);
 673 }
 674 .oo-ui-toolbar-bar .oo-ui-toolbar-bar {
 675   background-color: transparent;
 676   border: 0;
 677   box-shadow: none;
 678 }
 679 .oo-ui-toolbar-narrow-bar:after {
 680   content: '';
 681   display: block;
 682   position: absolute;
 683   top: 3em;
 684   left: 0;
 685   width: 100%;
 686   height: 0;
 687 }
 688 .oo-ui-toolbar-narrow.oo-ui-toolbar-position-top .oo-ui-toolbar-bar:after {
 689   border-bottom: 1px solid #c8ccd1;
 690 }
 691 .oo-ui-toolbar-narrow.oo-ui-toolbar-position-bottom .oo-ui-toolbar-bar:after {
 692   border-top: 1px solid #c8ccd1;
 693 }