[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      outline: none;
2952  }
2953  
2954  #plugin-information-content {
2955      overflow: hidden; /* equal height column trick */
2956      background: #fff;
2957      position: relative;
2958      top: 0;
2959      left: 0;
2960      right: 0;
2961      min-height: 100%;
2962      /* Height of title + tabs + install now */
2963      min-height: calc(100% - 152px);
2964  }
2965  
2966  #plugin-information-content.with-banner {
2967      /* Height of banner + tabs + install now */
2968      min-height: calc(100% - 346px);
2969  }
2970  
2971  #section-holder {
2972      position: relative;
2973      top: 0;
2974      left: 250px;
2975      bottom: 0;
2976      right: 0;
2977      margin-top: 10px;
2978      margin-left: 250px; /* FYI box */
2979      padding: 10px 26px 99999px; /* equal height column trick */
2980      margin-bottom: -99932px; /* 67px less than the padding below to accommodate footer height */
2981  }
2982  
2983  #section-holder .notice {
2984      margin: 5px 0 15px;
2985  }
2986  
2987  #section-holder .updated {
2988      margin: 16px 0;
2989  }
2990  
2991  #plugin-information .fyi {
2992      float: left;
2993      position: relative;
2994      top: 0;
2995      left: 0;
2996      padding: 16px 16px 99999px; /* equal height column trick */
2997      margin-bottom: -99932px; /* 67px less than the padding below to accommodate footer height */
2998      width: 217px;
2999      border-right: 1px solid #dcdcde;
3000      background: #f6f7f7;
3001      color: #646970;
3002  }
3003  
3004  #plugin-information .fyi strong {
3005      color: #3c434a;
3006  }
3007  
3008  #plugin-information .fyi h3 {
3009      font-weight: 600;
3010      text-transform: uppercase;
3011      font-size: 12px;
3012      color: #646970;
3013      margin: 24px 0 8px;
3014  }
3015  
3016  #plugin-information .fyi h2 {
3017      font-size: 0.9em;
3018      margin-bottom: 0;
3019      margin-left: 0;
3020  }
3021  
3022  #plugin-information .fyi ul {
3023      padding: 0;
3024      margin: 0;
3025      list-style: none;
3026  }
3027  
3028  #plugin-information .fyi li {
3029      margin: 0 0 10px;
3030  }
3031  
3032  #plugin-information .fyi-description {
3033      margin-top: 0;
3034  }
3035  
3036  #plugin-information .counter-container {
3037      margin: 3px 0;
3038  }
3039  
3040  #plugin-information .counter-label {
3041      float: right;
3042      margin-left: 5px;
3043      min-width: 55px;
3044  }
3045  
3046  #plugin-information .counter-back {
3047      height: 17px;
3048      width: 92px;
3049      background-color: #dcdcde;
3050      float: right;
3051  }
3052  
3053  #plugin-information .counter-bar {
3054      height: 17px;
3055      background-color: #f0c33c; /* slightly lighter than stars due to larger expanse */
3056      float: right;
3057  }
3058  
3059  #plugin-information .counter-count {
3060      margin-right: 5px;
3061  }
3062  
3063  #plugin-information .fyi ul.contributors {
3064      margin-top: 10px;
3065  }
3066  
3067  #plugin-information .fyi ul.contributors li {
3068      display: inline-block;
3069      margin-left: 8px;
3070      vertical-align: middle;
3071  }
3072  
3073  #plugin-information .fyi ul.contributors li img {
3074      vertical-align: middle;
3075      margin-left: 4px;
3076  }
3077  
3078  #plugin-information-footer {
3079      padding: 13px 16px;
3080      position: absolute;
3081      left: 0;
3082      bottom: 0;
3083      right: 0;
3084      height: 40px; /* actual height: 40+13+13+1=67 */
3085      border-top: 1px solid #dcdcde;
3086      background: #f6f7f7;
3087  }
3088  
3089  /* rtl:ignore */
3090  #plugin-information .section {
3091      direction: ltr;
3092  }
3093  
3094  /* rtl:ignore */
3095  #plugin-information .section ul,
3096  #plugin-information .section ol {
3097      list-style-type: disc;
3098      margin-left: 24px;
3099  }
3100  
3101  #plugin-information .section,
3102  #plugin-information .section p {
3103      font-size: 14px;
3104      line-height: 1.7;
3105  }
3106  
3107  #plugin-information #section-screenshots ol {
3108      list-style: none;
3109      margin: 0;
3110  }
3111  
3112  #plugin-information #section-screenshots li img {
3113      vertical-align: text-top;
3114      margin-top: 16px;
3115      max-width: 100%;
3116      width: auto;
3117      height: auto;
3118      box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
3119  }
3120  
3121  /* rtl:ignore */
3122  #plugin-information #section-screenshots li p {
3123      font-style: italic;
3124      padding-left: 20px;
3125  }
3126  
3127  #plugin-information pre {
3128      padding: 7px;
3129      overflow: auto;
3130      border: 1px solid #c3c4c7;
3131  }
3132  
3133  #plugin-information blockquote {
3134      border-right: 2px solid #dcdcde;
3135      color: #646970;
3136      font-style: italic;
3137      margin: 1em 0;
3138      padding: 0 1em 0 0;
3139  }
3140  
3141  /* rtl:ignore */
3142  #plugin-information .review {
3143      overflow: hidden; /* clearfix */
3144      width: 100%;
3145      margin-bottom: 20px;
3146      border-bottom: 1px solid #dcdcde;
3147  }
3148  
3149  #plugin-information .review-title-section {
3150      overflow: hidden; /* clearfix */
3151  }
3152  
3153  /* rtl:ignore */
3154  #plugin-information .review-title-section h4 {
3155      display: inline-block;
3156      float: left;
3157      margin: 0 6px 0 0;
3158  }
3159  
3160  #plugin-information .reviewer-info p {
3161      clear: both;
3162      margin: 0;
3163      padding-top: 2px;
3164  }
3165  
3166  /* rtl:ignore */
3167  #plugin-information .reviewer-info .avatar {
3168      float: left;
3169      margin: 4px 6px 0 0;
3170  }
3171  
3172  /* rtl:ignore */
3173  #plugin-information .reviewer-info .star-rating {
3174      float: left;
3175  }
3176  
3177  /* rtl:ignore */
3178  #plugin-information .review-meta {
3179      float: left;
3180      margin-left: 0.75em;
3181  }
3182  
3183  /* rtl:ignore */
3184  #plugin-information .review-body {
3185      float: left;
3186      width: 100%;
3187  }
3188  
3189  .plugin-version-author-uri {
3190      font-size: 13px;
3191  }
3192  
3193  /* For non-js plugin installation screen ticket #36430. */
3194  .update-php .button.button-primary {
3195      margin-left: 1em;
3196  }
3197  
3198  @media screen and (max-width: 771px) {
3199      #plugin-information-title.with-banner {
3200          height: 100px;
3201      }
3202  
3203      #plugin-information-title.with-banner h2 {
3204          margin-top: 30px;
3205          font-size: 20px;
3206          line-height: 2;
3207          max-width: 85%;
3208      }
3209  
3210      #plugin-information-title.with-banner div.vignette {
3211          height: 100px;
3212      }
3213  
3214      #plugin-information-tabs {
3215          overflow: hidden; /* clearfix */
3216          padding: 0;
3217          height: auto; /* let tabs wrap */
3218      }
3219  
3220      #plugin-information-tabs a.current {
3221          margin-bottom: 0;
3222          border-bottom: none;
3223      }
3224  
3225      #plugin-information .fyi {
3226          float: none;
3227          border: 1px solid #dcdcde;
3228          position: static;
3229          width: auto;
3230          margin: 26px 26px 0;
3231          padding-bottom: 0; /* reset from the two column height fix */
3232      }
3233  
3234      #section-holder {
3235          position: static;
3236          margin: 0;
3237          padding-bottom: 70px; /* reset from the two column height fix, plus accommodate footer */
3238      }
3239  
3240      #plugin-information .fyi h3,
3241      #plugin-information .fyi small {
3242          display: none;
3243      }
3244  }
3245  
3246  /* Thickbox for the Plugin details modal. */
3247  /* stylelint-disable selector-id-pattern -- Many IDs used by Thickbox contain uppercase charqacters and can't be changed. */
3248  #TB_window.plugin-details-modal {
3249      background: #fff;
3250  }
3251  
3252  #TB_window.plugin-details-modal.thickbox-loading::before {
3253      content: "";
3254      display: block;
3255      width: 20px;
3256      height: 20px;
3257      position: absolute;
3258      right: 50%;
3259      top: 50%;
3260      z-index: -1;
3261      margin: -10px -10px 0 0;
3262      background: #fff url(../images/spinner.gif) no-repeat center;
3263      background-size: 20px 20px;
3264      transform: translateZ(0);
3265  }
3266  
3267  @media print,
3268      (min-resolution: 120dpi) {
3269      #TB_window.plugin-details-modal.thickbox-loading::before {
3270          background-image: url(../images/spinner-2x.gif);
3271      }
3272  }
3273  
3274  .plugin-details-modal #TB_title {
3275      float: right;
3276      height: 1px;
3277  }
3278  
3279  .plugin-details-modal #TB_ajaxWindowTitle {
3280      display: none;
3281  }
3282  
3283  .plugin-details-modal #TB_closeWindowButton {
3284      right: auto;
3285      left: -30px;
3286      color: #f0f0f1;
3287  }
3288  
3289  .plugin-details-modal #TB_closeWindowButton:hover,
3290  .plugin-details-modal #TB_closeWindowButton:focus {
3291      outline: none;
3292      box-shadow: none;
3293  }
3294  
3295  .plugin-details-modal #TB_closeWindowButton:hover::after,
3296  .plugin-details-modal #TB_closeWindowButton:focus::after {
3297      outline: 2px solid;
3298      outline-offset: -4px;
3299      border-radius: 4px;
3300  }
3301  
3302  .plugin-details-modal .tb-close-icon {
3303      display: none;
3304  }
3305  
3306  .plugin-details-modal #TB_closeWindowButton::after {
3307      content: "\f335";
3308      content: "\f335" / "";
3309      font: 400 32px/29px dashicons;
3310      -webkit-font-smoothing: antialiased;
3311      -moz-osx-font-smoothing: grayscale;
3312  }
3313  
3314  /* move plugin install close icon to top on narrow screens */
3315  @media screen and (max-width: 830px) {
3316      .plugin-details-modal #TB_closeWindowButton {
3317          left: 0;
3318          top: -30px;
3319      }
3320  }
3321  /* stylelint-enable */
3322  
3323  /* @todo: move this. */
3324  img {
3325      border: none;
3326  }
3327  
3328  /* Metabox collapse arrow indicators */
3329  .sidebar-name .toggle-indicator::before,
3330  .meta-box-sortables .postbox .toggle-indicator::before,
3331  .meta-box-sortables .postbox .order-higher-indicator::before,
3332  .meta-box-sortables .postbox .order-lower-indicator::before,
3333  .bulk-action-notice .toggle-indicator::before,
3334  .privacy-text-box .toggle-indicator::before {
3335      content: "\f142";
3336      content: "\f142" / "";
3337      display: inline-block;
3338      font: 400 20px/1 dashicons;
3339      -webkit-font-smoothing: antialiased;
3340      -moz-osx-font-smoothing: grayscale;
3341      text-decoration: none;
3342  }
3343  
3344  .js .widgets-holder-wrap.closed .toggle-indicator::before,
3345  .meta-box-sortables .postbox.closed .handlediv .toggle-indicator::before,
3346  .bulk-action-notice .bulk-action-errors-collapsed .toggle-indicator::before,
3347  .privacy-text-box.closed .toggle-indicator::before {
3348      content: "\f140";
3349      content: "\f140" / "";
3350  }
3351  
3352  .postbox .handle-order-higher .order-higher-indicator::before {
3353      content: "\f343";
3354      content: "\f343" / "";
3355      color: inherit;
3356  }
3357  
3358  .postbox .handle-order-lower .order-lower-indicator::before {
3359      content: "\f347";
3360      content: "\f347" / "";
3361      color: inherit;
3362  }
3363  
3364  .postbox .handle-order-higher .order-higher-indicator::before,
3365  .postbox .handle-order-lower .order-lower-indicator::before {
3366      position: relative;
3367      top: 0.11rem;
3368      width: 20px;
3369      height: 20px;
3370  }
3371  
3372  .postbox .handlediv .toggle-indicator::before {
3373      width: 20px;
3374      border-radius: 50%;
3375      position: relative;
3376      top: 0.05rem;
3377      text-indent: -1px; /* account for the dashicon glyph uneven horizontal alignment */
3378  }
3379  
3380  .rtl .postbox .handlediv .toggle-indicator::before {
3381      text-indent: 1px; /* account for the dashicon glyph uneven horizontal alignment */
3382  }
3383  
3384  .bulk-action-notice .toggle-indicator::before {
3385      /* stylelint-disable-next-line declaration-property-unit-allowed-list -- This line-height value is used for a dashicon. */
3386      line-height: 16px;
3387      vertical-align: top;
3388      color: #50575e;
3389  }
3390  
3391  .postbox .handle-order-higher:focus,
3392  .postbox .handle-order-lower:focus,
3393  .postbox .handlediv:focus {
3394      box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus, 1.5px) var(--wp-admin-theme-color);
3395      border-radius: 50%;
3396      /* Only visible in Windows High Contrast mode */
3397      outline: 2px solid transparent;
3398  }
3399  
3400  .postbox .handle-order-higher:focus .order-higher-indicator::before,
3401  .postbox .handle-order-lower:focus .order-lower-indicator::before,
3402  .postbox .handlediv:focus .toggle-indicator::before {
3403      box-shadow: none;
3404      /* Only visible in Windows High Contrast mode */
3405      outline: 1px solid transparent;
3406  }
3407  
3408  /* @todo: appears to be Press This only and overridden */
3409  #photo-add-url-div input[type="text"] {
3410      width: 300px;
3411  }
3412  
3413  /* Theme/Plugin file editor */
3414  .alignleft h2 {
3415      margin: 0;
3416  }
3417  
3418  #template textarea {
3419      font-family: Consolas, Monaco, monospace;
3420      font-size: 13px;
3421      background: #f6f7f7;
3422      tab-size: 4;
3423  }
3424  
3425  #template textarea,
3426  /* stylelint-disable-next-line selector-class-pattern -- This class uses selectors that contain uppercase character in .CodeMirror external library. */
3427  #template .CodeMirror {
3428      width: 100%;
3429      min-height: 60vh;
3430      height: calc(100vh - 295px);
3431      border: 1px solid #dcdcde;
3432      box-sizing: border-box;
3433  }
3434  
3435  #templateside > h2 {
3436      padding-top: 6px;
3437      padding-bottom: 7px;
3438      margin: 0;
3439  }
3440  
3441  #templateside ol,
3442  #templateside ul {
3443      margin: 0;
3444      padding: 0;
3445  }
3446  
3447  #templateside > ul {
3448      box-sizing: border-box;
3449      margin-top: 0;
3450      overflow: auto;
3451      padding: 0;
3452      min-height: 60vh;
3453      height: calc(100vh - 295px);
3454      background-color: #f6f7f7;
3455      border: 1px solid #dcdcde;
3456      border-right: none;
3457  }
3458  
3459  #templateside ul ul {
3460      padding-right: 12px;
3461  }
3462  
3463  #templateside > ul > li > ul[role="group"] {
3464      padding-right: 0;
3465  }
3466  
3467  /*
3468   * Styles for Theme and Plugin file editors.
3469   */
3470  
3471  /* Hide collapsed items. */
3472  [role="treeitem"][aria-expanded="false"] > ul {
3473      display: none;
3474  }
3475  
3476  /* Use arrow dashicons for folder states, but hide from screen readers. */
3477  [role="treeitem"] span[aria-hidden] {
3478      display: inline;
3479      font-family: dashicons;
3480      font-size: 20px;
3481      line-height: 1;
3482      position: absolute;
3483      pointer-events: none;
3484  }
3485  
3486  [role="treeitem"][aria-expanded="false"] > .folder-label .icon::after {
3487      content: "\f141";
3488      content: "\f141" / "";
3489  }
3490  
3491  [role="treeitem"][aria-expanded="true"] > .folder-label .icon::after {
3492      content: "\f140";
3493      content: "\f140" / "";
3494  }
3495  
3496  [role="treeitem"] .folder-label {
3497      display: block;
3498      padding: 3px 12px 3px 3px;
3499      cursor: pointer;
3500  }
3501  
3502  /* Remove outline, and create our own focus and hover styles */
3503  [role="treeitem"] {
3504      outline: 0;
3505  }
3506  
3507  [role="treeitem"] a:focus,
3508  [role="treeitem"] .folder-label.focus {
3509      color: #043959;
3510      /* Reset default focus style. */
3511      box-shadow: none;
3512      /* Use an inset outline instead, so it's visible also over the current file item. */
3513      outline: 2px solid var(--wp-admin-theme-color, #3858e9);
3514      outline-offset: -2px;
3515  }
3516  
3517  [role="treeitem"].hover,
3518  [role="treeitem"] .folder-label.hover {
3519      background-color: #f0f0f1;
3520  }
3521  
3522  .tree-folder {
3523      margin: 0;
3524      position: relative;
3525  }
3526  
3527  [role="treeitem"] li {
3528      position: relative;
3529  }
3530  
3531  /* Styles for folder indicators/depth */
3532  .tree-folder .tree-folder::after {
3533      content: "";
3534      display: block;
3535      position: absolute;
3536      right: 2px;
3537      border-right: 1px solid #c3c4c7;
3538      top: -13px;
3539      bottom: 10px;
3540  }
3541  
3542  .tree-folder > li::before {
3543      content: "";
3544      position: absolute;
3545      display: block;
3546      border-right: 1px solid #c3c4c7;
3547      right: 2px;
3548      top: -5px;
3549      height: 18px;
3550      width: 7px;
3551      border-bottom: 1px solid #c3c4c7;
3552  }
3553  
3554  .tree-folder > li::after {
3555      content: "";
3556      position: absolute;
3557      display: block;
3558      border-right: 1px solid #c3c4c7;
3559      right: 2px;
3560      bottom: -7px;
3561      top: 0;
3562  }
3563  
3564  /* current-file needs to adjustment for .notice styles */
3565  #templateside .current-file {
3566      margin: -4px 0 -2px;
3567  }
3568  
3569  .tree-folder > .current-file::before {
3570      right: 4px;
3571      height: 15px;
3572      width: 0;
3573      border-right: none;
3574      top: 3px;
3575  }
3576  
3577  .tree-folder > .current-file::after {
3578      bottom: -4px;
3579      height: 7px;
3580      right: 2px;
3581      top: auto;
3582  }
3583  
3584  /* Lines shouldn't continue on last item */
3585  .tree-folder > li:last-child::after,
3586  .tree-folder li:last-child > .tree-folder::after {
3587      display: none;
3588  }
3589  
3590  #theme-plugin-editor-selector,
3591  #theme-plugin-editor-label,
3592  #documentation label {
3593      font-weight: 600;
3594  }
3595  
3596  #theme-plugin-editor-label {
3597      display: inline-block;
3598      margin-bottom: 1em;
3599  }
3600  
3601  /* rtl:ignore */
3602  #template textarea,
3603  #docs-list {
3604      direction: ltr;
3605  }
3606  
3607  .fileedit-sub #theme,
3608  .fileedit-sub #plugin {
3609      max-width: 40%;
3610  }
3611  
3612  .fileedit-sub .alignright {
3613      text-align: left;
3614  }
3615  
3616  #template p {
3617      width: 97%;
3618  }
3619  
3620  #file-editor-linting-error {
3621      margin-top: 1em;
3622      margin-bottom: 1em;
3623  }
3624  
3625  #file-editor-linting-error > .notice {
3626      margin: 0;
3627      display: inline-block;
3628  }
3629  
3630  #file-editor-linting-error > .notice > p {
3631      width: auto;
3632  }
3633  
3634  #template .submit {
3635      margin-top: 1em;
3636      padding: 0;
3637  }
3638  
3639  #templateside {
3640      float: left;
3641      width: 16em;
3642      word-wrap: break-word;
3643  }
3644  
3645  #postcustomstuff p.submit {
3646      margin: 0;
3647  }
3648  
3649  #templateside h4 {
3650      margin: 1em 0 0;
3651  }
3652  
3653  #templateside li {
3654      margin: 4px 0;
3655  }
3656  
3657  #templateside li:not(.howto) a,
3658  .theme-editor-php .highlight {
3659      display: block;
3660      padding: 3px 12px 3px 0;
3661      text-decoration: none;
3662  }
3663  
3664  #templateside li.current-file > a {
3665      padding-bottom: 0;
3666  }
3667  
3668  #templateside li:not(.howto) > a:first-of-type {
3669      padding-top: 0;
3670  }
3671  
3672  #templateside li.howto {
3673      padding: 6px 12px 12px;
3674  }
3675  
3676  .theme-editor-php .highlight {
3677      margin: -3px -12px -3px 3px;
3678  }
3679  
3680  #templateside .highlight {
3681      border: none;
3682      font-weight: 600;
3683  }
3684  
3685  .nonessential {
3686      color: #646970;
3687      font-size: 11px;
3688      font-style: italic;
3689      padding-right: 12px;
3690  }
3691  
3692  #documentation {
3693      margin-top: 10px;
3694  }
3695  
3696  #documentation label {
3697      line-height: 1.8;
3698      vertical-align: baseline;
3699  }
3700  
3701  .fileedit-sub {
3702      padding: 10px 0 8px;
3703      line-height: 1.8;
3704  }
3705  
3706  #file-editor-warning .file-editor-warning-content {
3707      margin: 25px;
3708  }
3709  
3710  /* @todo: can we use a common class for these? */
3711  .nav-menus-php .item-edit::before,
3712  .wp-customizer .control-section .accordion-section-title::after,
3713  .wp-customizer .accordion-section-title::after,
3714  .widget-top .widget-action .toggle-indicator::before {
3715      content: "\f140";
3716      content: "\f140" / "";
3717      font: 400 20px/1 dashicons;
3718      display: block;
3719      -webkit-font-smoothing: antialiased;
3720      -moz-osx-font-smoothing: grayscale;
3721      text-decoration: none;
3722  }
3723  
3724  .widget-top .widget-action .toggle-indicator::before {
3725      padding: 1px 0 1px 2px;
3726      border-radius: 50%;
3727  }
3728  
3729  .handlediv,
3730  .postbox .handlediv.button-link,
3731  .item-edit,
3732  .toggle-indicator {
3733      color: #646970;
3734  }
3735  
3736  .widget-action {
3737      color: #50575e; /* #fafafa background in the Widgets screen */
3738  }
3739  
3740  .widget-top:hover .widget-action,
3741  .widget-action:focus,
3742  .handlediv:hover,
3743  .handlediv:focus,
3744  .postbox .handlediv.button-link:hover,
3745  .postbox .handlediv.button-link:focus,
3746  .item-edit:hover,
3747  .item-edit:focus,
3748  .sidebar-name:hover .toggle-indicator {
3749      color: #1d2327;
3750      /* Only visible in Windows High Contrast mode */
3751      outline: 2px solid transparent;
3752  }
3753  
3754  .widget-top .widget-action:focus .toggle-indicator::before {
3755      box-shadow: 0 0 0 var(--wp-admin-border-width-focus, 1.5px) var(--wp-admin-theme-color, #3858e9);
3756      /* Only visible in Windows High Contrast mode */
3757      outline: 2px solid transparent;
3758  }
3759  
3760  #customize-info.open .accordion-section-title::after,
3761  .nav-menus-php .menu-item-edit-active .item-edit::before,
3762  .widget.open .widget-top .widget-action .toggle-indicator::before,
3763  .widget.widget-in-question .widget-top .widget-action .toggle-indicator::before {
3764      content: "\f142";
3765      content: "\f142" / "";
3766  }
3767  
3768  /*!
3769   * jQuery UI Draggable/Sortable 1.11.4
3770   * http://jqueryui.com
3771   *
3772   * Copyright jQuery Foundation and other contributors
3773   * Released under the MIT license.
3774   * http://jquery.org/license
3775   */
3776  .ui-draggable-handle,
3777  .ui-sortable-handle {
3778      touch-action: none;
3779  }
3780  
3781  /* Accordion */
3782  .accordion-section {
3783      border-bottom: 1px solid #dcdcde;
3784      margin: 0;
3785  }
3786  
3787  .accordion-section.open .accordion-section-content,
3788  .no-js .accordion-section .accordion-section-content {
3789      display: block;
3790  }
3791  
3792  .accordion-section.open:hover {
3793      border-bottom-color: #dcdcde;
3794  }
3795  
3796  .accordion-section-content {
3797      display: none;
3798      padding: 10px 20px 15px;
3799      overflow: hidden;
3800      background: #fff;
3801  }
3802  
3803  .accordion-section-title {
3804      margin: 0;
3805      position: relative;
3806      border-right: 1px solid #dcdcde;
3807      border-left: 1px solid #dcdcde;
3808      -webkit-user-select: none;
3809      user-select: none;
3810  }
3811  
3812  .js .accordion-section-title {
3813      cursor: pointer;
3814  }
3815  
3816  .js .accordion-section-title::after {
3817      position: absolute;
3818      top: 12px;
3819      left: 10px;
3820      z-index: 1;
3821  }
3822  
3823  .accordion-section-title:focus {
3824      /* Only visible in Windows High Contrast mode */
3825      outline: 1px solid transparent;
3826  }
3827  
3828  .accordion-section-title:hover::after,
3829  .accordion-section-title:focus::after {
3830      border-color: #a7aaad transparent;
3831      /* Only visible in Windows High Contrast mode */
3832      outline: 1px solid transparent;
3833  }
3834  
3835  .cannot-expand .accordion-section-title {
3836      cursor: auto;
3837  }
3838  
3839  .cannot-expand .accordion-section-title::after {
3840      display: none;
3841  }
3842  
3843  .control-section .accordion-section-title,
3844  .customize-pane-child .accordion-section-title {
3845      border-right: none;
3846      border-left: none;
3847      padding: 10px 14px 11px 10px;
3848      line-height: 1.55;
3849      background: #fff;
3850  }
3851  
3852  .control-section .accordion-section-title::after,
3853  .customize-pane-child .accordion-section-title::after {
3854      top: calc(50% - 10px); /* Arrow height is 20px, so use half of that to vertically center */
3855  }
3856  
3857  .js .control-section:hover .accordion-section-title,
3858  .js .control-section .accordion-section-title:hover,
3859  .js .control-section.open .accordion-section-title,
3860  .js .control-section .accordion-section-title:focus {
3861      color: #1d2327;
3862      background: #f6f7f7;
3863  }
3864  
3865  .control-section.open .accordion-section-title {
3866      /* When expanded */
3867      border-bottom: 1px solid #dcdcde;
3868  }
3869  
3870  /* Edit Site */
3871  .network-admin .edit-site-actions {
3872      margin-top: 0;
3873  }
3874  
3875  /* My Sites */
3876  .my-sites {
3877      display: block;
3878      overflow: auto;
3879      zoom: 1;
3880  }
3881  
3882  .my-sites li {
3883      display: block;
3884      padding: 8px 3%;
3885      min-height: 130px;
3886      margin: 0;
3887  }
3888  
3889  @media only screen and (max-width: 599px) {
3890      .my-sites li {
3891          min-height: 0;
3892      }
3893  }
3894  
3895  @media only screen and (min-width: 600px) {
3896      .my-sites.striped li {
3897          background-color: #fff;
3898          position: relative;
3899      }
3900  
3901      .my-sites.striped li::after {
3902          content: "";
3903          width: 1px;
3904          height: 100%;
3905          position: absolute;
3906          top: 0;
3907          left: 0;
3908          background: #c3c4c7;
3909      }
3910  
3911  }
3912  
3913  @media only screen and (min-width: 600px) and (max-width: 699px) {
3914      .my-sites li {
3915          float: right;
3916          width: 44%;
3917      }
3918  
3919      .my-sites.striped li {
3920          background-color: #fff;
3921      }
3922  
3923      .my-sites.striped li:nth-of-type(2n+1) {
3924          clear: right;
3925      }
3926  
3927      .my-sites.striped li:nth-of-type(2n+2)::after {
3928          content: none;
3929      }
3930  
3931      .my-sites li:nth-of-type(4n+1),
3932      .my-sites li:nth-of-type(4n+2) {
3933          background-color: #f6f7f7;
3934      }
3935  
3936  }
3937  
3938  @media only screen and (min-width: 700px) and (max-width: 1199px) {
3939      .my-sites li {
3940          float: right;
3941          width: 27.333333%;
3942          background-color: #fff;
3943      }
3944  
3945      .my-sites.striped li:nth-of-type(3n+3)::after {
3946          content: none;
3947      }
3948  
3949      .my-sites li:nth-of-type(6n+1),
3950      .my-sites li:nth-of-type(6n+2),
3951      .my-sites li:nth-of-type(6n+3) {
3952          background-color: #f6f7f7;
3953      }
3954  }
3955  
3956  @media only screen and (min-width: 1200px) and (max-width: 1399px) {
3957      .my-sites li {
3958          float: right;
3959          width: 21%;
3960          padding: 8px 2%;
3961          background-color: #fff;
3962      }
3963  
3964      .my-sites.striped li:nth-of-type(4n+1) {
3965          clear: right;
3966      }
3967  
3968      .my-sites.striped li:nth-of-type(4n+4)::after {
3969          content: none;
3970      }
3971  
3972      .my-sites li:nth-of-type(8n+1),
3973      .my-sites li:nth-of-type(8n+2),
3974      .my-sites li:nth-of-type(8n+3),
3975      .my-sites li:nth-of-type(8n+4) {
3976          background-color: #f6f7f7;
3977      }
3978  }
3979  
3980  @media only screen and (min-width: 1400px) and (max-width: 1599px) {
3981      .my-sites li {
3982          float: right;
3983          width: 16%;
3984          padding: 8px 2%;
3985          background-color: #fff;
3986      }
3987  
3988      .my-sites.striped li:nth-of-type(5n+1) {
3989          clear: right;
3990      }
3991  
3992      .my-sites.striped li:nth-of-type(5n+5)::after {
3993          content: none;
3994      }
3995  
3996      .my-sites li:nth-of-type(10n+1),
3997      .my-sites li:nth-of-type(10n+2),
3998      .my-sites li:nth-of-type(10n+3),
3999      .my-sites li:nth-of-type(10n+4),
4000      .my-sites li:nth-of-type(10n+5) {
4001          background-color: #f6f7f7;
4002      }
4003  }
4004  
4005  @media only screen and (min-width: 1600px) {
4006      .my-sites li {
4007          float: right;
4008          width: 12.666666%;
4009          padding: 8px 2%;
4010          background-color: #fff;
4011      }
4012  
4013      .my-sites.striped li:nth-of-type(6n+1) {
4014          clear: right;
4015      }
4016  
4017      .my-sites.striped li:nth-of-type(6n+6)::after {
4018          content: none;
4019      }
4020  
4021      .my-sites li:nth-of-type(12n+1),
4022      .my-sites li:nth-of-type(12n+2),
4023      .my-sites li:nth-of-type(12n+3),
4024      .my-sites li:nth-of-type(12n+4),
4025      .my-sites li:nth-of-type(12n+5),
4026      .my-sites li:nth-of-type(12n+6) {
4027          background-color: #f6f7f7;
4028      }
4029  }
4030  
4031  .my-sites li a {
4032      text-decoration: none;
4033  }
4034  
4035  /* =Media Queries
4036  -------------------------------------------------------------- */
4037  
4038  /**
4039   * HiDPI Displays
4040   */
4041  @media print,
4042      (min-resolution: 120dpi) {
4043      /* Back-compat for pre-3.8 */
4044      div.star-holder,
4045      div.star-holder .star-rating {
4046          background: url(../images/stars-2x.png?ver=20121108) repeat-x bottom right;
4047          background-size: 21px 37px;
4048      }
4049  
4050      .spinner {
4051          background-image: url(../images/spinner-2x.gif);
4052      }
4053  
4054  }
4055  
4056  @media screen and (max-width: 782px) {
4057      html.wp-toolbar {
4058          padding-top: var(--wp-admin--admin-bar--height);
4059      }
4060  
4061      .screen-reader-shortcut:focus {
4062          top: -39px;
4063      }
4064  
4065      .block-editor-page .screen-reader-shortcut:focus {
4066          top: 7px;
4067      }
4068  
4069      .screen-reader-shortcut[href="#wp-toolbar"] {
4070          display: none;
4071      }
4072  
4073      body {
4074          min-width: 240px;
4075          overflow-x: hidden;
4076      }
4077  
4078      body * {
4079          -webkit-tap-highlight-color: rgba(0, 0, 0, 0) !important;
4080      }
4081  
4082      #wpcontent {
4083          position: relative;
4084          margin-right: 0;
4085          padding-right: 10px;
4086      }
4087  
4088      #wpbody-content {
4089          padding-bottom: 100px;
4090      }
4091  
4092      .wrap {
4093          clear: both;
4094          margin-left: 12px;
4095          margin-right: 0;
4096      }
4097  
4098      /* categories */
4099      #col-left,
4100      #col-right {
4101          float: none;
4102          width: auto;
4103      }
4104  
4105      #col-left .col-wrap,
4106      #col-right .col-wrap {
4107          padding: 0;
4108      }
4109  
4110      /* Hidden Elements */
4111      #collapse-menu,
4112      .post-format-select {
4113          display: none !important;
4114      }
4115  
4116      .wrap h1.wp-heading-inline {
4117          margin-bottom: 0.5em;
4118      }
4119  
4120      .wrap .add-new-h2, /* deprecated */
4121      .wrap .add-new-h2:active, /* deprecated */
4122      .wrap .page-title-action,
4123      .wrap .page-title-action:active {
4124          padding: 0 14px;
4125          font-size: 14px;
4126          white-space: nowrap;
4127          min-height: 40px;
4128          line-height: 2.71428571;
4129          vertical-align: middle;
4130      }
4131  
4132      /* Feedback Messages */
4133      .notice,
4134      .wrap div.updated,
4135      .wrap div.error,
4136      .media-upload-form div.error {
4137          margin: 20px 0 10px;
4138          padding: 5px 10px;
4139          font-size: 14px;
4140          line-height: 1.75;
4141      }
4142  
4143      .wp-core-ui .notice.is-dismissible {
4144          padding-left: 46px;
4145      }
4146  
4147      .notice-dismiss {
4148          padding: 13px;
4149      }
4150  
4151      .wrap .icon32 + h2 {
4152          margin-top: -2px;
4153      }
4154  
4155      .wp-responsive-open #wpbody {
4156          left: -16em;
4157      }
4158  
4159      code {
4160          word-wrap: break-word;
4161          word-wrap: anywhere; /* Firefox. Allow breaking long words anywhere */
4162          word-break: break-word; /* Webkit: Treated similarly to word-wrap: break-word */
4163      }
4164  
4165      /* General Metabox */
4166      .postbox {
4167          font-size: 14px;
4168      }
4169  
4170      .metabox-holder h3.hndle, /* Back-compat for pre-4.4 */
4171      .metabox-holder .stuffbox > h3, /* Back-compat for pre-4.4 */
4172      .metabox-holder .postbox > h3, /* Back-compat for pre-4.4 */
4173      .metabox-holder h2 {
4174          padding: 12px;
4175      }
4176  
4177      .nav-menus-php .metabox-holder h3 {
4178          padding: 0;
4179      }
4180  
4181      .postbox .handlediv {
4182          margin-top: 3px;
4183      }
4184  
4185      /* Subsubsub Nav */
4186      .subsubsub {
4187          font-size: 16px;
4188          text-align: center;
4189          margin-bottom: 15px;
4190      }
4191  
4192      /* Theme/Plugin File Editor */
4193  
4194      #template textarea,
4195      /* stylelint-disable-next-line selector-class-pattern -- This class uses selectors that contain uppercase character in .CodeMirror external library. */
4196      #template .CodeMirror {
4197          box-sizing: border-box;
4198          width: 100%;
4199      }
4200  
4201      #templateside {
4202          float: none;
4203          width: auto;
4204      }
4205  
4206      #templateside > ul {
4207          border-right: 1px solid #dcdcde;
4208      }
4209  
4210      #templateside li {
4211          margin: 0;
4212      }
4213  
4214      #templateside li:not(.howto) a {
4215          display: block;
4216          padding: 5px;
4217      }
4218  
4219      #templateside li.howto {
4220          padding: 12px;
4221      }
4222  
4223      #templateside .highlight {
4224          padding: 5px;
4225          margin-right: -5px;
4226          margin-top: -5px;
4227      }
4228  
4229      #template > div,
4230      #template .notice {
4231          float: none;
4232          margin: 1em 0;
4233          width: auto;
4234      }
4235  
4236      #templateside ul ul {
4237          padding-right: 1.5em;
4238      }
4239  
4240      [role="treeitem"] .folder-label {
4241          display: block;
4242          padding: 5px;
4243      }
4244  
4245      .tree-folder > li::before,
4246      .tree-folder > li::after,
4247      .tree-folder .tree-folder::after {
4248          right: -8px;
4249      }
4250  
4251      .tree-folder > li::before {
4252          top: 0;
4253          height: 13px;
4254      }
4255  
4256      .tree-folder > .current-file::before {
4257          right: -5px;
4258          top: 7px;
4259          width: 4px;
4260      }
4261  
4262      .tree-folder > .current-file::after {
4263          height: 9px;
4264          right: -8px;
4265      }
4266  
4267      .wrap #templateside span.notice {
4268          margin-right: -5px;
4269          width: 100%;
4270      }
4271  
4272      .fileedit-sub .alignright {
4273          float: right;
4274          margin-top: 15px;
4275          width: 100%;
4276          text-align: right;
4277      }
4278  
4279      .fileedit-sub .alignright label {
4280          display: block;
4281      }
4282  
4283      .fileedit-sub #theme,
4284      .fileedit-sub #plugin {
4285          margin-right: 0;
4286          max-width: 70%;
4287      }
4288  
4289      .fileedit-sub input[type="submit"] {
4290          margin-bottom: 0;
4291      }
4292  
4293      #documentation label[for="docs-list"] {
4294          display: block;
4295      }
4296  
4297      #documentation select[name="docs-list"] {
4298          margin-right: 0;
4299          max-width: 60%;
4300      }
4301  
4302      #documentation input[type="button"] {
4303          margin-bottom: 0;
4304      }
4305  
4306      #comments-form .checkforspam {
4307          display: none;
4308      }
4309  
4310      .edit-comment-author {
4311          margin: 2px 0 0;
4312      }
4313  
4314      .filter-drawer .filter-group-feature input,
4315      .filter-drawer .filter-group-feature label {
4316          line-height: 2.1;
4317      }
4318  
4319      .filter-drawer .filter-group-feature label {
4320          margin-right: 32px;
4321      }
4322  
4323      .wp-filter .button.drawer-toggle {
4324          font-size: 13px;
4325          line-height: 2;
4326          height: 28px;
4327      }
4328  
4329      /* Fix help tab columns for smaller screens */
4330      #screen-meta #contextual-help-wrap {
4331          overflow: visible;
4332      }
4333  
4334      #screen-meta #contextual-help-back,
4335      #screen-meta .contextual-help-sidebar {
4336          display: none;
4337      }
4338  
4339      #screen-meta .contextual-help-tabs {
4340          clear: both;
4341          width: 100%;
4342          float: none;
4343      }
4344  
4345      #screen-meta .contextual-help-tabs ul {
4346          margin: 0 0 1em;
4347          padding: 1em 0 0;
4348      }
4349  
4350      #screen-meta .contextual-help-tabs .active {
4351          margin: 0;
4352      }
4353  
4354      #screen-meta .contextual-help-tabs-wrap {
4355          clear: both;
4356          max-width: 100%;
4357          float: none;
4358      }
4359  
4360      #screen-meta,
4361      #screen-meta-links {
4362          margin-left: 10px;
4363      }
4364  
4365      #screen-meta-links {
4366          margin-bottom: 20px; /* Add margins beneath links for better spacing between boxes and elements */
4367      }
4368  
4369      #screen-meta-links .show-settings::after {
4370          line-height: 1.9;
4371      }
4372  
4373      .wp-filter .search-form input[type="search"] {
4374          font-size: 1rem;
4375      }
4376  
4377      .wp-filter .search-form.search-plugins {
4378          /* This element is a flex item. */
4379          min-width: 100%;
4380      }
4381  }
4382  
4383  /* Smartphone */
4384  @media screen and (max-width: 600px) {
4385      /* Disable horizontal scroll when responsive menu is open
4386         since we push the main content off to the right. */
4387      #wpwrap.wp-responsive-open {
4388          overflow-x: hidden;
4389      }
4390  
4391      html.wp-toolbar {
4392          padding-top: 0;
4393      }
4394  
4395      .screen-reader-shortcut:focus {
4396          top: 7px;
4397      }
4398  
4399      #wpbody {
4400          padding-top: 46px;
4401      }
4402  
4403      /* Keep full-width boxes on Edit Post page from causing horizontal scroll */
4404      div#post-body.metabox-holder.columns-1 {
4405          overflow-x: hidden;
4406      }
4407  
4408      h1.nav-tab-wrapper,
4409      .wrap h2.nav-tab-wrapper,
4410      .nav-tab-wrapper {
4411          border-bottom: 0;
4412      }
4413  
4414      h1 .nav-tab,
4415      h2 .nav-tab,
4416      h3 .nav-tab,
4417      nav .nav-tab {
4418          margin: 10px 0 0 10px;
4419          border-bottom: 1px solid #c3c4c7;
4420      }
4421  
4422      .nav-tab-active:hover,
4423      .nav-tab-active:focus,
4424      .nav-tab-active:focus:active {
4425          border-bottom: 1px solid #c3c4c7;
4426      }
4427  
4428      .wp-filter .search-form.search-plugins label {
4429          width: 100%;
4430      }
4431  }
4432  
4433  @media screen and (max-width: 480px) {
4434      .metabox-prefs-container {
4435          display: grid;
4436      }
4437  
4438      .metabox-prefs-container > * {
4439          display: inline-block;
4440          padding: 2px;
4441      }
4442  }
4443  
4444  @media screen and (max-width: 320px) {
4445      /* Prevent default center alignment and larger font for the Right Now widget when the network dashboard is viewed on a small mobile device. */
4446      /* stylelint-disable-next-line selector-id-pattern -- The ID selector network_dashboard_right_now can't be changed because of backward compatibility reasons. */
4447      #network_dashboard_right_now .subsubsub {
4448          font-size: 14px;
4449          text-align: right;
4450      }
4451  }