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