[Summary view] [Print] [Text view]

   1  /*! This file is auto-generated */
   2  /* 2 column liquid layout */
   3  #wpwrap {
   4      height: auto;
   5      min-height: 100%;
   6      width: 100%;
   7      position: relative;
   8      -webkit-font-smoothing: subpixel-antialiased;
   9  }
  10  
  11  #wpcontent {
  12      height: 100%;
  13      padding-right: 20px;
  14  }
  15  
  16  #wpcontent,
  17  #wpfooter {
  18      margin-right: 160px;
  19  }
  20  
  21  .folded #wpcontent,
  22  .folded #wpfooter {
  23      margin-right: 36px;
  24  }
  25  
  26  #wpbody-content {
  27      padding-bottom: 65px;
  28      float: right;
  29      width: 100%;
  30      overflow: visible;
  31  }
  32  
  33  /* inner 2 column liquid layout */
  34  
  35  .inner-sidebar {
  36      float: left;
  37      clear: left;
  38      display: none;
  39      width: 281px;
  40      position: relative;
  41  }
  42  
  43  .columns-2 .inner-sidebar {
  44      margin-left: auto;
  45      width: 286px;
  46      display: block;
  47  }
  48  
  49  .inner-sidebar #side-sortables,
  50  .columns-2 .inner-sidebar #side-sortables {
  51      min-height: 300px;
  52      width: 280px;
  53      padding: 0;
  54  }
  55  
  56  .has-right-sidebar .inner-sidebar {
  57      display: block;
  58  }
  59  
  60  .has-right-sidebar #post-body {
  61      float: right;
  62      clear: right;
  63      width: 100%;
  64      margin-left: -2000px;
  65  }
  66  
  67  .has-right-sidebar #post-body-content {
  68      margin-left: 300px;
  69      float: none;
  70      width: auto;
  71  }
  72  
  73  /* 2 columns main area */
  74  
  75  #col-left {
  76      float: right;
  77      width: 35%;
  78  }
  79  
  80  #col-right {
  81      float: left;
  82      width: 65%;
  83  }
  84  
  85  #col-left .col-wrap {
  86      padding: 0 0 0 6px;
  87  }
  88  
  89  #col-right .col-wrap {
  90      padding: 0 6px 0 0;
  91  }
  92  
  93  /* utility classes */
  94  .alignleft {
  95      float: right;
  96  }
  97  
  98  .alignright {
  99      float: left;
 100  }
 101  
 102  .textleft {
 103      text-align: right;
 104  }
 105  
 106  .textright {
 107      text-align: left;
 108  }
 109  
 110  .clear {
 111      clear: both;
 112  }
 113  
 114  /* modern clearfix */
 115  .wp-clearfix:after {
 116      content: "";
 117      display: table;
 118      clear: both;
 119  }
 120  
 121  /* Hide visually but not from screen readers */
 122  .screen-reader-text,
 123  .screen-reader-text span,
 124  .ui-helper-hidden-accessible {
 125      border: 0;
 126      clip-path: inset(50%);
 127      height: 1px;
 128      margin: -1px;
 129      overflow: hidden;
 130      padding: 0;
 131      position: absolute;
 132      width: 1px;
 133      /* Many screen reader and browser combinations announce broken words as they would appear visually. */
 134      word-wrap: normal !important;
 135      word-break: normal !important;
 136  }
 137  
 138  .button .screen-reader-text {
 139      height: auto; /* Fixes a Safari+VoiceOver bug, see ticket #42006 */
 140  }
 141  
 142  .screen-reader-text + .dashicons-external {
 143      margin-top: -1px;
 144      margin-right: 2px;
 145      text-decoration: none;
 146  }
 147  
 148  .screen-reader-shortcut {
 149      position: absolute;
 150      top: -1000em;
 151      right: 6px;
 152      height: auto;
 153      width: auto;
 154      display: block;
 155      font-size: 14px;
 156      font-weight: 600;
 157      padding: 15px 23px 14px;
 158      /* Background and color set to prevent false positives in automated accessibility tests. */
 159      background: #ffffff;
 160      color: var(--wp-admin-theme-color, #3858e9);
 161      z-index: 100000;
 162      line-height: normal;
 163  }
 164  
 165  .screen-reader-shortcut:focus {
 166      top: -25px;
 167      /* Overrides a:focus in the admin. See ticket #56789. */
 168      color: var(--wp-admin-theme-color, #3858e9);
 169      box-shadow: 0 0 0 var(--wp-admin-border-width-focus, 1.5px) var(--wp-admin-theme-color, #3858e9);
 170      text-decoration: none;
 171      /* Only visible in Windows High Contrast mode */
 172      outline: 2px solid transparent;
 173      outline-offset: -2px;
 174  }
 175  
 176  .hidden,
 177  .js .closed .inside,
 178  .js .hide-if-js,
 179  .no-js .hide-if-no-js,
 180  .js.wp-core-ui .hide-if-js,
 181  .js .wp-core-ui .hide-if-js,
 182  .no-js.wp-core-ui .hide-if-no-js,
 183  .no-js .wp-core-ui .hide-if-no-js {
 184      display: none;
 185  }
 186  
 187  /* @todo: Take a second look. Large chunks of shared color, from the colors.css merge */
 188  .widget-top,
 189  .menu-item-handle,
 190  .widget-inside,
 191  #menu-settings-column .accordion-container,
 192  #menu-management .menu-edit,
 193  .manage-menus,
 194  table.widefat,
 195  .stuffbox,
 196  p.popular-tags,
 197  .widgets-holder-wrap,
 198  .wp-editor-container,
 199  .popular-tags,
 200  .feature-filter,
 201  .comment-ays {
 202      border: 1px solid #c3c4c7;
 203      box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
 204  }
 205  
 206  table.widefat,
 207  .wp-editor-container,
 208  .stuffbox,
 209  p.popular-tags,
 210  .widgets-holder-wrap,
 211  .popular-tags,
 212  .feature-filter,
 213  .comment-ays {
 214      background: #fff;
 215  }
 216  
 217  /* general */
 218  html,
 219  body {
 220      height: 100%;
 221      margin: 0;
 222      padding: 0;
 223  }
 224  
 225  body {
 226      background: #f0f0f1;
 227      color: #3c434a;
 228      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
 229      font-size: 13px;
 230      line-height: 1.4em;
 231      min-width: 600px;
 232  }
 233  
 234  body.iframe {
 235      min-width: 0;
 236      padding-top: 1px;
 237  }
 238  
 239  body.modal-open {
 240      overflow: hidden;
 241  }
 242  
 243  body.mobile.modal-open #wpwrap {
 244      overflow: hidden;
 245      position: fixed;
 246      height: 100%;
 247  }
 248  
 249  iframe,
 250  img {
 251      border: 0;
 252  }
 253  
 254  td {
 255      font-family: inherit;
 256      font-size: inherit;
 257      font-weight: inherit;
 258      line-height: inherit;
 259  }
 260  
 261  /* Any change to the default link style must be applied to button-link too. */
 262  a {
 263      color: #2271b1;
 264      transition-property: border, background, color;
 265      transition-duration: .05s;
 266      transition-timing-function: ease-in-out;
 267  }
 268  
 269  a,
 270  div {
 271      outline: 0;
 272  }
 273  
 274  a:hover,
 275  a:active {
 276      color: #135e96;
 277  }
 278  
 279  a:focus,
 280  a:focus .media-icon img,
 281  a:focus .plugin-icon,
 282  .wp-person a:focus .gravatar {
 283      color: #043959;
 284      border-radius: 2px;
 285      box-shadow: 0 0 0 var(--wp-admin-border-width-focus, 1.5px) var(--wp-admin-theme-color, #3858e9);
 286      /* Only visible in Windows High Contrast mode */
 287      outline: 2px solid transparent;
 288  }
 289  
 290  #adminmenu a:focus {
 291      box-shadow: none;
 292      /* Only visible in Windows High Contrast mode */
 293      outline: 1px solid transparent;
 294      outline-offset: -1px;
 295  }
 296  
 297  .screen-reader-text:focus {
 298      box-shadow: none;
 299      outline: none;
 300  }
 301  
 302  blockquote,
 303  q {
 304      quotes: none;
 305  }
 306  
 307  blockquote:before,
 308  blockquote:after,
 309  q:before,
 310  q:after {
 311      content: "";
 312      content: none;
 313  }
 314  
 315  p,
 316  .wp-die-message {
 317      font-size: 13px;
 318      line-height: 1.5;
 319      margin: 1em 0;
 320  }
 321  
 322  blockquote {
 323      margin: 1em;
 324  }
 325  
 326  li,
 327  dd {
 328      margin-bottom: 6px;
 329  }
 330  
 331  h1,
 332  h2,
 333  h3,
 334  h4,
 335  h5,
 336  h6 {
 337      display: block;
 338      font-weight: 600;
 339  }
 340  
 341  h1 {
 342      color: #1d2327;
 343      font-size: 2em;
 344      margin: .67em 0;
 345  }
 346  
 347  h2,
 348  h3 {
 349      color: #1d2327;
 350      font-size: 1.3em;
 351      margin: 1em 0;
 352  }
 353  
 354  .update-core-php h2 {
 355      margin-top: 4em;
 356  }
 357  
 358  .update-php h2,
 359  .update-messages h2,
 360  h4 {
 361      font-size: 1em;
 362      margin: 1.33em 0;
 363  }
 364  
 365  h5 {
 366      font-size: 0.83em;
 367      margin: 1.67em 0;
 368  }
 369  
 370  h6 {
 371      font-size: 0.67em;
 372      margin: 2.33em 0;
 373  }
 374  
 375  ul,
 376  ol {
 377      padding: 0;
 378  }
 379  
 380  ul {
 381      list-style: none;
 382  }
 383  
 384  ol {
 385      list-style-type: decimal;
 386      margin-right: 2em;
 387  }
 388  
 389  ul.ul-disc {
 390      list-style: disc outside;
 391  }
 392  
 393  ul.ul-square {
 394      list-style: square outside;
 395  }
 396  
 397  ol.ol-decimal {
 398      list-style: decimal outside;
 399  }
 400  
 401  ul.ul-disc,
 402  ul.ul-square,
 403  ol.ol-decimal {
 404      margin-right: 1.8em;
 405  }
 406  
 407  ul.ul-disc > li,
 408  ul.ul-square > li,
 409  ol.ol-decimal > li {
 410      margin: 0 0 0.5em;
 411  }
 412  
 413  /* rtl:ignore */
 414  .ltr {
 415      direction: ltr;
 416  }
 417  
 418  /* rtl:ignore */
 419  .code,
 420  code {
 421      font-family: Consolas, Monaco, monospace;
 422      direction: ltr;
 423      unicode-bidi: embed;
 424  }
 425  
 426  kbd,
 427  code {
 428      padding: 3px 5px 2px;
 429      margin: 0 1px;
 430      background: #f0f0f1;
 431      background: rgba(0, 0, 0, 0.07);
 432      font-size: 13px;
 433  }
 434  
 435  .subsubsub {
 436      list-style: none;
 437      margin: 8px 0 0;
 438      padding: 0;
 439      font-size: 13px;
 440      float: right;
 441      color: #646970;
 442  }
 443  
 444  .subsubsub a {
 445      line-height: 2;
 446      padding: .2em;
 447      text-decoration: none;
 448  }
 449  
 450  .subsubsub a .count,
 451  .subsubsub a.current .count {
 452      color: #50575e; /* #f1f1f1 background */
 453      font-weight: 400;
 454  }
 455  
 456  .subsubsub a.current {
 457      font-weight: 600;
 458      border: none;
 459  }
 460  
 461  .subsubsub li {
 462      display: inline-block;
 463      margin: 0;
 464      padding: 0;
 465      white-space: nowrap;
 466  }
 467  
 468  /* .widefat - main style for tables */
 469  .widefat {
 470      border-spacing: 0;
 471      width: 100%;
 472      clear: both;
 473      margin: 0;
 474  }
 475  
 476  .widefat * {
 477      word-wrap: break-word;
 478  }
 479  
 480  .widefat a,
 481  .widefat button.button-link {
 482      text-decoration: none;
 483  }
 484  
 485  .widefat td,
 486  .widefat th {
 487      padding: 8px 10px;
 488  }
 489  
 490  .widefat thead th,
 491  .widefat thead td {
 492      border-bottom: 1px solid #c3c4c7;
 493  }
 494  
 495  .widefat tfoot th,
 496  .widefat tfoot td {
 497      border-top: 1px solid #c3c4c7;
 498      border-bottom: none;
 499  }
 500  
 501  .widefat .no-items td {
 502      border-bottom-width: 0;
 503  }
 504  
 505  .widefat td {
 506      vertical-align: top;
 507  }
 508  
 509  .widefat td,
 510  .widefat td p,
 511  .widefat td ol,
 512  .widefat td ul {
 513      font-size: 13px;
 514      line-height: 1.5em;
 515  }
 516  
 517  .widefat th,
 518  .widefat thead td,
 519  .widefat tfoot td {
 520      text-align: right;
 521      line-height: 1.3em;
 522      font-size: 14px;
 523  }
 524  
 525  .widefat th input,
 526  .updates-table td input,
 527  .widefat thead td input,
 528  .widefat tfoot td input {
 529      margin: 0 8px 0 0;
 530      padding: 0;
 531      vertical-align: text-top;
 532  }
 533  
 534  .widefat .check-column {
 535      width: 2.2em;
 536      padding: 6px 0 25px;
 537      vertical-align: top;
 538  }
 539  
 540  .widefat tbody th.check-column {
 541      padding: 9px 0 22px;
 542  }
 543  
 544  .widefat thead td.check-column,
 545  .widefat tbody th.check-column,
 546  .updates-table tbody td.check-column,
 547  .widefat tfoot td.check-column {
 548      padding: 11px 3px 0 0;
 549  }
 550  
 551  .widefat thead td.check-column,
 552  .widefat tfoot td.check-column {
 553      padding-top: 4px;
 554      vertical-align: middle;
 555  }
 556  
 557  .update-php div.updated,
 558  .update-php div.error {
 559      margin-right: 0;
 560  }
 561  
 562  .js-update-details-toggle .dashicons {
 563      text-decoration: none;
 564  }
 565  
 566  .js-update-details-toggle[aria-expanded="true"] .dashicons::before {
 567      content: "\f142";
 568      content: "\f142" / '';
 569  }
 570  
 571  .no-js .widefat thead .check-column input,
 572  .no-js .widefat tfoot .check-column input {
 573      display: none;
 574  }
 575  
 576  .widefat .num,
 577  .column-comments,
 578  .column-links,
 579  .column-posts {
 580      text-align: center;
 581  }
 582  
 583  .widefat th#comments {
 584      vertical-align: middle;
 585  }
 586  
 587  .wrap {
 588      margin: 10px 2px 0 20px;
 589  }
 590  
 591  .wrap > h2:first-child, /* Back-compat for pre-4.4 */
 592  .wrap [class$="icon32"] + h2, /* Back-compat for pre-4.4 */
 593  .postbox .inside h2, /* Back-compat for pre-4.4 */
 594  .wrap h1 {
 595      font-size: 23px;
 596      font-weight: 400;
 597      margin: 0;
 598      padding: 9px 0 4px;
 599      line-height: 1.3;
 600  }
 601  
 602  .wrap h1.wp-heading-inline {
 603      display: inline-block;
 604      margin-left: 5px;
 605  }
 606  
 607  .wp-header-end {
 608      visibility: hidden;
 609      margin: -2px 0 0;
 610  }
 611  
 612  .subtitle {
 613      margin: 0;
 614      padding-right: 25px;
 615      color: #50575e;
 616      font-size: 14px;
 617      font-weight: 400;
 618      line-height: 1;
 619  }
 620  
 621  .subtitle strong {
 622      word-break: break-all;
 623  }
 624  
 625  .wrap .add-new-h2, /* deprecated */
 626  .wrap .add-new-h2:active, /* deprecated */
 627  .wrap .page-title-action,
 628  .wrap .page-title-action:active {
 629      display: inline-block;
 630      position: relative;
 631      box-sizing: border-box;
 632      cursor: pointer;
 633      white-space: nowrap;
 634      text-decoration: none;
 635      text-shadow: none;
 636      top: -3px;
 637      margin-right: 4px;
 638      border: 1px solid #2271b1;
 639      border-radius: 2px;
 640      background: transparent;
 641      font-size: 13px;
 642      font-weight: 500;
 643      min-height: 32px;
 644      line-height: 2.30769231; /* 30px for 32px height */
 645      color: #2271b1; /* use the standard color used for buttons */
 646      padding: 0 12px;
 647      -webkit-appearance: none;
 648  
 649  }
 650  
 651  .wrap .wp-heading-inline + .page-title-action {
 652      margin-right: 0;
 653  }
 654  
 655  .wrap .add-new-h2:hover, /* deprecated */
 656  .wrap .page-title-action:hover {
 657      border-color: #0a4b78;
 658      color: #0a4b78;
 659  }
 660  
 661  /* lower specificity: color needs to be overridden by :hover and :active */
 662  .page-title-action:focus {
 663      color: #0a4b78;
 664  }
 665  
 666  /* Dashicon for language options on General Settings and Profile screens */
 667  .form-table th label[for="locale"] .dashicons,
 668  .form-table th label[for="WPLANG"] .dashicons {
 669      margin-right: 5px;
 670  }
 671  
 672  .wrap .page-title-action:focus {
 673      border-color: #3582c4;
 674      box-shadow: 0 0 0 1px #3582c4;
 675      /* Only visible in Windows High Contrast mode */
 676      outline: 2px solid transparent;
 677  }
 678  
 679  .wrap h1.long-header {
 680      padding-left: 0;
 681  }
 682  
 683  .wp-dialog {
 684      background-color: #fff;
 685  }
 686  
 687  .widgets-chooser ul,
 688  #widgets-left .widget-in-question .widget-top,
 689  #available-widgets .widget-top:hover,
 690  div#widgets-right .widget-top:hover,
 691  #widgets-left .widget-top:hover {
 692      border-color: #8c8f94;
 693      box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
 694  }
 695  
 696  .sorthelper {
 697      background-color: #c5d9ed;
 698  }
 699  
 700  .ac_match,
 701  .subsubsub a.current {
 702      color: #000;
 703  }
 704  
 705  .striped > tbody > :nth-child(odd),
 706  ul.striped > :nth-child(odd),
 707  .alternate {
 708      background-color: #f6f7f7;
 709  }
 710  
 711  .bar {
 712      background-color: #f0f0f1;
 713      border-left-color: var(--wp-admin-theme-color);
 714  }
 715  
 716  /* Helper classes for plugins to leverage the active WordPress color scheme */
 717  
 718  .highlight {
 719      background-color: rgba(var(--wp-admin-theme-color--rgb), 0.08);
 720      color: #3c434a;
 721  }
 722  
 723  .wp-ui-primary {
 724      color: #fff;
 725      background-color: #2c3338;
 726  }
 727  .wp-ui-text-primary {
 728      color: #2c3338;
 729  }
 730  
 731  .wp-ui-highlight {
 732      color: #fff;
 733      background-color: #2271b1;
 734  }
 735  .wp-ui-text-highlight {
 736      color: #2271b1;
 737  }
 738  
 739  .wp-ui-notification {
 740      color: #fff;
 741      background-color: #d63638;
 742  }
 743  .wp-ui-text-notification {
 744      color: #d63638;
 745  }
 746  
 747  .wp-ui-text-icon {
 748      color: #8c8f94; /* same as new icons */
 749  }
 750  
 751  /* For emoji replacement images */
 752  img.emoji {
 753      display: inline !important;
 754      border: none !important;
 755      height: 1em !important;
 756      width: 1em !important;
 757      margin: 0 .07em !important;
 758      vertical-align: -0.1em !important;
 759      background: none !important;
 760      padding: 0 !important;
 761      box-shadow: none !important;
 762  }
 763  
 764  /*------------------------------------------------------------------------------
 765    1.0 - Text Styles
 766  ------------------------------------------------------------------------------*/
 767  
 768  .widget .widget-top,
 769  .postbox .hndle,
 770  .stuffbox .hndle,
 771  .control-section .accordion-section-title,
 772  .sidebar-name,
 773  #nav-menu-header,
 774  #nav-menu-footer,
 775  .menu-item-handle,
 776  .checkbox,
 777  .side-info,
 778  #your-profile #rich_editing,
 779  .widefat thead th,
 780  .widefat thead td,
 781  .widefat tfoot th,
 782  .widefat tfoot td {
 783      line-height: 1.4em;
 784  }
 785  
 786  .widget .widget-top,
 787  .menu-item-handle {
 788      background: #f6f7f7;
 789      color: #1d2327;
 790  }
 791  
 792  .stuffbox .hndle {
 793      border-bottom: 1px solid #c3c4c7;
 794  }
 795  
 796  .quicktags {
 797      background-color: #c3c4c7;
 798      color: #000;
 799      font-size: 12px;
 800  }
 801  
 802  .icon32 {
 803      display: none;
 804  }
 805  
 806  /* @todo can we combine these into a class or use an existing dashicon one? */
 807  .welcome-panel .welcome-panel-close:before,
 808  .tagchecklist .ntdelbutton .remove-tag-icon:before,
 809  #bulk-titles .ntdelbutton:before,
 810  .notice-dismiss:before {
 811      background: none;
 812      color: #1e1e1e;
 813      content: "\f335";
 814      content: "\f335" / '';
 815      display: block;
 816      font: normal 20px/1 dashicons;
 817      height: 1em;
 818      text-align: center;
 819      width: 1em;
 820      -webkit-font-smoothing: antialiased;
 821      -moz-osx-font-smoothing: grayscale;
 822  }
 823  
 824  .welcome-panel .welcome-panel-close:before {
 825      margin: 0;
 826  }
 827  
 828  .tagchecklist .ntdelbutton .remove-tag-icon:before {
 829      margin-right: 2px;
 830      border-radius: 50%;
 831      color: var(--wp-admin-theme-color, #3858e9);
 832      /* vertically center the icon cross browsers */
 833      line-height: 1.1;
 834  }
 835  
 836  .tagchecklist .ntdelbutton:focus {
 837      outline: 0;
 838  }
 839  
 840  .tagchecklist .ntdelbutton:hover .remove-tag-icon:before,
 841  .tagchecklist .ntdelbutton:focus .remove-tag-icon:before,
 842  #bulk-titles .ntdelbutton:hover:before,
 843  #bulk-titles .ntdelbutton:focus:before {
 844      color: #d63638;
 845  }
 846  
 847  .tagchecklist .ntdelbutton:focus .remove-tag-icon:before {
 848      box-shadow: 0 0 0 var(--wp-admin-border-width-focus, 1.5px) var(--wp-admin-theme-color, #3858e9);
 849      /* Only visible in Windows High Contrast mode */
 850      outline: 2px solid transparent;
 851  }
 852  
 853  .key-labels label {
 854      line-height: 24px;
 855  }
 856  
 857  strong, b {
 858      font-weight: 600;
 859  }
 860  
 861  .pre {
 862      /* https://developer.mozilla.org/en-US/docs/CSS/white-space */
 863      white-space: pre-wrap; /* css-3 */
 864      word-wrap: break-word; /* IE 5.5 - 7 */
 865  }
 866  
 867  .howto {
 868      color: #646970;
 869      display: block;
 870  }
 871  
 872  p.install-help {
 873      margin: 8px 0;
 874      font-style: italic;
 875  }
 876  
 877  .no-break {
 878      white-space: nowrap;
 879  }
 880  
 881  hr {
 882      border: 0;
 883      border-top: 1px solid #dcdcde;
 884      border-bottom: 1px solid #f6f7f7;
 885  }
 886  
 887  .row-actions span.delete a,
 888  .row-actions span.trash a,
 889  .row-actions span.spam a,
 890  .plugins a.delete,
 891  #all-plugins-table .plugins a.delete,
 892  #search-plugins-table .plugins a.delete,
 893  .submitbox .submitdelete,
 894  #media-items a.delete,
 895  #media-items a.delete-permanently,
 896  #nav-menu-footer .menu-delete,
 897  #delete-link a.delete,
 898  a#remove-post-thumbnail,
 899  .privacy_requests .remove-personal-data .remove-personal-data-handle {
 900      color: #b32d2e;
 901  }
 902  
 903  abbr.required,
 904  span.required,
 905  .file-error,
 906  .row-actions .delete a:hover,
 907  .row-actions .trash a:hover,
 908  .row-actions .spam a:hover,
 909  .plugins a.delete:hover,
 910  #all-plugins-table .plugins a.delete:hover,
 911  #search-plugins-table .plugins a.delete:hover,
 912  .submitbox .submitdelete:hover,
 913  #media-items a.delete:hover,
 914  #media-items a.delete-permanently:hover,
 915  #nav-menu-footer .menu-delete:hover,
 916  #delete-link a.delete:hover,
 917  a#remove-post-thumbnail:hover,
 918  .privacy_requests .remove-personal-data .remove-personal-data-handle:hover {
 919      color: #b32d2e;
 920      border: none;
 921  }
 922  
 923  .application-password-display .success {
 924      color: #007017;
 925      margin-right: 0.5rem;
 926  }
 927  
 928  /*------------------------------------------------------------------------------
 929    3.0 - Actions
 930  ------------------------------------------------------------------------------*/
 931  
 932  #major-publishing-actions {
 933      padding: 10px;
 934      clear: both;
 935      border-top: 1px solid #dcdcde;
 936      background: #f6f7f7;
 937      display: flex;
 938      align-items: center;
 939      justify-content: space-between;
 940  }
 941  
 942  #delete-action {
 943      line-height: 2.30769231; /* 30px */
 944  }
 945  
 946  #delete-link a {
 947      text-decoration: none;
 948  }
 949  
 950  #publishing-action {
 951      text-align: left;
 952      margin-right: auto;
 953      line-height: 1.9;
 954  }
 955  
 956  #publishing-action .spinner {
 957      float: none;
 958  }
 959  
 960  #misc-publishing-actions {
 961      padding: 6px 0 0;
 962  }
 963  
 964  .misc-pub-section {
 965      padding: 6px 10px 8px;
 966  }
 967  
 968  .word-wrap-break-word,
 969  .misc-pub-filename {
 970      word-wrap: break-word;
 971  }
 972  
 973  #minor-publishing-actions {
 974      padding: 10px 10px 0;
 975      text-align: left;
 976  }
 977  
 978  #save-post {
 979      float: right;
 980  }
 981  
 982  .preview {
 983      float: left;
 984  }
 985  
 986  #sticky-span {
 987      margin-right: 18px;
 988  }
 989  
 990  .approve,
 991  .unapproved .unapprove {
 992      display: none;
 993  }
 994  
 995  .unapproved .approve,
 996  .spam .approve,
 997  .trash .approve {
 998      display: inline;
 999  }
