[Summary view] [Print] [Text view]

   1  /* This file was automatically generated on Apr 09 2026 23:28:55 */
   2  
   3  body {
   4      --akismet-color-charcoal: #272635;
   5      --akismet-color-light-grey: #f6f7f7;
   6      --akismet-color-mid-grey: #a7aaad;
   7      --akismet-color-dark-grey: #646970;
   8      --akismet-color-grey-80: #2c3338;
   9      --akismet-color-grey-100: #101517;
  10      --akismet-color-grey-border: #dcdcde;
  11      --akismet-color-white: #fff;
  12      --akismet-color-dark-green: #2d6a40;
  13      --akismet-color-mid-green: #357b49;
  14      --akismet-color-light-green: #4eb26a;
  15      --akismet-color-mid-red: #e82c3f;
  16      --akismet-color-light-blue: #256eff;
  17      --akismet-color-notice-light-green: #dbf0e1;
  18      --akismet-color-notice-dark-green: #69bf82;
  19      --akismet-color-notice-light-red: #ffdbde;
  20      --akismet-color-notice-dark-red: #ff6676;
  21      --akismet-color-notice-yellow: #e5c133;
  22      --akismet-color-page-bg: #fcfcfc;
  23      --akismet-color-border: #e0e0e0;
  24      --akismet-color-border-light: #f0f0f0;
  25      --akismet-color-near-black: #1e1e1e;
  26      --akismet-color-text-grey: #757575;
  27      --akismet-color-icon: #666666;
  28      --akismet-color-icon-hover: #333333;
  29  }
  30  
  31  /* UI components */
  32  #akismet-plugin-container {
  33      background-color: var(--akismet-color-page-bg);
  34      border: 1px solid var(--akismet-color-border);
  35      font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen-Sans', 'Ubuntu', 'Cantarell', 'Helvetica Neue', sans-serif;
  36      -webkit-font-smoothing: antialiased;
  37  }
  38  
  39  #akismet-plugin-container a {
  40      color: var(--akismet-color-mid-green);
  41  }
  42  
  43  #akismet-plugin-container a.akismet-button {
  44      background-color: var(--akismet-color-mid-green);
  45      color: var(--akismet-color-white);
  46  }
  47  
  48  #akismet-plugin-container button:focus-visible,
  49  #akismet-plugin-container input:focus-visible {
  50      border: 0;
  51      box-shadow: none;
  52      outline: 2px solid var(--akismet-color-light-blue);
  53  }
  54  
  55  #akismet-plugin-container a:focus-visible {
  56      box-shadow: none;
  57      outline: 2px solid var(--akismet-color-light-blue);
  58  }
  59  
  60  .akismet-masthead {
  61      border-bottom: 1px solid var(--akismet-color-border-light);
  62      box-shadow: none;
  63  }
  64  
  65  .akismet-masthead__logo {
  66      margin: 20px 0;
  67  }
  68  
  69  .akismet-section-header {
  70      box-shadow: none;
  71      margin-bottom: 0;
  72  }
  73  
  74  .akismet-section-header__label {
  75      color: var(--akismet-color-charcoal);
  76      font-weight: 600;
  77      padding-right: 0.2em;
  78  }
  79  
  80  .akismet-button, 
  81  .akismet-button:hover {
  82      border: 0;
  83      color: var(--akismet-color-white);
  84  }
  85  
  86  .akismet-button {
  87      background-color: var(--akismet-color-mid-green);
  88  }
  89  
  90  .akismet-button:hover {
  91      background-color: var(--akismet-color-dark-green);
  92  }
  93  
  94  .akismet-external-link {
  95      display: inline-block;
  96  }
  97  
  98  .akismet-external-link::after {
  99      content: "↗";
 100      display: inline-block;
 101      padding-right: 2px;
 102      text-decoration: none;
 103      vertical-align: middle;
 104  }
 105  
 106  /* Need this specificity to override the existing header rule */
 107  .akismet-new-snapshot h3.akismet-new-snapshot__header {
 108      background: none;
 109      font-size: 13px;
 110      color: var(--akismet-color-charcoal);
 111      text-align: right;
 112      text-transform: none;
 113  }
 114  
 115  .akismet-new-snapshot__number {
 116      color: var(--akismet-color-charcoal);
 117      display: block;
 118      font-size: 32px;
 119      font-weight: 400;
 120      letter-spacing: -1px;
 121      line-height: 1.5em;
 122      text-align: right;
 123  }
 124  
 125  .akismet-new-snapshot li.akismet-new-snapshot__item {
 126      color: var(--akismet-color-dark-grey);
 127      font-size: 13px;
 128      text-align: right;
 129      text-transform: none;
 130  }
 131  
 132  .akismet-masthead__logo-link {
 133      min-height: 50px;
 134  }
 135  
 136  .akismet-masthead__back-link-container {
 137      margin-top: 16px;
 138      margin-bottom: 2px;
 139  }
 140  
 141  /* Need this specificity to override the existing link rule */
 142  #akismet-plugin-container a.akismet-masthead__back-link {
 143      background-image: url(../img/arrow-left.svg);
 144      background-position: right;
 145      background-repeat: no-repeat;
 146      background-size: 16px;
 147      color: var(--akismet-color-charcoal);
 148      font-weight: 400;
 149      padding-right: 20px;
 150      text-decoration: none;
 151  }
 152  
 153  #akismet-plugin-container a.akismet-masthead__back-link:hover {
 154      text-decoration: underline;
 155  }
 156  
 157  .akismet-new-snapshot__item {
 158      border-top: 1px solid var(--akismet-color-border-light);
 159      border-right: 1px solid var(--akismet-color-border-light);
 160      padding: 1em;
 161  }
 162  
 163  .akismet-new-snapshot li:first-child {
 164      border-right: none;
 165  }
 166  
 167  .akismet-new-snapshot__list {
 168      display: flex;
 169      margin-bottom: 0;
 170  }
 171  
 172  .akismet-new-snapshot__item {
 173      flex: 1 0 33.33%;
 174      margin-bottom: 0;
 175      padding-right: 1.5em;
 176      padding-left: 1.5em;
 177  }
 178  
 179  .akismet-new-snapshot__chart {
 180      padding: 1em;
 181  }
 182  
 183  .akismet-stats-footer {
 184      align-items: center;
 185      border-radius: 0 0 7px 7px;
 186      border-top: 1px solid var(--akismet-color-border-light);
 187      display: flex;
 188      justify-content: space-between;
 189      outline-offset: -2px;
 190      padding: 1em 1.5em;
 191      text-decoration: none;
 192  }
 193  
 194  .akismet-stats-footer:hover {
 195      text-decoration: underline;
 196  }
 197  
 198  .akismet-stats-footer:focus {
 199      border-radius: 0 0 7px 7px;
 200      box-shadow: none;
 201  }
 202  
 203  .akismet-stats-footer:focus-visible {
 204      box-shadow: none;
 205      outline: 2px solid var(--akismet-color-light-blue);
 206  }
 207  
 208  .akismet-box {
 209      border: 0;
 210  }
 211  
 212  .akismet-box:not(:first-child) {
 213      margin-top: 1rem;
 214  }
 215  
 216  .akismet-box,
 217  .akismet-card {
 218      border: 1px solid var(--akismet-color-border);
 219      border-radius: 8px;
 220      overflow: hidden;
 221  }
 222  
 223  .akismet-card {
 224      margin: 16px auto 0 auto;
 225  }
 226  
 227  .akismet-lower {
 228      padding-top: 0;
 229  }
 230  
 231  .akismet-lower .inside {
 232      padding: 0;
 233  }
 234  
 235  .akismet-section-header__label {
 236      margin: 0;
 237  }
 238  
 239  .akismet-settings__row {
 240      border-bottom: 1px solid var(--akismet-color-border-light);
 241      display: block;
 242      padding: 1em 1.5em;
 243  }
 244  
 245  .akismet-settings__row-input {
 246      margin-right: auto;
 247  }
 248  
 249  .akismet-settings__row-title {
 250      font-weight: 500;
 251      font-size: 1em;
 252      margin: 0;
 253      margin-bottom: 1em;
 254  }
 255  
 256  .akismet-settings__row-description {
 257      margin-top: 0.5em;
 258  }
 259  
 260  .akismet-card-actions {
 261      display: flex;
 262      justify-content: flex-end;
 263      padding: 1em;
 264  }
 265  
 266  .akismet-card-actions__secondary-action {
 267      align-self: center;
 268      margin-inline-end: auto;
 269      margin-inline-start: 6px;
 270  }
 271  
 272  .akismet-settings__row label {
 273      padding-bottom: 1em;
 274  }
 275  
 276  .akismet-settings__row-note {
 277      font-size: 0.9em;
 278      margin-top: 0.4em;
 279  }
 280  
 281  .akismet-settings__row-note abbr {
 282      cursor: help;
 283  }
 284  
 285  .akismet-settings__row input[type="checkbox"],
 286  .akismet-settings__row input[type="radio"] {
 287      accent-color: var(--akismet-color-mid-green);
 288      box-shadow: none;
 289      flex-shrink: 0;
 290      margin: 2px 0 0 0;
 291  }
 292  
 293  .akismet-settings__row input[type="checkbox"] {
 294      margin-top: 1px;
 295      vertical-align: top;
 296      -webkit-appearance: checkbox;
 297  }
 298  
 299  .akismet-settings__row input[type="radio"] {
 300      -webkit-appearance: radio;
 301  }
 302  
 303  /* Fix up misbehaving wp-admin styles in Chrome (from forms and colors stylesheets) */
 304  .akismet-settings__row input[type="checkbox"]:checked:before {
 305      content: '';
 306  }
 307  
 308  .akismet-settings__row input[type="radio"]:checked:before {
 309      background: none;
 310  }
 311  
 312  .akismet-settings__row input[type="checkbox"]:checked:hover,
 313  .akismet-settings__row input[type="radio"]:checked:hover {
 314      accent-color: var(--akismet-color-mid-green);
 315  }
 316  
 317  .akismet-button:disabled {
 318      background-color: var(--akismet-color-mid-grey);
 319      color: var(--akismet-color-white);
 320      cursor: arrow;
 321  }
 322  
 323  .akismet-awaiting-stats,
 324  .akismet-account {
 325      padding: 0 1rem 1rem 1rem;
 326      margin: 0;
 327  }
 328  
 329  .akismet-account {
 330      display: grid;
 331      grid-template-columns: auto 1fr;
 332      margin-inline-start: 2px;
 333      margin-top: 0.25em;
 334      padding-bottom: 0;
 335      row-gap: 0.25em;
 336  }
 337  
 338  .akismet-account__label {
 339      font-weight: 500;
 340      padding-bottom: 1em;
 341      padding-inline-end: 1em;
 342  }
 343  
 344  .akismet-account__value {
 345      margin: 0;
 346      padding-bottom: 1em;
 347  }
 348  
 349  .akismet-settings__row-input-label {
 350      align-items: center;
 351      display: flex;
 352  }
 353  
 354  .akismet-settings__row-label-text {
 355      padding-right: 0.5em;
 356      margin-top: 2px;
 357  }
 358  
 359  .akismet-alert {
 360      border-right: 8px solid;
 361      border-radius: 8px;
 362      margin: 20px 0;
 363      padding: 0.2em 1em;
 364  }
 365  
 366  .akismet-alert__heading {
 367      font-size: 1em;
 368  }
 369  
 370  .akismet-alert.is-good {
 371      background-color: var(--akismet-color-notice-light-green);
 372      border-right-color: var(--akismet-color-notice-dark-green);
 373  }
 374  
 375  .akismet-alert.is-neutral {
 376      background-color: var(--akismet-color-white);
 377      border-right-color: var(--akismet-color-dark-grey);
 378  }
 379  
 380  .akismet-alert.is-bad {
 381      background-color: var(--akismet-color-notice-light-red);
 382      border-right-color: var(--akismet-color-notice-dark-red);
 383  }
 384  
 385  .akismet-alert.is-commercial {
 386      background-color: var(--akismet-color-white);
 387      border-color: var(--akismet-color-mid-grey);
 388      border-bottom-width: 1px;
 389      border-right-color: var(--akismet-color-notice-yellow);
 390      display: flex;
 391      padding-bottom: 1em;
 392  }
 393  
 394  #akismet-plugin-container .akismet-alert.is-good a,
 395  #akismet-plugin-container .akismet-alert.is-bad a {
 396      /* For better contrast - green isn't great */
 397      color: var(--akismet-color-grey-80);
 398  }
 399  
 400  .akismet-alert-header {
 401      font-size: 16px;
 402      margin-bottom: 0.5em;
 403  }
 404  
 405  .akismet-alert-button-wrapper {
 406      align-self: center;
 407      margin-right: 2em;
 408      min-width: 120px;
 409  }
 410  
 411  .akismet-alert-info {
 412      text-wrap: pretty;
 413      margin: 0.5em 0;
 414  }
 415  
 416  /* Setup */
 417  .akismet-setup-instructions__heading {
 418      font-size: 1.375rem;
 419      font-weight: 700;
 420      padding-block-end: 0;
 421  }
 422  
 423  h3.akismet-setup-instructions__subheading {
 424      color: var(--akismet-color-dark-grey);
 425      font-size: 1rem;
 426      font-weight: 400;
 427      line-height: 1.5;
 428      margin: 0 0 1.25rem;
 429      padding-block-start: 1rem;
 430  }
 431  
 432  .akismet-setup-instructions__feature-list {
 433      list-style: none;
 434      margin: 1rem 0.5rem 1.5rem;
 435      max-width: 640px;
 436      padding: 0 1rem;
 437  }
 438  
 439  .akismet-setup-instructions__feature {
 440      align-items: start;
 441      display: flex;
 442      margin-block-end: 1rem;
 443      text-align: right;
 444  }
 445  
 446  .akismet-setup-instructions__icon {
 447      height: 20px;
 448      width: 20px;
 449  }
 450  
 451  .akismet-setup-instructions__body {
 452      flex: 1;
 453      padding-inline-start: 0.5rem;
 454  }
 455  
 456  .akismet-setup-instructions__title {
 457      color: #1d2327;
 458      font-size: 1rem;
 459      font-weight: 600;
 460      line-height: 1.3;
 461      margin: 0;
 462      text-align: right;
 463  }
 464  
 465  p.akismet-setup-instructions__text {
 466      color: var(--akismet-color-grey-80);
 467      font-size: 0.875rem;
 468      line-height: 1.5;
 469      margin: 0.25rem 0 0;
 470      padding: 0;
 471      text-align: right;
 472  }
 473  
 474  .akismet-setup-instructions__button,
 475  .akismet-setup-instructions__button:hover,
 476  .akismet-setup-instructions__button:visited {
 477      font-size: 1rem;
 478      margin-inline-start: 1.5rem;
 479  }
 480  
 481  .akismet-setup__connection {
 482      background: var(--akismet-color-light-grey);
 483      border: 1px solid var(--akismet-color-grey-border);
 484      border-radius: 8px;
 485      margin: 1rem 1rem 2rem 1rem;
 486      padding: 1rem;
 487  }
 488  
 489  .akismet-setup__connection-action:not(:last-child) {
 490      margin-bottom: 1rem;
 491  }
 492  
 493  .akismet-setup__connection-user {
 494      display: flex;
 495  }
 496  
 497  .akismet-setup__connection-avatar {
 498      align-items: center;
 499      display: flex;
 500      gap: 12px;
 501      margin-bottom: 12px;
 502  }
 503  
 504  .akismet-setup__connection-avatar-image {
 505      border-radius: 50%;
 506  }
 507  
 508  .akismet-setup__connection-account-name {
 509      color: var(--akismet-color-charcoal);
 510      font-size: 0.9rem;
 511      overflow-wrap: anywhere;
 512  }
 513  
 514  .akismet-setup__connection-account-email {
 515      margin-top: 0.1rem;
 516      overflow-wrap: anywhere;
 517  }
 518  
 519  .akismet-setup__connection-action {
 520      margin-right: auto;
 521  }
 522  
 523  .akismet-setup__connection-button {
 524      text-align: center;
 525      width: 100%;
 526  }
 527  
 528  p.akismet-setup__connection-action-intro,
 529  p.akismet-setup__connection-action-description {
 530      color: var(--akismet-color-dark-grey);
 531      font-size: 0.875rem;
 532      padding: 0;
 533  }
 534  
 535  p.akismet-setup__connection-action-intro {
 536      margin: 0 0 1rem 0;
 537  }
 538  
 539  p.akismet-setup__connection-action-description {
 540      margin: 1rem 0 0;
 541  }
 542  
 543  /* API key field with copy button */
 544  .akismet-api-key-wrapper {
 545      position: relative;
 546      display: inline-flex;
 547      align-items: center;
 548  }
 549  
 550  .akismet-api-key-wrapper input {
 551      padding-left: 36px;
 552  }
 553  
 554  .akismet-api-key-copy {
 555      position: absolute;
 556      left: 4px;
 557      background: none;
 558      border: none;
 559      cursor: pointer;
 560      padding: 4px;
 561      color: var(--akismet-color-icon);
 562      display: flex;
 563      align-items: center;
 564  }
 565  
 566  .akismet-api-key-copy:hover {
 567      color: var(--akismet-color-icon-hover);
 568  }
 569  
 570  /* Setup - API key input */
 571  .akismet-enter-api-key-box {
 572      margin: 1.5rem 0;
 573  }
 574  
 575  .akismet-enter-api-key-box__reveal {
 576      background: none;
 577      border: 0;
 578      color: var(--akismet-color-mid-green);
 579      cursor: pointer;
 580      text-decoration: underline;
 581  }
 582  
 583  .akismet-enter-api-key-box__form-wrapper {
 584      display: none;
 585      margin-top: 1.5rem;
 586  }
 587  
 588  .akismet-enter-api-key-box__input-wrapper {
 589      box-sizing: border-box;
 590      display: flex;
 591      flex-wrap: nowrap;
 592      padding: 0 1.5rem;
 593      width: 100%;
 594  }
 595  
 596  .akismet-enter-api-key-box__key-input {
 597      flex-grow: 1;
 598      margin-left: 1rem;
 599  }
 600  
 601  h3.akismet-enter-api-key-box__header {
 602      padding-top: 0;
 603      padding-bottom: 1em;
 604      text-align: right;
 605  }
 606  
 607  /* Notices > Activation (shown on edit-comments.php) */
 608  #akismet-setup-prompt {
 609      background: none;
 610      border: none;
 611      margin: 0;
 612      padding: 0;
 613      width: 100%;
 614  }
 615  
 616  .akismet-activate {
 617      align-items: center;
 618      /* background-image is defined via an inline style in class.akismet-admin.php */
 619      background-color: var(--akismet-color-light-grey);
 620      background-position: calc(100% - (100% - 1em)) center;
 621      background-repeat: no-repeat;
 622      background-size: 140px;
 623      border: 1px solid var(--akismet-color-mid-green);
 624      border-right-width: 4px;
 625      display: flex;
 626      justify-content: space-between;
 627      margin: 15px 0;
 628      min-height: 60px;
 629      overflow: hidden;
 630      padding: 5px 5px 5px 160px;
 631      position: relative;
 632  }
 633  
 634  .akismet-activate__button,
 635  .akismet-activate__button:hover,
 636  .akismet-activate__button:visited {
 637      margin: 0 1em;
 638  }
 639  
 640  .akismet-activate__description {
 641      color: var(--akismet-color-charcoal);
 642      flex-grow: 1;
 643      font-size: 16px;
 644      font-weight: 600;
 645      margin: 0 auto;
 646      text-align: center;
 647      text-wrap: pretty;
 648  }
 649  
 650  /* Compatible plugins section */
 651  .akismet-compatible-plugins__content {
 652      padding: 0 1.5em 1.5em 1.5em;
 653  }
 654  
 655  .akismet-compatible-plugins__intro {
 656      margin: 0;
 657  }
 658  
 659  .akismet-compatible-plugins__section-header-label {
 660      display: block;
 661  }
 662  
 663  .akismet-compatible-plugins__section-header-label-text {
 664      padding-left: 0.5em;
 665  }
 666  
 667  .akismet-compatible-plugins__list {
 668      display: grid;
 669      grid-template-columns: 1fr;
 670      gap: 10px;
 671      margin: 1.5em 0 1em 0;
 672      padding: 0;
 673  }
 674  
 675  .akismet-compatible-plugins__card {
 676      border: 1px solid var(--akismet-color-border-light);
 677      border-radius: 4px;
 678      padding: 1em;
 679      display: flex;
 680      align-items: center;
 681  }
 682  
 683  .akismet-compatible-plugins__card-logo {
 684      padding: 0 0 0 1.5em;
 685      object-fit: contain;
 686      width: 36px;
 687      height: 36px;
 688  }
 689  
 690  .akismet-compatible-plugins__card-detail {
 691      display: flex;
 692      flex: 1;
 693      justify-content: space-between;
 694      align-items: center;
 695  }
 696  
 697  .akismet-compatible-plugins__card-title {
 698      font-size: 1.2em;
 699      margin-top: 0;
 700      margin-bottom: 0;
 701  }
 702  
 703  .akismet-compatible-plugins__docs {
 704      margin-top: 0;
 705  }
 706  
 707  .akismet-compatible-plugins__show-more {
 708      all: unset;
 709      cursor: pointer;
 710      display: flex;
 711      justify-content: space-between;
 712      position: relative;
 713      width: 100%;
 714  }
 715  
 716  /* Generates the show/hide chevron */
 717  .akismet-compatible-plugins__show-more::after {
 718      align-self: center;
 719      border-bottom: 2px solid black;
 720      border-left: 2px solid black;
 721      content: "";
 722      height: 8px;
 723      transform: rotate(-45deg);
 724      transition: transform 0.2s ease;
 725      width: 8px;
 726  }
 727  
 728  .akismet-compatible-plugins__list.is-expanded + .akismet-compatible-plugins__show-more::after {
 729      align-self: end;
 730      transform: rotate(-225deg);
 731  }
 732  
 733  /* Gutenberg medium breakpoint */
 734  @media screen and (max-width: 782px) {
 735      .akismet-new-snapshot__list {
 736          display: block;
 737      }
 738  
 739      .akismet-new-snapshot__number {
 740          float: left;
 741          font-size: 20px;
 742          font-weight: 500;
 743          margin-top: -16px;
 744      }
 745  
 746      .akismet-new-snapshot__header {
 747          font-size: 14px;
 748          font-weight: 500;
 749      }
 750  
 751      .akismet-new-snapshot__text {
 752          font-size: 12px;
 753      }
 754  
 755      .akismet-settings__row input[type="checkbox"],
 756      .akismet-settings__row input[type="radio"] {
 757          height: 24px;
 758          width: 24px;
 759      }
 760  
 761      .akismet-settings__row-label-text {
 762          padding-right: 0.8em;
 763      }
 764  
 765      .akismet-settings__row input[type="checkbox"],
 766      .akismet-settings__row input[type="radio"] {
 767          margin-top: 0;
 768      }
 769  
 770      .akismet-activate {
 771          background-size: 120px;
 772          padding-left: 134px;
 773      }
 774  
 775      .akismet-activate__button {
 776          white-space: normal;
 777      }
 778  
 779      .akismet-activate__description {
 780          font-size: 14px;
 781          margin-left: 1em;
 782      }
 783  }
 784  
 785  /* Gutenberg small breakpoint */
 786  @media screen and (max-width: 600px) {
 787      .akismet-compatible-plugins__list {
 788          gap: 8px;
 789      }
 790  
 791      .akismet-activate__button,
 792      .akismet-activate__button:hover {
 793          font-size: 13px;
 794      }
 795  
 796      .akismet-activate__description {
 797          display: none;
 798      }
 799  }