PHPXRef 0.7.1 : WordPress Trunk (Updated Daily) : /wp-admin/css/common.css source

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

/wp-admin/css/ -> common.css (source)
