[Summary view] [Print] [Text view]

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