1000  
1001  td.action-links,
1002  th.action-links {
1003      text-align: left;
1004  }
1005  
1006  #misc-publishing-actions .notice {
1007      margin-right: 10px;
1008      margin-left: 10px;
1009  }
1010  
1011  /* Filter bar */
1012  .wp-filter {
1013      display: inline-block;
1014      position: relative;
1015      box-sizing: border-box;
1016      margin: 12px 0 25px;
1017      padding: 0 10px;
1018      width: 100%;
1019      box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
1020      border: 1px solid #c3c4c7;
1021      background: #fff;
1022      color: #50575e;
1023      font-size: 13px;
1024  }
1025  
1026  .wp-filter a {
1027      text-decoration: none;
1028  }
1029  
1030  .filter-count {
1031      display: inline-block;
1032      vertical-align: middle;
1033      min-width: 4em;
1034  }
1035  
1036  .title-count,
1037  .filter-count .count {
1038      display: inline-block;
1039      position: relative;
1040      top: -1px;
1041      padding: 4px 10px;
1042      border-radius: 30px;
1043      background: #646970;
1044      color: #fff;
1045      font-size: 14px;
1046      font-weight: 600;
1047  }
1048  
1049  /* not a part of filter bar, but derived from it, so here for now */
1050  .title-count {
1051      display: inline;
1052      top: -3px;
1053      margin-right: 5px;
1054      margin-left: 20px;
1055  }
1056  
1057  .filter-items {
1058      float: right;
1059  }
1060  
1061  .filter-links {
1062      display: inline-block;
1063      margin: 0;
1064  }
1065  
1066  .filter-links li {
1067      display: inline-block;
1068      margin: 0;
1069  }
1070  
1071  .filter-links li > a {
1072      display: inline-block;
1073      margin: 0 10px;
1074      padding: 15px 0;
1075      border-bottom: 4px solid #fff;
1076      color: #646970;
1077      cursor: pointer;
1078  }
1079  
1080  .filter-links .current {
1081      box-shadow: none;
1082      border-bottom: 4px solid var(--wp-admin-theme-color);
1083      color: #1d2327;
1084  }
1085  
1086  .filter-links li > a:hover,
1087  .filter-links li > a:focus,
1088  .show-filters .filter-links a.current:hover,
1089  .show-filters .filter-links a.current:focus {
1090      color: var(--wp-admin-theme-color);
1091  }
1092  
1093  .wp-filter .search-form {
1094      float: left;
1095      display: flex;
1096      align-items: center;
1097      column-gap: .5rem;
1098  }
1099  
1100  .wp-filter .search-form input[type="search"] {
1101      width: 280px;
1102      max-width: 100%;
1103  }
1104  
1105  .wp-filter .search-form select {
1106      margin: 0;
1107  }
1108  
1109  .wp-filter .search-form input[type="search"] {
1110      min-height: 32px;
1111      padding: 0 8px;
1112  }
1113  
1114  .wp-filter .search-form select,
1115  .wp-filter .filter-items select {
1116      min-height: 32px;
1117      line-height: 2.14285714; /* 30px for 32px height with 14px font */
1118      padding: 0 8px 0 24px;
1119  }
1120  
1121  .wp-filter .button {
1122      min-height: 32px;
1123      line-height: 2.30769231; /* 30px for 32px height with 13px font */
1124      padding: 0 12px;
1125  }
1126  
1127  /* Use flexbox only on the plugins install page and upload page. The `filter-links` and search form children will become flex items. */
1128  .plugin-install-php .wp-filter,
1129  .upload-php .wp-filter {
1130      display: flex;
1131      flex-wrap: wrap;
1132      justify-content: space-between;
1133      align-items: center;
1134  }
1135  
1136  .wp-filter .search-form.search-plugins select,
1137  .wp-filter .search-form.search-plugins .wp-filter-search,
1138  .no-js .wp-filter .search-form.search-plugins .button {
1139      display: inline-block;
1140      vertical-align: top;
1141  }
1142  
1143  .wp-filter .button.drawer-toggle {
1144      margin: 10px 9px 0;
1145      padding: 0 6px 0 10px;
1146      border-color: transparent;
1147      background-color: transparent;
1148      color: #646970;
1149      vertical-align: baseline;
1150      box-shadow: none;
1151  }
1152  
1153  .wp-filter .drawer-toggle:before {
1154      content: "\f111";
1155      content: "\f111" / '';
1156      margin: 0 0 0 5px;
1157      color: #646970;
1158      font: normal 16px/1 dashicons;
1159      vertical-align: text-bottom;
1160      -webkit-font-smoothing: antialiased;
1161      -moz-osx-font-smoothing: grayscale;
1162  }
1163  
1164  .wp-filter .button.drawer-toggle:hover,
1165  .wp-filter .drawer-toggle:hover:before,
1166  .wp-filter .button.drawer-toggle:focus,
1167  .wp-filter .drawer-toggle:focus:before {
1168      background-color: transparent;
1169      color: var(--wp-admin-theme-color);
1170  }
1171  
1172  .wp-filter .button.drawer-toggle:hover,
1173  .wp-filter .button.drawer-toggle:focus:active {
1174      border-color: transparent;
1175  }
1176  
1177  .wp-filter .button.drawer-toggle:focus {
1178      border-color: var(--wp-admin-theme-color);
1179  }
1180  
1181  .wp-filter .button.drawer-toggle:active {
1182      background: transparent;
1183      box-shadow: none;
1184      transform: none;
1185  }
1186  
1187  .wp-filter .drawer-toggle.current:before {
1188      color: #fff;
1189  }
1190  
1191  .filter-drawer,
1192  .wp-filter .favorites-form {
1193      display: none;
1194      margin: 0 -20px 0 -10px;
1195      padding: 20px;
1196      border-top: 1px solid #f0f0f1;
1197      background: #f6f7f7;
1198      overflow: hidden;
1199  }
1200  
1201  .wp-filter .favorites-form .favorites-username {
1202      display: flex;
1203      align-items: center;
1204      flex-wrap: wrap;
1205      gap: 0.5rem;
1206  }
1207  
1208  .wp-filter .favorites-form .favorites-username input {
1209      margin: 0;
1210  }
1211  
1212  .show-filters .filter-drawer,
1213  .show-favorites-form .favorites-form {
1214      display: block;
1215  }
1216  
1217  .show-filters .filter-links a.current {
1218      border-bottom: none;
1219  }
1220  
1221  .show-filters .wp-filter .button.drawer-toggle {
1222      border-radius: 2px;
1223      background: #646970;
1224      color: #fff;
1225  }
1226  
1227  .show-filters .wp-filter .drawer-toggle:hover,
1228  .show-filters .wp-filter .drawer-toggle:focus {
1229      background: var(--wp-admin-theme-color);
1230  }
1231  
1232  .show-filters .wp-filter .drawer-toggle:before {
1233      color: #fff;
1234  }
1235  
1236  .filter-group {
1237      box-sizing: border-box;
1238      position: relative;
1239      float: right;
1240      margin: 0 0 0 1%;
1241      padding: 20px 10px 10px;
1242      width: 24%;
1243      background: #fff;
1244      border: 1px solid #dcdcde;
1245      box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
1246  }
1247  
1248  .filter-group legend {
1249      position: absolute;
1250      top: 10px;
1251      display: block;
1252      margin: 0;
1253      padding: 0;
1254      font-size: 1em;
1255      font-weight: 600;
1256  }
1257  
1258  .filter-drawer .filter-group-feature {
1259      margin: 28px 0 0;
1260      list-style-type: none;
1261      font-size: 12px;
1262  }
1263  
1264  .filter-drawer .filter-group-feature input,
1265  .filter-drawer .filter-group-feature label {
1266      line-height: 1.4;
1267  }
1268  
1269  .filter-drawer .filter-group-feature input {
1270      position: absolute;
1271      margin: 0;
1272  }
1273  
1274  .filter-group .filter-group-feature label {
1275      display: block;
1276      margin: 14px 23px 14px 0;
1277  }
1278  
1279  .filter-drawer .buttons {
1280      clear: both;
1281      margin-bottom: 20px;
1282  }
1283  
1284  .filter-drawer .filter-group + .buttons {
1285      margin-bottom: 0;
1286      padding-top: 20px;
1287  }
1288  
1289  .filter-drawer .buttons .button span {
1290      display: inline-block;
1291      opacity: 0.8;
1292      font-size: 12px;
1293      text-indent: 10px;
1294  }
1295  
1296  .wp-filter .button.clear-filters {
1297      display: none;
1298      margin-right: 10px;
1299  }
1300  
1301  .wp-filter .button-link.edit-filters {
1302      padding: 0 5px;
1303      line-height: 2.2;
1304  }
1305  
1306  .filtered-by {
1307      display: none;
1308      margin: 0;
1309  }
1310  
1311  .filtered-by > span {
1312      font-weight: 600;
1313  }
1314  
1315  .filtered-by a {
1316      margin-right: 10px;
1317  }
1318  
1319  .filtered-by .tags {
1320      display: flex;
1321      align-items: flex-start;
1322      flex-wrap: wrap;
1323      gap: 8px;
1324  }
1325  
1326  .filtered-by .tag {
1327      padding: 4px 8px;
1328      border: 1px solid #dcdcde;
1329      box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
1330      background: #fff;
1331      font-size: 11px;
1332  }
1333  
1334  .filters-applied .filter-group,
1335  .filters-applied .filter-drawer .buttons,
1336  .filters-applied .filter-drawer br {
1337      display: none;
1338  }
1339  
1340  .filters-applied .filtered-by {
1341      display: flex;
1342      align-items: center;
1343      flex-wrap: wrap;
1344      gap: 10px;
1345  }
1346  
1347  .filters-applied .filter-drawer {
1348      padding: 20px;
1349  }
1350  
1351  .show-filters .favorites-form,
1352  .show-filters .content-filterable,
1353  .show-filters.filters-applied.loading-content .content-filterable,
1354  .loading-content .content-filterable,
1355  .error .content-filterable {
1356      display: none;
1357  }
1358  
1359  .show-filters.filters-applied .content-filterable {
1360      display: block;
1361  }
1362  
1363  .loading-content .spinner {
1364      display: block;
1365      margin: 40px auto 0;
1366      float: none;
1367  }
1368  
1369  @media only screen and (max-width: 1138px) {
1370      .wp-filter .search-form {
1371          margin: 11px 0;
1372      }
1373  }
1374  
1375  @media only screen and (max-width: 1250px) {
1376      .wp-filter:has(.plugin-install-search) .search-form {
1377          margin: 11px 0;
1378      }
1379  }
1380  
1381  @media only screen and (max-width: 1120px) {
1382      .filter-drawer {
1383          border-bottom: 1px solid #f0f0f1;
1384      }
1385  
1386      .filter-group {
1387          margin-bottom: 0;
1388          margin-top: 5px;
1389          width: 100%;
1390      }
1391  
1392      .filter-group li {
1393          margin: 10px 0;
1394      }
1395  }
1396  
1397  @media only screen and (max-width: 1000px) {
1398      .filter-items {
1399          float: none;
1400      }
1401  
1402      .wp-filter .media-toolbar-primary,
1403      .wp-filter .media-toolbar-secondary,
1404      .wp-filter .search-form {
1405          float: none; /* Remove float from media-views.css */
1406          position: relative;
1407          max-width: 100%;
1408      }
1409      .wp-filter .search-form {
1410          margin: 11px 0;
1411          flex-wrap: wrap;
1412          row-gap: 10px;
1413      }
1414  }
1415  
1416  @media only screen and (max-width: 782px) {
1417      .filter-group li {
1418          padding: 0;
1419          width: 50%;
1420      }
1421  }
1422  
1423  @media only screen and (max-width: 320px) {
1424      .filter-count {
1425          display: none;
1426      }
1427  
1428      .wp-filter .drawer-toggle {
1429          margin: 10px 0;
1430      }
1431  
1432      .filter-group li,
1433      .wp-filter .search-form input[type="search"] {
1434          width: 100%;
1435      }
1436  }
1437  
1438  /*------------------------------------------------------------------------------
1439    4.0 - Notifications
1440  ------------------------------------------------------------------------------*/
1441  
1442  .notice,
1443  div.updated,
1444  div.error {
1445      background: #fff;
1446      border: none;
1447      border-right: 4px solid #c3c4c7;
1448      box-shadow: none;
1449      margin: 5px 15px 2px;
1450      padding: 8px 12px;
1451  }
1452  
1453  div[class="update-message"] { /* back-compat for pre-4.6 */
1454      padding: 0.5em 0 0.5em 12px;
1455  }
1456  
1457  .notice p,
1458  .notice-title,
1459  div.updated p,
1460  div.error p,
1461  .form-table td .notice p {
1462      margin: 0.5em 0;
1463      padding: 0;
1464      font-size: 13px;
1465      line-height: 1.54;
1466      color: #1e1e1e;
1467  }
1468  
1469  div.notice a,
1470  div.error a,
1471  div.updated a {
1472      color: var(--wp-admin-theme-color-darker-10);
1473      text-decoration: underline;
1474  }
1475  
1476  div.notice a:hover,
1477  div.error a:hover,
1478  div.updated a:hover {
1479      color: var(--wp-admin-theme-color-darker-20);
1480  }
1481  
1482  div.notice a:focus,
1483  div.error a:focus,
1484  div.updated a:focus {
1485      box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
1486      outline: 2px solid transparent;
1487      border-radius: 2px;
1488  }
1489  
1490  .notice-alt {
1491      box-shadow: none;
1492  }
1493  
1494  .notice-large {
1495      padding: 10px 20px;
1496  }
1497  
1498  .notice-title {
1499      display: inline-block;
1500      color: #1d2327;
1501      font-size: 18px;
1502  }
1503  
1504  .wp-core-ui .notice.is-dismissible {
1505      padding-left: 48px;
1506      position: relative;
1507  }
1508  
1509  .notice-dismiss {
1510      position: absolute;
1511      top: 12px;
1512      left: 12px;
1513      border: none;
1514      margin: 0;
1515      padding: 0;
1516      background: none;
1517      color: #1e1e1e;
1518      cursor: pointer;
1519      width: 24px;
1520      height: 24px;
1521      display: flex;
1522      align-items: center;
1523      justify-content: center;
1524      border-radius: 2px;
1525  }
1526  
1527  .notice-dismiss:hover:before,
1528  .notice-dismiss:active:before {
1529      color: #1e1e1e;
1530      opacity: 0.7;
1531  }
1532  
1533  .notice-dismiss:focus {
1534      box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
1535      /* Only visible in Windows High Contrast mode */
1536      outline: 2px solid transparent;
1537  }
1538  
1539  .notice-dismiss:focus:before {
1540      color: #1e1e1e;
1541  }
1542  
1543  .notice-success,
1544  div.updated {
1545      border-right-color: #4ab866;
1546      background-color: #eff9f1;
1547  }
1548  
1549  .notice-success.notice-alt,
1550  div.updated.notice-alt {
1551      background-color: #eff9f1;
1552  }
1553  
1554  .notice-warning {
1555      border-right-color: #f0b849;
1556      background-color: #fef8ee;
1557  }
1558  
1559  .notice-warning.notice-alt {
1560      background-color: #fef8ee;
1561  }
1562  
1563  .notice-error,
1564  div.error {
1565      border-right-color: #cc1818;
1566      background-color: #fcf0f0;
1567  }
1568  
1569  .notice-error.notice-alt,
1570  div.error.notice-alt {
1571      background-color: #fcf0f0;
1572  }
1573  
1574  .notice-info {
1575      border-right-color: #3858e9;
1576      background-color: #fff;
1577  }
1578  
1579  .notice-info.notice-alt {
1580      background-color: #fff;
1581  }
1582  
1583  #plugin-information-footer .update-now:not(.button-disabled):before {
1584      color: #d63638;
1585      content: "\f463";
1586      content: "\f463" / '';
1587      display: inline-block;
1588      font: normal 20px/1 dashicons;
1589      margin: -3px -2px 0 5px;
1590      -webkit-font-smoothing: antialiased;
1591      -moz-osx-font-smoothing: grayscale;
1592      vertical-align: middle;
1593  }
1594  
1595  #plugin-information-footer .notice {
1596      margin-top: -5px;
1597  }
1598  
1599  .update-message p:before,
1600  .updating-message p:before,
1601  .updated-message p:before,
1602  .import-php .updating-message:before,
1603  .button.updating-message:before,
1604  .button.updated-message:before,
1605  .button.installed:before,
1606  .button.installing:before,
1607  .button.activating-message:before,
1608  .button.activated-message:before {
1609      display: inline-block;
1610      font: normal 20px/1 'dashicons';
1611      -webkit-font-smoothing: antialiased;
1612      -moz-osx-font-smoothing: grayscale;
1613      vertical-align: top;
1614  }
1615  
1616  .wrap .notice,
1617  .wrap div.updated,
1618  .wrap div.error,
1619  .media-upload-form .notice,
1620  .media-upload-form div.error {
1621      margin: 5px 0 15px;
1622  }
1623  
1624  .wrap #templateside .notice {
1625      display: block;
1626      margin: 0;
1627      padding: 5px 8px;
1628      font-weight: 600;
1629      text-decoration: none;
1630  }
1631  
1632  .wrap #templateside span.notice {
1633      margin-right: -12px;
1634  }
1635  
1636  #templateside li.notice a {
1637      padding: 0;
1638  }
1639  
1640  /* Update icon. */
1641  .update-message p:before,
1642  .updating-message p:before,
1643  .import-php .updating-message:before,
1644  .button.updating-message:before,
1645  .button.installing:before,
1646  .button.activating-message:before {
1647      color: #d63638;
1648      content: "\f463";
1649      content: "\f463" / '';
1650  }
1651  
1652  /* Spins the update icon. */
1653  .updating-message p:before,
1654  .import-php .updating-message:before,
1655  .button.updating-message:before,
1656  .button.installing:before,
1657  .button.activating-message:before,
1658  .plugins .column-auto-updates .dashicons-update.spin,
1659  .theme-overlay .theme-autoupdate .dashicons-update.spin {
1660      animation: rotation 2s infinite linear;
1661  }
1662  
1663  @media (prefers-reduced-motion: reduce) {
1664      .updating-message p:before,
1665      .import-php .updating-message:before,
1666      .button.updating-message:before,
1667      .button.installing:before,
1668      .button.activating-message:before,
1669      .plugins .column-auto-updates .dashicons-update.spin,
1670      .theme-overlay .theme-autoupdate .dashicons-update.spin {
1671          animation: none;
1672      }
1673  }
1674  
1675  .theme-overlay .theme-autoupdate .dashicons-update.spin {
1676      margin-left: 3px;
1677  }
1678  
1679  /* Updated icon (check mark). */
1680  .updated-message p:before,
1681  .installed p:before,
1682  .button.updated-message:before,
1683  .button.activated-message:before {
1684      color: #68de7c;
1685      content: "\f147";
1686      content: "\f147" / '';
1687  }
1688  
1689  /* Error icon. */
1690  .update-message.notice-error p:before {
1691      color: #d63638;
1692      content: "\f534";
1693      content: "\f534" / '';
1694  }
1695  
1696  .wrap .notice p:before,
1697  .import-php .updating-message:before {
1698      margin-left: 6px;
1699  }
1700  
1701  .import-php .updating-message:before {
1702      vertical-align: bottom;
1703  }
1704  
1705  #update-nag,
1706  .update-nag {
1707      display: inline-block;
1708      line-height: 1.4;
1709      padding: 11px 15px;
1710      font-size: 14px;
1711      margin: 25px 2px 0 20px;
1712  }
1713  
1714  ul#dismissed-updates {
1715      display: none;
1716  }
1717  
1718  #dismissed-updates li > p {
1719      margin-top: 0;
1720  }
1721  
1722  #dismiss,
1723  #undismiss {
1724      margin-right: 0.5em;
1725  }
1726  
1727  form.upgrade {
1728      margin-top: 8px;
1729  }
1730  
1731  form.upgrade .hint {
1732      font-style: italic;
1733      font-size: 85%;
1734      margin: -0.5em 0 2em;
1735  }
1736  
1737  .update-php .spinner {
1738      float: none;
1739      margin: -4px 0;
1740  }
1741  
1742  h2.wp-current-version {
1743      margin-bottom: .3em;
1744  }
1745  
1746  p.update-last-checked {
1747      margin-top: 0;
1748  }
1749  
1750  p.auto-update-status {
1751      margin-top: 2em;
1752      line-height: 1.8;
1753  }
1754  
1755  #ajax-loading,
1756  .ajax-loading,
1757  .ajax-feedback,
1758  .imgedit-wait-spin,
1759  .list-ajax-loading { /* deprecated */
1760      visibility: hidden;
1761  }
1762  
1763  #ajax-response.alignleft {
1764      margin-right: 2em;
1765  }
1766  
1767  .button.updating-message:before,
1768  .button.updated-message:before,
1769  .button.installed:before,
1770  .button.installing:before,
1771  .button.activated-message:before,
1772  .button.activating-message:before {
1773      margin: 0 -2px 0 5px;
1774      line-height: 1.9; /* 38px (20px * 1.9) - matches button */
1775      vertical-align: top;
1776  }
1777  
1778  #plugin-information-footer .button {
1779      padding: 0 14px;
1780      line-height: 2.71428571; /* 38px */
1781      font-size: 14px;
1782      vertical-align: middle;
1783      min-height: 40px;
1784      margin-bottom: 4px;
1785  }
1786  
1787  #plugin-information-footer .button.installed:before,
1788  #plugin-information-footer .button.installing:before,
1789  #plugin-information-footer .button.updating-message:before,
1790  #plugin-information-footer .button.updated-message:before,
1791  #plugin-information-footer .button.activated-message:before,
1792  #plugin-information-footer .button.activating-message:before {
1793      margin: 0 -2px 0 5px;
1794      line-height: 1.9; /* 38px (20px * 1.9) - matches button */
1795      vertical-align: top;
1796  }
1797  
1798  #plugin-information-footer .button.update-now.updating-message:before {
1799      margin: 0 -2px 0 5px;
1800  }
1801  
1802  .button-primary.updating-message:before,
1803  .button-primary.activating-message:before {
1804      color: #fff;
1805  }
1806  
1807  .button-primary.updated-message:before,
1808  .button-primary.activated-message:before {
1809      color: #9ec2e6;
1810  }
1811  
1812  .button.updated-message,
1813  .button.activated-message {
1814      transition-property: border, background, color;
1815      transition-duration: .05s;
1816      transition-timing-function: ease-in-out;
1817  }
1818  
1819  
1820  /* @todo: this does not need its own section anymore */
1821  /*------------------------------------------------------------------------------
1822    6.0 - Admin Header
1823  ------------------------------------------------------------------------------*/
1824  #adminmenu a,
1825  #taglist a,
1826  #catlist a {
1827      text-decoration: none;
1828  }
1829  
1830  /*------------------------------------------------------------------------------
1831    6.1 - Screen Options Tabs
1832  ------------------------------------------------------------------------------*/
1833  
1834  #screen-options-wrap,
1835  #contextual-help-wrap {
1836      margin: 0;
1837      padding: 8px 20px 12px;
1838      position: relative;
1839  }
1840  
1841  #contextual-help-wrap {
1842      overflow: auto;
1843      margin-right: 0;
1844  }
1845  
1846  #screen-meta-links {
1847      float: left;
1848      margin: 0 0 0 20px;
1849  }
1850  
1851  /* screen options and help tabs revert */
1852  #screen-meta {
1853      display: none;
1854      margin: 0 0 -1px 20px;
1855      position: relative;
1856      background-color: #fff;
1857      border: 1px solid #c3c4c7;
1858      border-top: none;
1859      box-shadow: 0 0 0 transparent;
1860  }
1861  
1862  #screen-options-link-wrap,
1863  #contextual-help-link-wrap {
1864      float: right;
1865      margin: 0 6px 0 0;
1866  }
1867  
1868  #screen-meta-links .screen-meta-toggle {
1869      position: relative;
1870      top: 0;
1871  }
1872  
1873  #screen-meta-links .show-settings {
1874      border: 1px solid #c3c4c7;
1875      border-top: none;
1876      height: auto;
1877      min-height: 32px; /* Compact size for header buttons */
1878      margin-bottom: 0;
1879      padding: 0 16px 0 6px;
1880      background: #fff;
1881      border-radius: 0 0 4px 4px;
1882      color: #646970;
1883      line-height: 2.30769231; /* 30px - matches compact button */
1884      box-shadow: 0 0 0 transparent;
1885      transition: box-shadow 0.1s linear;
1886  }
1887  
1888  #screen-meta-links .show-settings:hover,
1889  #screen-meta-links .show-settings:active,
1890  #screen-meta-links .show-settings:focus {
1891      color: #2c3338;
1892  }
1893  
1894  #screen-meta-links .show-settings:focus {
1895      border-color: var(--wp-admin-theme-color, #3858e9);
1896      box-shadow: 0 0 0 var(--wp-admin-border-width-focus, 1.5px) var(--wp-admin-theme-color, #3858e9);
1897      /* Only visible in Windows High Contrast mode */
1898      outline: 2px solid transparent;
1899  }
1900  
1901  #screen-meta-links .show-settings:active {
1902      transform: none;
1903  }
1904  
1905  #screen-meta-links .show-settings:after {
1906      left: 0;
1907      content: "\f140";
1908      content: "\f140" / '';
1909      font: normal 20px/1.5 dashicons; /* line-height 1.5 = 30px to match compact button */
1910      display: inline-block;
1911      padding: 0 0 0 5px;
1912      vertical-align: top;
1913      -webkit-font-smoothing: antialiased;
1914      -moz-osx-font-smoothing: grayscale;
1915      text-decoration: none;
1916  }
1917  
1918  #screen-meta-links .screen-meta-active:after {
1919      content: "\f142";
1920      content: "\f142" / '';
1921  }
1922  
1923  /* end screen options and help tabs */
1924  
1925  .toggle-arrow {
1926      background-repeat: no-repeat;
1927      background-position: top right;
1928      background-color: transparent;
1929      height: 22px;
1930      line-height: 22px;
1931      display: block;
1932  }
1933  
1934  .toggle-arrow-active {
1935      background-position: bottom right;
1936  }
1937  
1938  #screen-options-wrap h5, /* Back-compat for old plugins */
1939  #screen-options-wrap legend,
1940  #contextual-help-wrap h5 {
1941      margin: 0;
1942      padding: 8px 0;
1943      font-size: 13px;
1944      font-weight: 600;
1945  }
1946  
1947  .metabox-prefs label {
1948      display: inline-block;
1949      padding-left: 15px;
1950      line-height: 2.35;
1951  }
1952  
1953  #number-of-columns {
1954      display: inline-block;
1955      vertical-align: middle;
1956      line-height: 30px;
1957  }
1958  
1959  .metabox-prefs input[type=checkbox] {
1960      margin-top: 0;
1961      margin-left: 6px;
1962  }
1963  
1964  .metabox-prefs label input,
1965  .metabox-prefs label input[type=checkbox] {
1966      margin: -4px 0 0 5px;
1967  }
1968  
1969  .metabox-prefs .columns-prefs label input {
1970      margin: -1px 0 0 2px;
1971  }
1972  
1973  .metabox-prefs label a {
1974      display: none;
1975  }
1976  
1977  .metabox-prefs .screen-options input,
1978  .metabox-prefs .screen-options label {
1979      margin-top: 0;
1980      margin-bottom: 0;
1981      vertical-align: middle;
1982  }
1983  
1984  .metabox-prefs .screen-options .screen-per-page {
1985      margin-left: 15px;
1986      padding-left: 0;
1987  }
1988  
1989  .metabox-prefs .screen-options label {
1990      line-height: 2.2;
1991      padding-left: 0;
1992  }
1993  
1994  .screen-options + .screen-options {
1995      margin-top: 10px;
1996  }
1997  
1998  .metabox-prefs .submit {
1999      margin-top: 1em;
2000      padding: 0;
2001  }
2002  
2003  /*------------------------------------------------------------------------------
2004    6.2 - Help Menu
2005  ------------------------------------------------------------------------------*/
2006  
2007  #contextual-help-wrap {
2008      padding: 0;
2009  }
2010  
2011  #contextual-help-columns {
2012      position: relative;
2013  }
2014  
2015  #contextual-help-back {
2016      position: absolute;
2017      top: 0;
2018      bottom: 0;
2019      right: 150px;
2020      left: 170px;
2021      border: 1px solid #c3c4c7;
2022      border-top: none;
2023      border-bottom: none;
2024      background: rgba(var(--wp-admin-theme-color--rgb), 0.08);
2025  }
2026  
2027  #contextual-help-wrap.no-sidebar #contextual-help-back {
2028      left: 0;
2029      border-left-width: 0;
2030      border-bottom-left-radius: 2px;
2031  }
2032  
2033  .contextual-help-tabs {
2034      float: right;
2035      width: 150px;
2036      margin: 0;
2037  }
2038  
2039  .contextual-help-tabs ul {
2040      margin: 1em 0;
2041  }
2042  
2043  .contextual-help-tabs li {
2044      margin-bottom: 0;
2045      list-style-type: none;
2046      border-style: solid;
2047      border-width: 0 2px 0 0;
2048      border-color: transparent;
2049  }
2050  
2051  .contextual-help-tabs a {
2052      display: block;
2053      padding: 5px 12px 5px 5px;
2054      line-height: 1.4;
2055      text-decoration: none;
2056      border: 1px solid transparent;
2057      border-left: none;
2058      border-right: none;
2059  }
2060  
2061  .contextual-help-tabs a:hover {
2062      color: #2c3338;
2063  }
2064  
2065  .contextual-help-tabs .active {
2066      padding: 0;
2067      margin: 0 0 0 -1px;
2068      border-right: 2px solid var(--wp-admin-theme-color);
2069      background: color-mix(in srgb, var(--wp-admin-theme-color) 8%, white);
2070      box-shadow: 0 2px 0 rgba(0, 0, 0, 0.02), 0 1px 0 rgba(0, 0, 0, 0.02);
2071  }
2072  
2073  .contextual-help-tabs .active a {
2074      border-color: #c3c4c7;
2075      color: #2c3338;
2076  }
2077  
2078  .contextual-help-tabs-wrap {
2079      padding: 0 20px;
2080      overflow: auto;
2081  }
2082  
2083  .help-tab-content {
2084      display: none;
2085      margin: 0 0 12px 22px;
2086      line-height: 1.6;
2087  }
2088  
2089  .help-tab-content.active {
2090      display: block;
2091  }
2092  
2093  .help-tab-content ul li {
2094      list-style-type: disc;
2095      margin-right: 18px;
2096  }
2097  
2098  .contextual-help-sidebar {
2099      width: 150px;
2100      float: left;
2101      padding: 0 12px 0 8px;
2102      overflow: auto;
2103  }
2104  
2105  /*------------------------------------------------------------------------------
2106    8.0 - Layout Blocks
2107  ------------------------------------------------------------------------------*/
2108  
2109  html.wp-toolbar {
2110      padding-top: var(--wp-admin--admin-bar--height);
2111      box-sizing: border-box;
2112      -ms-overflow-style: scrollbar; /* See ticket #48545 */
2113  }
2114  
2115  .widefat th,
2116  .widefat td {
2117      color: #50575e;
2118  }
2119  
2120  .widefat th,
2121  .widefat thead td,
2122  .widefat tfoot td {
2123      font-weight: 400;
2124  }
2125  
2126  .widefat thead tr th,
2127  .widefat thead tr td,
2128  .widefat tfoot tr th,
2129  .widefat tfoot tr td {
2130      color: #2c3338;
2131  }
2132  
2133  .widefat td p {
2134      margin: 2px 0 0.8em;
2135  }
2136  
2137  .widefat p,
2138  .widefat ol,
2139  .widefat ul {
2140      color: #2c3338;
2141  }
2142  
2143  .widefat .column-comment p {
2144      margin: 0.6em 0;
2145  }
2146  
2147  .widefat .column-comment ul {
2148      list-style: initial;
2149      margin-right: 2em;
2150  }
2151  
2152  /* Screens with postboxes */
2153  .postbox-container {
2154      float: right;
2155  }
2156  
2157  .postbox-container .meta-box-sortables {
2158      box-sizing: border-box;
2159  }
2160  
2161  #wpbody-content .metabox-holder {
2162      padding-top: 10px;
2163  }
2164  
2165  .metabox-holder .postbox-container .meta-box-sortables {
2166      /* The jQuery UI Sortables need some initial height to work properly. */
2167      min-height: 1px;
2168      position: relative;
2169  }
2170  
2171  #post-body-content {
2172      width: 100%;
2173      min-width: 463px;
2174      float: right;
2175  }
2176  
2177  #post-body.columns-2 #postbox-container-1 {
2178      float: left;
2179      margin-left: -300px;
2180      width: 280px;
2181  }
2182  
2183  #post-body.columns-2 #side-sortables {
2184      min-height: 250px;
2185  }
2186  
2187  /* one column on the dash */
2188  @media only screen and (max-width: 799px) {
2189      #wpbody-content .metabox-holder .postbox-container .empty-container {
2190          outline: none;
2191          height: 0;
2192          min-height: 0;
2193      }
2194  }
2195  
2196  .js .widget .widget-top,
2197  .js .postbox .hndle {
2198      cursor: move;
2199  }
2200  
2201  .js .widget .widget-top.is-non-sortable,
2202  .js .postbox .hndle.is-non-sortable {
2203      cursor: auto;
2204  }
2205  
2206  /* Configurable dashboard widgets "Configure" edit-box link. */
2207  .hndle a {
2208      font-size: 12px;
2209      font-weight: 400;
2210  }
2211  
2212  .postbox-header {
2213      display: flex;
2214      align-items: center;
2215      justify-content: space-between;
2216      border-bottom: 1px solid #c3c4c7;
2217  }
2218  
2219  .postbox-header .hndle {
2220      flex-grow: 1;
2221      /* Handle the alignment for the configurable dashboard widgets "Configure" edit-box link. */
2222      display: flex;
2223      justify-content: space-between;
2224      align-items: center;
2225  }
2226  
2227  .postbox-header .handle-actions {
2228      flex-shrink: 0;
2229  }
2230  
2231  /* Post box order and toggle buttons. */
2232  .postbox .handle-order-higher,
2233  .postbox .handle-order-lower,
2234  .postbox .handlediv {
2235      width: 1.62rem;
2236      height: 1.62rem;
2237      margin: 0;
2238      padding: 0;
2239      border: 0;
2240      background: none;
2241      cursor: pointer;
2242  }
2243  
2244  .postbox .handle-order-higher,
2245  .postbox .handle-order-lower {
2246      color: #646970;
2247      width: 1.62rem;
2248  }
2249  
2250  /* Post box order buttons in the block editor meta boxes area. */
2251  .edit-post-meta-boxes-area .postbox .handle-order-higher,
2252  .edit-post-meta-boxes-area .postbox .handle-order-lower {
2253      width: 44px;
2254      height: 44px;
2255      color: #1d2327
2256  }
2257  
2258  .postbox .handle-order-higher[aria-disabled="true"],
2259  .postbox .handle-order-lower[aria-disabled="true"] {
2260      cursor: default;
2261      color: #a7aaad;
2262  }
2263  
2264  .sortable-placeholder:not(.empty-container .sortable-placeholder) {
2265      border: 1px dashed #c3c4c7;
2266      border-radius: 8px;
2267      margin-bottom: 20px;
2268  }
2269  
2270  .postbox,
2271  .stuffbox {
2272      margin-bottom: 20px;
2273      padding: 0;
2274      line-height: 1;
2275  }
2276  
2277  .postbox.closed .postbox-header {
2278      border-bottom: 0;
2279  }
2280  
2281  /* user-select is not a part of the CSS standard - may change behavior in the future */
2282  .postbox .hndle,
2283  .stuffbox .hndle {
2284      -webkit-user-select: none;
2285      user-select: none;
2286  }
2287  
2288  .postbox .inside {
2289      padding: 0 12px 12px;
2290      line-height: 1.4;
2291      font-size: 13px;
2292  }
2293  
2294  .stuffbox .inside {
2295      padding: 0;
2296      line-height: 1.4;
2297      font-size: 13px;
2298      margin-top: 0;
2299  }
2300  
2301  .postbox .inside {
2302      margin: 11px 0;
2303      position: relative;
2304  }
2305  
2306  .postbox .inside > p:last-child,
2307  .rss-widget ul li:last-child {
2308      margin-bottom: 1px !important;
2309  }
2310  
2311  .postbox.closed h3 {
2312      border: none;
2313      box-shadow: none;
2314  }
2315  
2316  .postbox table.form-table {
2317      margin-bottom: 0;
2318  }
2319  
2320  .postbox table.widefat {
2321      box-shadow: none;
2322  }
2323  
2324  .temp-border {
2325      border: 1px dotted #c3c4c7;
2326  }
2327  
2328  .columns-prefs label {
2329      padding: 0 0 0 10px;
2330  }
2331  
2332  /* @todo: what is this doing here */
2333  #dashboard_right_now .versions .b,
2334  #post-status-display,
2335  #post-visibility-display,
2336  #adminmenu .wp-submenu li.current,
2337  #adminmenu .wp-submenu li.current a,
2338  #adminmenu .wp-submenu li.current a:hover,
2339  .media-item .percent,
2340  .plugins .name,
2341  #pass-strength-result.strong,
2342  #pass-strength-result.short,
2343  #ed_reply_toolbar #ed_reply_strong,
2344  .item-controls .item-order a,
2345  .feature-filter .feature-name,
2346  #comment-status-display {
2347      font-weight: 600;
2348  }
2349  
2350  /*------------------------------------------------------------------------------
2351    21.0 - Admin Footer
2352  ------------------------------------------------------------------------------*/
2353  
2354  #wpfooter {
2355      position: absolute;
2356      bottom: 0;
2357      right: 0;
2358      left: 0;
2359      padding: 10px 20px;
2360      color: #50575e;
2361  }
2362  
2363  #wpfooter p {
2364      font-size: 13px;
2365      margin: 0;
2366      line-height: 1.55;
2367  }
2368  
2369  #footer-thankyou {
2370      font-style: italic;
2371  }
2372  
2373  /*------------------------------------------------------------------------------
2374    25.0 - Tabbed Admin Screen Interface (Experimental)
2375  ------------------------------------------------------------------------------*/
2376  
2377  .nav-tab {
2378      float: right;
2379      border: 1px solid #c3c4c7;
2380      border-bottom: none;
2381      margin-right: 0.5em; /* half the font size so set the font size properly */
2382      padding: 5px 10px;
2383      font-size: 14px;
2384      line-height: 1.71428571;
2385      font-weight: 600;
2386      background: #dcdcde;
2387      color: #50575e;
2388      text-decoration: none;
2389      white-space: nowrap;
2390  }
2391  
2392  h3 .nav-tab, /* Back-compat for pre-4.4 */
2393  .nav-tab-small .nav-tab {
2394      padding: 5px 14px;
2395      font-size: 12px;
2396      line-height: 1.33;
2397  }
2398  
2399  .nav-tab:hover,
2400  .nav-tab:focus {
2401      background-color: #fff;
2402      color: #3c434a;
2403  }
2404  
2405  .nav-tab-active,
2406  .nav-tab:focus:active {
2407      box-shadow: none;
2408  }
2409  
2410  .nav-tab-active {
2411      margin-bottom: -1px;
2412      color: #3c434a;
2413  }
2414  
2415  .nav-tab-active,
2416  .nav-tab-active:hover,
2417  .nav-tab-active:focus,
2418  .nav-tab-active:focus:active {
2419      border-bottom: 1px solid #f0f0f1;
2420      background: #f0f0f1;
2421      color: #000;
2422  }
2423  
2424  h1.nav-tab-wrapper, /* Back-compat for pre-4.4 */
2425  .wrap h2.nav-tab-wrapper, /* higher specificity to override .wrap > h2:first-child */
2426  .nav-tab-wrapper {
2427      border-bottom: 1px solid #c3c4c7;
2428      margin: 0;
2429      padding-top: 9px;
2430      padding-bottom: 0;
2431      line-height: inherit;
2432  }
2433  
2434  /* Back-compat for plugins. Deprecated. Use .wp-clearfix instead. */
2435  .nav-tab-wrapper:not(.wp-clearfix):after {
2436      content: "";
2437      display: table;
2438      clear: both;
2439  }
2440  
2441  /*------------------------------------------------------------------------------
2442    26.0 - Misc
2443  ------------------------------------------------------------------------------*/
2444  
2445  .spinner {
2446      background: url(../images/spinner.gif) no-repeat;
2447      background-size: 20px 20px;
2448      display: inline-block;
2449      visibility: hidden;
2450      float: left;
2451      vertical-align: middle;
2452      opacity: 0.7;
2453      filter: alpha(opacity=70);
2454      width: 20px;
2455      height: 20px;
2456      margin: 10px 10px 0;
2457  }
2458  
2459  .spinner.is-active,
2460  .loading-content .spinner {
2461      visibility: visible;
2462  }
2463  
2464  #template > div {
2465      margin-left: 16em;
2466  }
2467  #template .notice {
2468      margin-top: 1em;
2469      margin-left: 3%;
2470  }
2471  #template .notice p {
2472      width: auto;
2473  }
2474  #template .submit .spinner {
2475      float: none;
2476      vertical-align: top;
2477  }
2478  
2479  .metabox-holder .stuffbox > h3, /* Back-compat for pre-4.4 */
2480  .metabox-holder .postbox > h3, /* Back-compat for pre-4.4 */
2481  .metabox-holder h3.hndle, /* Back-compat for pre-4.4 */
2482  .metabox-holder h2.hndle {
2483      font-size: 14px;
2484      padding: 8px 12px;
2485      margin: 0;
2486      line-height: 1.4;
2487  }
2488  
2489  /* Back-compat for nav-menus screen */
2490  .nav-menus-php .metabox-holder h3 {
2491      padding: 0;
2492  }
2493  
2494  .accordion-container h3.accordion-section-title {
2495      padding: 0 !important;
2496  }
2497  
2498  .accordion-section-title button.accordion-trigger,
2499  .nav-menus-php .metabox-holder .accordion-section-title button.accordion-trigger {
2500      background: inherit;
2501      color: #1d2327;
2502      display: block;
2503      position: relative;
2504      text-align: right;
2505      width: 100%;
2506      outline: none;
2507      border: 0;
2508      padding: 10px 14px 11px 10px;
2509      line-height: 1.5;
2510      cursor: pointer;
2511  }
2512  
2513  .accordion-section-title button.accordion-trigger:focus,
2514  .nav-menus-php .metabox-holder .accordion-section-title button.accordion-trigger:focus {
2515      box-shadow: 0 0 0 var(--wp-admin-border-width-focus, 1.5px) var(--wp-admin-theme-color, #3858e9);
2516      outline: 2px solid transparent;
2517  }
2518  
2519  .accordion-section-title span.dashicons.dashicons-arrow-down,
2520  .nav-menus-php .metabox-holder .accordion-section-title span.dashicons.dashicons-arrow-down {
2521      position: absolute;
2522      left: 10px;
2523      right: auto;
2524      color: #787c82;
2525      border-radius: 50px;
2526      top: 50%;
2527      transform: translateY(-50%);
2528  }
2529  
2530  .accordion-section-title:hover span.dashicons.dashicons-arrow-down,
2531  .nav-menus-php .metabox-holder .accordion-section-title:hover span.dashicons.dashicons-arrow-down {
2532      color: #1d2327;
2533  }
2534  
2535  .accordion-section-title span.dashicons.dashicons-arrow-down::before,
2536  .nav-menus-php .metabox-holder .accordion-section-title span.dashicons.dashicons-arrow-down::before {
2537      position: relative;
2538      right: -1px;
2539  }
2540  
2541  .accordion-section.open .accordion-section-title span.dashicons.dashicons-arrow-down,
2542  .nav-menus-php .metabox-holder .accordion-section.open .accordion-section-title span.dashicons.dashicons-arrow-down {
2543      transform: rotate(-180deg) translate(0, 50%);
2544  }
2545  
2546  #templateside ul li a {
2547      text-decoration: none;
2548  }
2549  
2550  .plugin-install #description,
2551  .plugin-install-network #description {
2552      width: 60%;
2553  }
2554  
2555  table .vers,
2556  table .column-visible,
2557  table .column-rating {
2558      text-align: right;
2559  }
2560  
2561  .attention,
2562  .error-message {
2563      color: #d63638;
2564      font-weight: 600;
2565  }
2566  
2567  /* Scrollbar fix for bulk upgrade iframe */
2568  body.iframe {
2569      height: 98%;
2570  }
2571  
2572  /* Upgrader styles, Specific to Language Packs */
2573  .lp-show-latest p {
2574      display: none;
2575  }
2576  .lp-show-latest p:last-child,
2577  .lp-show-latest .lp-error p {
2578      display: block;
2579  }
2580  
2581  /* - Only used once or twice in all of WP - deprecate for global style
2582  ------------------------------------------------------------------------------*/
2583  .media-icon {
2584      width: 62px; /* icon + border */
2585      text-align: center;
2586  }
2587  
2588  .media-icon img {
2589      border: 1px solid #dcdcde;
2590      border: 1px solid rgba(0, 0, 0, 0.07);
2591  }
2592  
2593  #howto {
2594      font-size: 11px;
2595      margin: 0 5px;
2596      display: block;
2597  }
2598  
2599  .importers {
2600      font-size: 16px;
2601      width: auto;
2602  }
2603  
2604  .importers td {
2605      padding-left: 14px;
2606      line-height: 1.4;
2607  }
2608  
2609  .importers .import-system {
2610      max-width: 250px;
2611  }
2612  
2613  .importers td.desc {
2614      max-width: 500px;
2615  }
2616  
2617  .importer-title,
2618  .importer-desc,
2619  .importer-action {
2620      display: block;
2621  }
2622  
2623  .importer-title {
2624      color: #000;
2625      font-size: 14px;
2626      font-weight: 400;
2627      margin-bottom: .2em;
2628  }
2629  
2630  .importer-action {
2631      line-height: 1.55; /* Same as with .updating-message */
2632      color: #50575e;
2633      margin-bottom: 1em;
2634  }
2635  
2636  #post-body #post-body-content #namediv h3, /* Back-compat for pre-4.4 */
2637  #post-body #post-body-content #namediv h2 {
2638      margin-top: 0;
2639  }
2640  
2641  .edit-comment-author {
2642      color: #1d2327;
2643      border-bottom: 1px solid #f0f0f1;
2644  }
2645  
2646  #namediv h3 label, /* Back-compat for pre-4.4 */
2647  #namediv h2 label {
2648      vertical-align: baseline;
2649  }
2650  
2651  #namediv table {
2652      width: 100%;
2653  }
2654  
2655  #namediv td.first {
2656      width: 10px;
2657      white-space: nowrap;
2658  }
2659  
2660  #namediv input {
2661      width: 100%;
2662  }
2663  
2664  #namediv p {
2665      margin: 10px 0;
2666  }
2667  
2668  /* - Used - but could/should be deprecated with a CSS reset
2669  ------------------------------------------------------------------------------*/
2670  .zerosize {
2671      height: 0;
2672      width: 0;
2673      margin: 0;
2674      border: 0;
2675      padding: 0;
2676      overflow: hidden;
2677      position: absolute;
2678  }
2679  
2680  br.clear {
2681      height: 2px;
2682      line-height: 0.15;
2683  }
2684  
2685  .checkbox {
2686      border: none;
2687      margin: 0;
2688      padding: 0;
2689  }
2690  
2691  fieldset {
2692      border: 0;
2693      padding: 0;
2694      margin: 0;
2695  }
2696  
2697  .post-categories {
2698      display: inline;
2699      margin: 0;
2700      padding: 0;
2701  }
2702  
2703  .post-categories li {
2704      display: inline;
2705  }
2706  
2707  /* Star Ratings - Back-compat for pre-3.8 */
2708  div.star-holder {
2709      position: relative;
2710      height: 17px;
2711      width: 100px;
2712      background: url(../images/stars.png?ver=20121108) repeat-x bottom right;
2713  }
2714  
2715  div.star-holder .star-rating {
2716      background: url(../images/stars.png?ver=20121108) repeat-x top right;
2717      height: 17px;
2718      float: right;
2719  }
2720  
2721  /* Star Ratings */
2722  .star-rating {
2723      white-space: nowrap;
2724  }
2725  .star-rating .star {
2726      display: inline-block;
2727      width: 20px;
2728      height: 20px;
2729      -webkit-font-smoothing: antialiased;
2730      font-size: 20px;
2731      line-height: 1;
2732      font-family: dashicons;
2733      text-decoration: inherit;
2734      font-weight: 400;
2735      font-style: normal;
2736      vertical-align: top;
2737      transition: color .1s ease-in;
2738      text-align: center;
2739      color: #dba617;
2740  }
2741  
2742  .star-rating .star-full:before {
2743      content: "\f155";
2744      content: "\f155" / '';
2745  }
2746  
2747  .star-rating .star-half:before {
2748      content: "\f459";
2749      content: "\f459" / '';
2750  }
2751  
2752  .rtl .star-rating .star-half {
2753      transform: rotateY(-180deg);
2754  }
2755  
2756  .star-rating .star-empty:before {
2757      content: "\f154";
2758      content: "\f154" / '';
2759  }
2760  
2761  div.action-links {
2762      font-weight: 400;
2763      margin: 6px 0 0;
2764  }
2765  
2766  /* Plugin install thickbox */
2767  #plugin-information {
2768      background: #fff;
2769      position: fixed;
2770      top: 0;
2771      left: 0;
2772      bottom: 0;
2773      right: 0;
2774      height: 100%;
2775      padding: 0;
2776  }
2777  
2778  #plugin-information-scrollable {
2779      overflow: auto;
2780      -webkit-overflow-scrolling: touch;
2781      height: 100%;
2782  }
2783  
2784  #plugin-information-title {
2785      padding: 0 26px;
2786      background: #f6f7f7;
2787      font-size: 22px;
2788      font-weight: 600;
2789      line-height: 2.4;
2790      position: relative;
2791      height: 56px;
2792  }
2793  
2794  #plugin-information-title.with-banner {
2795      margin-left: 0;
2796      height: 250px;
2797      background-size: cover;
2798  }
2799  
2800  #plugin-information-title h2 {
2801      font-size: 1em;
2802      font-weight: 600;
2803      padding: 0;
2804      margin: 0;
2805      overflow: hidden;
2806      text-overflow: ellipsis;
2807      white-space: nowrap;
2808  }
2809  
2810  #plugin-information-title.with-banner h2 {
2811      position: relative;
2812      font-family: "Helvetica Neue", sans-serif;
2813      display: inline-block;
2814      font-size: 30px;
2815      line-height: 1.68;
2816      box-sizing: border-box;
2817      max-width: 100%;
2818      padding: 0 15px;
2819      margin-top: 174px;
2820      color: #fff;
2821      background: rgba(29, 35, 39, 0.9);
2822      text-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
2823      box-shadow: 0 0 30px rgba(255, 255, 255, 0.1);
2824      border-radius: 8px;
2825  }
2826  
2827  #plugin-information-title div.vignette {
2828      display: none;
2829  }
2830  
2831  #plugin-information-title.with-banner div.vignette {
2832      position: absolute;
2833      display: block;
2834      top: 0;
2835      right: 0;
2836      height: 250px;
2837      width: 100%;
2838      background: transparent;
2839      box-shadow: inset 0 0 50px 4px rgba(0, 0, 0, 0.2), inset 0 -1px 0 rgba(0, 0, 0, 0.1);
2840  }
2841  
2842  #plugin-information-tabs {
2843      padding: 0 16px;
2844      position: relative;
2845      left: 0;
2846      right: 0;
2847      min-height: 36px;
2848      font-size: 0;
2849      z-index: 1;
2850      border-bottom: 1px solid #dcdcde;
2851      background: #f6f7f7;
2852  }
2853  
2854  #plugin-information-tabs a {
2855      position: relative;
2856      display: inline-block;
2857      padding: 9px 10px;
2858      margin: 0;
2859      height: 18px;
2860      line-height: 1.3;
2861      font-size: 14px;
2862      text-decoration: none;
2863      transition: none;
2864  }
2865  
2866  #plugin-information-tabs a.current {
2867      margin: 0 -1px -1px;
2868      background: #fff;
2869      border: 1px solid #dcdcde;
2870      border-bottom-color: #fff;
2871      padding-top: 8px;
2872      color: #2c3338;
2873  }
2874  
2875  #plugin-information-tabs.with-banner a.current {
2876      border-top: none;
2877      padding-top: 9px;
2878  }
2879  
2880  #plugin-information-tabs a:active,
2881  #plugin-information-tabs a:focus {
2882      outline: none;
2883  }
2884  
2885  #plugin-information-content {
2886      overflow: hidden; /* equal height column trick */
2887      background: #fff;
2888      position: relative;
2889      top: 0;
2890      left: 0;
2891      right: 0;
2892      min-height: 100%;
2893      /* Height of title + tabs + install now */
2894      min-height: calc( 100% - 152px );
2895  }
2896  
2897  #plugin-information-content.with-banner {
2898      /* Height of banner + tabs + install now */
2899      min-height: calc( 100% - 346px );
2900  }
2901  
2902  #section-holder {
2903      position: relative;
2904      top: 0;
2905      left: 250px;
2906      bottom: 0;
2907      right: 0;
2908      margin-top: 10px;
2909      margin-left: 250px; /* FYI box */
2910      padding: 10px 26px 99999px; /* equal height column trick */
2911      margin-bottom: -99932px; /* 67px less than the padding below to accommodate footer height */
2912  }
2913  
2914  #section-holder .notice {
2915      margin: 5px 0 15px;
2916  }
2917  
2918  #section-holder .updated {
2919      margin: 16px 0;
2920  }
2921  
2922  #plugin-information .fyi {
2923      float: left;
2924      position: relative;
2925      top: 0;
2926      left: 0;
2927      padding: 16px 16px 99999px; /* equal height column trick */
2928      margin-bottom: -99932px; /* 67px less than the padding below to accommodate footer height */
2929      width: 217px;
2930      border-right: 1px solid #dcdcde;
2931      background: #f6f7f7;
2932      color: #646970;
2933  }
2934  
2935  #plugin-information .fyi strong {
2936      color: #3c434a;
2937  }
2938  
2939  #plugin-information .fyi h3 {
2940      font-weight: 600;
2941      text-transform: uppercase;
2942      font-size: 12px;
2943      color: #646970;
2944      margin: 24px 0 8px;
2945  }
2946  
2947  #plugin-information .fyi h2 {
2948      font-size: 0.9em;
2949      margin-bottom: 0;
2950      margin-left: 0;
2951  }
2952  
2953  #plugin-information .fyi ul {
2954      padding: 0;
2955      margin: 0;
2956      list-style: none;
2957  }
2958  
2959  #plugin-information .fyi li {
2960      margin: 0 0 10px;
2961  }
2962  
2963  #plugin-information .fyi-description {
2964      margin-top: 0;
2965  }
2966  
2967  #plugin-information .counter-container {
2968      margin: 3px 0;
2969  }
2970  
2971  #plugin-information .counter-label {
2972      float: right;
2973      margin-left: 5px;
2974      min-width: 55px;
2975  }
2976  
2977  #plugin-information .counter-back {
2978      height: 17px;
2979      width: 92px;
2980      background-color: #dcdcde;
2981      float: right;
2982  }
2983  
2984  #plugin-information .counter-bar {
2985      height: 17px;
2986      background-color: #f0c33c; /* slightly lighter than stars due to larger expanse */
2987      float: right;
2988  }
2989  
2990  #plugin-information .counter-count {
2991      margin-right: 5px;
2992  }
2993  
2994  #plugin-information .fyi ul.contributors {
2995      margin-top: 10px;
2996  }
2997  
2998  #plugin-information .fyi ul.contributors li {
2999      display: inline-block;
3000      margin-left: 8px;
3001      vertical-align: middle;
3002  }
3003  
3004  #plugin-information .fyi ul.contributors li {
3005      display: inline-block;
3006      margin-left: 8px;
3007      vertical-align: middle;
3008  }
3009  
3010  #plugin-information .fyi ul.contributors li img {
3011      vertical-align: middle;
3012      margin-left: 4px;
3013  }
3014  
3015  #plugin-information-footer {
3016      padding: 13px 16px;
3017      position: absolute;
3018      left: 0;
3019      bottom: 0;
3020      right: 0;
3021      height: 40px; /* actual height: 40+13+13+1=67 */
3022      border-top: 1px solid #dcdcde;
3023      background: #f6f7f7;
3024  }
3025  
3026  /* rtl:ignore */
3027  #plugin-information .section {
3028      direction: ltr;
3029  }
3030  
3031  /* rtl:ignore */
3032  #plugin-information .section ul,
3033  #plugin-information .section ol {
3034      list-style-type: disc;
3035      margin-left: 24px;
3036  }
3037  
3038  #plugin-information .section,
3039  #plugin-information .section p {
3040      font-size: 14px;
3041      line-height: 1.7;
3042  }
3043  
3044  #plugin-information #section-screenshots ol {
3045      list-style: none;
3046      margin: 0;
3047  }
3048  
3049  #plugin-information #section-screenshots li img {
3050      vertical-align: text-top;
3051      margin-top: 16px;
3052      max-width: 100%;
3053      width: auto;
3054      height: auto;
3055      box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
3056  }
3057  
3058  /* rtl:ignore */
3059  #plugin-information #section-screenshots li p {
3060      font-style: italic;
3061      padding-left: 20px;
3062  }
3063  
3064  #plugin-information pre {
3065      padding: 7px;
3066      overflow: auto;
3067      border: 1px solid #c3c4c7;
3068  }
3069  
3070  #plugin-information blockquote {
3071      border-right: 2px solid #dcdcde;
3072      color: #646970;
3073      font-style: italic;
3074      margin: 1em 0;
3075      padding: 0 1em 0 0;
3076  }
3077  
3078  /* rtl:ignore */
3079  #plugin-information .review {
3080      overflow: hidden; /* clearfix */
3081      width: 100%;
3082      margin-bottom: 20px;
3083      border-bottom: 1px solid #dcdcde;
3084  }
3085  
3086  #plugin-information .review-title-section {
3087      overflow: hidden; /* clearfix */
3088  }
3089  
3090  /* rtl:ignore */
3091  #plugin-information .review-title-section h4 {
3092      display: inline-block;
3093      float: left;
3094      margin: 0 6px 0 0;
3095  }
3096  
3097  #plugin-information .reviewer-info p {
3098      clear: both;
3099      margin: 0;
3100      padding-top: 2px;
3101  }
3102  
3103  /* rtl:ignore */
3104  #plugin-information .reviewer-info .avatar {
3105      float: left;
3106      margin: 4px 6px 0 0;
3107  }
3108  
3109  /* rtl:ignore */
3110  #plugin-information .reviewer-info .star-rating {
3111      float: left;
3112  }
3113  
3114  /* rtl:ignore */
3115  #plugin-information .review-meta {
3116      float: left;
3117      margin-left: 0.75em;
3118  }
3119  
3120  /* rtl:ignore */
3121  #plugin-information .review-body {
3122      float: left;
3123      width: 100%;
3124  }
3125  
3126  .plugin-version-author-uri {
3127      font-size: 13px;
3128  }
3129  
3130  /* For non-js plugin installation screen ticket #36430. */
3131  .update-php .button.button-primary {
3132      margin-left: 1em;
3133  }
3134  
3135  @media screen and (max-width: 771px) {
3136      #plugin-information-title.with-banner {
3137          height: 100px;
3138      }
3139  
3140      #plugin-information-title.with-banner h2 {
3141          margin-top: 30px;
3142          font-size: 20px;
3143          line-height: 2;
3144          max-width: 85%;
3145      }
3146  
3147      #plugin-information-title.with-banner div.vignette {
3148          height: 100px;
3149      }
3150  
3151      #plugin-information-tabs {
3152          overflow: hidden; /* clearfix */
3153          padding: 0;
3154          height: auto; /* let tabs wrap */
3155      }
3156  
3157      #plugin-information-tabs a.current {
3158          margin-bottom: 0;
3159          border-bottom: none;
3160      }
3161  
3162      #plugin-information .fyi {
3163          float: none;
3164          border: 1px solid #dcdcde;
3165          position: static;
3166          width: auto;
3167          margin: 26px 26px 0;
3168          padding-bottom: 0; /* reset from the two column height fix */
3169      }
3170  
3171      #section-holder {
3172          position: static;
3173          margin: 0;
3174          padding-bottom: 70px; /* reset from the two column height fix, plus accommodate footer */
3175      }
3176  
3177      #plugin-information .fyi h3,
3178      #plugin-information .fyi small {
3179          display: none;
3180      }
3181  
3182      #plugin-information-footer {
3183          padding: 12px 16px 0;
3184          height: 46px;
3185      }
3186  }
3187  
3188  /* Thickbox for the Plugin details modal. */
3189  #TB_window.plugin-details-modal {
3190      background: #fff;
3191  }
3192  
3193  #TB_window.plugin-details-modal.thickbox-loading:before {
3194      content: "";
3195      display: block;
3196      width: 20px;
3197      height: 20px;
3198      position: absolute;
3199      right: 50%;
3200      top: 50%;
3201      z-index: -1;
3202      margin: -10px -10px 0 0;
3203      background: #fff url(../images/spinner.gif) no-repeat center;
3204      background-size: 20px 20px;
3205      transform: translateZ(0);
3206  }
3207  
3208  @media print,
3209      (min-resolution: 120dpi) {
3210  
3211      #TB_window.plugin-details-modal.thickbox-loading:before {
3212          background-image: url(../images/spinner-2x.gif);
3213      }
3214  }
3215  
3216  .plugin-details-modal #TB_title {
3217      float: right;
3218      height: 1px;
3219  }
3220  
3221  .plugin-details-modal #TB_ajaxWindowTitle {
3222      display: none;
3223  }
3224  
3225  .plugin-details-modal #TB_closeWindowButton {
3226      right: auto;
3227      left: -30px;
3228      color: #f0f0f1;
3229  }
3230  
3231  .plugin-details-modal #TB_closeWindowButton:hover,
3232  .plugin-details-modal #TB_closeWindowButton:focus {
3233      outline: none;
3234      box-shadow: none;
3235  }
3236  
3237  .plugin-details-modal #TB_closeWindowButton:hover::after,
3238  .plugin-details-modal #TB_closeWindowButton:focus::after {
3239      outline: 2px solid;
3240      outline-offset: -4px;
3241      border-radius: 4px;
3242  }
3243  
3244  .plugin-details-modal .tb-close-icon {
3245      display: none;
3246  }
3247  
3248  .plugin-details-modal #TB_closeWindowButton:after {
3249      content: "\f335";
3250      content: "\f335" / '';
3251      font: normal 32px/29px 'dashicons';
3252      -webkit-font-smoothing: antialiased;
3253      -moz-osx-font-smoothing: grayscale;
3254  }
3255  
3256  /* move plugin install close icon to top on narrow screens */
3257  @media screen and (max-width: 830px) {
3258      .plugin-details-modal #TB_closeWindowButton {
3259          left: 0;
3260          top: -30px;
3261      }
3262  }
3263  
3264  /* @todo: move this. */
3265  img {
3266      border: none;
3267  }
3268  
3269  /* Metabox collapse arrow indicators */
3270  .sidebar-name .toggle-indicator::before,
3271  .meta-box-sortables .postbox .toggle-indicator::before,
3272  .meta-box-sortables .postbox .order-higher-indicator::before,
3273  .meta-box-sortables .postbox .order-lower-indicator::before,
3274  .bulk-action-notice .toggle-indicator::before,
3275  .privacy-text-box .toggle-indicator::before {
3276      content: "\f142";
3277      content: "\f142" / '';
3278      display: inline-block;
3279      font: normal 20px/1 dashicons;
3280      -webkit-font-smoothing: antialiased;
3281      -moz-osx-font-smoothing: grayscale;
3282      text-decoration: none;
3283  }
3284  
3285  .js .widgets-holder-wrap.closed .toggle-indicator::before,
3286  .meta-box-sortables .postbox.closed .handlediv .toggle-indicator::before,
3287  .bulk-action-notice .bulk-action-errors-collapsed .toggle-indicator::before,
3288  .privacy-text-box.closed .toggle-indicator::before {
3289      content: "\f140";
3290      content: "\f140" / '';
3291  }
3292  
3293  .postbox .handle-order-higher .order-higher-indicator::before {
3294      content: "\f343";
3295      content: "\f343" / '';
3296      color: inherit;
3297  }
3298  
3299  .postbox .handle-order-lower .order-lower-indicator::before {
3300      content: "\f347";
3301      content: "\f347" / '';
3302      color: inherit;
3303  }
3304  
3305  .postbox .handle-order-higher .order-higher-indicator::before,
3306  .postbox .handle-order-lower .order-lower-indicator::before {
3307      position: relative;
3308      top: 0.11rem;
3309      width: 20px;
3310      height: 20px;
3311  }
3312  
3313  .postbox .handlediv .toggle-indicator::before {
3314      width: 20px;
3315      border-radius: 50%;
3316  }
3317  
3318  .postbox .handlediv .toggle-indicator::before {
3319      position: relative;
3320      top: 0.05rem;
3321      text-indent: -1px; /* account for the dashicon glyph uneven horizontal alignment */
3322  }
3323  
3324  .rtl .postbox .handlediv .toggle-indicator::before {
3325      text-indent: 1px; /* account for the dashicon glyph uneven horizontal alignment */
3326  }
3327  
3328  .bulk-action-notice .toggle-indicator::before {
3329      line-height: 16px;
3330      vertical-align: top;
3331      color: #787c82;
3332  }
3333  
3334  .postbox .handle-order-higher:focus,
3335  .postbox .handle-order-lower:focus,
3336  .postbox .handlediv:focus {
3337      box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus, 1.5px) var(--wp-admin-theme-color);
3338      border-radius: 50%;
3339      /* Only visible in Windows High Contrast mode */
3340      outline: 2px solid transparent;
3341  }
3342  
3343  .postbox .handle-order-higher:focus .order-higher-indicator::before,
3344  .postbox .handle-order-lower:focus .order-lower-indicator::before,
3345  .postbox .handlediv:focus .toggle-indicator::before {
3346      box-shadow: none;
3347      /* Only visible in Windows High Contrast mode */
3348      outline: 1px solid transparent;
3349  }
3350  
3351  /* @todo: appears to be Press This only and overridden */
3352  #photo-add-url-div input[type="text"] {
3353      width: 300px;
3354  }
3355  
3356  /* Theme/Plugin file editor */
3357  .alignleft h2 {
3358      margin: 0;
3359  }
3360  
3361  #template textarea {
3362      font-family: Consolas, Monaco, monospace;
3363      font-size: 13px;
3364      background: #f6f7f7;
3365      tab-size: 4;
3366  }
3367  
3368  #template textarea,
3369  #template .CodeMirror {
3370      width: 100%;
3371      min-height: 60vh;
3372      height: calc( 100vh - 295px );
3373      border: 1px solid #dcdcde;
3374      box-sizing: border-box;
3375  }
3376  
3377  #templateside > h2 {
3378      padding-top: 6px;
3379      padding-bottom: 7px;
3380      margin: 0;
3381  }
3382  
3383  #templateside ol,
3384  #templateside ul {
3385      margin: 0;
3386      padding: 0;
3387  }
3388  #templateside > ul {
3389      box-sizing: border-box;
3390      margin-top: 0;
3391      overflow: auto;
3392      padding: 0;
3393      min-height: 60vh;
3394      height: calc(100vh - 295px);
3395      background-color: #f6f7f7;
3396      border: 1px solid #dcdcde;
3397      border-right: none;
3398  }
3399  #templateside ul ul {
3400      padding-right: 12px;
3401  }
3402  #templateside > ul > li > ul[role=group] {
3403      padding-right: 0;
3404  }
3405  
3406  /*
3407   * Styles for Theme and Plugin file editors.
3408   */
3409  
3410  /* Hide collapsed items. */
3411  [role="treeitem"][aria-expanded="false"] > ul {
3412      display: none;
3413  }
3414  
3415  /* Use arrow dashicons for folder states, but hide from screen readers. */
3416  [role="treeitem"] span[aria-hidden] {
3417      display: inline;
3418      font-family: dashicons;
3419      font-size: 20px;
3420      position: absolute;
3421      pointer-events: none;
3422  }
3423  [role="treeitem"][aria-expanded="false"] > .folder-label .icon:after {
3424      content: "\f141";
3425      content: "\f139" / '';
3426  }
3427  [role="treeitem"][aria-expanded="true"] > .folder-label .icon:after {
3428      content: "\f140";
3429      content: "\f140" / '';
3430  }
3431  [role="treeitem"] .folder-label {
3432      display: block;
3433      padding: 3px 12px 3px 3px;
3434      cursor: pointer;
3435  }
3436  
3437  /* Remove outline, and create our own focus and hover styles */
3438  [role="treeitem"] {
3439      outline: 0;
3440  }
3441  
3442  [role="treeitem"] a:focus,
3443  [role="treeitem"] .folder-label.focus {
3444      color: #043959;
3445      /* Reset default focus style. */
3446      box-shadow: none;
3447      /* Use an inset outline instead, so it's visible also over the current file item. */
3448      outline: 2px solid var(--wp-admin-theme-color, #3858e9);
3449      outline-offset: -2px;
3450  }
3451  
3452  [role="treeitem"].hover,
3453  [role="treeitem"] .folder-label.hover {
3454      background-color: #f0f0f1;
3455  }
3456  
3457  .tree-folder {
3458      margin: 0;
3459      position: relative;
3460  }
3461  [role="treeitem"] li {
3462      position: relative;
3463  }
3464  
3465  /* Styles for folder indicators/depth */
3466  .tree-folder .tree-folder::after {
3467      content: "";
3468      display: block;
3469      position: absolute;
3470      right: 2px;
3471      border-right: 1px solid #c3c4c7;
3472      top: -13px;
3473      bottom: 10px;
3474  }
3475  .tree-folder > li::before {
3476      content: "";
3477      position: absolute;
3478      display: block;
3479      border-right: 1px solid #c3c4c7;
3480      right: 2px;
3481      top: -5px;
3482      height: 18px;
3483      width: 7px;
3484      border-bottom: 1px solid #c3c4c7;
3485  }
3486  .tree-folder > li::after {
3487      content: "";
3488      position: absolute;
3489      display: block;
3490      border-right: 1px solid #c3c4c7;
3491      right: 2px;
3492      bottom: -7px;
3493      top: 0;
3494  }
3495  
3496  /* current-file needs to adjustment for .notice styles */
3497  #templateside .current-file {
3498      margin: -4px 0 -2px;
3499  }
3500  .tree-folder > .current-file::before {
3501      right: 4px;
3502      height: 15px;
3503      width: 0;
3504      border-right: none;
3505      top: 3px;
3506  }
3507  .tree-folder > .current-file::after {
3508      bottom: -4px;
3509      height: 7px;
3510      right: 2px;
3511      top: auto;
3512  }
3513  
3514  /* Lines shouldn't continue on last item */
3515  .tree-folder > li:last-child::after,
3516  .tree-folder li:last-child > .tree-folder::after {
3517      display: none;
3518  }
3519  
3520  #theme-plugin-editor-selector,
3521  #theme-plugin-editor-label,
3522  #documentation label {
3523      font-weight: 600;
3524  }
3525  
3526  #theme-plugin-editor-label {
3527      display: inline-block;
3528      margin-bottom: 1em;
3529  }
3530  
3531  /* rtl:ignore */
3532  #template textarea,
3533  #docs-list {
3534      direction: ltr;
3535  }
3536  
3537  .fileedit-sub #theme,
3538  .fileedit-sub #plugin {
3539      max-width: 40%;
3540  }
3541  .fileedit-sub .alignright {
3542      text-align: left;
3543  }
3544  
3545  #template p {
3546      width: 97%;
3547  }
3548  
3549  #file-editor-linting-error {
3550      margin-top: 1em;
3551      margin-bottom: 1em;
3552  }
3553  #file-editor-linting-error > .notice {
3554      margin: 0;
3555      display: inline-block;
3556  }
3557  #file-editor-linting-error > .notice > p {
3558      width: auto;
3559  }
3560  #template .submit {
3561      margin-top: 1em;
3562      padding: 0;
3563  }
3564  
3565  #template .submit input[type=submit][disabled] {
3566      cursor: not-allowed;
3567  }
3568  #templateside {
3569      float: left;
3570      width: 16em;
3571      word-wrap: break-word;
3572  }
3573  
3574  #postcustomstuff p.submit {
3575      margin: 0;
3576  }
3577  
3578  #templateside h4 {
3579      margin: 1em 0 0;
3580  }
3581  
3582  #templateside li {
3583      margin: 4px 0;
3584  }
3585  
3586  #templateside li:not(.howto) a,
3587  .theme-editor-php .highlight {
3588      display: block;
3589      padding: 3px 12px 3px 0;
3590      text-decoration: none;
3591  }
3592  
3593  #templateside li.current-file > a {
3594      padding-bottom: 0;
3595  }
3596  
3597  #templateside li:not(.howto) > a:first-of-type {
3598      padding-top: 0;
3599  }
3600  
3601  #templateside li.howto {
3602      padding: 6px 12px 12px;
3603  }
3604  
3605  .theme-editor-php .highlight {
3606      margin: -3px -12px -3px 3px;
3607  }
3608  
3609  #templateside .highlight {
3610      border: none;
3611      font-weight: 600;
3612  }
3613  
3614  .nonessential {
3615      color: #646970;
3616      font-size: 11px;
3617      font-style: italic;
3618      padding-right: 12px;
3619  }
3620  
3621  #documentation {
3622      margin-top: 10px;
3623  }
3624  
3625  #documentation label {
3626      line-height: 1.8;
3627      vertical-align: baseline;
3628  }
3629  
3630  .fileedit-sub {
3631      padding: 10px 0 8px;
3632      line-height: 180%;
3633  }
3634  
3635  #file-editor-warning .file-editor-warning-content {
3636      margin: 25px;
3637  }
3638  
3639  /* @todo: can we use a common class for these? */
3640  .nav-menus-php .item-edit:before,
3641  .wp-customizer .control-section .accordion-section-title:after,
3642  .wp-customizer .accordion-section-title:after,
3643  .widget-top .widget-action .toggle-indicator:before {
3644      content: "\f140";
3645      content: "\f140" / '';
3646      font: normal 20px/1 dashicons;
3647      display: block;
3648      -webkit-font-smoothing: antialiased;
3649      -moz-osx-font-smoothing: grayscale;
3650      text-decoration: none;
3651  }
3652  
3653  .widget-top .widget-action .toggle-indicator:before {
3654      padding: 1px 0 1px 2px;
3655      border-radius: 50%;
3656  }
3657  
3658  .handlediv,
3659  .postbox .handlediv.button-link,
3660  .item-edit,
3661  .toggle-indicator {
3662      color: #646970;
3663  }
3664  
3665  .widget-action {
3666      color: #50575e; /* #fafafa background in the Widgets screen */
3667  }
3668  
3669  .widget-top:hover .widget-action,
3670  .widget-action:focus,
3671  .handlediv:hover,
3672  .handlediv:focus,
3673  .postbox .handlediv.button-link:hover,
3674  .postbox .handlediv.button-link:focus,
3675  .item-edit:hover,
3676  .item-edit:focus,
3677  .sidebar-name:hover .toggle-indicator {
3678      color: #1d2327;
3679      /* Only visible in Windows High Contrast mode */
3680      outline: 2px solid transparent;
3681  }
3682  
3683  .widget-top .widget-action:focus .toggle-indicator:before {
3684      box-shadow: 0 0 0 var(--wp-admin-border-width-focus, 1.5px) var(--wp-admin-theme-color, #3858e9);
3685      /* Only visible in Windows High Contrast mode */
3686      outline: 2px solid transparent;
3687  }
3688  
3689  #customize-info.open .accordion-section-title:after,
3690  .nav-menus-php .menu-item-edit-active .item-edit:before,
3691  .widget.open .widget-top .widget-action .toggle-indicator:before,
3692  .widget.widget-in-question .widget-top .widget-action .toggle-indicator:before {
3693      content: "\f142";
3694      content: "\f142" / '';
3695  }
3696  
3697  /*!
3698   * jQuery UI Draggable/Sortable 1.11.4
3699   * http://jqueryui.com
3700   *
3701   * Copyright jQuery Foundation and other contributors
3702   * Released under the MIT license.
3703   * http://jquery.org/license
3704   */
3705  .ui-draggable-handle,
3706  .ui-sortable-handle {
3707      touch-action: none;
3708  }
3709  
3710  /* Accordion */
3711  .accordion-section {
3712      border-bottom: 1px solid #dcdcde;
3713      margin: 0;
3714  }
3715  
3716  .accordion-section.open .accordion-section-content,
3717  .no-js .accordion-section .accordion-section-content {
3718      display: block;
3719  }
3720  
3721  .accordion-section.open:hover {
3722      border-bottom-color: #dcdcde;
3723  }
3724  
3725  .accordion-section-content {
3726      display: none;
3727      padding: 10px 20px 15px;
3728      overflow: hidden;
3729      background: #fff;
3730  }
3731  
3732  .accordion-section-title {
3733      margin: 0;
3734      position: relative;
3735      border-right: 1px solid #dcdcde;
3736      border-left: 1px solid #dcdcde;
3737      -webkit-user-select: none;
3738      user-select: none;
3739  }
3740  
3741  .js .accordion-section-title {
3742      cursor: pointer;
3743  }
3744  
3745  .js .accordion-section-title:after {
3746      position: absolute;
3747      top: 12px;
3748      left: 10px;
3749      z-index: 1;
3750  }
3751  
3752  .accordion-section-title:focus {
3753      /* Only visible in Windows High Contrast mode */
3754      outline: 1px solid transparent;
3755  }
3756  
3757  .accordion-section-title:hover:after,
3758  .accordion-section-title:focus:after {
3759      border-color: #a7aaad transparent;
3760      /* Only visible in Windows High Contrast mode */
3761      outline: 1px solid transparent;
3762  }
3763  
3764  .cannot-expand .accordion-section-title {
3765      cursor: auto;
3766  }
3767  
3768  .cannot-expand .accordion-section-title:after {
3769      display: none;
3770  }
3771  
3772  .control-section .accordion-section-title,
3773  .customize-pane-child .accordion-section-title {
3774      border-right: none;
3775      border-left: none;
3776      padding: 10px 14px 11px 10px;
3777      line-height: 1.55;
3778      background: #fff;
3779  }
3780  
3781  .control-section .accordion-section-title:after,
3782  .customize-pane-child .accordion-section-title:after {
3783      top: calc(50% - 10px); /* Arrow height is 20px, so use half of that to vertically center */
3784  }
3785  
3786  .js .control-section:hover .accordion-section-title,
3787  .js .control-section .accordion-section-title:hover,
3788  .js .control-section.open .accordion-section-title,
3789  .js .control-section .accordion-section-title:focus {
3790      color: #1d2327;
3791      background: #f6f7f7;
3792  }
3793  
3794  .control-section.open .accordion-section-title {
3795      /* When expanded */
3796      border-bottom: 1px solid #dcdcde;
3797  }
3798  
3799  /* Edit Site */
3800  .network-admin .edit-site-actions {
3801      margin-top: 0;
3802  }
3803  
3804  /* My Sites */
3805  .my-sites {
3806      display: block;
3807      overflow: auto;
3808      zoom: 1;
3809  }
3810  
3811  .my-sites li {
3812      display: block;
3813      padding: 8px 3%;
3814      min-height: 130px;
3815      margin: 0;
3816  }
3817  
3818  @media only screen and (max-width: 599px) {
3819      .my-sites li {
3820          min-height: 0;
3821      }
3822  }
3823  
3824  @media only screen and (min-width: 600px) {
3825      .my-sites.striped li {
3826          background-color: #fff;
3827          position: relative;
3828      }
3829      .my-sites.striped li:after {
3830          content: "";
3831          width: 1px;
3832          height: 100%;
3833          position: absolute;
3834          top: 0;
3835          left: 0;
3836          background: #c3c4c7;
3837      }
3838  
3839  }
3840  @media only screen and (min-width: 600px) and (max-width: 699px) {
3841      .my-sites li{
3842          float: right;
3843          width: 44%;
3844      }
3845      .my-sites.striped li {
3846          background-color: #fff;
3847      }
3848      .my-sites.striped li:nth-of-type(2n+1) {
3849          clear: right;
3850      }
3851      .my-sites.striped li:nth-of-type(2n+2):after {
3852          content: none;
3853      }
3854      .my-sites li:nth-of-type(4n+1),
3855      .my-sites li:nth-of-type(4n+2) {
3856          background-color: #f6f7f7;
3857      }
3858  
3859  }
3860  
3861  @media only screen and (min-width: 700px) and (max-width: 1199px) {
3862      .my-sites li {
3863          float: right;
3864          width: 27.333333%;
3865          background-color: #fff;
3866      }
3867      .my-sites.striped li:nth-of-type(3n+3):after {
3868          content: none;
3869      }
3870      .my-sites li:nth-of-type(6n+1),
3871      .my-sites li:nth-of-type(6n+2),
3872      .my-sites li:nth-of-type(6n+3) {
3873          background-color: #f6f7f7;
3874      }
3875  }
3876  
3877  @media only screen and (min-width: 1200px) and (max-width: 1399px) {
3878      .my-sites li {
3879          float: right;
3880          width: 21%;
3881          padding: 8px 2%;
3882          background-color: #fff;
3883      }
3884      .my-sites.striped li:nth-of-type(4n+1) {
3885          clear: right;
3886      }
3887      .my-sites.striped li:nth-of-type(4n+4):after {
3888          content: none;
3889      }
3890      .my-sites li:nth-of-type(8n+1),
3891      .my-sites li:nth-of-type(8n+2),
3892      .my-sites li:nth-of-type(8n+3),
3893      .my-sites li:nth-of-type(8n+4) {
3894          background-color: #f6f7f7;
3895      }
3896  }
3897  
3898  @media only screen and (min-width: 1400px) and (max-width: 1599px) {
3899      .my-sites li {
3900          float: right;
3901          width: 16%;
3902          padding: 8px 2%;
3903          background-color: #fff;
3904      }
3905      .my-sites.striped li:nth-of-type(5n+1) {
3906          clear: right;
3907      }
3908      .my-sites.striped li:nth-of-type(5n+5):after {
3909          content: none;
3910      }
3911      .my-sites li:nth-of-type(10n+1),
3912      .my-sites li:nth-of-type(10n+2),
3913      .my-sites li:nth-of-type(10n+3),
3914      .my-sites li:nth-of-type(10n+4),
3915      .my-sites li:nth-of-type(10n+5) {
3916          background-color: #f6f7f7;
3917      }
3918  }
3919  
3920  @media only screen and (min-width: 1600px) {
3921      .my-sites li {
3922          float: right;
3923          width: 12.666666%;
3924          padding: 8px 2%;
3925          background-color: #fff;
3926      }
3927      .my-sites.striped li:nth-of-type(6n+1) {
3928          clear: right;
3929      }
3930      .my-sites.striped li:nth-of-type(6n+6):after {
3931          content: none;
3932      }
3933      .my-sites li:nth-of-type(12n+1),
3934      .my-sites li:nth-of-type(12n+2),
3935      .my-sites li:nth-of-type(12n+3),
3936      .my-sites li:nth-of-type(12n+4),
3937      .my-sites li:nth-of-type(12n+5),
3938      .my-sites li:nth-of-type(12n+6) {
3939          background-color: #f6f7f7;
3940      }
3941  }
3942  
3943  .my-sites li a {
3944      text-decoration: none;
3945  }
3946  
3947  /* =Media Queries
3948  -------------------------------------------------------------- */
3949  
3950  /**
3951   * HiDPI Displays
3952   */
3953  @media print,
3954    (min-resolution: 120dpi) {
3955      /* Back-compat for pre-3.8 */
3956      div.star-holder,
3957      div.star-holder .star-rating {
3958          background: url(../images/stars-2x.png?ver=20121108) repeat-x bottom right;
3959          background-size: 21px 37px;
3960      }
3961  
3962      .spinner {
3963          background-image: url(../images/spinner-2x.gif);
3964      }
3965  
3966  }
3967  
3968  @media screen and (max-width: 782px) {
3969      html.wp-toolbar {
3970          padding-top: var(--wp-admin--admin-bar--height);
3971      }
3972  
3973      .screen-reader-shortcut:focus {
3974          top: -39px;
3975      }
3976  
3977      .block-editor-page .screen-reader-shortcut:focus {
3978          top: 7px;
3979      }
3980  
3981      .screen-reader-shortcut[href="#wp-toolbar"] {
3982          display: none;
3983      }
3984  
3985      body {
3986          min-width: 240px;
3987          overflow-x: hidden;
3988      }
3989  
3990      body * {
3991          -webkit-tap-highlight-color: rgba(0, 0, 0, 0) !important;
3992      }
3993  
3994      #wpcontent {
3995          position: relative;
3996          margin-right: 0;
3997          padding-right: 10px;
3998      }
3999  
4000      #wpbody-content {
4001          padding-bottom: 100px;
4002      }
4003  
4004      .wrap {
4005          clear: both;
4006          margin-left: 12px;
4007          margin-right: 0;
4008      }
4009  
4010      /* categories */
4011      #col-left,
4012      #col-right {
4013          float: none;
4014          width: auto;
4015      }
4016  
4017      #col-left .col-wrap,
4018      #col-right .col-wrap {
4019          padding: 0;
4020      }
4021  
4022      /* Hidden Elements */
4023      #collapse-menu,
4024      .post-format-select {
4025          display: none !important;
4026      }
4027  
4028      .wrap h1.wp-heading-inline {
4029          margin-bottom: 0.5em;
4030      }
4031  
4032      .wrap .add-new-h2, /* deprecated */
4033      .wrap .add-new-h2:active, /* deprecated */
4034      .wrap .page-title-action,
4035      .wrap .page-title-action:active {
4036          padding: 0 14px;
4037          font-size: 14px;
4038          white-space: nowrap;
4039          min-height: 40px;
4040          line-height: 2.71428571;
4041          vertical-align: middle;
4042      }
4043  
4044      /* Feedback Messages */
4045      .notice,
4046      .wrap div.updated,
4047      .wrap div.error,
4048      .media-upload-form div.error {
4049          margin: 20px 0 10px;
4050          padding: 5px 10px;
4051          font-size: 14px;
4052          line-height: 175%;
4053      }
4054  
4055      .wp-core-ui .notice.is-dismissible {
4056          padding-left: 46px;
4057      }
4058  
4059      .notice-dismiss {
4060          padding: 13px;
4061      }
4062  
4063      .wrap .icon32 + h2 {
4064          margin-top: -2px;
4065      }
4066  
4067      .wp-responsive-open #wpbody {
4068          left: -16em;
4069      }
4070  
4071      code {
4072          word-wrap: break-word;
4073          word-wrap: anywhere; /* Firefox. Allow breaking long words anywhere */
4074          word-break: break-word; /* Webkit: Treated similarly to word-wrap: break-word */
4075      }
4076  
4077      /* General Metabox */
4078      .postbox {
4079          font-size: 14px;
4080      }
4081  
4082      .metabox-holder h3.hndle, /* Back-compat for pre-4.4 */
4083      .metabox-holder .stuffbox > h3, /* Back-compat for pre-4.4 */
4084      .metabox-holder .postbox > h3, /* Back-compat for pre-4.4 */
4085      .metabox-holder h2 {
4086          padding: 12px;
4087      }
4088  
4089      .nav-menus-php .metabox-holder h3 {
4090          padding: 0;
4091      }
4092  
4093      .postbox .handlediv {
4094          margin-top: 3px;
4095      }
4096  
4097      /* Subsubsub Nav */
4098      .subsubsub {
4099          font-size: 16px;
4100          text-align: center;
4101          margin-bottom: 15px;
4102      }
4103  
4104      /* Theme/Plugin File Editor */
4105  
4106      #template textarea,
4107      #template .CodeMirror {
4108          box-sizing: border-box;
4109      }
4110  
4111      #templateside {
4112          float: none;
4113          width: auto;
4114      }
4115  
4116      #templateside > ul {
4117          border-right: 1px solid #dcdcde;
4118      }
4119  
4120      #templateside li {
4121          margin: 0;
4122      }
4123  
4124      #templateside li:not(.howto) a {
4125          display: block;
4126          padding: 5px;
4127      }
4128      #templateside li.howto {
4129          padding: 12px;
4130      }
4131  
4132      #templateside .highlight {
4133          padding: 5px;
4134          margin-right: -5px;
4135          margin-top: -5px;
4136      }
4137  
4138      #template > div,
4139      #template .notice {
4140          float: none;
4141          margin: 1em 0;
4142          width: auto;
4143      }
4144  
4145      #template .CodeMirror,
4146      #template textarea {
4147          width: 100%;
4148      }
4149  
4150      #templateside ul ul {
4151          padding-right: 1.5em;
4152      }
4153      [role="treeitem"] .folder-label {
4154          display: block;
4155          padding: 5px;
4156      }
4157      .tree-folder > li::before,
4158      .tree-folder > li::after,
4159      .tree-folder .tree-folder::after {
4160          right: -8px;
4161      }
4162      .tree-folder > li::before {
4163          top: 0;
4164          height: 13px;
4165      }
4166      .tree-folder > .current-file::before {
4167          right: -5px;
4168          top: 7px;
4169          width: 4px;
4170      }
4171      .tree-folder > .current-file::after {
4172          height: 9px;
4173          right: -8px;
4174      }
4175      .wrap #templateside span.notice {
4176          margin-right: -5px;
4177          width: 100%;
4178      }
4179  
4180      .fileedit-sub .alignright {
4181          float: right;
4182          margin-top: 15px;
4183          width: 100%;
4184          text-align: right;
4185      }
4186  
4187      .fileedit-sub .alignright label {
4188          display: block;
4189      }
4190  
4191      .fileedit-sub #theme,
4192      .fileedit-sub #plugin {
4193          margin-right: 0;
4194          max-width: 70%;
4195      }
4196  
4197      .fileedit-sub input[type="submit"] {
4198          margin-bottom: 0;
4199      }
4200  
4201      #documentation label[for="docs-list"] {
4202          display: block;
4203      }
4204  
4205      #documentation select[name="docs-list"] {
4206          margin-right: 0;
4207          max-width: 60%;
4208      }
4209  
4210      #documentation input[type="button"] {
4211          margin-bottom: 0;
4212      }
4213  
4214      #wpfooter {
4215          display: none;
4216      }
4217  
4218      #comments-form .checkforspam {
4219          display: none;
4220      }
4221  
4222      .edit-comment-author {
4223          margin: 2px 0 0;
4224      }
4225  
4226      .filter-drawer .filter-group-feature input,
4227      .filter-drawer .filter-group-feature label {
4228          line-height: 2.1;
4229      }
4230  
4231      .filter-drawer .filter-group-feature label {
4232          margin-right: 32px;
4233      }
4234  
4235      .wp-filter .button.drawer-toggle {
4236          font-size: 13px;
4237          line-height: 2;
4238          height: 28px;
4239      }
4240  
4241      /* Fix help tab columns for smaller screens */
4242      #screen-meta #contextual-help-wrap {
4243          overflow: visible;
4244      }
4245  
4246      #screen-meta #contextual-help-back,
4247      #screen-meta .contextual-help-sidebar {
4248          display: none;
4249      }
4250  
4251      #screen-meta .contextual-help-tabs {
4252          clear: both;
4253          width: 100%;
4254          float: none;
4255      }
4256  
4257      #screen-meta .contextual-help-tabs ul {
4258          margin: 0 0 1em;
4259          padding: 1em 0 0;
4260      }
4261  
4262      #screen-meta .contextual-help-tabs .active {
4263          margin: 0;
4264      }
4265  
4266      #screen-meta .contextual-help-tabs-wrap {
4267          clear: both;
4268          max-width: 100%;
4269          float: none;
4270      }
4271  
4272      #screen-meta,
4273      #screen-meta-links {
4274          margin-left: 10px;
4275      }
4276  
4277      #screen-meta-links {
4278          margin-bottom: 20px; /* Add margins beneath links for better spacing between boxes and elements */
4279      }
4280  
4281      .wp-filter .search-form input[type="search"] {
4282          font-size: 1rem;
4283      }
4284  
4285      .wp-filter .search-form.search-plugins {
4286          /* This element is a flex item. */
4287          min-width: 100%;
4288      }
4289  }
4290  
4291  /* Smartphone */
4292  @media screen and (max-width: 600px) {
4293      /* Disable horizontal scroll when responsive menu is open
4294         since we push the main content off to the right. */
4295      #wpwrap.wp-responsive-open {
4296          overflow-x: hidden;
4297      }
4298  
4299      html.wp-toolbar {
4300          padding-top: 0;
4301      }
4302  
4303      .screen-reader-shortcut:focus {
4304          top: 7px;
4305      }
4306  
4307      #wpbody {
4308          padding-top: 46px;
4309      }
4310  
4311      /* Keep full-width boxes on Edit Post page from causing horizontal scroll */
4312      div#post-body.metabox-holder.columns-1 {
4313          overflow-x: hidden;
4314      }
4315  
4316      h1.nav-tab-wrapper,
4317      .wrap h2.nav-tab-wrapper,
4318      .nav-tab-wrapper {
4319          border-bottom: 0;
4320      }
4321  
4322      h1 .nav-tab,
4323      h2 .nav-tab,
4324      h3 .nav-tab,
4325      nav .nav-tab {
4326          margin: 10px 0 0 10px;
4327          border-bottom: 1px solid #c3c4c7;
4328      }
4329  
4330      .nav-tab-active:hover,
4331      .nav-tab-active:focus,
4332      .nav-tab-active:focus:active {
4333          border-bottom: 1px solid #c3c4c7;
4334      }
4335  
4336      .wp-filter .search-form.search-plugins label {
4337          width: 100%;
4338      }
4339  }
4340  
4341  @media screen and (max-width: 480px) {
4342      .metabox-prefs-container {
4343          display: grid;
4344      }
4345  
4346      .metabox-prefs-container > * {
4347          display: inline-block;
4348          padding: 2px;
4349      }
4350  }
4351  
4352  @media screen and (max-width: 320px) {
4353      /* Prevent default center alignment and larger font for the Right Now widget when
4354         the network dashboard is viewed on a small mobile device. */
4355      #network_dashboard_right_now .subsubsub {
4356          font-size: 14px;
4357          text-align: right;
4358      }
4359  }