[Summary view] [Print] [Text view]

   1  @charset "UTF-8";
   2  /**
   3   * Typography
   4   */
   5  /**
   6   * SCSS Variables.
   7   *
   8   * Please use variables from this sheet to ensure consistency across the UI.
   9   * Don't add to this sheet unless you're pretty sure the value will be reused in many places.
  10   * For example, don't add rules to this sheet that affect block visuals. It's purely for UI.
  11   */
  12  /**
  13   * Colors
  14   */
  15  /**
  16   * Fonts & basic variables.
  17   */
  18  /**
  19   * Typography
  20   */
  21  /**
  22   * Grid System.
  23   * https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/
  24   */
  25  /**
  26   * Radius scale.
  27   */
  28  /**
  29   * Elevation scale.
  30   */
  31  /**
  32   * Dimensions.
  33   */
  34  /**
  35   * Mobile specific styles
  36   */
  37  /**
  38   * Editor styles.
  39   */
  40  /**
  41   * Block & Editor UI.
  42   */
  43  /**
  44   * Block paddings.
  45   */
  46  /**
  47   * React Native specific.
  48   * These variables do not appear to be used anywhere else.
  49   */
  50  /**
  51   * Breakpoints & Media Queries
  52   */
  53  /**
  54  *  Converts a hex value into the rgb equivalent.
  55  *
  56  * @param {string} hex - the hexadecimal value to convert
  57  * @return {string} comma separated rgb values
  58  */
  59  /**
  60   * Long content fade mixin
  61   *
  62   * Creates a fading overlay to signify that the content is longer
  63   * than the space allows.
  64   */
  65  /**
  66   * Breakpoint mixins
  67   */
  68  /**
  69   * Focus styles.
  70   */
  71  /**
  72   * Standard focus rings for the WordPress Design System.
  73   *
  74   * Apply `outset-ring__focus` inside the relevant pseudo-class at the call site,
  75   * e.g. `&:focus { @include outset-ring__focus(); }`.
  76   */
  77  /**
  78   * Applies editor left position to the selector passed as argument
  79   */
  80  /**
  81   * Styles that are reused verbatim in a few places
  82   */
  83  /**
  84   * Allows users to opt-out of animations via OS-level preferences.
  85   */
  86  /**
  87   * Reset default styles for JavaScript UI based pages.
  88   * This is a WP-admin agnostic reset
  89   */
  90  /**
  91   * Reset the WP Admin page styles for Gutenberg-like pages.
  92   */
  93  /**
  94   * Creates a checkerboard pattern background to indicate transparency.
  95   * @param {String} $size - The size of the squares in the checkerboard pattern. Default is 12px.
  96   */
  97  :root {
  98    --wp-block-synced-color: #7a00df;
  99    --wp-block-synced-color--rgb: 122, 0, 223;
 100    --wp-bound-block-color: var(--wp-block-synced-color);
 101    --wp-editor-canvas-background: #ddd;
 102    --wp-admin-theme-color: #007cba;
 103    --wp-admin-theme-color--rgb: 0, 124, 186;
 104    --wp-admin-theme-color-darker-10: rgb(0, 107, 160.5);
 105    --wp-admin-theme-color-darker-10--rgb: 0, 107, 160.5;
 106    --wp-admin-theme-color-darker-20: #005a87;
 107    --wp-admin-theme-color-darker-20--rgb: 0, 90, 135;
 108    --wp-admin-border-width-focus: 2px;
 109  }
 110  @media (min-resolution: 192dpi) {
 111    :root {
 112      --wp-admin-border-width-focus: 1.5px;
 113    }
 114  }
 115  
 116  /**
 117   * Colors
 118   */
 119  /**
 120   * SCSS Variables.
 121   *
 122   * Please use variables from this sheet to ensure consistency across the UI.
 123   * Don't add to this sheet unless you're pretty sure the value will be reused in many places.
 124   * For example, don't add rules to this sheet that affect block visuals. It's purely for UI.
 125   */
 126  /**
 127   * Fonts & basic variables.
 128   */
 129  /**
 130   * Typography
 131   */
 132  /**
 133   * Grid System.
 134   * https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/
 135   */
 136  /**
 137   * Radius scale.
 138   */
 139  /**
 140   * Elevation scale.
 141   */
 142  /**
 143   * Dimensions.
 144   */
 145  /**
 146   * Mobile specific styles
 147   */
 148  /**
 149   * Editor styles.
 150   */
 151  /**
 152   * Block & Editor UI.
 153   */
 154  /**
 155   * Block paddings.
 156   */
 157  /**
 158   * React Native specific.
 159   * These variables do not appear to be used anywhere else.
 160   */
 161  .interface-complementary-area-header {
 162    background: #fff;
 163    padding-right: 8px;
 164    gap: 4px;
 165  }
 166  
 167  .interface-complementary-area-header .interface-complementary-area-header__title {
 168    margin: 0 auto 0 0;
 169  }
 170  
 171  /**
 172   * Typography
 173   */
 174  /**
 175   * Breakpoints & Media Queries
 176   */
 177  /**
 178  *  Converts a hex value into the rgb equivalent.
 179  *
 180  * @param {string} hex - the hexadecimal value to convert
 181  * @return {string} comma separated rgb values
 182  */
 183  /**
 184   * Long content fade mixin
 185   *
 186   * Creates a fading overlay to signify that the content is longer
 187   * than the space allows.
 188   */
 189  /**
 190   * Breakpoint mixins
 191   */
 192  /**
 193   * Focus styles.
 194   */
 195  /**
 196   * Standard focus rings for the WordPress Design System.
 197   *
 198   * Apply `outset-ring__focus` inside the relevant pseudo-class at the call site,
 199   * e.g. `&:focus { @include outset-ring__focus(); }`.
 200   */
 201  /**
 202   * Applies editor left position to the selector passed as argument
 203   */
 204  /**
 205   * Styles that are reused verbatim in a few places
 206   */
 207  /**
 208   * Allows users to opt-out of animations via OS-level preferences.
 209   */
 210  /**
 211   * Reset default styles for JavaScript UI based pages.
 212   * This is a WP-admin agnostic reset
 213   */
 214  /**
 215   * Reset the WP Admin page styles for Gutenberg-like pages.
 216   */
 217  /**
 218   * Creates a checkerboard pattern background to indicate transparency.
 219   * @param {String} $size - The size of the squares in the checkerboard pattern. Default is 12px.
 220   */
 221  .interface-complementary-area {
 222    background: #fff;
 223    color: #1e1e1e;
 224    height: 100%;
 225    overflow: auto;
 226  }
 227  
 228  @media (min-width: 782px) {
 229    .interface-complementary-area {
 230      width: 280px;
 231    }
 232  }
 233  .interface-complementary-area .components-panel {
 234    border: none;
 235    position: relative;
 236    z-index: 0;
 237  }
 238  
 239  .interface-complementary-area .components-panel__header {
 240    position: sticky;
 241    top: 0;
 242    z-index: 1;
 243  }
 244  
 245  .interface-complementary-area .components-panel__header.editor-sidebar__panel-tabs {
 246    top: 0;
 247  }
 248  
 249  .interface-complementary-area p:not(.components-base-control__help, .components-form-token-field__help) {
 250    margin-top: 0;
 251  }
 252  
 253  .interface-complementary-area h2 {
 254    font-size: 13px;
 255    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
 256    color: #1e1e1e;
 257    margin-bottom: 1.5em;
 258  }
 259  
 260  .interface-complementary-area h3 {
 261    font-size: 11px;
 262    text-transform: uppercase;
 263    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
 264    color: #1e1e1e;
 265    margin-bottom: 1.5em;
 266  }
 267  
 268  .interface-complementary-area hr {
 269    border-top: none;
 270    border-bottom: 1px solid #f0f0f0;
 271    margin: 1.5em 0;
 272  }
 273  
 274  .interface-complementary-area div.components-toolbar-group,
 275  .interface-complementary-area div.components-toolbar {
 276    box-shadow: none;
 277    margin-bottom: 1.5em;
 278  }
 279  
 280  .interface-complementary-area div.components-toolbar-group:last-child,
 281  .interface-complementary-area div.components-toolbar:last-child {
 282    margin-bottom: 0;
 283  }
 284  
 285  .interface-complementary-area .block-editor-skip-to-selected-block:focus {
 286    top: auto;
 287    right: 10px;
 288    bottom: 10px;
 289    left: auto;
 290  }
 291  
 292  .interface-complementary-area__fill {
 293    height: 100%;
 294  }
 295  
 296  @media (min-width: 782px) {
 297    body.js.is-fullscreen-mode #adminmenumain {
 298      display: none;
 299    }
 300    body.js.is-fullscreen-mode #wpcontent,
 301    body.js.is-fullscreen-mode #wpfooter {
 302      margin-left: 0;
 303    }
 304  }
 305  html.interface-interface-skeleton__html-container {
 306    position: fixed;
 307    width: 100%;
 308  }
 309  
 310  @media (min-width: 782px) {
 311    html.interface-interface-skeleton__html-container:not(:has(.is-zoom-out)) {
 312      position: initial;
 313      width: initial;
 314    }
 315  }
 316  .interface-interface-skeleton {
 317    display: flex;
 318    flex-direction: row;
 319    height: auto;
 320    max-height: 100%;
 321    position: fixed;
 322    top: 46px;
 323    left: 0;
 324    right: 0;
 325    bottom: 0;
 326  }
 327  
 328  @media (min-width: 783px) {
 329    .interface-interface-skeleton {
 330      top: 32px;
 331    }
 332    .is-fullscreen-mode .interface-interface-skeleton {
 333      top: var(--wp-admin--admin-bar--height, 0);
 334    }
 335  }
 336  .interface-interface-skeleton__editor {
 337    display: flex;
 338    flex-direction: column;
 339    flex: 0 1 100%;
 340    overflow: hidden;
 341  }
 342  
 343  .interface-interface-skeleton { /* Set left position when auto-fold is not on the body element. */
 344    left: 0;
 345  }
 346  
 347  @media (min-width: 783px) {
 348    .interface-interface-skeleton {
 349      left: 160px;
 350    }
 351  }
 352  .auto-fold .interface-interface-skeleton { /* Auto fold is when on smaller breakpoints, nav menu auto collapses. */ }
 353  
 354  @media (min-width: 783px) {
 355    .auto-fold .interface-interface-skeleton {
 356      left: 36px;
 357    }
 358  }
 359  @media (min-width: 961px) {
 360    .auto-fold .interface-interface-skeleton {
 361      left: 160px;
 362    }
 363  }
 364  /* Sidebar manually collapsed. */
 365  .folded .interface-interface-skeleton {
 366    left: 0;
 367  }
 368  
 369  @media (min-width: 783px) {
 370    .folded .interface-interface-skeleton {
 371      left: 36px;
 372    }
 373  }
 374  body.is-fullscreen-mode .interface-interface-skeleton {
 375    left: 0 !important;
 376  }
 377  
 378  .interface-interface-skeleton__body {
 379    position: relative;
 380    flex-grow: 1;
 381    display: flex;
 382    overflow: auto;
 383    overscroll-behavior-y: none;
 384  }
 385  
 386  @media (min-width: 782px) {
 387    .has-footer .interface-interface-skeleton__body {
 388      padding-bottom: 25px;
 389    }
 390  }
 391  .interface-interface-skeleton__content {
 392    flex-grow: 1;
 393    display: flex;
 394    flex-direction: column;
 395    overflow: auto;
 396    z-index: 20;
 397  }
 398  
 399  @media (min-width: 782px) {
 400    .interface-interface-skeleton__content {
 401      z-index: auto;
 402    }
 403  }
 404  .interface-interface-skeleton__secondary-sidebar,
 405  .interface-interface-skeleton__sidebar {
 406    flex-shrink: 0;
 407    position: absolute;
 408    z-index: 100000;
 409    top: 0;
 410    left: 0;
 411    bottom: 0;
 412    background: #fff;
 413    color: #1e1e1e;
 414    width: auto;
 415  }
 416  
 417  @media (min-width: 782px) {
 418    .interface-interface-skeleton__secondary-sidebar,
 419    .interface-interface-skeleton__sidebar {
 420      position: relative !important;
 421    }
 422  }
 423  .interface-interface-skeleton__sidebar {
 424    border-top: 1px solid #e0e0e0;
 425    overflow: hidden;
 426  }
 427  
 428  @media (min-width: 782px) {
 429    .interface-interface-skeleton__sidebar {
 430      box-shadow: -1px 0 0 0 rgba(0, 0, 0, 0.133);
 431      outline: 1px solid transparent;
 432    }
 433  }
 434  .interface-interface-skeleton__secondary-sidebar {
 435    border-top: 1px solid #e0e0e0;
 436    right: 0;
 437  }
 438  
 439  @media (min-width: 782px) {
 440    .interface-interface-skeleton__secondary-sidebar {
 441      box-shadow: 1px 0 0 0 rgba(0, 0, 0, 0.133);
 442      outline: 1px solid transparent;
 443    }
 444  }
 445  .interface-interface-skeleton__header {
 446    flex-shrink: 0;
 447    height: auto;
 448    box-shadow: 0 1px 0 0 rgba(0, 0, 0, 0.133);
 449    z-index: 30;
 450    color: #1e1e1e;
 451    outline: 1px solid transparent;
 452  }
 453  
 454  .interface-interface-skeleton__footer {
 455    height: auto;
 456    flex-shrink: 0;
 457    border-top: 1px solid #e0e0e0;
 458    color: #1e1e1e;
 459    position: absolute;
 460    bottom: 0;
 461    left: 0;
 462    width: 100%;
 463    background-color: #fff;
 464    z-index: 90;
 465    display: none;
 466  }
 467  
 468  @media (min-width: 782px) {
 469    .interface-interface-skeleton__footer {
 470      display: flex;
 471    }
 472  }
 473  .interface-interface-skeleton__footer .block-editor-block-breadcrumb {
 474    z-index: 30;
 475    display: flex;
 476    background: #fff;
 477    height: 24px;
 478    align-items: center;
 479    font-size: 13px;
 480    padding: 0 18px;
 481  }
 482  
 483  .interface-interface-skeleton__actions {
 484    z-index: 100000;
 485    position: fixed !important;
 486    top: -9999em;
 487    bottom: auto;
 488    left: auto;
 489    right: 0;
 490    color: #1e1e1e;
 491    background: #fff;
 492    width: 100vw;
 493  }
 494  
 495  @media (min-width: 782px) {
 496    .interface-interface-skeleton__actions {
 497      width: 280px;
 498    }
 499  }
 500  .interface-interface-skeleton__actions:focus, .interface-interface-skeleton__actions:focus-within {
 501    top: auto;
 502    bottom: 0;
 503  }
 504  
 505  .is-entity-save-view-open .interface-interface-skeleton__actions:focus, .is-entity-save-view-open .interface-interface-skeleton__actions:focus-within {
 506    top: 46px;
 507  }
 508  
 509  @media (min-width: 782px) {
 510    .is-entity-save-view-open .interface-interface-skeleton__actions:focus, .is-entity-save-view-open .interface-interface-skeleton__actions:focus-within {
 511      border-left: 1px solid #ddd;
 512      top: 32px;
 513    }
 514    .is-fullscreen-mode .is-entity-save-view-open .interface-interface-skeleton__actions:focus, .is-fullscreen-mode .is-entity-save-view-open .interface-interface-skeleton__actions:focus-within {
 515      top: var(--wp-admin--admin-bar--height, 0);
 516    }
 517  }
 518  .interface-pinned-items {
 519    display: flex;
 520  }
 521  
 522  .interface-pinned-items .components-button {
 523    display: none;
 524    margin: 0;
 525  }
 526  
 527  .interface-pinned-items .components-button[aria-controls="edit-post:document"], .interface-pinned-items .components-button[aria-controls="edit-post:block"], .interface-pinned-items .components-button[aria-controls="edit-site:template"], .interface-pinned-items .components-button[aria-controls="edit-site:block-inspector"] {
 528    display: flex;
 529  }
 530  
 531  .interface-pinned-items .components-button svg {
 532    max-width: 24px;
 533    max-height: 24px;
 534  }
 535  
 536  @media (min-width: 600px) {
 537    .interface-pinned-items .components-button {
 538      display: flex;
 539    }
 540  }
 541  .interface-pinned-items {
 542    gap: 8px;
 543  }
 544  
 545  /**
 546   * SCSS Variables.
 547   *
 548   * Please use variables from this sheet to ensure consistency across the UI.
 549   * Don't add to this sheet unless you're pretty sure the value will be reused in many places.
 550   * For example, don't add rules to this sheet that affect block visuals. It's purely for UI.
 551   */
 552  /**
 553   * Colors
 554   */
 555  /**
 556   * Fonts & basic variables.
 557   */
 558  /**
 559   * Typography
 560   */
 561  /**
 562   * Grid System.
 563   * https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/
 564   */
 565  /**
 566   * Radius scale.
 567   */
 568  /**
 569   * Elevation scale.
 570   */
 571  /**
 572   * Dimensions.
 573   */
 574  /**
 575   * Mobile specific styles
 576   */
 577  /**
 578   * Editor styles.
 579   */
 580  /**
 581   * Block & Editor UI.
 582   */
 583  /**
 584   * Block paddings.
 585   */
 586  /**
 587   * React Native specific.
 588   * These variables do not appear to be used anywhere else.
 589   */
 590  /**
 591   * Typography
 592   */
 593  /**
 594   * Breakpoints & Media Queries
 595   */
 596  /**
 597  *  Converts a hex value into the rgb equivalent.
 598  *
 599  * @param {string} hex - the hexadecimal value to convert
 600  * @return {string} comma separated rgb values
 601  */
 602  /**
 603   * Long content fade mixin
 604   *
 605   * Creates a fading overlay to signify that the content is longer
 606   * than the space allows.
 607   */
 608  /**
 609   * Breakpoint mixins
 610   */
 611  /**
 612   * Focus styles.
 613   */
 614  /**
 615   * Standard focus rings for the WordPress Design System.
 616   *
 617   * Apply `outset-ring__focus` inside the relevant pseudo-class at the call site,
 618   * e.g. `&:focus { @include outset-ring__focus(); }`.
 619   */
 620  /**
 621   * Applies editor left position to the selector passed as argument
 622   */
 623  /**
 624   * Styles that are reused verbatim in a few places
 625   */
 626  /**
 627   * Allows users to opt-out of animations via OS-level preferences.
 628   */
 629  /**
 630   * Reset default styles for JavaScript UI based pages.
 631   * This is a WP-admin agnostic reset
 632   */
 633  /**
 634   * Reset the WP Admin page styles for Gutenberg-like pages.
 635   */
 636  /**
 637   * Creates a checkerboard pattern background to indicate transparency.
 638   * @param {String} $size - The size of the squares in the checkerboard pattern. Default is 12px.
 639   */
 640  @media (min-width: 782px) {
 641    .font-library-modal.font-library-modal {
 642      width: 65vw;
 643    }
 644  }
 645  .font-library-modal .components-modal__header {
 646    border-bottom: none;
 647  }
 648  
 649  .font-library-modal .components-modal__content {
 650    padding: 0;
 651    margin-bottom: 90px;
 652  }
 653  
 654  .font-library-modal .font-library__subtitle {
 655    text-transform: uppercase;
 656    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
 657    font-size: 11px;
 658  }
 659  
 660  .font-library-modal__tab-panel {
 661    height: calc(100% - 50px);
 662  }
 663  
 664  .font-library__tabpanel-layout {
 665    height: 100%;
 666    display: flex;
 667    flex-direction: column;
 668  }
 669  
 670  .font-library__tabpanel-layout > div {
 671    flex-grow: 1;
 672  }
 673  
 674  .font-library__tabpanel-layout .font-library__loading {
 675    width: 100%;
 676    height: 100%;
 677    display: flex;
 678    position: absolute;
 679    left: 0;
 680    top: 0;
 681    align-items: center;
 682    justify-content: center;
 683    padding-top: 124px;
 684    box-sizing: border-box;
 685  }
 686  
 687  .font-library__tabpanel-layout .components-navigator-screen {
 688    padding: 24px;
 689    width: 100%;
 690  }
 691  
 692  .font-library__footer {
 693    position: absolute;
 694    width: 100%;
 695    bottom: 0;
 696    border-top: 1px solid #ddd;
 697    padding: 24px;
 698    background-color: #fff;
 699    box-sizing: border-box;
 700    flex-grow: 0 !important;
 701    flex-shrink: 0;
 702    height: 90px;
 703  }
 704  
 705  .font-library__page-selection {
 706    font-size: 11px;
 707    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
 708    text-transform: uppercase;
 709  }
 710  
 711  @media (min-width: 600px) {
 712    .font-library__page-selection .font-library__page-selection-trigger {
 713      font-size: 11px !important;
 714      font-weight: var(--wpds-typography-font-weight-emphasis, 600);
 715    }
 716  }
 717  .font-library__fonts-title {
 718    text-transform: uppercase;
 719    font-size: 11px;
 720    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
 721    margin-top: 0;
 722    margin-bottom: 0;
 723  }
 724  
 725  .font-library__fonts-list {
 726    list-style: none;
 727    padding: 0;
 728    margin-top: 0;
 729    margin-bottom: 0;
 730  }
 731  
 732  .font-library__fonts-list-item {
 733    margin-bottom: 0;
 734  }
 735  
 736  .font-library__font-card {
 737    box-sizing: border-box;
 738    border: 1px solid #ddd;
 739    width: 100%;
 740    height: auto !important;
 741    padding: 16px;
 742    margin-top: -1px; /* To collapse the margin with the previous element */
 743  }
 744  
 745  .font-library__font-card:hover {
 746    background-color: #f0f0f0;
 747  }
 748  
 749  .font-library__font-card:focus {
 750    position: relative;
 751  }
 752  
 753  .font-library__font-card .font-library__font-card__name {
 754    font-weight: bold;
 755  }
 756  
 757  .font-library__font-card .font-library__font-card__count {
 758    color: #757575;
 759  }
 760  
 761  .font-library__font-card .font-library__font-variant_demo-image {
 762    display: block;
 763    height: 24px;
 764    width: auto;
 765  }
 766  
 767  .font-library__font-card .font-library__font-variant_demo-text {
 768    white-space: nowrap;
 769    flex-shrink: 0;
 770  }
 771  
 772  @media not (prefers-reduced-motion) {
 773    .font-library__font-card .font-library__font-variant_demo-text {
 774      transition: opacity 0.3s ease-in-out;
 775    }
 776  }
 777  .font-library-modal__tablist-container {
 778    position: sticky;
 779    top: 0;
 780    border-bottom: 1px solid #ddd;
 781    background: #fff;
 782    z-index: 1;
 783  }
 784  
 785  .font-library__upload-area {
 786    align-items: center;
 787    display: flex;
 788    justify-content: center;
 789    height: 256px !important;
 790    width: 100%;
 791  }
 792  
 793  button.font-library__upload-area {
 794    background-color: #f0f0f0;
 795  }
 796  
 797  .font-library__local-fonts {
 798    margin: 24px auto;
 799    width: 80%;
 800  }
 801  
 802  .font-library__local-fonts .font-library__upload-area__text {
 803    color: #757575;
 804  }
 805  
 806  .font-library__google-fonts-confirm {
 807    display: flex;
 808    justify-content: center;
 809    align-items: center;
 810    margin-top: 64px;
 811  }
 812  
 813  .font-library__google-fonts-confirm p {
 814    line-height: 1.4;
 815  }
 816  
 817  .font-library__google-fonts-confirm h2 {
 818    font-size: 1.2rem;
 819    font-weight: 400;
 820  }
 821  
 822  .font-library__google-fonts-confirm .components-card {
 823    padding: 16px;
 824    width: 400px;
 825  }
 826  
 827  .font-library__google-fonts-confirm .components-button {
 828    width: 100%;
 829    justify-content: center;
 830  }
 831  
 832  .font-library__select-all {
 833    padding: 16px 16px 16px 17px;
 834  }
 835  
 836  .font-library__select-all .components-checkbox-control__label {
 837    padding-left: 16px;
 838  }
 839  
 840  .global-styles-ui-pagination .components-button.is-tertiary {
 841    width: 32px;
 842    height: 32px;
 843    justify-content: center;
 844  }
 845  
 846  .global-styles-ui-screen-revisions__revisions-list {
 847    list-style: none;
 848    margin: 0 16px 16px 16px;
 849    flex-grow: 1;
 850  }
 851  
 852  .global-styles-ui-screen-revisions__revisions-list li {
 853    margin-bottom: 0;
 854  }
 855  
 856  .global-styles-ui-screen-revisions__revision-item {
 857    position: relative;
 858    cursor: var(--wpds-cursor-control, pointer);
 859    display: flex;
 860    flex-direction: column;
 861  }
 862  
 863  .global-styles-ui-screen-revisions__revision-item[role=option]:active, .global-styles-ui-screen-revisions__revision-item[role=option]:focus {
 864    box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
 865    outline: 2px solid transparent;
 866  }
 867  
 868  .global-styles-ui-screen-revisions__revision-item:hover {
 869    background: rgba(var(--wp-admin-theme-color--rgb), 0.04);
 870  }
 871  
 872  .global-styles-ui-screen-revisions__revision-item:hover .global-styles-ui-screen-revisions__date {
 873    color: var(--wp-admin-theme-color);
 874  }
 875  
 876  .global-styles-ui-screen-revisions__revision-item::before, .global-styles-ui-screen-revisions__revision-item::after {
 877    position: absolute;
 878    content: "\a";
 879    display: block;
 880  }
 881  
 882  .global-styles-ui-screen-revisions__revision-item::before {
 883    background: #ddd;
 884    border-radius: 50%;
 885    height: 8px;
 886    width: 8px;
 887    top: 18px;
 888    left: 17px;
 889    transform: translate(-50%, -50%);
 890    z-index: 1;
 891    border: 4px solid transparent;
 892  }
 893  
 894  .global-styles-ui-screen-revisions__revision-item[aria-selected=true] {
 895    border-radius: 2px;
 896    outline: 3px solid transparent;
 897    outline-offset: -2px;
 898    color: var(--wp-admin-theme-color);
 899    background: rgba(var(--wp-admin-theme-color--rgb), 0.04);
 900  }
 901  
 902  .global-styles-ui-screen-revisions__revision-item[aria-selected=true] .global-styles-ui-screen-revisions__date {
 903    color: var(--wp-admin-theme-color);
 904  }
 905  
 906  .global-styles-ui-screen-revisions__revision-item[aria-selected=true]::before {
 907    background: var(--wp-admin-theme-color);
 908  }
 909  
 910  .global-styles-ui-screen-revisions__revision-item[aria-selected=true] .global-styles-ui-screen-revisions__changes > li,
 911  .global-styles-ui-screen-revisions__revision-item[aria-selected=true] .global-styles-ui-screen-revisions__meta {
 912    color: #1e1e1e;
 913  }
 914  
 915  .global-styles-ui-screen-revisions__revision-item::after {
 916    height: 100%;
 917    left: 16px;
 918    top: 0;
 919    width: 0;
 920    border: 0.5px solid #ddd;
 921  }
 922  
 923  .global-styles-ui-screen-revisions__revision-item:first-child::after {
 924    top: 18px;
 925  }
 926  
 927  .global-styles-ui-screen-revisions__revision-item:last-child::after {
 928    height: 18px;
 929  }
 930  
 931  .global-styles-ui-screen-revisions__revision-item-wrapper {
 932    display: block;
 933    padding: 12px 12px 4px 40px;
 934  }
 935  
 936  .global-styles-ui-screen-revisions__apply-button.is-primary,
 937  .global-styles-ui-screen-revisions__active-badge {
 938    align-self: flex-start;
 939    margin: 0 12px 12px 40px;
 940  }
 941  
 942  .global-styles-ui-screen-revisions__changes,
 943  .global-styles-ui-screen-revisions__meta {
 944    color: #757575;
 945    font-size: 12px;
 946  }
 947  
 948  .global-styles-ui-screen-revisions__description {
 949    display: flex;
 950    flex-direction: column;
 951    align-items: flex-start;
 952    gap: 8px;
 953  }
 954  
 955  .global-styles-ui-screen-revisions__description .global-styles-ui-screen-revisions__date {
 956    text-transform: uppercase;
 957    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
 958    font-size: 12px;
 959  }
 960  
 961  .global-styles-ui-screen-revisions__meta {
 962    display: flex;
 963    justify-content: start;
 964    width: 100%;
 965    align-items: flex-start;
 966    text-align: left;
 967    margin-bottom: 4px;
 968  }
 969  
 970  .global-styles-ui-screen-revisions__meta img {
 971    width: 16px;
 972    height: 16px;
 973    border-radius: 100%;
 974    margin-right: 8px;
 975  }
 976  
 977  .global-styles-ui-screen-revisions__loading {
 978    margin: 24px auto !important;
 979  }
 980  
 981  .global-styles-ui-screen-revisions__changes {
 982    text-align: left;
 983    line-height: 1.4;
 984    margin-left: 12px;
 985    list-style: disc;
 986  }
 987  
 988  .global-styles-ui-screen-revisions__changes li {
 989    margin-bottom: 4px;
 990  }
 991  
 992  .global-styles-ui-screen-revisions__pagination.global-styles-ui-screen-revisions__pagination {
 993    justify-content: space-between;
 994    gap: 2px;
 995  }
 996  
 997  .global-styles-ui-screen-revisions__pagination.global-styles-ui-screen-revisions__pagination .edit-site-pagination__total {
 998    position: absolute;
 999    left: -1000px;
1000    height: 1px;
1001    margin: -1px;
1002    overflow: hidden;
1003  }
1004  
1005  .global-styles-ui-screen-revisions__pagination.global-styles-ui-screen-revisions__pagination .components-text {
1006    font-size: 12px;
1007    will-change: opacity;
1008  }
1009  
1010  .global-styles-ui-screen-revisions__pagination.global-styles-ui-screen-revisions__pagination .components-button.is-tertiary {
1011    color: #1e1e1e;
1012  }
1013  
1014  .global-styles-ui-screen-revisions__pagination.global-styles-ui-screen-revisions__pagination .components-button.is-tertiary:disabled,
1015  .global-styles-ui-screen-revisions__pagination.global-styles-ui-screen-revisions__pagination .components-button.is-tertiary[aria-disabled=true] {
1016    color: #949494;
1017  }
1018  
1019  .global-styles-ui-screen-revisions__footer {
1020    height: 56px;
1021    z-index: 1;
1022    position: sticky;
1023    min-width: 100%;
1024    bottom: 0;
1025    background: #fff;
1026    padding: 12px;
1027    border-top: 1px solid #ddd;
1028    box-sizing: border-box;
1029  }
1030  
1031  .global-styles-ui-variations_item {
1032    box-sizing: border-box;
1033    cursor: var(--wpds-cursor-control, pointer);
1034  }
1035  
1036  .global-styles-ui-variations_item .global-styles-ui-variations_item-preview {
1037    border-radius: 2px;
1038    outline: 1px solid rgba(0, 0, 0, 0.1);
1039    outline-offset: -1px;
1040    overflow: hidden;
1041    position: relative;
1042  }
1043  
1044  @media not (prefers-reduced-motion) {
1045    .global-styles-ui-variations_item .global-styles-ui-variations_item-preview {
1046      transition: outline 0.1s linear;
1047    }
1048  }
1049  .global-styles-ui-variations_item .global-styles-ui-variations_item-preview.is-pill {
1050    height: 32px;
1051  }
1052  
1053  .global-styles-ui-variations_item .global-styles-ui-variations_item-preview.is-pill .block-editor-iframe__scale-container {
1054    overflow: hidden;
1055  }
1056  
1057  .global-styles-ui-variations_item:not(.is-active):hover .global-styles-ui-variations_item-preview {
1058    outline-color: rgba(0, 0, 0, 0.3);
1059  }
1060  
1061  .global-styles-ui-variations_item.is-active .global-styles-ui-variations_item-preview, .global-styles-ui-variations_item:focus-visible .global-styles-ui-variations_item-preview {
1062    outline-color: #1e1e1e;
1063    outline-offset: 1px;
1064    outline-width: var(--wp-admin-border-width-focus);
1065  }
1066  
1067  .global-styles-ui-variations_item:focus-visible .global-styles-ui-variations_item-preview {
1068    outline-color: var(--wp-admin-theme-color);
1069  }
1070  
1071  .global-styles-ui-preview__wrapper {
1072    max-width: 100%;
1073    display: block;
1074    width: 100%;
1075  }
1076  
1077  .global-styles-ui-preview__wrapper.is-hoverable {
1078    cursor: var(--wpds-cursor-control, pointer);
1079  }
1080  
1081  .global-styles-ui-typography-preview {
1082    display: flex;
1083    align-items: center;
1084    justify-content: center;
1085    min-height: 100px;
1086    margin-bottom: 20px;
1087    background: #f0f0f0;
1088    border-radius: 2px;
1089    overflow: hidden;
1090  }
1091  
1092  .global-styles-ui-font-size__item {
1093    white-space: nowrap;
1094    text-overflow: ellipsis;
1095    overflow: hidden;
1096    line-break: anywhere;
1097  }
1098  
1099  .global-styles-ui-font-size__item-value {
1100    color: #757575;
1101  }
1102  
1103  .global-styles-ui-screen-typography__indicator {
1104    height: 24px;
1105    width: 24px;
1106    font-size: 14px;
1107    display: flex !important;
1108    align-items: center;
1109    justify-content: center;
1110    border-radius: 2px;
1111  }
1112  
1113  .global-styles-ui-block-types-search {
1114    margin-bottom: 10px;
1115    padding: 0 16px;
1116  }
1117  
1118  .global-styles-ui-screen-typography__font-variants-count {
1119    color: #757575;
1120  }
1121  
1122  .global-styles-ui-font-families__manage-fonts {
1123    justify-content: center;
1124  }
1125  
1126  .global-styles-ui-screen .color-block-support-panel {
1127    padding-left: 0;
1128    padding-right: 0;
1129    padding-top: 0;
1130    border-top: none;
1131    row-gap: 12px;
1132  }
1133  
1134  .global-styles-ui-header {
1135    margin-bottom: 0 !important;
1136    line-height: 1.9 !important;
1137  }
1138  
1139  .global-styles-ui-subtitle {
1140    margin-bottom: 0 !important;
1141    text-transform: uppercase;
1142    font-weight: var(--wpds-typography-font-weight-emphasis, 600) !important;
1143    font-size: 11px !important;
1144  }
1145  
1146  .global-styles-ui-section-title {
1147    color: #2f2f2f;
1148    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
1149    line-height: 1.2;
1150    padding: 16px 16px 0;
1151    margin: 0;
1152  }
1153  
1154  .global-styles-ui-icon-with-current-color {
1155    fill: currentColor;
1156  }
1157  
1158  .global-styles-ui__color-indicator-wrapper {
1159    height: 24px;
1160    flex-shrink: 0;
1161  }
1162  
1163  .global-styles-ui__shadows-panel__options-container,
1164  .global-styles-ui__typography-panel__options-container {
1165    height: 24px;
1166  }
1167  
1168  .global-styles-ui__block-preview-panel {
1169    position: relative;
1170    width: 100%;
1171    border: #ddd 1px solid;
1172    border-radius: 2px;
1173    overflow: hidden;
1174  }
1175  
1176  .global-styles-ui__shadow-preview-panel {
1177    height: 144px;
1178    border: #ddd 1px solid;
1179    border-radius: 2px;
1180    overflow: auto;
1181    /*rtl:begin:ignore*/
1182    background-image: repeating-linear-gradient(45deg, #e0e0e0 25%, transparent 25%, transparent 75%, #e0e0e0 75%, #e0e0e0), repeating-linear-gradient(45deg, #e0e0e0 25%, transparent 25%, transparent 75%, #e0e0e0 75%, #e0e0e0);
1183    background-position: 0 0, 8px 8px;
1184    /*rtl:end:ignore*/
1185    background-size: 16px 16px;
1186  }
1187  
1188  .global-styles-ui__shadow-preview-panel .global-styles-ui__shadow-preview-block {
1189    border: #ddd 1px solid;
1190    border-radius: 2px;
1191    background-color: #fff;
1192    width: 60%;
1193    height: 60px;
1194  }
1195  
1196  .global-styles-ui__shadow-editor__dropdown-content {
1197    width: 280px;
1198  }
1199  
1200  .global-styles-ui__shadow-editor-panel {
1201    margin-bottom: 4px;
1202  }
1203  
1204  .global-styles-ui__shadow-editor__dropdown {
1205    width: 100%;
1206    position: relative;
1207  }
1208  
1209  .global-styles-ui__shadow-editor__dropdown-toggle {
1210    width: 100%;
1211    height: auto;
1212    padding-top: 8px;
1213    padding-bottom: 8px;
1214    text-align: left;
1215    border-radius: inherit;
1216  }
1217  
1218  .global-styles-ui__shadow-editor__dropdown-toggle.is-open {
1219    background: #f0f0f0;
1220    color: var(--wp-admin-theme-color);
1221  }
1222  
1223  .global-styles-ui__shadow-editor__remove-button {
1224    position: absolute;
1225    right: 8px;
1226    top: 8px;
1227    opacity: 0;
1228  }
1229  
1230  .global-styles-ui__shadow-editor__remove-button.global-styles-ui__shadow-editor__remove-button {
1231    border: none;
1232  }
1233  
1234  .global-styles-ui__shadow-editor__dropdown-toggle:hover + .global-styles-ui__shadow-editor__remove-button, .global-styles-ui__shadow-editor__remove-button:focus, .global-styles-ui__shadow-editor__remove-button:hover {
1235    opacity: 1;
1236  }
1237  
1238  @media (hover: none) {
1239    .global-styles-ui__shadow-editor__remove-button {
1240      opacity: 1;
1241    }
1242  }
1243  .global-styles-ui-screen-css {
1244    flex: 1 1 auto;
1245    display: flex;
1246    flex-direction: column;
1247    margin: 16px;
1248  }
1249  
1250  .global-styles-ui-screen-css .block-editor-global-styles-advanced-panel {
1251    flex: 1 1 auto;
1252  }
1253  
1254  .global-styles-ui-screen-css .block-editor-global-styles-advanced-panel__custom-css-input {
1255    flex: 1 1 auto;
1256    display: flex;
1257    flex-direction: column;
1258  }
1259  
1260  .global-styles-ui-screen-css .block-editor-global-styles-advanced-panel__custom-css-input .components-base-control__field {
1261    flex: 1 1 auto;
1262    display: flex;
1263    flex-direction: column;
1264  }
1265  
1266  .global-styles-ui-screen-css .block-editor-global-styles-advanced-panel__custom-css-input textarea {
1267    flex: 1 1 auto;
1268  }
1269  
1270  .global-styles-ui-screen-css-help-link {
1271    display: inline-block;
1272    margin-top: 8px;
1273  }
1274  
1275  .global-styles-ui-screen-variations {
1276    margin-top: 16px;
1277    border-top: 1px solid #ddd;
1278  }
1279  
1280  .global-styles-ui-screen-variations > * {
1281    margin: 24px 16px;
1282  }
1283  
1284  .global-styles-ui-sidebar__navigator-provider {
1285    height: 100%;
1286  }
1287  
1288  .global-styles-ui-sidebar__navigator-screen {
1289    display: flex;
1290    flex-direction: column;
1291    height: 100%;
1292  }
1293  
1294  .global-styles-ui-color-palette__tablist-container {
1295    border-bottom: 1px solid #ddd;
1296  }
1297  
1298  .global-styles-ui-color-palette__tablist {
1299    margin-bottom: -1px;
1300  }
1301  
1302  .global-styles-ui-sidebar__navigator-screen .single-column {
1303    grid-column: span 1;
1304  }
1305  
1306  .global-styles-ui-screen-root.global-styles-ui-screen-root,
1307  .global-styles-ui-screen-style-variations.global-styles-ui-screen-style-variations {
1308    background: unset;
1309    color: inherit;
1310  }
1311  
1312  .global-styles-ui-sidebar__panel .block-editor-block-icon svg {
1313    fill: currentColor;
1314  }
1315  
1316  .global-styles-ui-screen-root__active-style-tile.global-styles-ui-screen-root__active-style-tile, .global-styles-ui-screen-root__active-style-tile.global-styles-ui-screen-root__active-style-tile .global-styles-ui-screen-root__active-style-tile-preview {
1317    border-radius: 2px;
1318  }
1319  
1320  .global-styles-ui-screen-root__active-style-tile-preview {
1321    clip-path: border-box;
1322  }
1323  
1324  .global-styles-ui-color-palette-panel,
1325  .global-styles-ui-gradient-palette-panel {
1326    padding: 16px;
1327  }
1328  
1329  /**
1330   * Typography
1331   */
1332  /**
1333   * SCSS Variables.
1334   *
1335   * Please use variables from this sheet to ensure consistency across the UI.
1336   * Don't add to this sheet unless you're pretty sure the value will be reused in many places.
1337   * For example, don't add rules to this sheet that affect block visuals. It's purely for UI.
1338   */
1339  /**
1340   * Colors
1341   */
1342  /**
1343   * Fonts & basic variables.
1344   */
1345  /**
1346   * Typography
1347   */
1348  /**
1349   * Grid System.
1350   * https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/
1351   */
1352  /**
1353   * Radius scale.
1354   */
1355  /**
1356   * Elevation scale.
1357   */
1358  /**
1359   * Dimensions.
1360   */
1361  /**
1362   * Mobile specific styles
1363   */
1364  /**
1365   * Editor styles.
1366   */
1367  /**
1368   * Block & Editor UI.
1369   */
1370  /**
1371   * Block paddings.
1372   */
1373  /**
1374   * React Native specific.
1375   * These variables do not appear to be used anywhere else.
1376   */
1377  /**
1378   * Breakpoints & Media Queries
1379   */
1380  /**
1381  *  Converts a hex value into the rgb equivalent.
1382  *
1383  * @param {string} hex - the hexadecimal value to convert
1384  * @return {string} comma separated rgb values
1385  */
1386  /**
1387   * Long content fade mixin
1388   *
1389   * Creates a fading overlay to signify that the content is longer
1390   * than the space allows.
1391   */
1392  /**
1393   * Breakpoint mixins
1394   */
1395  /**
1396   * Focus styles.
1397   */
1398  /**
1399   * Standard focus rings for the WordPress Design System.
1400   *
1401   * Apply `outset-ring__focus` inside the relevant pseudo-class at the call site,
1402   * e.g. `&:focus { @include outset-ring__focus(); }`.
1403   */
1404  /**
1405   * Applies editor left position to the selector passed as argument
1406   */
1407  /**
1408   * Styles that are reused verbatim in a few places
1409   */
1410  /**
1411   * Allows users to opt-out of animations via OS-level preferences.
1412   */
1413  /**
1414   * Reset default styles for JavaScript UI based pages.
1415   * This is a WP-admin agnostic reset
1416   */
1417  /**
1418   * Reset the WP Admin page styles for Gutenberg-like pages.
1419   */
1420  /**
1421   * Creates a checkerboard pattern background to indicate transparency.
1422   * @param {String} $size - The size of the squares in the checkerboard pattern. Default is 12px.
1423   */
1424  .dataviews-wrapper,
1425  .dataviews-picker-wrapper {
1426    height: 100%;
1427    flex-grow: 1;
1428    min-height: 0;
1429    box-sizing: border-box;
1430    scroll-padding-bottom: 64px;
1431    container: dataviews-wrapper/inline-size;
1432    display: flex;
1433    flex-direction: column;
1434    font-size: var(--wpds-typography-font-size-md, 13px);
1435    line-height: var(--wpds-typography-line-height-sm, 20px);
1436    background-color: var(--wp-dataviews-color-background, var(--wpds-color-background-surface-neutral-strong, #fff));
1437  }
1438  
1439  .dataviews__view-actions,
1440  .dataviews-filters__container {
1441    box-sizing: border-box;
1442    padding: var(--wpds-dimension-padding-lg, 16px) var(--wpds-dimension-padding-2xl, 24px);
1443    flex-shrink: 0;
1444    position: sticky;
1445    left: 0;
1446    background-color: inherit;
1447  }
1448  
1449  @media not (prefers-reduced-motion) {
1450    .dataviews__view-actions,
1451    .dataviews-filters__container {
1452      transition: padding ease-out 0.1s;
1453    }
1454  }
1455  .dataviews-no-results,
1456  .dataviews-loading {
1457    padding: 0 var(--wpds-dimension-padding-2xl, 24px);
1458    flex-grow: 1;
1459    display: flex;
1460    align-items: center;
1461    justify-content: center;
1462  }
1463  
1464  @media not (prefers-reduced-motion) {
1465    .dataviews-no-results,
1466    .dataviews-loading {
1467      transition: padding ease-out 0.1s;
1468    }
1469  }
1470  .dataviews-no-results.is-refreshing {
1471    opacity: 0.5;
1472    pointer-events: none;
1473  }
1474  
1475  @media not (prefers-reduced-motion) {
1476    .dataviews-no-results.is-refreshing {
1477      opacity: 1;
1478      animation: dataviews-pulse 1s ease-in-out infinite;
1479    }
1480  }
1481  @keyframes dataviews-pulse {
1482    0%, 100% {
1483      opacity: 1;
1484    }
1485    50% {
1486      opacity: 0.5;
1487    }
1488  }
1489  .dataviews-loading-more {
1490    text-align: center;
1491  }
1492  
1493  .dataviews-loading-more[aria-hidden=true] {
1494    visibility: hidden;
1495  }
1496  
1497  @container (max-width: 430px) {
1498    .dataviews__view-actions,
1499    .dataviews-filters__container {
1500      padding: var(--wpds-dimension-padding-md, 12px) var(--wpds-dimension-padding-2xl, 24px);
1501    }
1502  }
1503  .dataviews-title-field {
1504    font-size: var(--wpds-typography-font-size-md, 13px);
1505    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
1506    color: var(--wpds-color-foreground-content-neutral, #1e1e1e);
1507    text-overflow: ellipsis;
1508    white-space: nowrap;
1509    width: 100%;
1510  }
1511  
1512  .dataviews-title-field a {
1513    text-decoration: none;
1514    text-overflow: ellipsis;
1515    white-space: nowrap;
1516    overflow: hidden;
1517    display: block;
1518    flex-grow: 0;
1519    color: var(--wpds-color-foreground-interactive-neutral, #1e1e1e);
1520  }
1521  
1522  .dataviews-title-field a:hover {
1523    color: var(--wpds-color-foreground-interactive-brand, var(--wp-admin-theme-color, #3858e9));
1524  }
1525  
1526  .dataviews-title-field a:focus {
1527    color: var(--wp-admin-theme-color--rgb);
1528    box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color, #007cba);
1529    border-radius: 2px;
1530  }
1531  
1532  .dataviews-title-field button.components-button.is-link {
1533    text-decoration: none;
1534    font-weight: inherit;
1535    text-overflow: ellipsis;
1536    white-space: nowrap;
1537    overflow: hidden;
1538    display: block;
1539    width: 100%;
1540    color: var(--wpds-color-foreground-interactive-neutral-active, #1e1e1e);
1541  }
1542  
1543  .dataviews-title-field button.components-button.is-link:hover {
1544    color: var(--wpds-color-foreground-interactive-brand, var(--wp-admin-theme-color, #3858e9));
1545  }
1546  
1547  .dataviews-title-field--clickable {
1548    cursor: var(--wpds-cursor-control, pointer);
1549    color: var(--wpds-color-foreground-interactive-neutral, #1e1e1e);
1550  }
1551  
1552  .dataviews-title-field--clickable:hover {
1553    color: var(--wpds-color-foreground-interactive-brand, var(--wp-admin-theme-color, #3858e9));
1554  }
1555  
1556  .dataviews-title-field--clickable:focus {
1557    color: var(--wp-admin-theme-color--rgb);
1558    box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color, #007cba);
1559    border-radius: 2px;
1560  }
1561  
1562  .dataviews__view-actions--infinite-scroll {
1563    position: sticky;
1564    top: 0;
1565    z-index: 2;
1566    background-color: #fff;
1567  }
1568  
1569  /**
1570   * When DataViews are placed within cards, apply a consistent top padding.
1571   */
1572  .components-card__body:has(> .dataviews-wrapper),
1573  .components-card__body:has(> .dataviews-picker-wrapper) {
1574    padding: var(--wpds-dimension-padding-sm, 8px) 0 0;
1575    overflow: hidden;
1576  }
1577  
1578  .dataviews-bulk-actions-footer__item-count {
1579    color: var(--wpds-color-foreground-content-neutral, #1e1e1e);
1580  }
1581  
1582  .dataviews-bulk-actions-footer__container {
1583    margin-right: auto;
1584    min-height: var(--wpds-dimension-size-md, 32px);
1585  }
1586  
1587  .dataviews-layout__container {
1588    flex: 1;
1589    min-height: 0;
1590    overflow: auto;
1591    display: flex;
1592    flex-direction: column;
1593    background-color: inherit;
1594  }
1595  
1596  .dataviews-filters__button {
1597    position: relative;
1598  }
1599  
1600  .dataviews-filters__container {
1601    padding-top: 0;
1602  }
1603  
1604  .dataviews-filters__reset-button.dataviews-filters__reset-button[aria-disabled=true], .dataviews-filters__reset-button.dataviews-filters__reset-button[aria-disabled=true]:hover {
1605    opacity: 0;
1606  }
1607  
1608  .dataviews-filters__reset-button.dataviews-filters__reset-button[aria-disabled=true]:focus {
1609    opacity: 1;
1610  }
1611  
1612  .dataviews-filters__summary-popover {
1613    font-size: var(--wpds-typography-font-size-md, 13px);
1614    line-height: var(--wpds-typography-line-height-sm, 20px);
1615  }
1616  
1617  .dataviews-filters__summary-popover .components-popover__content {
1618    width: 100%;
1619    min-width: 230px;
1620    max-width: 250px;
1621    border-radius: var(--wpds-border-radius-md, 4px);
1622  }
1623  
1624  .dataviews-filters__summary-popover.components-dropdown__content .components-popover__content {
1625    padding: 0;
1626  }
1627  
1628  .dataviews-filters__summary-operators-container {
1629    padding: var(--wpds-dimension-padding-sm, 8px) var(--wpds-dimension-padding-lg, 16px);
1630  }
1631  
1632  .dataviews-filters__summary-operators-container:has(+ .dataviews-filters__search-widget-listbox), .dataviews-filters__summary-operators-container:has(+ .dataviews-filters__search-widget-no-elements), .dataviews-filters__summary-operators-container:has(+ .dataviews-filters__user-input-widget) {
1633    border-bottom: 1px solid var(--wpds-color-stroke-surface-neutral, #dbdbdb);
1634  }
1635  
1636  .dataviews-filters__summary-operators-container:empty {
1637    display: none;
1638  }
1639  
1640  .dataviews-filters__summary-operators-container .dataviews-filters__summary-operators-filter-name {
1641    color: var(--wpds-color-foreground-content-neutral-weak, #707070);
1642    white-space: nowrap;
1643    overflow: hidden;
1644    text-overflow: ellipsis;
1645    flex-shrink: 0; /* Prevents this element from shrinking */
1646    max-width: calc(100% - 55px);
1647  }
1648  
1649  .dataviews-filters__summary-operators-container .dataviews-filters__summary-operators-filter-select {
1650    width: 100%;
1651    white-space: nowrap;
1652    overflow: hidden;
1653  }
1654  
1655  .dataviews-filters__summary-chip-container {
1656    position: relative;
1657    white-space: pre-wrap;
1658  }
1659  
1660  .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip {
1661    border-radius: var(--wpds-border-radius-lg, 8px);
1662    border: var(--wpds-border-width-xs, 1px) solid var(--wpds-color-stroke-interactive-neutral, #8d8d8d);
1663    cursor: var(--wpds-cursor-control, pointer);
1664    padding: var(--wpds-dimension-padding-xs, 4px) var(--wpds-dimension-padding-md, 12px);
1665    min-height: var(--wpds-dimension-size-md, 32px);
1666    color: var(--wpds-color-foreground-interactive-neutral, #1e1e1e);
1667    position: relative;
1668    display: flex;
1669    align-items: center;
1670    box-sizing: border-box;
1671  }
1672  
1673  .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip.is-not-clickable {
1674    cursor: default;
1675  }
1676  
1677  .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip.has-reset {
1678    padding-inline-end: calc(var(--wpds-dimension-size-sm, 24px) + var(--wpds-dimension-padding-xs, 4px));
1679  }
1680  
1681  .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip:hover:not(.dataviews-filters__summary-chip-container .dataviews-filters__summary-chip.is-not-clickable), .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip:focus-visible, .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip[aria-expanded=true] {
1682    color: var(--wpds-color-foreground-interactive-neutral, #1e1e1e);
1683    border-color: var(--wpds-color-stroke-interactive-neutral-active, #6e6e6e);
1684    background-color: var(--wpds-color-background-interactive-neutral-weak-active, #ededed);
1685  }
1686  
1687  .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip.has-values {
1688    color: var(--wpds-color-foreground-interactive-brand, var(--wp-admin-theme-color, #3858e9));
1689    background: var(--wpds-color-background-interactive-brand-weak, rgba(0, 0, 0, 0));
1690    border-color: var(--wpds-color-stroke-interactive-brand, var(--wp-admin-theme-color, #3858e9));
1691  }
1692  
1693  .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip.has-values:hover:not(.dataviews-filters__summary-chip-container .dataviews-filters__summary-chip.has-values.is-not-clickable), .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip.has-values[aria-expanded=true] {
1694    color: var(--wpds-color-foreground-interactive-brand-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 52%, black));
1695    background: var(--wpds-color-background-interactive-brand-weak-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 12%, white));
1696    border-color: var(--wpds-color-stroke-interactive-brand-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 85%, black));
1697  }
1698  
1699  .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip:focus-visible {
1700    outline: none;
1701    box-shadow: 0 0 0 var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)) var(--wpds-color-stroke-focus, var(--wp-admin-theme-color, #3858e9));
1702  }
1703  
1704  .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip .dataviews-filters-__summary-filter-text-name {
1705    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
1706  }
1707  
1708  .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove {
1709    width: var(--wpds-dimension-size-sm, 24px);
1710    height: var(--wpds-dimension-size-sm, 24px);
1711    border-radius: var(--wpds-border-radius-md, 4px);
1712    border: 0;
1713    padding: 0;
1714    position: absolute;
1715    right: var(--wpds-dimension-padding-xs, 4px);
1716    top: 50%;
1717    transform: translateY(-50%);
1718    display: flex;
1719    align-items: center;
1720    justify-content: center;
1721    background: transparent;
1722    cursor: var(--wpds-cursor-control, pointer);
1723  }
1724  
1725  .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove svg {
1726    fill: var(--wpds-color-foreground-interactive-neutral, #1e1e1e);
1727  }
1728  
1729  .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove:hover, .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove:focus {
1730    background: var(--wpds-color-background-interactive-neutral-weak-active, #ededed);
1731  }
1732  
1733  .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove:hover svg, .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove:focus svg {
1734    fill: var(--wpds-color-foreground-interactive-neutral-active, #1e1e1e);
1735  }
1736  
1737  .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove.has-values svg {
1738    fill: var(--wpds-color-foreground-interactive-brand, var(--wp-admin-theme-color, #3858e9));
1739  }
1740  
1741  .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove.has-values:hover {
1742    background: var(--wpds-color-background-interactive-brand-weak-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 12%, white));
1743  }
1744  
1745  .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove:focus-visible {
1746    outline: none;
1747    box-shadow: 0 0 0 var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)) var(--wpds-color-stroke-focus, var(--wp-admin-theme-color, #3858e9));
1748  }
1749  
1750  .dataviews-filters__search-widget-filter-combobox-list {
1751    max-height: 184px;
1752    padding: var(--wpds-dimension-padding-xs, 4px);
1753    overflow: auto;
1754    border-top: 1px solid var(--wpds-color-stroke-surface-neutral, #dbdbdb);
1755  }
1756  
1757  .dataviews-filters__search-widget-filter-combobox-list .dataviews-filters__search-widget-filter-combobox-item-value [data-user-value] {
1758    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
1759  }
1760  
1761  .dataviews-filters__search-widget-listbox {
1762    padding: var(--wpds-dimension-padding-xs, 4px);
1763    overflow: auto;
1764  }
1765  
1766  .dataviews-filters__search-widget-listitem {
1767    display: flex;
1768    align-items: center;
1769    gap: var(--wpds-dimension-gap-md, 12px);
1770    border-radius: var(--wpds-border-radius-sm, 2px);
1771    box-sizing: border-box;
1772    padding: var(--wpds-dimension-padding-xs, 4px) var(--wpds-dimension-padding-md, 12px);
1773    cursor: default;
1774    min-height: var(--wpds-dimension-size-md, 32px);
1775    font-family: -apple-system, system-ui, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
1776    font-weight: var(--wpds-typography-font-weight-default, 400);
1777    font-size: 13px;
1778    line-height: 20px;
1779  }
1780  
1781  .dataviews-filters__search-widget-listitem:last-child {
1782    margin-block-end: 0;
1783  }
1784  
1785  .dataviews-filters__search-widget-listitem:hover, .dataviews-filters__search-widget-listitem[data-active-item], .dataviews-filters__search-widget-listitem:focus {
1786    background-color: var(--wpds-color-background-interactive-brand-weak-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 12%, white));
1787  }
1788  
1789  .dataviews-filters__search-widget-listitem:hover .dataviews-filters__search-widget-listitem-single-selection, .dataviews-filters__search-widget-listitem[data-active-item] .dataviews-filters__search-widget-listitem-single-selection, .dataviews-filters__search-widget-listitem:focus .dataviews-filters__search-widget-listitem-single-selection {
1790    border-color: var(--wpds-color-stroke-interactive-brand-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 85%, black));
1791    background: var(--wpds-color-background-surface-neutral-strong, #fff);
1792  }
1793  
1794  .dataviews-filters__search-widget-listitem:hover .dataviews-filters__search-widget-listitem-single-selection.is-selected, .dataviews-filters__search-widget-listitem[data-active-item] .dataviews-filters__search-widget-listitem-single-selection.is-selected, .dataviews-filters__search-widget-listitem:focus .dataviews-filters__search-widget-listitem-single-selection.is-selected {
1795    border-color: var(--wpds-color-stroke-interactive-brand-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 85%, black));
1796    background: var(--wpds-color-background-interactive-brand-strong-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 93%, black));
1797  }
1798  
1799  .dataviews-filters__search-widget-listitem:hover .dataviews-filters__search-widget-listitem-multi-selection, .dataviews-filters__search-widget-listitem[data-active-item] .dataviews-filters__search-widget-listitem-multi-selection, .dataviews-filters__search-widget-listitem:focus .dataviews-filters__search-widget-listitem-multi-selection {
1800    border-color: var(--wpds-color-stroke-interactive-brand-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 85%, black));
1801    background: var(--wpds-color-background-surface-neutral-strong, #fff);
1802  }
1803  
1804  .dataviews-filters__search-widget-listitem:hover .dataviews-filters__search-widget-listitem-multi-selection.is-selected, .dataviews-filters__search-widget-listitem[data-active-item] .dataviews-filters__search-widget-listitem-multi-selection.is-selected, .dataviews-filters__search-widget-listitem:focus .dataviews-filters__search-widget-listitem-multi-selection.is-selected {
1805    border-color: var(--wpds-color-stroke-interactive-brand-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 85%, black));
1806    background: var(--wpds-color-background-interactive-brand-strong-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 93%, black));
1807  }
1808  
1809  .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-value {
1810    overflow: hidden;
1811    text-overflow: ellipsis;
1812    white-space: nowrap;
1813    min-width: 0;
1814  }
1815  
1816  .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-description {
1817    display: block;
1818    overflow: hidden;
1819    text-overflow: ellipsis;
1820    font-size: var(--wpds-typography-font-size-sm, 12px);
1821    line-height: 16px;
1822    color: var(--wpds-color-foreground-content-neutral-weak, #707070);
1823  }
1824  
1825  .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-single-selection {
1826    border: 1px solid #1e1e1e;
1827    margin-right: 12px;
1828    transition: none;
1829    border-radius: 50%;
1830    width: 24px;
1831    height: 24px;
1832    min-width: 24px;
1833    max-width: 24px;
1834    position: relative;
1835  }
1836  
1837  @media not (prefers-reduced-motion) {
1838    .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-single-selection {
1839      transition: box-shadow 0.1s linear;
1840    }
1841  }
1842  @media (min-width: 600px) {
1843    .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-single-selection {
1844      height: 16px;
1845      width: 16px;
1846      min-width: 16px;
1847      max-width: 16px;
1848    }
1849  }
1850  .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-single-selection:checked::before {
1851    box-sizing: inherit;
1852    width: 12px;
1853    height: 12px;
1854    position: absolute;
1855    top: 50%;
1856    left: 50%;
1857    transform: translate(-50%, -50%);
1858    margin: 0;
1859    background-color: #fff;
1860    border: 4px solid #fff;
1861  }
1862  
1863  @media (min-width: 600px) {
1864    .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-single-selection:checked::before {
1865      width: 8px;
1866      height: 8px;
1867    }
1868  }
1869  .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-single-selection:focus {
1870    box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--wp-admin-theme-color);
1871    outline: 2px solid transparent;
1872  }
1873  
1874  .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-single-selection:checked {
1875    background: var(--wp-admin-theme-color);
1876    border: none;
1877  }
1878  
1879  .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-single-selection {
1880    margin: 0;
1881    padding: 0;
1882  }
1883  
1884  .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-single-selection.is-selected {
1885    background: var(--wpds-color-background-interactive-brand-strong, var(--wp-admin-theme-color, #3858e9));
1886    border-color: var(--wpds-color-stroke-interactive-brand, var(--wp-admin-theme-color, #3858e9));
1887  }
1888  
1889  .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-single-selection.is-selected::before {
1890    content: "";
1891    border-radius: 50%;
1892    box-sizing: inherit;
1893    width: 12px;
1894    height: 12px;
1895    position: absolute;
1896    top: 50%;
1897    left: 50%;
1898    transform: translate(-50%, -50%);
1899    margin: 0;
1900    background-color: var(--wpds-color-foreground-interactive-brand-strong, #fff);
1901    border: 4px solid var(--wpds-color-foreground-interactive-brand-strong, #fff);
1902  }
1903  
1904  @media (min-width: 600px) {
1905    .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-single-selection.is-selected::before {
1906      width: 8px;
1907      height: 8px;
1908    }
1909  }
1910  .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection {
1911    --checkbox-size: 24px;
1912    flex-shrink: 0;
1913    border: 1px solid #1e1e1e;
1914    margin-right: 12px;
1915    transition: none;
1916    border-radius: 2px;
1917    font-family: -apple-system, system-ui, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
1918    padding: 6px 8px;
1919    /* Fonts smaller than 16px causes mobile safari to zoom. */
1920    font-size: 16px;
1921    /* Override core line-height. To be reviewed. */
1922    line-height: normal;
1923    box-shadow: 0 0 0 transparent;
1924    border-radius: 2px;
1925    border: 1px solid #949494;
1926  }
1927  
1928  @media not (prefers-reduced-motion) {
1929    .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection {
1930      transition: box-shadow 0.1s linear;
1931    }
1932  }
1933  @media (min-width: 600px) {
1934    .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection {
1935      font-size: 13px;
1936      /* Override core line-height. To be reviewed. */
1937      line-height: normal;
1938    }
1939  }
1940  .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection:focus {
1941    border-color: var(--wp-admin-theme-color);
1942    box-shadow: 0 0 0 0.5px var(--wp-admin-theme-color);
1943    outline: 2px solid transparent;
1944  }
1945  
1946  .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection::-moz-placeholder {
1947    color: rgba(30, 30, 30, 0.62);
1948  }
1949  
1950  .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection::placeholder {
1951    color: rgba(30, 30, 30, 0.62);
1952  }
1953  
1954  .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection:focus {
1955    box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--wp-admin-theme-color);
1956    outline: 2px solid transparent;
1957  }
1958  
1959  .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection:checked {
1960    background: var(--wp-admin-theme-color);
1961    border-color: var(--wp-admin-theme-color);
1962  }
1963  
1964  .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection:checked::before, .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection[aria-checked=mixed]::before {
1965    margin: -3px -5px;
1966    color: #fff;
1967  }
1968  
1969  @media (min-width: 782px) {
1970    .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection:checked::before, .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection[aria-checked=mixed]::before {
1971      margin: -4px 0 0 -5px;
1972    }
1973  }
1974  .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection[aria-checked=mixed] {
1975    background: var(--wp-admin-theme-color);
1976    border-color: var(--wp-admin-theme-color);
1977  }
1978  
1979  .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection[aria-checked=mixed]::before {
1980    content: "\f460";
1981    float: left;
1982    display: inline-block;
1983    vertical-align: middle;
1984    width: 16px;
1985    /* stylelint-disable-next-line font-family-no-missing-generic-family-keyword -- dashicons don't need a generic family keyword. */
1986    font: normal 30px/1 dashicons;
1987    speak: none;
1988    -webkit-font-smoothing: antialiased;
1989    -moz-osx-font-smoothing: grayscale;
1990  }
1991  
1992  @media (min-width: 782px) {
1993    .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection[aria-checked=mixed]::before {
1994      float: none;
1995      font-size: 21px;
1996    }
1997  }
1998  .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection[aria-disabled=true], .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection:disabled {
1999    background: #f0f0f0;
2000    border-color: #ddd;
2001    cursor: default;
2002    opacity: 1;
2003  }
2004  
2005  .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection {
2006    position: relative;
2007    background: var(--wpds-color-background-interactive-neutral-weak, rgba(0, 0, 0, 0));
2008    color: var(--wpds-color-foreground-content-neutral, #1e1e1e);
2009    margin: 0;
2010    padding: 0;
2011    width: var(--checkbox-size);
2012    height: var(--checkbox-size);
2013  }
2014  
2015  @media (min-width: 600px) {
2016    .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection {
2017      --checkbox-size: 16px;
2018    }
2019  }
2020  @media not (prefers-reduced-motion) {
2021    .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection {
2022      transition: 0.1s border-color ease-in-out;
2023    }
2024  }
2025  .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection.is-selected {
2026    background: var(--wpds-color-background-interactive-brand-strong, var(--wp-admin-theme-color, #3858e9));
2027    border-color: var(--wpds-color-stroke-interactive-brand, var(--wp-admin-theme-color, #3858e9));
2028  }
2029  
2030  .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection.is-selected svg {
2031    --checkmark-size: var(--checkbox-size);
2032    fill: var(--wpds-color-foreground-interactive-neutral-strong, #f0f0f0);
2033    position: absolute;
2034    left: 50%;
2035    top: 50%;
2036    transform: translate(-50%, -50%);
2037    width: var(--checkmark-size);
2038    height: var(--checkmark-size);
2039  }
2040  
2041  @media (min-width: 600px) {
2042    .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection.is-selected svg {
2043      --checkmark-size: calc(var(--checkbox-size) + 4px);
2044    }
2045  }
2046  .dataviews-filters__search-widget-filter-combobox__wrapper {
2047    position: relative;
2048    padding: var(--wpds-dimension-padding-sm, 8px);
2049  }
2050  
2051  .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input {
2052    font-family: -apple-system, system-ui, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
2053    padding: 6px 8px;
2054    /* Fonts smaller than 16px causes mobile safari to zoom. */
2055    font-size: 16px;
2056    /* Override core line-height. To be reviewed. */
2057    line-height: normal;
2058    box-shadow: 0 0 0 transparent;
2059    border-radius: 2px;
2060    border: 1px solid #949494;
2061  }
2062  
2063  @media not (prefers-reduced-motion) {
2064    .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input {
2065      transition: box-shadow 0.1s linear;
2066    }
2067  }
2068  @media (min-width: 600px) {
2069    .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input {
2070      font-size: 13px;
2071      /* Override core line-height. To be reviewed. */
2072      line-height: normal;
2073    }
2074  }
2075  .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input:focus {
2076    border-color: var(--wp-admin-theme-color);
2077    box-shadow: 0 0 0 0.5px var(--wp-admin-theme-color);
2078    outline: 2px solid transparent;
2079  }
2080  
2081  .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::-moz-placeholder {
2082    color: rgba(30, 30, 30, 0.62);
2083  }
2084  
2085  .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::placeholder {
2086    color: rgba(30, 30, 30, 0.62);
2087  }
2088  
2089  .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input {
2090    display: block;
2091    padding: 0 var(--wpds-dimension-padding-sm, 8px) 0 var(--wpds-dimension-size-md, 32px);
2092    width: 100%;
2093    height: var(--wpds-dimension-size-md, 32px);
2094    margin-left: 0;
2095    margin-right: 0;
2096    /* Fonts smaller than 16px causes mobile safari to zoom. */
2097    font-size: 16px;
2098  }
2099  
2100  @media (min-width: 600px) {
2101    .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input {
2102      font-size: var(--wpds-typography-font-size-md, 13px);
2103    }
2104  }
2105  .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input:focus {
2106    background: var(--wpds-color-background-surface-neutral-strong, #fff);
2107    box-shadow: inset 0 0 0 var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)) var(--wpds-color-stroke-focus, var(--wp-admin-theme-color, #3858e9));
2108  }
2109  
2110  .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::-moz-placeholder {
2111    color: var(--wpds-color-foreground-content-neutral-weak, #707070);
2112  }
2113  
2114  .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::placeholder {
2115    color: var(--wpds-color-foreground-content-neutral-weak, #707070);
2116  }
2117  
2118  .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::-webkit-search-decoration, .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::-webkit-search-cancel-button, .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::-webkit-search-results-button, .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::-webkit-search-results-decoration {
2119    -webkit-appearance: none;
2120  }
2121  
2122  .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__icon {
2123    position: absolute;
2124    inset-inline-start: var(--wpds-dimension-gap-md, 12px);
2125    top: 0;
2126    bottom: 0;
2127    display: flex;
2128    align-items: center;
2129    justify-content: center;
2130    width: var(--wpds-dimension-size-sm, 24px);
2131  }
2132  
2133  .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__icon:dir(ltr) {
2134    transform: scaleX(-1);
2135  }
2136  
2137  .dataviews-filters__container-visibility-toggle {
2138    position: relative;
2139    flex-shrink: 0;
2140  }
2141  
2142  .dataviews-filters-toggle__count {
2143    position: absolute;
2144    top: 0;
2145    right: 0;
2146    transform: translate(50%, -50%);
2147    background: var(--wpds-color-background-interactive-brand-strong, var(--wp-admin-theme-color, #3858e9));
2148    height: var(--wpds-dimension-size-2xs, 16px);
2149    min-width: var(--wpds-dimension-size-2xs, 16px);
2150    line-height: var(--wpds-typography-line-height-xs, 16px);
2151    padding: 0 var(--wpds-dimension-padding-xs, 4px);
2152    text-align: center;
2153    border-radius: var(--wpds-border-radius-lg, 8px);
2154    font-size: 11px;
2155    outline: var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)) solid var(--wpds-color-background-surface-neutral-strong, #fff);
2156    color: var(--wpds-color-foreground-interactive-neutral-strong, #f0f0f0);
2157    box-sizing: border-box;
2158  }
2159  
2160  .dataviews-search {
2161    width: -moz-fit-content;
2162    width: fit-content;
2163  }
2164  
2165  .dataviews-filters__user-input-widget {
2166    padding: var(--wpds-dimension-padding-lg, 16px);
2167  }
2168  
2169  .dataviews-filters__user-input-widget .components-input-control__prefix {
2170    padding-left: var(--wpds-dimension-padding-sm, 8px);
2171  }
2172  
2173  .dataviews-filters__search-widget-no-elements {
2174    display: flex;
2175    align-items: center;
2176    justify-content: center;
2177    padding: var(--wpds-dimension-padding-lg, 16px);
2178  }
2179  
2180  .dataviews-footer {
2181    position: sticky;
2182    bottom: 0;
2183    left: 0;
2184    background-color: inherit;
2185    padding: var(--wpds-dimension-padding-md, 12px) var(--wpds-dimension-padding-2xl, 24px);
2186    border-top: var(--wpds-border-width-xs, 1px) solid var(--wpds-color-stroke-surface-neutral-weak, #f0f0f0);
2187    flex-shrink: 0;
2188  }
2189  
2190  @media not (prefers-reduced-motion) {
2191    .dataviews-footer {
2192      transition: padding ease-out 0.1s;
2193    }
2194  }
2195  .dataviews-footer {
2196    z-index: 1;
2197  }
2198  
2199  .dataviews-footer .is-refreshing {
2200    opacity: 0.5;
2201    pointer-events: none;
2202  }
2203  
2204  @media not (prefers-reduced-motion) {
2205    .dataviews-footer .is-refreshing {
2206      opacity: 1;
2207      animation: dataviews-pulse 1s ease-in-out infinite;
2208    }
2209  }
2210  @container (max-width: 560px) {
2211    .dataviews-footer__content {
2212      flex-direction: column !important;
2213    }
2214    .dataviews-footer__content .dataviews-bulk-actions-footer__container {
2215      width: 100%;
2216    }
2217    .dataviews-footer__content .dataviews-bulk-actions-footer__item-count {
2218      flex-grow: 1;
2219    }
2220    .dataviews-footer__content .dataviews-pagination {
2221      width: 100%;
2222      justify-content: space-between;
2223    }
2224  }
2225  .dataviews-pagination__page-select {
2226    font-size: 11px;
2227    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
2228    text-transform: uppercase;
2229  }
2230  
2231  @media (min-width: 600px) {
2232    .dataviews-pagination__page-select .components-select-control__input {
2233      font-size: 11px !important;
2234      font-weight: var(--wpds-typography-font-weight-emphasis, 600);
2235    }
2236  }
2237  .dataviews-action-modal {
2238    z-index: 1000001;
2239  }
2240  
2241  .dataviews-item-actions .components-button:not(.dataviews-all-actions-button) {
2242    padding: 0 var(--wpds-dimension-padding-xs, 4px);
2243  }
2244  
2245  .dataviews-selection-checkbox {
2246    --checkbox-input-size: 24px;
2247  }
2248  
2249  @media (min-width: 600px) {
2250    .dataviews-selection-checkbox {
2251      --checkbox-input-size: 16px;
2252    }
2253  }
2254  .dataviews-selection-checkbox {
2255    line-height: 0;
2256    flex-shrink: 0;
2257  }
2258  
2259  .dataviews-selection-checkbox .components-checkbox-control__input-container {
2260    margin: 0;
2261  }
2262  
2263  .dataviews-view-config {
2264    width: 320px;
2265    container-type: inline-size;
2266    font-size: var(--wpds-typography-font-size-md, 13px);
2267    line-height: var(--wpds-typography-line-height-sm, 20px);
2268  }
2269  
2270  .dataviews-config__popover.is-expanded .dataviews-config__popover-content-wrapper {
2271    overflow-y: scroll;
2272    height: 100%;
2273  }
2274  
2275  .dataviews-config__popover.is-expanded .dataviews-config__popover-content-wrapper .dataviews-view-config {
2276    width: auto;
2277  }
2278  
2279  .dataviews-view-config__sort-direction .components-toggle-group-control-option-base {
2280    text-transform: uppercase;
2281  }
2282  
2283  .dataviews-settings-section__title.dataviews-settings-section__title {
2284    line-height: var(--wpds-typography-line-height-md, 24px);
2285    font-size: 15px;
2286  }
2287  
2288  .dataviews-settings-section__sidebar {
2289    grid-column: span 4;
2290  }
2291  
2292  .dataviews-settings-section__content,
2293  .dataviews-settings-section__content > * {
2294    grid-column: span 8;
2295  }
2296  
2297  .dataviews-settings-section__content .is-divided-in-two {
2298    display: contents;
2299  }
2300  
2301  .dataviews-settings-section__content .is-divided-in-two > * {
2302    grid-column: span 4;
2303  }
2304  
2305  .dataviews-settings-section:has(.dataviews-settings-section__content:empty) {
2306    display: none;
2307  }
2308  
2309  @container (max-width: 500px) {
2310    .dataviews-settings-section.dataviews-settings-section {
2311      grid-template-columns: repeat(2, 1fr);
2312    }
2313    .dataviews-settings-section.dataviews-settings-section .dataviews-settings-section__sidebar {
2314      grid-column: span 2;
2315    }
2316    .dataviews-settings-section.dataviews-settings-section .dataviews-settings-section__content {
2317      grid-column: span 2;
2318    }
2319  }
2320  .dataviews-view-config__sort-controls > * {
2321    flex: 1;
2322  }
2323  
2324  .dataviews-view-config__label {
2325    text-wrap: nowrap;
2326  }
2327  
2328  .dataviews-view-config__toggle-wrapper {
2329    position: relative;
2330    display: inline-flex;
2331  }
2332  
2333  .dataviews-view-config__modified-indicator {
2334    position: absolute;
2335    top: var(--wpds-dimension-gap-xs, 4px);
2336    right: var(--wpds-dimension-gap-xs, 4px);
2337    width: var(--wpds-dimension-gap-xs, 4px);
2338    height: var(--wpds-dimension-gap-xs, 4px);
2339    background: var(--wpds-color-background-interactive-brand-strong, var(--wp-admin-theme-color, #3858e9));
2340    border-radius: 50%;
2341    pointer-events: none;
2342  }
2343  
2344  .dataviews-view-grid-items {
2345    margin-bottom: auto;
2346    display: grid;
2347    gap: var(--wpds-dimension-gap-xl, 24px);
2348    grid-template-rows: max-content;
2349    grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
2350    padding: 0 var(--wpds-dimension-padding-2xl, 24px) var(--wpds-dimension-padding-2xl, 24px);
2351    container-type: inline-size;
2352  }
2353  
2354  @media not (prefers-reduced-motion) {
2355    .dataviews-view-grid-items {
2356      transition: padding ease-out 0.1s;
2357    }
2358  }
2359  .dataviews-view-grid-items.has-compact-density {
2360    gap: var(--wpds-dimension-gap-lg, 16px);
2361  }
2362  
2363  .dataviews-view-grid-items.has-comfortable-density {
2364    gap: var(--wpds-dimension-gap-2xl, 32px);
2365  }
2366  
2367  .dataviews-view-grid {
2368    padding: 0 var(--wpds-dimension-padding-2xl, 24px) var(--wpds-dimension-padding-2xl, 24px);
2369    display: flex;
2370    flex-direction: column;
2371    gap: var(--wpds-dimension-gap-xl, 24px);
2372    container-type: inline-size;
2373    margin-bottom: auto;
2374  }
2375  
2376  @media not (prefers-reduced-motion) {
2377    .dataviews-view-grid {
2378      transition: padding ease-out 0.1s;
2379    }
2380  }
2381  .dataviews-view-grid.has-compact-density {
2382    gap: var(--wpds-dimension-gap-lg, 16px);
2383  }
2384  
2385  .dataviews-view-grid.has-compact-density .dataviews-view-grid__row {
2386    gap: var(--wpds-dimension-gap-lg, 16px);
2387  }
2388  
2389  .dataviews-view-grid.has-comfortable-density {
2390    gap: var(--wpds-dimension-gap-2xl, 32px);
2391  }
2392  
2393  .dataviews-view-grid.has-comfortable-density .dataviews-view-grid__row {
2394    gap: var(--wpds-dimension-gap-2xl, 32px);
2395  }
2396  
2397  .dataviews-view-grid .dataviews-view-grid__row {
2398    display: grid;
2399    gap: var(--wpds-dimension-gap-xl, 24px);
2400  }
2401  
2402  .dataviews-view-grid .dataviews-view-grid__row .dataviews-view-grid__row__gridcell {
2403    border-radius: var(--wpds-border-radius-md, 4px);
2404    position: relative;
2405  }
2406  
2407  .dataviews-view-grid .dataviews-view-grid__row .dataviews-view-grid__row__gridcell[data-focus-visible]::after {
2408    content: "";
2409    position: absolute;
2410    top: 0;
2411    left: 0;
2412    width: 100%;
2413    height: 100%;
2414    box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wpds-color-stroke-focus, var(--wp-admin-theme-color, #3858e9));
2415    border-radius: var(--wpds-border-radius-md, 4px);
2416    pointer-events: none;
2417    outline: 2px solid transparent;
2418  }
2419  
2420  .dataviews-view-grid .dataviews-view-grid__card,
2421  .dataviews-view-grid-infinite-scroll .dataviews-view-grid__card {
2422    height: 100%;
2423    justify-content: flex-start;
2424    position: relative;
2425    isolation: isolate;
2426  }
2427  
2428  .dataviews-view-grid .dataviews-view-grid__card .dataviews-view-grid__title-actions,
2429  .dataviews-view-grid-infinite-scroll .dataviews-view-grid__card .dataviews-view-grid__title-actions {
2430    padding: var(--wpds-dimension-padding-sm, 8px) 0 var(--wpds-dimension-padding-xs, 4px);
2431  }
2432  
2433  .dataviews-view-grid .dataviews-view-grid__card .dataviews-view-grid__title-field,
2434  .dataviews-view-grid-infinite-scroll .dataviews-view-grid__card .dataviews-view-grid__title-field {
2435    min-height: var(--wpds-dimension-size-sm, 24px);
2436    overflow: hidden;
2437    align-content: center;
2438    text-align: start;
2439  }
2440  
2441  .dataviews-view-grid .dataviews-view-grid__card .dataviews-view-grid__title-field--clickable,
2442  .dataviews-view-grid-infinite-scroll .dataviews-view-grid__card .dataviews-view-grid__title-field--clickable {
2443    width: -moz-fit-content;
2444    width: fit-content;
2445  }
2446  
2447  .dataviews-view-grid .dataviews-view-grid__card.is-selected .dataviews-view-grid__fields .dataviews-view-grid__field .dataviews-view-grid__field-value,
2448  .dataviews-view-grid-infinite-scroll .dataviews-view-grid__card.is-selected .dataviews-view-grid__fields .dataviews-view-grid__field .dataviews-view-grid__field-value {
2449    color: var(--wpds-color-foreground-content-neutral, #1e1e1e);
2450  }
2451  
2452  .dataviews-view-grid .dataviews-view-grid__card.is-selected .dataviews-view-grid__media::after,
2453  .dataviews-view-grid-infinite-scroll .dataviews-view-grid__card.is-selected .dataviews-view-grid__media::after {
2454    box-shadow: inset 0 0 0 var(--wpds-border-width-xs, 1px) var(--wpds-color-stroke-interactive-brand, var(--wp-admin-theme-color, #3858e9)), inset 0 0 0 var(--wpds-border-width-sm, 2px) var(--wpds-color-background-surface-neutral-strong, #fff);
2455  }
2456  
2457  .dataviews-view-grid .dataviews-view-grid__card .dataviews-view-grid__media:focus::after,
2458  .dataviews-view-grid-infinite-scroll .dataviews-view-grid__card .dataviews-view-grid__media:focus::after {
2459    box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wpds-color-stroke-focus, var(--wp-admin-theme-color, #3858e9));
2460  }
2461  
2462  .dataviews-view-grid .dataviews-view-grid__media,
2463  .dataviews-view-grid-infinite-scroll .dataviews-view-grid__media {
2464    width: 100%;
2465    aspect-ratio: 1/1;
2466    background-color: var(--wpds-color-background-surface-neutral-strong, #fff);
2467    border-radius: var(--wpds-border-radius-md, 4px);
2468    overflow: hidden;
2469    position: relative;
2470  }
2471  
2472  .dataviews-view-grid .dataviews-view-grid__media.dataviews-view-grid__media--placeholder,
2473  .dataviews-view-grid-infinite-scroll .dataviews-view-grid__media.dataviews-view-grid__media--placeholder {
2474    aspect-ratio: 3/1;
2475  }
2476  
2477  .dataviews-view-grid .dataviews-view-grid__media img,
2478  .dataviews-view-grid-infinite-scroll .dataviews-view-grid__media img {
2479    -o-object-fit: cover;
2480    object-fit: cover;
2481    width: 100%;
2482    height: 100%;
2483  }
2484  
2485  .dataviews-view-grid .dataviews-view-grid__media::after,
2486  .dataviews-view-grid-infinite-scroll .dataviews-view-grid__media::after {
2487    content: "";
2488    position: absolute;
2489    top: 0;
2490    left: 0;
2491    width: 100%;
2492    height: 100%;
2493    box-shadow: inset 0 0 0 var(--wpds-border-width-xs, 1px) rgba(0, 0, 0, 0.1);
2494    border-radius: var(--wpds-border-radius-md, 4px);
2495    pointer-events: none;
2496  }
2497  
2498  .dataviews-view-grid .dataviews-view-grid__media .dataviews-view-grid__media-placeholder,
2499  .dataviews-view-grid-infinite-scroll .dataviews-view-grid__media .dataviews-view-grid__media-placeholder {
2500    width: 100%;
2501    height: 100%;
2502    display: block;
2503    border-radius: var(--wpds-border-radius-md, 4px);
2504    box-shadow: none;
2505    background: var(--wpds-color-background-surface-neutral, #fcfcfc);
2506  }
2507  
2508  .dataviews-view-grid .dataviews-view-grid__fields,
2509  .dataviews-view-grid-infinite-scroll .dataviews-view-grid__fields {
2510    position: relative;
2511    font-size: 12px;
2512    line-height: 16px;
2513  }
2514  
2515  .dataviews-view-grid .dataviews-view-grid__fields:not(:empty),
2516  .dataviews-view-grid-infinite-scroll .dataviews-view-grid__fields:not(:empty) {
2517    padding: 0 0 var(--wpds-dimension-padding-md, 12px);
2518  }
2519  
2520  .dataviews-view-grid .dataviews-view-grid__fields .dataviews-view-grid__field-value:not(:empty),
2521  .dataviews-view-grid-infinite-scroll .dataviews-view-grid__fields .dataviews-view-grid__field-value:not(:empty) {
2522    min-height: var(--wpds-dimension-size-sm, 24px);
2523    line-height: var(--wpds-typography-line-height-sm, 20px);
2524    padding-top: calc((var(--wpds-dimension-size-sm, 24px) - var(--wpds-typography-line-height-sm, 20px)) / 2);
2525  }
2526  
2527  .dataviews-view-grid .dataviews-view-grid__fields .dataviews-view-grid__field,
2528  .dataviews-view-grid-infinite-scroll .dataviews-view-grid__fields .dataviews-view-grid__field {
2529    min-height: var(--wpds-dimension-size-sm, 24px);
2530    align-items: center;
2531  }
2532  
2533  .dataviews-view-grid .dataviews-view-grid__fields .dataviews-view-grid__field .dataviews-view-grid__field-name,
2534  .dataviews-view-grid-infinite-scroll .dataviews-view-grid__fields .dataviews-view-grid__field .dataviews-view-grid__field-name {
2535    width: 35%;
2536    color: var(--wpds-color-foreground-content-neutral-weak, #707070);
2537    overflow: hidden;
2538    text-overflow: ellipsis;
2539    white-space: nowrap;
2540  }
2541  
2542  .dataviews-view-grid .dataviews-view-grid__fields .dataviews-view-grid__field .dataviews-view-grid__field-value,
2543  .dataviews-view-grid-infinite-scroll .dataviews-view-grid__fields .dataviews-view-grid__field .dataviews-view-grid__field-value {
2544    width: 65%;
2545    overflow: hidden;
2546    text-overflow: ellipsis;
2547    white-space: nowrap;
2548  }
2549  
2550  .dataviews-view-grid .dataviews-view-grid__fields .dataviews-view-grid__field:not(:has(.dataviews-view-grid__field-value:not(:empty))),
2551  .dataviews-view-grid-infinite-scroll .dataviews-view-grid__fields .dataviews-view-grid__field:not(:has(.dataviews-view-grid__field-value:not(:empty))) {
2552    display: none;
2553  }
2554  
2555  .dataviews-view-grid .dataviews-view-grid__badge-fields:not(:empty),
2556  .dataviews-view-grid-infinite-scroll .dataviews-view-grid__badge-fields:not(:empty) {
2557    padding-bottom: var(--wpds-dimension-padding-md, 12px);
2558  }
2559  
2560  .dataviews-view-grid.is-refreshing,
2561  .dataviews-view-grid-infinite-scroll.is-refreshing {
2562    opacity: 0.5;
2563    pointer-events: none;
2564  }
2565  
2566  @media not (prefers-reduced-motion) {
2567    .dataviews-view-grid.is-refreshing,
2568    .dataviews-view-grid-infinite-scroll.is-refreshing {
2569      opacity: 1;
2570      animation: dataviews-pulse 1s ease-in-out infinite;
2571    }
2572  }
2573  .dataviews-view-grid__field-value:empty,
2574  .dataviews-view-grid__field:empty {
2575    display: none;
2576  }
2577  
2578  .dataviews-view-grid__card .dataviews-selection-checkbox {
2579    position: absolute;
2580    top: -9999em;
2581    left: var(--wpds-dimension-padding-sm, 8px);
2582    z-index: 1;
2583    opacity: 0;
2584  }
2585  
2586  @media not (prefers-reduced-motion) {
2587    .dataviews-view-grid__card .dataviews-selection-checkbox {
2588      transition: opacity 0.1s linear;
2589    }
2590  }
2591  @media (hover: none) {
2592    .dataviews-view-grid__card .dataviews-selection-checkbox {
2593      opacity: 1;
2594      top: var(--wpds-dimension-padding-sm, 8px);
2595    }
2596  }
2597  .dataviews-view-grid__card:hover .dataviews-selection-checkbox,
2598  .dataviews-view-grid__card:focus-within .dataviews-selection-checkbox,
2599  .dataviews-view-grid__card.is-selected .dataviews-selection-checkbox {
2600    opacity: 1;
2601    top: var(--wpds-dimension-padding-sm, 8px);
2602  }
2603  
2604  .dataviews-view-grid__card .dataviews-view-grid__media-actions {
2605    position: absolute;
2606    z-index: 1;
2607    top: var(--wpds-dimension-padding-xs, 4px);
2608    opacity: 0;
2609    right: var(--wpds-dimension-padding-xs, 4px);
2610  }
2611  
2612  .dataviews-view-grid__card .dataviews-view-grid__media-actions .dataviews-all-actions-button {
2613    background-color: var(--wpds-color-background-surface-neutral-strong, #fff);
2614  }
2615  
2616  @media not (prefers-reduced-motion) {
2617    .dataviews-view-grid__card .dataviews-view-grid__media-actions {
2618      transition: opacity 0.1s linear;
2619    }
2620  }
2621  @media (hover: none) {
2622    .dataviews-view-grid__card .dataviews-view-grid__media-actions {
2623      opacity: 1;
2624      top: var(--wpds-dimension-padding-xs, 4px);
2625    }
2626  }
2627  .dataviews-view-grid__card:hover .dataviews-view-grid__media-actions,
2628  .dataviews-view-grid__card:focus-within .dataviews-view-grid__media-actions,
2629  .dataviews-view-grid__card .dataviews-view-grid__media-actions:has(.dataviews-all-actions-button[aria-expanded=true]) {
2630    opacity: 1;
2631  }
2632  
2633  .dataviews-view-grid__media--clickable {
2634    cursor: var(--wpds-cursor-control, pointer);
2635  }
2636  
2637  .dataviews-view-grid__group-header {
2638    font-size: var(--wpds-typography-font-size-lg, 15px);
2639    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
2640    color: var(--wpds-color-foreground-content-neutral, #1e1e1e);
2641    margin: 0 0 var(--wpds-dimension-gap-sm, 8px) 0;
2642    padding: 0 var(--wpds-dimension-padding-2xl, 24px);
2643    container-type: inline-size;
2644  }
2645  
2646  div.dataviews-view-list {
2647    list-style-type: none;
2648  }
2649  
2650  .dataviews-view-list {
2651    margin: 0 0 auto;
2652  }
2653  
2654  .dataviews-view-list div[role=row],
2655  .dataviews-view-list div[role=article] {
2656    margin: 0;
2657    border-top: 1px solid var(--wpds-color-stroke-surface-neutral-weak, #f0f0f0);
2658  }
2659  
2660  .dataviews-view-list div[role=row] .dataviews-view-list__item-wrapper,
2661  .dataviews-view-list div[role=article] .dataviews-view-list__item-wrapper {
2662    position: relative;
2663    padding: var(--wpds-dimension-padding-lg, 16px) var(--wpds-dimension-padding-2xl, 24px);
2664    box-sizing: border-box;
2665  }
2666  
2667  .dataviews-view-list div[role=row] .dataviews-view-list__item-actions,
2668  .dataviews-view-list div[role=article] .dataviews-view-list__item-actions {
2669    display: flex;
2670    width: -moz-max-content;
2671    width: max-content;
2672    flex: 0 0 auto;
2673    gap: var(--wpds-dimension-gap-xs, 4px);
2674    white-space: nowrap;
2675  }
2676  
2677  .dataviews-view-list div[role=row] .dataviews-view-list__item-actions .components-button,
2678  .dataviews-view-list div[role=article] .dataviews-view-list__item-actions .components-button {
2679    position: relative;
2680    z-index: 1;
2681  }
2682  
2683  .dataviews-view-list div[role=row] .dataviews-view-list__item-actions > div,
2684  .dataviews-view-list div[role=article] .dataviews-view-list__item-actions > div {
2685    height: var(--wpds-dimension-size-sm, 24px);
2686  }
2687  
2688  .dataviews-view-list div[role=row] .dataviews-view-list__item-actions > :not(:last-child),
2689  .dataviews-view-list div[role=article] .dataviews-view-list__item-actions > :not(:last-child) {
2690    flex: 0;
2691    overflow: hidden;
2692    width: 0;
2693  }
2694  
2695  .dataviews-view-list div[role=row]:where(.is-selected, .is-hovered, :focus-within) .dataviews-view-list__item-actions > :not(:last-child),
2696  .dataviews-view-list div[role=article]:where(.is-selected, .is-hovered, :focus-within) .dataviews-view-list__item-actions > :not(:last-child) {
2697    flex-basis: min-content;
2698    width: auto;
2699    overflow: unset;
2700  }
2701  
2702  @media (hover: none) {
2703    .dataviews-view-list div[role=row] .dataviews-view-list__item-actions > :not(:last-child),
2704    .dataviews-view-list div[role=article] .dataviews-view-list__item-actions > :not(:last-child) {
2705      flex-basis: min-content;
2706      width: auto;
2707      overflow: unset;
2708    }
2709  }
2710  .dataviews-view-list div[role=row].is-selected.is-selected,
2711  .dataviews-view-list div[role=article].is-selected.is-selected {
2712    border-top: 1px solid var(--wpds-color-stroke-surface-brand, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 40%, white));
2713  }
2714  
2715  .dataviews-view-list div[role=row].is-selected.is-selected + div[role=row], .dataviews-view-list div[role=row].is-selected.is-selected + div[role=article],
2716  .dataviews-view-list div[role=article].is-selected.is-selected + div[role=row],
2717  .dataviews-view-list div[role=article].is-selected.is-selected + div[role=article] {
2718    border-top: 1px solid var(--wpds-color-stroke-surface-brand, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 40%, white));
2719  }
2720  
2721  .dataviews-view-list div[role=row]:not(.is-selected):hover, .dataviews-view-list div[role=row]:not(.is-selected).is-hovered, .dataviews-view-list div[role=row]:not(.is-selected):focus-within,
2722  .dataviews-view-list div[role=article]:not(.is-selected):hover,
2723  .dataviews-view-list div[role=article]:not(.is-selected).is-hovered,
2724  .dataviews-view-list div[role=article]:not(.is-selected):focus-within {
2725    color: var(--wpds-color-foreground-interactive-brand, var(--wp-admin-theme-color, #3858e9));
2726    background-color: var(--wpds-color-background-interactive-brand-weak, rgba(0, 0, 0, 0));
2727  }
2728  
2729  .dataviews-view-list div[role=row]:not(.is-selected):hover .dataviews-title-field,
2730  .dataviews-view-list div[role=row]:not(.is-selected):hover .dataviews-view-list__field, .dataviews-view-list div[role=row]:not(.is-selected).is-hovered .dataviews-title-field,
2731  .dataviews-view-list div[role=row]:not(.is-selected).is-hovered .dataviews-view-list__field, .dataviews-view-list div[role=row]:not(.is-selected):focus-within .dataviews-title-field,
2732  .dataviews-view-list div[role=row]:not(.is-selected):focus-within .dataviews-view-list__field,
2733  .dataviews-view-list div[role=article]:not(.is-selected):hover .dataviews-title-field,
2734  .dataviews-view-list div[role=article]:not(.is-selected):hover .dataviews-view-list__field,
2735  .dataviews-view-list div[role=article]:not(.is-selected).is-hovered .dataviews-title-field,
2736  .dataviews-view-list div[role=article]:not(.is-selected).is-hovered .dataviews-view-list__field,
2737  .dataviews-view-list div[role=article]:not(.is-selected):focus-within .dataviews-title-field,
2738  .dataviews-view-list div[role=article]:not(.is-selected):focus-within .dataviews-view-list__field {
2739    color: var(--wpds-color-foreground-interactive-brand, var(--wp-admin-theme-color, #3858e9));
2740  }
2741  
2742  .dataviews-view-list div[role=row].is-selected .dataviews-view-list__item-wrapper,
2743  .dataviews-view-list div[role=row].is-selected:focus-within .dataviews-view-list__item-wrapper,
2744  .dataviews-view-list div[role=article].is-selected .dataviews-view-list__item-wrapper,
2745  .dataviews-view-list div[role=article].is-selected:focus-within .dataviews-view-list__item-wrapper {
2746    background-color: var(--wpds-color-background-interactive-brand-weak-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 12%, white));
2747    color: var(--wpds-color-foreground-interactive-neutral, #1e1e1e);
2748  }
2749  
2750  .dataviews-view-list div[role=row].is-selected .dataviews-view-list__item-wrapper .dataviews-title-field,
2751  .dataviews-view-list div[role=row].is-selected .dataviews-view-list__item-wrapper .dataviews-view-list__field,
2752  .dataviews-view-list div[role=row].is-selected:focus-within .dataviews-view-list__item-wrapper .dataviews-title-field,
2753  .dataviews-view-list div[role=row].is-selected:focus-within .dataviews-view-list__item-wrapper .dataviews-view-list__field,
2754  .dataviews-view-list div[role=article].is-selected .dataviews-view-list__item-wrapper .dataviews-title-field,
2755  .dataviews-view-list div[role=article].is-selected .dataviews-view-list__item-wrapper .dataviews-view-list__field,
2756  .dataviews-view-list div[role=article].is-selected:focus-within .dataviews-view-list__item-wrapper .dataviews-title-field,
2757  .dataviews-view-list div[role=article].is-selected:focus-within .dataviews-view-list__item-wrapper .dataviews-view-list__field {
2758    color: var(--wpds-color-foreground-interactive-neutral-active, #1e1e1e);
2759  }
2760  
2761  .dataviews-view-list .dataviews-view-list__item {
2762    position: absolute;
2763    z-index: 1;
2764    inset: 0;
2765    scroll-margin: var(--wpds-dimension-gap-sm, 8px) 0;
2766    -webkit-appearance: none;
2767    -moz-appearance: none;
2768    appearance: none;
2769    border: none;
2770    background: none;
2771    padding: 0;
2772    cursor: var(--wpds-cursor-control, pointer);
2773  }
2774  
2775  .dataviews-view-list .dataviews-view-list__item:focus-visible {
2776    outline: none;
2777  }
2778  
2779  .dataviews-view-list .dataviews-view-list__item:focus-visible::before {
2780    position: absolute;
2781    content: "";
2782    inset: var(--wp-admin-border-width-focus);
2783    box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wpds-color-stroke-focus, var(--wp-admin-theme-color, #3858e9));
2784    border-radius: var(--wpds-border-radius-sm, 2px);
2785    outline: 2px solid transparent;
2786  }
2787  
2788  .dataviews-view-list .dataviews-view-list__title-field {
2789    flex: 1;
2790    min-height: var(--wpds-dimension-size-sm, 24px);
2791    line-height: var(--wpds-typography-line-height-md, 24px);
2792    overflow: hidden;
2793  }
2794  
2795  .dataviews-view-list .dataviews-view-list__title-field:has(a, button) {
2796    z-index: 1;
2797  }
2798  
2799  .dataviews-view-list .dataviews-view-list__media-wrapper {
2800    width: 48px;
2801    height: 48px;
2802    overflow: hidden;
2803    position: relative;
2804    flex-shrink: 0;
2805    background-color: var(--wpds-color-background-surface-neutral-strong, #fff);
2806    border-radius: var(--wpds-border-radius-md, 4px);
2807  }
2808  
2809  .dataviews-view-list .dataviews-view-list__media-wrapper img {
2810    width: 100%;
2811    height: 100%;
2812    -o-object-fit: cover;
2813    object-fit: cover;
2814  }
2815  
2816  .dataviews-view-list .dataviews-view-list__media-wrapper::after {
2817    content: "";
2818    position: absolute;
2819    top: 0;
2820    left: 0;
2821    width: 100%;
2822    height: 100%;
2823    box-shadow: inset 0 0 0 var(--wpds-border-width-xs, 1px) rgba(0, 0, 0, 0.1);
2824    border-radius: var(--wpds-border-radius-md, 4px);
2825  }
2826  
2827  .dataviews-view-list .dataviews-view-list__field-wrapper {
2828    min-height: 48px;
2829    flex-grow: 1;
2830    min-width: 0;
2831  }
2832  
2833  .dataviews-view-list .dataviews-view-list__field {
2834    color: var(--wpds-color-foreground-interactive-neutral-weak, #707070);
2835  }
2836  
2837  .dataviews-view-list .dataviews-view-list__fields {
2838    display: flex;
2839    gap: var(--wpds-dimension-gap-md, 12px);
2840    row-gap: var(--wpds-dimension-gap-xs, 4px);
2841    flex-wrap: wrap;
2842    font-size: 12px;
2843  }
2844  
2845  .dataviews-view-list .dataviews-view-list__fields:empty {
2846    display: none;
2847  }
2848  
2849  .dataviews-view-list .dataviews-view-list__fields .dataviews-view-list__field:has(.dataviews-view-list__field-value:empty) {
2850    display: none;
2851  }
2852  
2853  .dataviews-view-list .dataviews-view-list__fields .dataviews-view-list__field-value {
2854    min-height: var(--wpds-dimension-size-sm, 24px);
2855    line-height: var(--wpds-typography-line-height-sm, 20px);
2856    display: flex;
2857    align-items: center;
2858  }
2859  
2860  .dataviews-view-list + .dataviews-pagination {
2861    justify-content: space-between;
2862  }
2863  
2864  .dataviews-view-list.has-compact-density div[role=row] .dataviews-view-list__item-wrapper {
2865    padding: var(--wpds-dimension-padding-sm, 8px) var(--wpds-dimension-padding-2xl, 24px);
2866  }
2867  
2868  .dataviews-view-list.has-compact-density div[role=row] .dataviews-view-list__title-field {
2869    min-height: var(--wpds-dimension-size-2xs, 16px);
2870    line-height: var(--wpds-typography-line-height-xs, 16px);
2871  }
2872  
2873  .dataviews-view-list.has-compact-density div[role=row] .dataviews-view-list__media-wrapper {
2874    width: var(--wpds-dimension-size-md, 32px);
2875    height: var(--wpds-dimension-size-md, 32px);
2876  }
2877  
2878  .dataviews-view-list.has-compact-density div[role=row] .dataviews-view-list__field-wrapper {
2879    min-height: var(--wpds-dimension-size-md, 32px);
2880  }
2881  
2882  .dataviews-view-list.has-compact-density div[role=row] .dataviews-view-list__fields {
2883    gap: var(--wpds-dimension-gap-sm, 8px);
2884    row-gap: var(--wpds-dimension-gap-xs, 4px);
2885  }
2886  
2887  .dataviews-view-list.has-compact-density div[role=row] .dataviews-view-list__fields .dataviews-view-list__field-value {
2888    min-height: var(--wpds-dimension-size-2xs, 16px);
2889    line-height: var(--wpds-typography-line-height-xs, 16px);
2890  }
2891  
2892  .dataviews-view-list.has-comfortable-density div[role=row] .dataviews-view-list__item-wrapper {
2893    padding: var(--wpds-dimension-padding-2xl, 24px) var(--wpds-dimension-padding-2xl, 24px);
2894  }
2895  
2896  .dataviews-view-list.has-comfortable-density div[role=row] .dataviews-view-list__title-field {
2897    min-height: var(--wpds-dimension-size-md, 32px);
2898    line-height: var(--wpds-typography-line-height-xl, 32px);
2899  }
2900  
2901  .dataviews-view-list.has-comfortable-density div[role=row] .dataviews-view-list__media-wrapper {
2902    width: 64px;
2903    height: 64px;
2904  }
2905  
2906  .dataviews-view-list.has-comfortable-density div[role=row] .dataviews-view-list__field-wrapper {
2907    min-height: 64px;
2908  }
2909  
2910  .dataviews-view-list.has-comfortable-density div[role=row] .dataviews-view-list__fields {
2911    gap: var(--wpds-dimension-gap-lg, 16px);
2912    row-gap: var(--wpds-dimension-gap-sm, 8px);
2913  }
2914  
2915  .dataviews-view-list.has-comfortable-density div[role=row] .dataviews-view-list__fields .dataviews-view-list__field-value {
2916    min-height: var(--wpds-dimension-size-md, 32px);
2917    line-height: var(--wpds-typography-line-height-md, 24px);
2918  }
2919  
2920  .dataviews-view-list.is-refreshing {
2921    opacity: 0.5;
2922    pointer-events: none;
2923  }
2924  
2925  @media not (prefers-reduced-motion) {
2926    .dataviews-view-list.is-refreshing {
2927      opacity: 1;
2928      animation: dataviews-pulse 1s ease-in-out infinite;
2929    }
2930  }
2931  .dataviews-view-list__group-header {
2932    font-size: var(--wpds-typography-font-size-lg, 15px);
2933    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
2934    color: var(--wpds-color-foreground-content-neutral, #1e1e1e);
2935    margin: 0 0 var(--wpds-dimension-gap-sm, 8px) 0;
2936    padding: 0 var(--wpds-dimension-padding-2xl, 24px);
2937  }
2938  
2939  .dataviews-view-table {
2940    width: 100%;
2941    text-indent: 0;
2942    border-color: inherit;
2943    border-collapse: collapse;
2944    position: relative;
2945    color: var(--wpds-color-foreground-content-neutral-weak, #707070);
2946    margin-bottom: auto;
2947    background-color: inherit;
2948  }
2949  
2950  .dataviews-view-table th {
2951    text-align: left;
2952    color: var(--wpds-color-foreground-content-neutral, #1e1e1e);
2953    font-weight: normal;
2954    font-size: var(--wpds-typography-font-size-md, 13px);
2955  }
2956  
2957  .dataviews-view-table td,
2958  .dataviews-view-table th {
2959    padding: var(--wpds-dimension-padding-md, 12px);
2960  }
2961  
2962  .dataviews-view-table td.dataviews-view-table__actions-column,
2963  .dataviews-view-table th.dataviews-view-table__actions-column {
2964    text-align: right;
2965  }
2966  
2967  .dataviews-view-table td.dataviews-view-table__actions-column--sticky,
2968  .dataviews-view-table th.dataviews-view-table__actions-column--sticky {
2969    position: sticky;
2970    right: 0;
2971    background-color: var(--wp-dataviews-color-background, var(--wpds-color-background-surface-neutral-strong, #fff));
2972  }
2973  
2974  .dataviews-view-table td.dataviews-view-table__actions-column--stuck::after,
2975  .dataviews-view-table th.dataviews-view-table__actions-column--stuck::after {
2976    display: block;
2977    content: "";
2978    position: absolute;
2979    top: 0;
2980    bottom: 0;
2981    left: 0;
2982    width: 1px;
2983    background-color: var(--wpds-color-background-surface-neutral, #fcfcfc);
2984  }
2985  
2986  .dataviews-view-table td.dataviews-view-table__checkbox-column,
2987  .dataviews-view-table th.dataviews-view-table__checkbox-column {
2988    padding-right: 0;
2989  }
2990  
2991  .dataviews-view-table td.dataviews-view-table__checkbox-column .dataviews-view-table__cell-content-wrapper,
2992  .dataviews-view-table th.dataviews-view-table__checkbox-column .dataviews-view-table__cell-content-wrapper {
2993    max-width: auto;
2994    min-width: auto;
2995  }
2996  
2997  .dataviews-view-table tr {
2998    border-top: 1px solid var(--wpds-color-stroke-surface-neutral-weak, #f0f0f0);
2999    background-color: inherit;
3000  }
3001  
3002  .dataviews-view-table tr td:first-child,
3003  .dataviews-view-table tr th:first-child {
3004    padding-left: var(--wpds-dimension-padding-2xl, 24px);
3005  }
3006  
3007  .dataviews-view-table tr td:last-child,
3008  .dataviews-view-table tr th:last-child {
3009    padding-right: var(--wpds-dimension-padding-2xl, 24px);
3010  }
3011  
3012  .dataviews-view-table tr:last-child {
3013    border-bottom: 0;
3014  }
3015  
3016  .dataviews-view-table tr .dataviews-item-actions .components-button:not(.dataviews-all-actions-button) {
3017    opacity: 0;
3018  }
3019  
3020  @media (hover: none) {
3021    .dataviews-view-table tr .dataviews-item-actions .components-button:not(.dataviews-all-actions-button) {
3022      opacity: 1;
3023    }
3024  }
3025  .dataviews-view-table tr.is-selected {
3026    background-color: var(--wpds-color-background-interactive-brand-weak-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 12%, white));
3027    color: var(--wpds-color-foreground-content-neutral, #1e1e1e);
3028  }
3029  
3030  .dataviews-view-table tr.is-selected, .dataviews-view-table tr.is-selected + tr {
3031    border-top: 1px solid var(--wpds-color-stroke-surface-brand, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 40%, white));
3032  }
3033  
3034  .dataviews-view-table tr.is-selected .dataviews-view-table__actions-column--sticky {
3035    background-color: var(--wpds-color-background-interactive-brand-weak-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 12%, white));
3036  }
3037  
3038  .dataviews-view-table tr:focus-within .dataviews-item-actions .components-button:not(.dataviews-all-actions-button), .dataviews-view-table tr.is-hovered .dataviews-item-actions .components-button:not(.dataviews-all-actions-button), .dataviews-view-table tr:hover .dataviews-item-actions .components-button:not(.dataviews-all-actions-button) {
3039    opacity: 1;
3040  }
3041  
3042  .dataviews-view-table.has-bulk-actions tr:focus-within .dataviews-view-table__actions-column--sticky, .dataviews-view-table.has-bulk-actions tr:hover .dataviews-view-table__actions-column--sticky {
3043    background-color: var(--wp-dataviews-color-background, var(--wpds-color-background-surface-neutral-strong, #fff));
3044  }
3045  
3046  .dataviews-view-table.has-bulk-actions tr.is-selected .dataviews-view-table__actions-column--sticky, .dataviews-view-table.has-bulk-actions tr.is-selected:hover .dataviews-view-table__actions-column--sticky {
3047    background-color: var(--wpds-color-background-interactive-brand-weak-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 12%, white));
3048  }
3049  
3050  .dataviews-view-table thead {
3051    position: sticky;
3052    inset-block-start: 0;
3053    z-index: 1;
3054    background-color: inherit;
3055  }
3056  
3057  .dataviews-view-table thead.dataviews-view-table__thead--stuck::after {
3058    display: block;
3059    content: "";
3060    position: absolute;
3061    bottom: 0;
3062    left: 0;
3063    right: 0;
3064    height: 1px;
3065    background-color: var(--wpds-color-stroke-surface-neutral-weak, #f0f0f0);
3066  }
3067  
3068  .dataviews-view-table thead tr {
3069    border: 0;
3070  }
3071  
3072  .dataviews-view-table thead th {
3073    background-color: inherit;
3074    padding-top: var(--wpds-dimension-padding-sm, 8px);
3075    padding-bottom: var(--wpds-dimension-padding-sm, 8px);
3076    font-size: 11px;
3077    text-transform: uppercase;
3078    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
3079  }
3080  
3081  .dataviews-view-table thead th:has(.dataviews-view-table-header-button) {
3082    padding-left: var(--wpds-dimension-padding-xs, 4px);
3083    padding-right: var(--wpds-dimension-padding-xs, 4px);
3084  }
3085  
3086  .dataviews-view-table thead th:has(.dataviews-view-table-header-button) .dataviews-view-table-header-button {
3087    gap: var(--wpds-dimension-gap-xs, 4px);
3088  }
3089  
3090  .dataviews-view-table thead th:has(.dataviews-view-table-header-button):first-child {
3091    padding-left: var(--wpds-dimension-padding-lg, 16px);
3092  }
3093  
3094  .dataviews-view-table thead th:has(.dataviews-view-table-header-button):last-child {
3095    padding-right: var(--wpds-dimension-padding-lg, 16px);
3096  }
3097  
3098  .dataviews-view-table tbody td {
3099    vertical-align: top;
3100  }
3101  
3102  .dataviews-view-table tbody .dataviews-view-table__cell-content-wrapper {
3103    min-height: var(--wpds-dimension-size-md, 32px);
3104    display: flex;
3105    align-items: center;
3106    white-space: nowrap;
3107  }
3108  
3109  .dataviews-view-table tbody .dataviews-view-table__cell-content-wrapper.dataviews-view-table__cell-align-end {
3110    justify-content: flex-end;
3111    font-variant-numeric: tabular-nums;
3112  }
3113  
3114  .dataviews-view-table tbody .dataviews-view-table__cell-content-wrapper.dataviews-view-table__cell-align-center {
3115    justify-content: center;
3116  }
3117  
3118  .dataviews-view-table tbody .components-v-stack > .dataviews-view-table__cell-content-wrapper:not(:first-child) {
3119    min-height: 0;
3120  }
3121  
3122  .dataviews-view-table .dataviews-view-table-header-button {
3123    padding: var(--wpds-dimension-padding-xs, 4px) var(--wpds-dimension-padding-sm, 8px);
3124    font-size: 11px;
3125    text-transform: uppercase;
3126    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
3127  }
3128  
3129  .dataviews-view-table .dataviews-view-table-header-button:not(:hover) {
3130    color: var(--wpds-color-foreground-interactive-neutral, #1e1e1e);
3131  }
3132  
3133  .dataviews-view-table .dataviews-view-table-header-button span {
3134    speak: none;
3135  }
3136  
3137  .dataviews-view-table .dataviews-view-table-header-button span:empty {
3138    display: none;
3139  }
3140  
3141  .dataviews-view-table .dataviews-view-table-header {
3142    padding-left: var(--wpds-dimension-padding-xs, 4px);
3143  }
3144  
3145  .dataviews-view-table .dataviews-view-table__actions-column {
3146    width: auto;
3147    white-space: nowrap;
3148  }
3149  
3150  .dataviews-view-table.has-compact-density thead th:has(.dataviews-view-table-header-button):not(:first-child) {
3151    padding-left: 0;
3152  }
3153  
3154  .dataviews-view-table.has-compact-density thead th:has(.dataviews-view-table-header-button):not(:last-child) {
3155    padding-right: 0;
3156  }
3157  
3158  .dataviews-view-table.has-compact-density td,
3159  .dataviews-view-table.has-compact-density th {
3160    padding: var(--wpds-dimension-padding-xs, 4px) var(--wpds-dimension-padding-sm, 8px);
3161  }
3162  
3163  .dataviews-view-table.has-comfortable-density td,
3164  .dataviews-view-table.has-comfortable-density th {
3165    padding: var(--wpds-dimension-padding-lg, 16px) var(--wpds-dimension-padding-md, 12px);
3166  }
3167  
3168  .dataviews-view-table.has-compact-density td.dataviews-view-table__checkbox-column,
3169  .dataviews-view-table.has-compact-density th.dataviews-view-table__checkbox-column, .dataviews-view-table.has-comfortable-density td.dataviews-view-table__checkbox-column,
3170  .dataviews-view-table.has-comfortable-density th.dataviews-view-table__checkbox-column {
3171    padding-right: 0;
3172  }
3173  
3174  .dataviews-view-table-selection-checkbox {
3175    --checkbox-input-size: 24px;
3176  }
3177  
3178  @media (min-width: 600px) {
3179    .dataviews-view-table-selection-checkbox {
3180      --checkbox-input-size: 16px;
3181    }
3182  }
3183  .dataviews-column-primary__media {
3184    max-width: 60px;
3185    min-width: var(--wpds-dimension-size-md, 32px);
3186    min-height: var(--wpds-dimension-size-md, 32px);
3187    overflow: hidden;
3188    position: relative;
3189    flex-shrink: 0;
3190    background-color: var(--wpds-color-background-surface-neutral-strong, #fff);
3191    border-radius: var(--wpds-border-radius-md, 4px);
3192  }
3193  
3194  .dataviews-column-primary__media img {
3195    width: var(--wpds-dimension-size-md, 32px);
3196    height: var(--wpds-dimension-size-md, 32px);
3197    -o-object-fit: cover;
3198    object-fit: cover;
3199  }
3200  
3201  .dataviews-column-primary__media::after {
3202    content: "";
3203    position: absolute;
3204    top: 0;
3205    left: 0;
3206    width: 100%;
3207    height: 100%;
3208    box-shadow: inset 0 0 0 var(--wpds-border-width-xs, 1px) rgba(0, 0, 0, 0.1);
3209    border-radius: var(--wpds-border-radius-md, 4px);
3210  }
3211  
3212  .dataviews-view-table__cell-content-wrapper:not(.dataviews-column-primary__media),
3213  .dataviews-view-table__primary-column-content:not(.dataviews-column-primary__media) {
3214    min-width: 15ch;
3215    max-width: 80ch;
3216  }
3217  
3218  .dataviews-view-table__group-header-row .dataviews-view-table__group-header-cell {
3219    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
3220    padding: var(--wpds-dimension-padding-md, 12px) var(--wpds-dimension-padding-2xl, 24px);
3221    color: var(--wpds-color-foreground-content-neutral, #1e1e1e);
3222  }
3223  
3224  /* Column width intents via colgroup: make non-primary columns shrink-to-fit */
3225  .dataviews-view-table col[class^=dataviews-view-table__col-]:not(.dataviews-view-table__col-first-data):not(.dataviews-view-table__col-expand) {
3226    width: 1%;
3227  }
3228  
3229  .dataviews-view-table.is-refreshing {
3230    opacity: 0.5;
3231    pointer-events: none;
3232  }
3233  
3234  @media not (prefers-reduced-motion) {
3235    .dataviews-view-table.is-refreshing {
3236      opacity: 1;
3237      animation: dataviews-pulse 1s ease-in-out infinite;
3238    }
3239  }
3240  .dataviews-view-picker-grid.has-compact-density .dataviews-view-grid-items {
3241    gap: var(--wpds-dimension-gap-lg, 16px);
3242  }
3243  
3244  .dataviews-view-picker-grid.has-comfortable-density .dataviews-view-grid-items {
3245    gap: var(--wpds-dimension-gap-2xl, 32px);
3246  }
3247  
3248  .dataviews-view-picker-grid .dataviews-view-picker-grid__card {
3249    height: 100%;
3250    justify-content: flex-start;
3251    position: relative;
3252    isolation: isolate;
3253  }
3254  
3255  .dataviews-view-picker-grid .dataviews-view-picker-grid__card .dataviews-view-picker-grid__title-actions {
3256    padding: var(--wpds-dimension-padding-sm, 8px) 0 var(--wpds-dimension-padding-xs, 4px);
3257  }
3258  
3259  .dataviews-view-picker-grid .dataviews-view-picker-grid__card .dataviews-view-picker-grid__title-field {
3260    min-height: var(--wpds-dimension-size-sm, 24px);
3261    overflow: hidden;
3262    align-content: center;
3263    text-align: start;
3264  }
3265  
3266  .dataviews-view-picker-grid .dataviews-view-picker-grid__card .dataviews-view-picker-grid__title-field--clickable {
3267    width: -moz-fit-content;
3268    width: fit-content;
3269  }
3270  
3271  .dataviews-view-picker-grid .dataviews-view-picker-grid__card.is-selected .dataviews-view-picker-grid__fields .dataviews-view-picker-grid__field .dataviews-view-picker-grid__field-value {
3272    color: var(--wpds-color-foreground-content-neutral, #1e1e1e);
3273  }
3274  
3275  .dataviews-view-picker-grid .dataviews-view-picker-grid__card.is-selected .dataviews-view-picker-grid__media::after {
3276    box-shadow: inset 0 0 0 var(--wpds-border-width-xs, 1px) var(--wpds-color-stroke-interactive-brand, var(--wp-admin-theme-color, #3858e9)), inset 0 0 0 var(--wpds-border-width-sm, 2px) var(--wpds-color-background-surface-neutral-strong, #fff);
3277  }
3278  
3279  .dataviews-view-picker-grid .dataviews-view-picker-grid__card .dataviews-view-picker-grid__media:focus::after {
3280    box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wpds-color-stroke-focus, var(--wp-admin-theme-color, #3858e9));
3281  }
3282  
3283  .dataviews-view-picker-grid:focus-visible[aria-activedescendant] {
3284    outline: none;
3285  }
3286  
3287  .dataviews-view-picker-grid:focus-visible [data-active-item=true] {
3288    outline: 2px solid var(--wpds-color-stroke-focus, var(--wp-admin-theme-color, #3858e9));
3289  }
3290  
3291  .dataviews-view-picker-grid .dataviews-selection-checkbox {
3292    top: var(--wpds-dimension-padding-sm, 8px) !important;
3293  }
3294  
3295  .dataviews-view-picker-grid .dataviews-selection-checkbox input {
3296    pointer-events: none;
3297  }
3298  
3299  .dataviews-view-picker-grid .dataviews-view-picker-grid__media {
3300    width: 100%;
3301    aspect-ratio: 1/1;
3302    min-height: 0;
3303    background-color: var(--wpds-color-background-surface-neutral-strong, #fff);
3304    border-radius: var(--wpds-border-radius-md, 4px);
3305    position: relative;
3306  }
3307  
3308  .dataviews-view-picker-grid .dataviews-view-picker-grid__media img {
3309    -o-object-fit: cover;
3310    object-fit: cover;
3311    width: 100%;
3312    height: 100%;
3313  }
3314  
3315  .dataviews-view-picker-grid .dataviews-view-picker-grid__media::after {
3316    content: "";
3317    position: absolute;
3318    top: 0;
3319    left: 0;
3320    width: 100%;
3321    height: 100%;
3322    box-shadow: inset 0 0 0 var(--wpds-border-width-xs, 1px) rgba(0, 0, 0, 0.1);
3323    border-radius: var(--wpds-border-radius-md, 4px);
3324    pointer-events: none;
3325  }
3326  
3327  .dataviews-view-picker-grid .dataviews-view-picker-grid__fields {
3328    position: relative;
3329    font-size: 12px;
3330    line-height: 16px;
3331  }
3332  
3333  .dataviews-view-picker-grid .dataviews-view-picker-grid__fields:not(:empty) {
3334    padding: 0 0 var(--wpds-dimension-padding-md, 12px);
3335  }
3336  
3337  .dataviews-view-picker-grid .dataviews-view-picker-grid__fields .dataviews-view-picker-grid__field-value:not(:empty) {
3338    min-height: var(--wpds-dimension-size-sm, 24px);
3339    line-height: var(--wpds-typography-line-height-sm, 20px);
3340    padding-top: calc((var(--wpds-dimension-size-sm, 24px) - var(--wpds-typography-line-height-sm, 20px)) / 2);
3341  }
3342  
3343  .dataviews-view-picker-grid .dataviews-view-picker-grid__fields .dataviews-view-picker-grid__field {
3344    min-height: var(--wpds-dimension-size-sm, 24px);
3345    align-items: center;
3346  }
3347  
3348  .dataviews-view-picker-grid .dataviews-view-picker-grid__fields .dataviews-view-picker-grid__field .dataviews-view-picker-grid__field-name {
3349    width: 35%;
3350    color: var(--wpds-color-foreground-content-neutral-weak, #707070);
3351    overflow: hidden;
3352    text-overflow: ellipsis;
3353    white-space: nowrap;
3354  }
3355  
3356  .dataviews-view-picker-grid .dataviews-view-picker-grid__fields .dataviews-view-picker-grid__field .dataviews-view-picker-grid__field-value {
3357    width: 65%;
3358    overflow: hidden;
3359    text-overflow: ellipsis;
3360    white-space: nowrap;
3361  }
3362  
3363  .dataviews-view-picker-grid .dataviews-view-picker-grid__fields .dataviews-view-picker-grid__field:not(:has(.dataviews-view-picker-grid__field-value:not(:empty))) {
3364    display: none;
3365  }
3366  
3367  .dataviews-view-picker-grid .dataviews-view-picker-grid__badge-fields:not(:empty) {
3368    padding-bottom: var(--wpds-dimension-padding-md, 12px);
3369  }
3370  
3371  .dataviews-view-picker-grid__field-value:empty,
3372  .dataviews-view-picker-grid__field:empty {
3373    display: none;
3374  }
3375  
3376  .dataviews-view-picker-grid__card .dataviews-selection-checkbox {
3377    position: absolute;
3378    top: -9999em;
3379    left: var(--wpds-dimension-padding-sm, 8px);
3380    z-index: 1;
3381  }
3382  
3383  @media (hover: none) {
3384    .dataviews-view-picker-grid__card .dataviews-selection-checkbox {
3385      top: var(--wpds-dimension-padding-sm, 8px);
3386    }
3387  }
3388  .dataviews-view-picker-grid__card:hover .dataviews-selection-checkbox,
3389  .dataviews-view-picker-grid__card:focus-within .dataviews-selection-checkbox,
3390  .dataviews-view-picker-grid__card.is-selected .dataviews-selection-checkbox {
3391    top: var(--wpds-dimension-padding-sm, 8px);
3392  }
3393  
3394  .dataviews-view-picker-grid__media--clickable {
3395    cursor: var(--wpds-cursor-control, pointer);
3396  }
3397  
3398  .dataviews-view-picker-grid-group__header {
3399    font-size: var(--wpds-typography-font-size-lg, 15px);
3400    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
3401    color: var(--wpds-color-foreground-content-neutral, #1e1e1e);
3402    margin: 0 0 var(--wpds-dimension-gap-sm, 8px) 0;
3403    padding: 0 48px;
3404  }
3405  
3406  .dataviews-view-picker-table {
3407    background-color: inherit;
3408  }
3409  
3410  .dataviews-view-picker-table .dataviews-view-table__checkbox-column {
3411    width: 48px;
3412  }
3413  
3414  .dataviews-view-picker-table tbody:focus-visible[aria-activedescendant] {
3415    outline: none;
3416  }
3417  
3418  .dataviews-view-picker-table tbody:focus-visible [data-active-item=true] {
3419    outline: 2px solid var(--wpds-color-stroke-focus, var(--wp-admin-theme-color, #3858e9));
3420  }
3421  
3422  .dataviews-view-picker-table .dataviews-selection-checkbox .components-checkbox-control__input.components-checkbox-control__input {
3423    pointer-events: none;
3424    opacity: 1;
3425  }
3426  
3427  .dataviews-view-picker-table .dataviews-view-table__row {
3428    cursor: var(--wpds-cursor-control, pointer);
3429  }
3430  
3431  .dataviews-view-picker-table .dataviews-view-table__row.is-selected {
3432    background-color: var(--wpds-color-background-interactive-brand-weak-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 12%, white));
3433  }
3434  
3435  .dataviews-view-picker-table .dataviews-view-table__row.is-hovered {
3436    background-color: var(--wpds-color-background-interactive-brand-weak-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 12%, white));
3437  }
3438  
3439  .dataviews-view-picker-table .dataviews-view-table__row.is-selected.is-hovered {
3440    background-color: var(--wpds-color-background-interactive-brand-weak-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 12%, white));
3441  }
3442  
3443  .dataviews-view-activity {
3444    margin: 0 0 auto;
3445    padding: 0 var(--wpds-dimension-padding-2xl, 24px);
3446  }
3447  
3448  .dataviews-view-activity .dataviews-view-activity__group-header {
3449    font-size: var(--wpds-typography-font-size-lg, 15px);
3450    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
3451    color: var(--wpds-color-foreground-content-neutral-weak, #707070);
3452    margin: 0 0 var(--wpds-dimension-gap-sm, 8px) 0;
3453    padding: 0;
3454  }
3455  
3456  .dataviews-view-activity .dataviews-view-activity__item-actions {
3457    min-width: var(--wpds-dimension-size-sm, 24px);
3458  }
3459  
3460  .dataviews-view-activity .dataviews-view-activity__item-content {
3461    flex-grow: 1;
3462  }
3463  
3464  .dataviews-view-activity .dataviews-view-activity__item-content .dataviews-view-activity__item-title,
3465  .dataviews-view-activity .dataviews-view-activity__item-content .dataviews-view-activity__item-description,
3466  .dataviews-view-activity .dataviews-view-activity__item-content .dataviews-view-activity__item-fields {
3467    min-height: var(--wpds-dimension-size-2xs, 16px);
3468  }
3469  
3470  .dataviews-view-activity .dataviews-view-activity__item-content .dataviews-view-activity__item-title {
3471    position: relative;
3472    display: flex;
3473    align-items: center;
3474    flex: 1;
3475    overflow: hidden;
3476  }
3477  
3478  .dataviews-view-activity .dataviews-view-activity__item-content .dataviews-view-activity__item-title--clickable {
3479    cursor: var(--wpds-cursor-control, pointer);
3480  }
3481  
3482  .dataviews-view-activity .dataviews-view-activity__item-content .dataviews-view-activity__item-title--clickable:focus-visible {
3483    outline: var(--wp-admin-border-width-focus) solid var(--wpds-color-stroke-focus, var(--wp-admin-theme-color, #3858e9));
3484    outline-offset: var(--wp-admin-border-width-focus);
3485    border-radius: var(--wpds-border-radius-sm, 2px);
3486  }
3487  
3488  .dataviews-view-activity .dataviews-view-activity__item-content .dataviews-view-activity__primary-actions {
3489    display: flex;
3490    width: -moz-max-content;
3491    width: max-content;
3492    flex: 0 0 auto;
3493  }
3494  
3495  .dataviews-view-activity .dataviews-view-activity__item-content .dataviews-view-activity__primary-actions .components-button {
3496    position: relative;
3497    z-index: 1;
3498  }
3499  
3500  .dataviews-view-activity .dataviews-view-activity__item-content .dataviews-view-activity__item-fields {
3501    color: var(--wpds-color-foreground-content-neutral-weak, #707070);
3502    display: flex;
3503    gap: var(--wpds-dimension-gap-md, 12px);
3504    row-gap: var(--wpds-dimension-gap-xs, 4px);
3505    flex-wrap: wrap;
3506  }
3507  
3508  .dataviews-view-activity .dataviews-view-activity__item-content .dataviews-view-activity__item-fields:empty {
3509    display: none;
3510  }
3511  
3512  .dataviews-view-activity .dataviews-view-activity__item-content .dataviews-view-activity__item-fields .dataviews-view-activity__item-field:has(.dataviews-view-activity__item-field-value:empty) {
3513    display: none;
3514  }
3515  
3516  .dataviews-view-activity .dataviews-view-activity__item-content .dataviews-view-activity__item-fields .dataviews-view-activity__item-field-value {
3517    display: flex;
3518    align-items: center;
3519  }
3520  
3521  .dataviews-view-activity .dataviews-view-activity__item-type {
3522    align-self: stretch;
3523    flex-shrink: 0;
3524  }
3525  
3526  .dataviews-view-activity .dataviews-view-activity__item-type::after {
3527    content: "";
3528    flex: 1 1 auto;
3529    width: 1px;
3530    margin: 0 auto;
3531    background-color: var(--wpds-color-stroke-surface-neutral, #dbdbdb);
3532  }
3533  
3534  .dataviews-view-activity .dataviews-view-activity__item-type::before {
3535    content: "";
3536    flex: 0 0 auto;
3537    width: 1px;
3538    margin: 0 auto;
3539    background-color: var(--wpds-color-stroke-surface-neutral, #dbdbdb);
3540  }
3541  
3542  .dataviews-view-activity .dataviews-view-activity__item.is-compact .dataviews-view-activity__item-type {
3543    width: var(--wpds-dimension-padding-md, 12px);
3544  }
3545  
3546  .dataviews-view-activity .dataviews-view-activity__item.is-compact .dataviews-view-activity__item-type::before {
3547    height: var(--wpds-dimension-size-3xs, 12px);
3548  }
3549  
3550  .dataviews-view-activity .dataviews-view-activity__item.is-compact .dataviews-view-activity__item-type-icon {
3551    width: calc(var(--wpds-dimension-size-3xs, 12px) - 1px);
3552    height: calc(var(--wpds-dimension-size-3xs, 12px) - 1px);
3553  }
3554  
3555  .dataviews-view-activity .dataviews-view-activity__item.is-compact .dataviews-view-activity__item-content {
3556    margin: var(--wpds-dimension-gap-md, 12px) 0;
3557  }
3558  
3559  .dataviews-view-activity .dataviews-view-activity__item.is-balanced .dataviews-view-activity__item-type {
3560    width: var(--wpds-dimension-size-sm, 24px);
3561  }
3562  
3563  .dataviews-view-activity .dataviews-view-activity__item.is-balanced .dataviews-view-activity__item-type::before {
3564    height: var(--wpds-dimension-size-3xs, 12px);
3565  }
3566  
3567  .dataviews-view-activity .dataviews-view-activity__item.is-balanced .dataviews-view-activity__item-type-icon {
3568    width: calc(var(--wpds-dimension-size-sm, 24px) + 1px);
3569    height: calc(var(--wpds-dimension-size-sm, 24px) + 1px);
3570  }
3571  
3572  .dataviews-view-activity .dataviews-view-activity__item.is-balanced .dataviews-view-activity__item-content {
3573    margin: var(--wpds-dimension-gap-md, 12px) 0;
3574    padding-top: var(--wpds-dimension-padding-sm, 8px);
3575  }
3576  
3577  .dataviews-view-activity .dataviews-view-activity__item.is-comfortable .dataviews-view-activity__item-type {
3578    width: var(--wpds-dimension-size-md, 32px);
3579  }
3580  
3581  .dataviews-view-activity .dataviews-view-activity__item.is-comfortable .dataviews-view-activity__item-type::before {
3582    height: var(--wpds-dimension-size-4xs, 8px);
3583  }
3584  
3585  .dataviews-view-activity .dataviews-view-activity__item.is-comfortable .dataviews-view-activity__item-type-icon {
3586    width: calc(var(--wpds-dimension-size-md, 32px) + 1px);
3587    height: calc(var(--wpds-dimension-size-md, 32px) + 1px);
3588  }
3589  
3590  .dataviews-view-activity .dataviews-view-activity__item.is-comfortable .dataviews-view-activity__item-content {
3591    margin: var(--wpds-dimension-gap-sm, 8px) 0 var(--wpds-dimension-gap-lg, 16px);
3592    padding-top: var(--wpds-dimension-padding-md, 12px);
3593  }
3594  
3595  .dataviews-view-activity .dataviews-view-activity__item.is-comfortable .dataviews-view-activity__item-bullet, .dataviews-view-activity .dataviews-view-activity__item.is-balanced .dataviews-view-activity__item-bullet {
3596    width: calc(var(--wpds-dimension-size-4xs, 8px) + 1px);
3597    height: calc(var(--wpds-dimension-size-4xs, 8px) + 1px);
3598    position: relative;
3599    top: 50%;
3600    transform: translateY(-50%);
3601  }
3602  
3603  .dataviews-view-activity .dataviews-view-activity__item:first-child .dataviews-view-activity__item-type::before {
3604    visibility: hidden;
3605  }
3606  
3607  .dataviews-view-activity .dataviews-view-activity__group:last-of-type > .dataviews-view-activity__item:last-of-type .dataviews-view-activity__item-type::after, .dataviews-view-activity > .dataviews-view-activity__item:last-child .dataviews-view-activity__item-type::after {
3608    background: linear-gradient(to bottom, var(--wpds-color-stroke-surface-neutral, #dbdbdb) 0%, color-mix(in srgb, var(--wpds-color-stroke-surface-neutral, #dbdbdb) 20%, transparent) 60%, transparent 100%);
3609  }
3610  
3611  .dataviews-view-activity .dataviews-view-activity__item-type-icon {
3612    overflow: hidden;
3613    flex-shrink: 0;
3614    background-color: var(--wpds-color-background-surface-neutral-strong, #fff);
3615  }
3616  
3617  .dataviews-view-activity .dataviews-view-activity__item-type-icon img,
3618  .dataviews-view-activity .dataviews-view-activity__item-type-icon svg,
3619  .dataviews-view-activity .dataviews-view-activity__item-type-icon .dataviews-view-activity__item-bullet {
3620    display: block;
3621    width: 100%;
3622    height: 100%;
3623    margin: 0 auto;
3624    -o-object-fit: cover;
3625    object-fit: cover;
3626    border-radius: 50%;
3627    box-sizing: border-box;
3628    box-shadow: inset 0 0 0 var(--wpds-border-width-xs, 1px) var(--wpds-color-stroke-surface-neutral, #dbdbdb);
3629  }
3630  
3631  .dataviews-view-activity .dataviews-view-activity__item-type-icon svg {
3632    padding: var(--wpds-dimension-padding-xs, 4px);
3633  }
3634  
3635  .dataviews-view-activity .dataviews-view-activity__item-type-icon .dataviews-view-activity__item-bullet {
3636    content: "";
3637    background-color: var(--wpds-color-stroke-surface-neutral, #dbdbdb);
3638  }
3639  
3640  .dataviews-view-activity.is-refreshing {
3641    opacity: 0.5;
3642    pointer-events: none;
3643  }
3644  
3645  @media not (prefers-reduced-motion) {
3646    .dataviews-view-activity.is-refreshing {
3647      opacity: 1;
3648      animation: dataviews-pulse 1s ease-in-out infinite;
3649    }
3650  }
3651  .dataviews-view-activity + .dataviews-pagination {
3652    justify-content: space-between;
3653  }
3654  
3655  .dataviews-view-picker-activity {
3656    margin: 0;
3657    padding: 0;
3658    flex-grow: 1;
3659  }
3660  
3661  .dataviews-view-picker-activity:focus-visible[aria-activedescendant] {
3662    outline: none;
3663  }
3664  
3665  .dataviews-view-picker-activity:focus-visible .dataviews-view-picker-activity__item[data-active-item=true] {
3666    outline: 2px solid var(--wpds-color-stroke-focus, var(--wp-admin-theme-color, #3858e9));
3667    outline-offset: -2px;
3668  }
3669  
3670  .dataviews-view-picker-activity .dataviews-view-picker-activity__item {
3671    cursor: var(--wpds-cursor-control, pointer);
3672    border-radius: var(--wpds-border-radius-sm, 2px);
3673    padding-inline: var(--wpds-dimension-padding-2xl, 24px);
3674    transition: background-color 0.1s ease;
3675  }
3676  
3677  .dataviews-view-picker-activity .dataviews-view-picker-activity__item.is-selected, .dataviews-view-picker-activity .dataviews-view-picker-activity__item:hover {
3678    background-color: var(--wpds-color-background-interactive-brand-weak-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 12%, white));
3679  }
3680  
3681  .dataviews-view-picker-activity .dataviews-view-picker-activity__item.is-selected {
3682    outline: 3px solid transparent;
3683    outline-offset: -2px;
3684  }
3685  
3686  .dataviews-view-picker-activity .dataviews-view-picker-activity__item.is-compact .dataviews-view-picker-activity__item-type {
3687    width: var(--wpds-dimension-padding-md, 12px);
3688  }
3689  
3690  .dataviews-view-picker-activity .dataviews-view-picker-activity__item.is-compact .dataviews-view-picker-activity__item-type::before {
3691    height: var(--wpds-dimension-size-3xs, 12px);
3692  }
3693  
3694  .dataviews-view-picker-activity .dataviews-view-picker-activity__item.is-compact .dataviews-view-picker-activity__item-type-icon {
3695    width: calc(var(--wpds-dimension-size-3xs, 12px) - 1px);
3696    height: calc(var(--wpds-dimension-size-3xs, 12px) - 1px);
3697  }
3698  
3699  .dataviews-view-picker-activity .dataviews-view-picker-activity__item.is-compact .dataviews-view-picker-activity__item-content {
3700    margin: var(--wpds-dimension-gap-md, 12px) 0;
3701  }
3702  
3703  .dataviews-view-picker-activity .dataviews-view-picker-activity__item.is-balanced .dataviews-view-picker-activity__item-type {
3704    width: var(--wpds-dimension-size-sm, 24px);
3705  }
3706  
3707  .dataviews-view-picker-activity .dataviews-view-picker-activity__item.is-balanced .dataviews-view-picker-activity__item-type::before {
3708    height: var(--wpds-dimension-size-3xs, 12px);
3709  }
3710  
3711  .dataviews-view-picker-activity .dataviews-view-picker-activity__item.is-balanced .dataviews-view-picker-activity__item-type-icon {
3712    width: calc(var(--wpds-dimension-size-sm, 24px) + 1px);
3713    height: calc(var(--wpds-dimension-size-sm, 24px) + 1px);
3714  }
3715  
3716  .dataviews-view-picker-activity .dataviews-view-picker-activity__item.is-balanced .dataviews-view-picker-activity__item-content {
3717    margin: var(--wpds-dimension-gap-md, 12px) 0;
3718    padding-top: var(--wpds-dimension-padding-sm, 8px);
3719  }
3720  
3721  .dataviews-view-picker-activity .dataviews-view-picker-activity__item.is-comfortable .dataviews-view-picker-activity__item-type {
3722    width: var(--wpds-dimension-size-md, 32px);
3723  }
3724  
3725  .dataviews-view-picker-activity .dataviews-view-picker-activity__item.is-comfortable .dataviews-view-picker-activity__item-type::before {
3726    height: var(--wpds-dimension-size-4xs, 8px);
3727  }
3728  
3729  .dataviews-view-picker-activity .dataviews-view-picker-activity__item.is-comfortable .dataviews-view-picker-activity__item-type-icon {
3730    width: calc(var(--wpds-dimension-size-md, 32px) + 1px);
3731    height: calc(var(--wpds-dimension-size-md, 32px) + 1px);
3732  }
3733  
3734  .dataviews-view-picker-activity .dataviews-view-picker-activity__item.is-comfortable .dataviews-view-picker-activity__item-content {
3735    margin: var(--wpds-dimension-gap-sm, 8px) 0 var(--wpds-dimension-gap-lg, 16px);
3736    padding-top: var(--wpds-dimension-padding-md, 12px);
3737  }
3738  
3739  .dataviews-view-picker-activity .dataviews-view-picker-activity__item.is-comfortable .dataviews-view-picker-activity__item-bullet, .dataviews-view-picker-activity .dataviews-view-picker-activity__item.is-balanced .dataviews-view-picker-activity__item-bullet {
3740    width: calc(var(--wpds-dimension-size-4xs, 8px) + 1px);
3741    height: calc(var(--wpds-dimension-size-4xs, 8px) + 1px);
3742    position: relative;
3743    top: 50%;
3744    transform: translateY(-50%);
3745  }
3746  
3747  .dataviews-view-picker-activity .dataviews-view-picker-activity__item-content {
3748    flex-grow: 1;
3749  }
3750  
3751  .dataviews-view-picker-activity .dataviews-view-picker-activity__item-content .dataviews-view-picker-activity__item-title,
3752  .dataviews-view-picker-activity .dataviews-view-picker-activity__item-content .dataviews-view-picker-activity__item-description,
3753  .dataviews-view-picker-activity .dataviews-view-picker-activity__item-content .dataviews-view-picker-activity__item-fields {
3754    min-height: var(--wpds-dimension-size-2xs, 16px);
3755  }
3756  
3757  .dataviews-view-picker-activity .dataviews-view-picker-activity__item-content .dataviews-view-picker-activity__item-title {
3758    position: relative;
3759    display: flex;
3760    align-items: center;
3761    flex: 1;
3762    overflow: hidden;
3763  }
3764  
3765  .dataviews-view-picker-activity .dataviews-view-picker-activity__item-content .dataviews-view-picker-activity__item-description:empty {
3766    display: none;
3767  }
3768  
3769  .dataviews-view-picker-activity .dataviews-view-picker-activity__item-content .dataviews-view-picker-activity__item-fields {
3770    color: var(--wpds-color-foreground-content-neutral-weak, #707070);
3771    display: flex;
3772    gap: var(--wpds-dimension-gap-md, 12px);
3773    row-gap: var(--wpds-dimension-gap-xs, 4px);
3774    flex-wrap: wrap;
3775  }
3776  
3777  .dataviews-view-picker-activity .dataviews-view-picker-activity__item-content .dataviews-view-picker-activity__item-fields:empty {
3778    display: none;
3779  }
3780  
3781  .dataviews-view-picker-activity .dataviews-view-picker-activity__item-content .dataviews-view-picker-activity__item-fields .dataviews-view-picker-activity__item-field:has(.dataviews-view-picker-activity__item-field-value:empty) {
3782    display: none;
3783  }
3784  
3785  .dataviews-view-picker-activity .dataviews-view-picker-activity__item-content .dataviews-view-picker-activity__item-fields .dataviews-view-picker-activity__item-field-value {
3786    display: flex;
3787    align-items: center;
3788  }
3789  
3790  .dataviews-view-picker-activity .dataviews-view-picker-activity__item-type {
3791    align-self: stretch;
3792    flex-shrink: 0;
3793  }
3794  
3795  .dataviews-view-picker-activity .dataviews-view-picker-activity__item-type::after {
3796    content: "";
3797    flex: 1 1 auto;
3798    width: 1px;
3799    margin: 0 auto;
3800    background-color: var(--wpds-color-stroke-surface-neutral, #dbdbdb);
3801  }
3802  
3803  .dataviews-view-picker-activity .dataviews-view-picker-activity__item-type::before {
3804    content: "";
3805    flex: 0 0 auto;
3806    width: 1px;
3807    margin: 0 auto;
3808    background-color: var(--wpds-color-stroke-surface-neutral, #dbdbdb);
3809  }
3810  
3811  .dataviews-view-picker-activity .dataviews-view-picker-activity__item:first-child .dataviews-view-picker-activity__item-type::before {
3812    visibility: hidden;
3813  }
3814  
3815  .dataviews-view-picker-activity .dataviews-view-picker-activity-group:last-of-type > .dataviews-view-picker-activity__item:last-of-type .dataviews-view-picker-activity__item-type::after, .dataviews-view-picker-activity > .dataviews-view-picker-activity__item:last-child .dataviews-view-picker-activity__item-type::after {
3816    background: linear-gradient(to bottom, var(--wpds-color-stroke-surface-neutral, #dbdbdb) 0%, color-mix(in srgb, var(--wpds-color-stroke-surface-neutral, #dbdbdb) 20%, transparent) 60%, transparent 100%);
3817  }
3818  
3819  .dataviews-view-picker-activity .dataviews-view-picker-activity-group__header {
3820    font-size: var(--wpds-typography-font-size-lg, 15px);
3821    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
3822    color: var(--wpds-color-foreground-content-neutral-weak, #707070);
3823    margin: 0 0 var(--wpds-dimension-gap-sm, 8px) 0;
3824    padding: 0;
3825    padding-inline-start: var(--wpds-dimension-padding-2xl, 24px);
3826  }
3827  
3828  .dataviews-view-picker-activity .dataviews-view-picker-activity__item-type-icon {
3829    overflow: hidden;
3830    flex-shrink: 0;
3831    background-color: transparent;
3832  }
3833  
3834  .dataviews-view-picker-activity .dataviews-view-picker-activity__item-type-icon img,
3835  .dataviews-view-picker-activity .dataviews-view-picker-activity__item-type-icon svg,
3836  .dataviews-view-picker-activity .dataviews-view-picker-activity__item-type-icon .dataviews-view-picker-activity__item-bullet {
3837    display: block;
3838    width: 100%;
3839    height: 100%;
3840    margin: 0 auto;
3841    -o-object-fit: cover;
3842    object-fit: cover;
3843    border-radius: 50%;
3844    box-sizing: border-box;
3845    box-shadow: inset 0 0 0 var(--wpds-border-width-xs, 1px) var(--wpds-color-stroke-surface-neutral, #dbdbdb);
3846  }
3847  
3848  .dataviews-view-picker-activity .dataviews-view-picker-activity__item-type-icon svg {
3849    padding: var(--wpds-dimension-padding-xs, 4px);
3850  }
3851  
3852  .dataviews-view-picker-activity .dataviews-view-picker-activity__item-type-icon .dataviews-view-picker-activity__item-bullet {
3853    background-color: var(--wpds-color-stroke-surface-neutral, #dbdbdb);
3854  }
3855  
3856  .dataviews-picker-footer__bulk-selection {
3857    align-self: flex-start;
3858    height: var(--wpds-dimension-size-md, 32px);
3859  }
3860  
3861  .dataviews-picker-footer__actions {
3862    align-self: flex-end;
3863  }
3864  
3865  .dataviews-controls__richtext [data-rich-text-placeholder]::after {
3866    content: attr(data-rich-text-placeholder);
3867    color: color-mix(in srgb, currentColor, transparent 38%);
3868  }
3869  
3870  .dataviews-controls__datetime {
3871    border: none;
3872    padding: 0;
3873  }
3874  
3875  .dataviews-controls__relative-date-number,
3876  .dataviews-controls__relative-date-unit {
3877    flex: 1 1 50%;
3878  }
3879  
3880  .dataviews-controls__date input[type=date]::-webkit-inner-spin-button,
3881  .dataviews-controls__date input[type=date]::-webkit-calendar-picker-indicator {
3882    display: none;
3883    -webkit-appearance: none;
3884  }
3885  
3886  .dataviews-controls__date-range-inputs > * {
3887    min-width: 0;
3888  }
3889  
3890  .dataviews-controls__color-picker-dropdown {
3891    display: flex;
3892  }
3893  
3894  .dataviews-controls__date-preset {
3895    border: 1px solid var(--wpds-color-stroke-surface-neutral, #dbdbdb);
3896  }
3897  
3898  .dataviews-controls__date-preset:active {
3899    background-color: var(--wpds-color-background-interactive-neutral-strong-active, #1e1e1e);
3900  }
3901  
3902  .dataforms-layouts-panel__field-trigger {
3903    position: relative;
3904    color: inherit;
3905    display: flex;
3906    width: 100%;
3907    min-height: var(--wpds-dimension-size-sm, 24px);
3908    cursor: var(--wpds-cursor-control, pointer);
3909    align-items: flex-start;
3910    border-radius: var(--wpds-border-radius-sm, 2px);
3911    isolation: isolate;
3912  }
3913  
3914  .dataforms-layouts-panel__field-trigger--label-side {
3915    flex-direction: row;
3916    gap: var(--wpds-dimension-gap-sm, 8px);
3917  }
3918  
3919  .dataforms-layouts-panel__field-trigger--label-top {
3920    display: grid;
3921    grid-template-columns: 1fr auto;
3922  }
3923  
3924  .dataforms-layouts-panel__field-trigger--label-none {
3925    align-items: center;
3926  }
3927  
3928  .dataforms-layouts-panel__field-trigger:not(.is-disabled):hover {
3929    color: var(--wpds-color-foreground-interactive-brand, var(--wp-admin-theme-color, #3858e9));
3930  }
3931  
3932  .dataforms-layouts-panel__field-trigger:not(.is-disabled):hover .dataforms-layouts-panel__field-trigger-icon {
3933    opacity: 1;
3934  }
3935  
3936  .dataforms-layouts-panel__field-trigger:not(.is-disabled):hover .dataforms-layouts-panel__field-label {
3937    color: var(--wpds-color-foreground-interactive-brand, var(--wp-admin-theme-color, #3858e9));
3938  }
3939  
3940  .dataforms-layouts-panel__field-trigger.is-disabled {
3941    cursor: default;
3942  }
3943  
3944  .dataforms-layouts-panel__field-trigger.is-disabled .dataforms-layouts-panel__field-control {
3945    color: var(--wpds-color-foreground-content-neutral-weak, #707070);
3946    font-weight: var(--wpds-typography-font-weight-default, 400);
3947  }
3948  
3949  .dataforms-layouts-panel__field-trigger--edit-always .dataforms-layouts-panel__field-trigger-icon {
3950    opacity: 1;
3951    fill: currentColor;
3952  }
3953  
3954  .dataforms-layouts-panel__field-trigger--edit-always .dataforms-layouts-panel__field-trigger-icon:hover, .dataforms-layouts-panel__field-trigger--edit-always .dataforms-layouts-panel__field-trigger-icon:focus-visible {
3955    fill: var(--wpds-color-foreground-interactive-brand, var(--wp-admin-theme-color, #3858e9));
3956  }
3957  
3958  .dataforms-layouts-panel__field-trigger-icon {
3959    padding: 0;
3960    color: var(--wpds-color-foreground-interactive-brand, var(--wp-admin-theme-color, #3858e9));
3961    flex: 0 0 auto;
3962    opacity: 0;
3963    border-radius: var(--wpds-border-radius-xs, 1px);
3964  }
3965  
3966  .dataforms-layouts-panel__field-trigger-icon:focus-visible {
3967    opacity: 1;
3968    outline: var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)) solid var(--wpds-color-stroke-focus, var(--wp-admin-theme-color, #3858e9));
3969  }
3970  
3971  .dataforms-layouts-panel__field-dropdown-anchor {
3972    width: 100%;
3973  }
3974  
3975  .dataforms-layouts-panel__field-dropdown-anchor .components-dropdown {
3976    width: 100%;
3977  }
3978  
3979  .dataforms-layouts-panel__field-label {
3980    width: 38%;
3981    flex-shrink: 0;
3982    min-height: var(--wpds-dimension-size-sm, 24px);
3983    display: flex;
3984    align-items: center;
3985    line-height: var(--wpds-typography-line-height-sm, 20px);
3986    hyphens: auto;
3987    color: var(--wpds-color-foreground-content-neutral-weak, #707070);
3988  }
3989  
3990  .dataforms-layouts-panel__field-label .components-base-control__label {
3991    display: inline;
3992    margin-bottom: 0;
3993    line-height: inherit;
3994  }
3995  
3996  .dataforms-layouts-panel__field-label.has-error {
3997    color: var(--wpds-color-foreground-content-error-weak, #cc1818);
3998  }
3999  
4000  .dataforms-layouts-panel__field-label-error-content {
4001    position: relative;
4002    z-index: 1;
4003    cursor: help;
4004    color: var(--wpds-color-foreground-content-error-weak, #cc1818);
4005    display: inline-flex;
4006    flex-direction: row;
4007    align-items: center;
4008    gap: var(--wpds-dimension-gap-xs, 4px);
4009  }
4010  
4011  .dataforms-layouts-panel__field-control {
4012    flex-grow: 1;
4013    min-width: 0;
4014    min-height: var(--wpds-dimension-size-sm, 24px);
4015    line-height: var(--wpds-typography-line-height-md, 24px);
4016    display: flex;
4017    align-items: center;
4018    overflow: clip;
4019    padding-inline: var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px));
4020    margin-inline: calc(-1 * var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)));
4021    word-break: break-word;
4022    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
4023  }
4024  
4025  .dataforms-layouts-panel__field-control > * {
4026    min-width: 0;
4027  }
4028  
4029  .dataforms-layouts-panel__field-trigger--label-top .dataforms-layouts-panel__field-label {
4030    width: 100%;
4031  }
4032  
4033  .dataforms-layouts-panel__field-trigger--label-top .dataforms-layouts-panel__field-control {
4034    grid-column: 1/-1;
4035  }
4036  
4037  .dataforms-layouts-panel__field-trigger--label-top .dataforms-layouts-panel__field-trigger-icon {
4038    grid-row: 1;
4039    grid-column: 2;
4040  }
4041  
4042  .dataforms-layouts-panel__field-dropdown .components-popover__content {
4043    min-width: 320px;
4044    padding: var(--wpds-dimension-padding-lg, 16px);
4045  }
4046  
4047  .dataforms-layouts-panel__dropdown-header {
4048    margin-bottom: var(--wpds-dimension-gap-lg, 16px);
4049  }
4050  
4051  .dataforms-layouts-panel__modal-footer {
4052    margin-top: var(--wpds-dimension-gap-lg, 16px);
4053  }
4054  
4055  .components-popover.components-dropdown__content.dataforms-layouts-panel__field-dropdown {
4056    z-index: 159990;
4057  }
4058  
4059  .dataforms-layouts-panel__summary-button:empty {
4060    min-width: 160px;
4061  }
4062  
4063  .dataforms-layouts-regular__field {
4064    width: 100%;
4065    min-height: var(--wpds-dimension-size-md, 32px);
4066    justify-content: flex-start !important;
4067    align-items: flex-start !important;
4068  }
4069  
4070  .dataforms-layouts-regular__field .components-base-control__label,
4071  .dataforms-layouts-regular__field .components-input-control__label,
4072  .dataforms-layouts-regular__field .components-form-token-field__label {
4073    color: var(--wpds-color-foreground-content-neutral, #1e1e1e);
4074  }
4075  
4076  .dataforms-layouts-regular__field-label {
4077    width: 38%;
4078    flex-shrink: 0;
4079    min-height: var(--wpds-dimension-size-md, 32px);
4080    display: flex;
4081    align-items: center;
4082    line-height: var(--wpds-typography-line-height-sm, 20px);
4083    hyphens: auto;
4084  }
4085  
4086  .dataforms-layouts-regular__field-label--label-position-side {
4087    align-self: center;
4088  }
4089  
4090  .dataforms-layouts-regular__field-label .components-base-control__label {
4091    margin-bottom: 0;
4092  }
4093  
4094  .dataforms-layouts-regular__field-control {
4095    flex-grow: 1;
4096    min-height: var(--wpds-dimension-size-md, 32px);
4097    display: flex;
4098    align-items: center;
4099  }
4100  
4101  .dataforms-layouts-card__field {
4102    width: 100%;
4103  }
4104  
4105  .dataforms-layouts-card__field-header-content {
4106    min-height: 24px;
4107  }
4108  
4109  .dataforms-layouts-card__field-header-content-description {
4110    display: contents;
4111  }
4112  
4113  .dataforms-layouts-card__field-description {
4114    color: var(--wpds-color-foreground-content-neutral-weak, #707070);
4115    display: block;
4116    font-size: var(--wpds-typography-font-size-md, 13px);
4117    margin-bottom: var(--wpds-dimension-gap-lg, 16px);
4118  }
4119  
4120  .dataforms-layouts-card__field-summary {
4121    display: flex;
4122    flex-direction: row;
4123    gap: var(--wpds-dimension-gap-lg, 16px);
4124    align-items: center;
4125  }
4126  
4127  .dataforms-layouts-details__summary-content {
4128    display: inline-flex;
4129    min-height: var(--wpds-dimension-size-sm, 24px);
4130  }
4131  
4132  .dataforms-layouts-details__content {
4133    padding-top: var(--wpds-dimension-padding-md, 12px);
4134  }
4135  
4136  .dataforms-layouts-row__field-control {
4137    width: 100%;
4138  }
4139  
4140  .dataforms-layouts__wrapper {
4141    font-family: -apple-system, system-ui, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
4142    font-weight: var(--wpds-typography-font-weight-default, 400);
4143    font-size: 13px;
4144    line-height: 20px;
4145  }
4146  
4147  /**
4148   * Typography
4149   */
4150  /**
4151   * SCSS Variables.
4152   *
4153   * Please use variables from this sheet to ensure consistency across the UI.
4154   * Don't add to this sheet unless you're pretty sure the value will be reused in many places.
4155   * For example, don't add rules to this sheet that affect block visuals. It's purely for UI.
4156   */
4157  /**
4158   * Colors
4159   */
4160  /**
4161   * Fonts & basic variables.
4162   */
4163  /**
4164   * Typography
4165   */
4166  /**
4167   * Grid System.
4168   * https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/
4169   */
4170  /**
4171   * Radius scale.
4172   */
4173  /**
4174   * Elevation scale.
4175   */
4176  /**
4177   * Dimensions.
4178   */
4179  /**
4180   * Mobile specific styles
4181   */
4182  /**
4183   * Editor styles.
4184   */
4185  /**
4186   * Block & Editor UI.
4187   */
4188  /**
4189   * Block paddings.
4190   */
4191  /**
4192   * React Native specific.
4193   * These variables do not appear to be used anywhere else.
4194   */
4195  /**
4196   * Breakpoints & Media Queries
4197   */
4198  /**
4199  *  Converts a hex value into the rgb equivalent.
4200  *
4201  * @param {string} hex - the hexadecimal value to convert
4202  * @return {string} comma separated rgb values
4203  */
4204  /**
4205   * Long content fade mixin
4206   *
4207   * Creates a fading overlay to signify that the content is longer
4208   * than the space allows.
4209   */
4210  /**
4211   * Breakpoint mixins
4212   */
4213  /**
4214   * Focus styles.
4215   */
4216  /**
4217   * Standard focus rings for the WordPress Design System.
4218   *
4219   * Apply `outset-ring__focus` inside the relevant pseudo-class at the call site,
4220   * e.g. `&:focus { @include outset-ring__focus(); }`.
4221   */
4222  /**
4223   * Applies editor left position to the selector passed as argument
4224   */
4225  /**
4226   * Styles that are reused verbatim in a few places
4227   */
4228  /**
4229   * Allows users to opt-out of animations via OS-level preferences.
4230   */
4231  /**
4232   * Reset default styles for JavaScript UI based pages.
4233   * This is a WP-admin agnostic reset
4234   */
4235  /**
4236   * Reset the WP Admin page styles for Gutenberg-like pages.
4237   */
4238  /**
4239   * Creates a checkerboard pattern background to indicate transparency.
4240   * @param {String} $size - The size of the squares in the checkerboard pattern. Default is 12px.
4241   */
4242  :root {
4243    --wp-block-synced-color: #7a00df;
4244    --wp-block-synced-color--rgb: 122, 0, 223;
4245    --wp-bound-block-color: var(--wp-block-synced-color);
4246    --wp-editor-canvas-background: #ddd;
4247    --wp-admin-theme-color: #007cba;
4248    --wp-admin-theme-color--rgb: 0, 124, 186;
4249    --wp-admin-theme-color-darker-10: rgb(0, 107, 160.5);
4250    --wp-admin-theme-color-darker-10--rgb: 0, 107, 160.5;
4251    --wp-admin-theme-color-darker-20: #005a87;
4252    --wp-admin-theme-color-darker-20--rgb: 0, 90, 135;
4253    --wp-admin-border-width-focus: 2px;
4254  }
4255  
4256  @media (min-resolution: 192dpi) {
4257    :root {
4258      --wp-admin-border-width-focus: 1.5px;
4259    }
4260  }
4261  .fields-create-template-part-modal {
4262    z-index: 1000001;
4263  }
4264  
4265  .fields-create-template-part-modal__area-fieldset {
4266    border: 0;
4267    padding: 0;
4268    margin: 0;
4269  }
4270  
4271  .fields-create-template-part-modal__area-radio-group {
4272    border: 1px solid #949494;
4273    border-radius: 2px;
4274  }
4275  
4276  .fields-create-template-part-modal__area-radio-wrapper {
4277    position: relative;
4278    padding: 12px;
4279    display: grid;
4280    align-items: center;
4281    grid-template-columns: min-content 1fr min-content;
4282    grid-gap: 4px 8px;
4283    color: #1e1e1e;
4284  }
4285  
4286  .fields-create-template-part-modal__area-radio-wrapper + .fields-create-template-part-modal__area-radio-wrapper {
4287    border-top: 1px solid #949494;
4288  }
4289  
4290  .fields-create-template-part-modal__area-radio-wrapper input[type=radio] {
4291    position: absolute;
4292    opacity: 0;
4293  }
4294  
4295  .fields-create-template-part-modal__area-radio-wrapper:has(input[type=radio]:checked) {
4296    z-index: 1;
4297  }
4298  
4299  .fields-create-template-part-modal__area-radio-wrapper:has(input[type=radio]:not(:checked)):hover {
4300    color: var(--wp-admin-theme-color);
4301  }
4302  
4303  .fields-create-template-part-modal__area-radio-wrapper > *:not(.fields-create-template-part-modal__area-radio-label) {
4304    pointer-events: none;
4305  }
4306  
4307  .fields-create-template-part-modal__area-radio-label::before {
4308    content: "";
4309    position: absolute;
4310    inset: 0;
4311  }
4312  
4313  input[type=radio]:not(:checked) ~ .fields-create-template-part-modal__area-radio-label::before {
4314    cursor: var(--wpds-cursor-control, pointer);
4315  }
4316  
4317  input[type=radio]:focus-visible ~ .fields-create-template-part-modal__area-radio-label::before {
4318    outline: 4px solid transparent;
4319    box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
4320  }
4321  
4322  .fields-create-template-part-modal__area-radio-icon,
4323  .fields-create-template-part-modal__area-radio-checkmark {
4324    fill: currentColor;
4325  }
4326  
4327  input[type=radio]:not(:checked) ~ .fields-create-template-part-modal__area-radio-checkmark {
4328    opacity: 0;
4329  }
4330  
4331  .fields-create-template-part-modal__area-radio-description {
4332    grid-column: 2/3;
4333    margin: 0;
4334    color: #757575;
4335    font-size: 12px;
4336    line-height: normal;
4337    text-wrap: pretty;
4338  }
4339  
4340  input[type=radio]:not(:checked):hover ~ .fields-create-template-part-modal__area-radio-description {
4341    color: inherit;
4342  }
4343  
4344  fieldset.fields__media-edit {
4345    border: 0;
4346    padding: 0;
4347    margin: 0;
4348    width: 100%;
4349  }
4350  
4351  fieldset.fields__media-edit .components-base-control__label {
4352    color: #1e1e1e;
4353  }
4354  
4355  fieldset.fields__media-edit .fields__media-edit-description {
4356    font-size: 12px;
4357    line-height: 1.5;
4358  }
4359  
4360  fieldset.fields__media-edit {
4361    container-type: inline-size;
4362  }
4363  
4364  fieldset.fields__media-edit .fields__media-edit-compact-group {
4365    border: 1px dashed #949494;
4366    border-radius: 4px;
4367    overflow: hidden;
4368  }
4369  
4370  fieldset.fields__media-edit .fields__media-edit-compact-group.is-single {
4371    border-radius: 2px;
4372  }
4373  
4374  fieldset.fields__media-edit .fields__media-edit-compact-group .fields__media-edit-picker-button {
4375    border: 0;
4376    border-radius: 0;
4377  }
4378  
4379  fieldset.fields__media-edit .fields__media-edit-compact-group .fields__media-edit-picker-button:focus-visible {
4380    box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
4381  }
4382  
4383  fieldset.fields__media-edit .fields__media-edit-compact-group .fields__media-edit-compact:not(:last-child) {
4384    border-bottom: 1px solid #f0f0f0;
4385  }
4386  
4387  fieldset.fields__media-edit .fields__media-edit-compact .components-drop-zone .components-drop-zone__content-inner {
4388    display: flex;
4389    align-items: center;
4390    gap: 8px;
4391  }
4392  
4393  fieldset.fields__media-edit .fields__media-edit-compact .components-drop-zone .components-drop-zone__content-inner .components-drop-zone__content-icon {
4394    margin: 0;
4395  }
4396  
4397  fieldset.fields__media-edit .fields__media-edit-compact {
4398    position: relative;
4399    min-width: 0;
4400  }
4401  
4402  fieldset.fields__media-edit .fields__media-edit-compact:hover .fields__media-edit-compact-movers, fieldset.fields__media-edit .fields__media-edit-compact:focus-within .fields__media-edit-compact-movers {
4403    opacity: 1;
4404  }
4405  
4406  fieldset.fields__media-edit .fields__media-edit-compact .fields__media-edit-compact-movers {
4407    position: absolute;
4408    right: 8px;
4409    top: 50%;
4410    transform: translateY(-50%);
4411    opacity: 0;
4412    pointer-events: none;
4413    z-index: 1;
4414    border-radius: 2px;
4415    background: #fff;
4416  }
4417  
4418  fieldset.fields__media-edit .fields__media-edit-compact .fields__media-edit-compact-movers * {
4419    pointer-events: auto;
4420  }
4421  
4422  fieldset.fields__media-edit .fields__media-edit-picker-button:has(.fields__media-edit-placeholder):not(.fields__media-edit-expanded *) .components-drop-zone .components-drop-zone__content-inner {
4423    display: flex;
4424    align-items: center;
4425    gap: 8px;
4426  }
4427  
4428  fieldset.fields__media-edit .fields__media-edit-picker-button:has(.fields__media-edit-placeholder):not(.fields__media-edit-expanded *) .components-drop-zone .components-drop-zone__content-inner .components-drop-zone__content-icon {
4429    margin: 0;
4430  }
4431  
4432  fieldset.fields__media-edit .fields__media-edit-picker-button {
4433    position: relative;
4434    display: flex;
4435    align-items: center;
4436    gap: 8px;
4437    border: 1px dashed #949494;
4438    border-radius: 2px;
4439    padding: 4px 8px;
4440    min-height: 40px;
4441    cursor: var(--wpds-cursor-control, pointer);
4442    min-width: 0;
4443  }
4444  
4445  fieldset.fields__media-edit .fields__media-edit-picker-button:not(.has-attachment) {
4446    border-color: var(--wp-admin-theme-color);
4447    color: var(--wp-admin-theme-color);
4448  }
4449  
4450  fieldset.fields__media-edit .fields__media-edit-picker-button:not(.has-attachment):hover {
4451    background-color: color-mix(in srgb, var(--wp-admin-theme-color, #3858e9) 4%, transparent);
4452    color: var(--wp-admin-theme-color-darker-20);
4453    border-color: var(--wp-admin-theme-color-darker-20);
4454  }
4455  
4456  fieldset.fields__media-edit .fields__media-edit-picker-button:hover {
4457    color: var(--wp-admin-theme-color);
4458  }
4459  
4460  fieldset.fields__media-edit .fields__media-edit-picker-button:focus-visible {
4461    box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
4462    outline: none;
4463  }
4464  
4465  fieldset.fields__media-edit .fields__media-edit-picker-button[aria-disabled=true] {
4466    opacity: 0.6;
4467    cursor: default;
4468  }
4469  
4470  fieldset.fields__media-edit .fields__media-edit-picker-button .fields__media-edit-picker-button-spinner {
4471    position: absolute;
4472    top: 50%;
4473    left: 50%;
4474    transform: translate(-50%, -50%);
4475    z-index: 1;
4476  }
4477  
4478  fieldset.fields__media-edit .fields__media-edit-filename,
4479  fieldset.fields__media-edit .fields__media-edit-placeholder {
4480    flex: 1;
4481    width: 100%;
4482    min-width: 0;
4483  }
4484  
4485  fieldset.fields__media-edit .fields__media-edit-placeholder {
4486    text-align: center;
4487  }
4488  
4489  fieldset.fields__media-edit .fields__media-edit-thumbnail {
4490    width: 24px;
4491    aspect-ratio: 1/1;
4492    flex-shrink: 0;
4493    border-radius: 2px;
4494  }
4495  
4496  fieldset.fields__media-edit .fields__media-edit-expanded {
4497    display: grid;
4498    gap: 8px;
4499  }
4500  
4501  fieldset.fields__media-edit .fields__media-edit-expanded.is-empty .components-drop-zone .components-drop-zone__content-inner {
4502    display: flex;
4503    align-items: center;
4504    gap: 8px;
4505  }
4506  
4507  fieldset.fields__media-edit .fields__media-edit-expanded.is-empty .components-drop-zone .components-drop-zone__content-inner .components-drop-zone__content-icon {
4508    margin: 0;
4509  }
4510  
4511  fieldset.fields__media-edit .fields__media-edit-expanded .fields__media-edit-expanded-preview {
4512    position: relative;
4513    width: 100%;
4514    aspect-ratio: var(--fields-media-edit-expanded-multiple-aspect-ratio, 3/2);
4515    border-radius: 2px;
4516    padding: 4px;
4517    overflow: hidden;
4518    display: flex;
4519    align-items: center;
4520    justify-content: center;
4521  }
4522  
4523  fieldset.fields__media-edit .fields__media-edit-expanded .fields__media-edit-expanded-preview .fields__media-edit-expanded-preview-stack {
4524    width: 100%;
4525    height: 100%;
4526  }
4527  
4528  fieldset.fields__media-edit .fields__media-edit-expanded .fields__media-edit-expanded-overlay {
4529    position: absolute;
4530    top: 0;
4531    left: 0;
4532    right: 0;
4533    bottom: 0;
4534    opacity: 0;
4535    pointer-events: none;
4536  }
4537  
4538  fieldset.fields__media-edit .fields__media-edit-expanded .fields__media-edit-expanded-overlay * {
4539    pointer-events: auto;
4540  }
4541  
4542  fieldset.fields__media-edit .fields__media-edit-expanded .fields__media-edit-expanded-actions {
4543    position: absolute;
4544    top: 4px;
4545    right: 4px;
4546    border-radius: 2px;
4547    background: #fff;
4548  }
4549  
4550  fieldset.fields__media-edit .fields__media-edit-expanded .fields__media-edit-expanded-item {
4551    position: relative;
4552    min-width: 0;
4553    border-radius: 4px;
4554  }
4555  
4556  fieldset.fields__media-edit .fields__media-edit-expanded .fields__media-edit-expanded-item:hover .fields__media-edit-expanded-overlay, fieldset.fields__media-edit .fields__media-edit-expanded .fields__media-edit-expanded-item:focus-within .fields__media-edit-expanded-overlay {
4557    opacity: 1;
4558  }
4559  
4560  fieldset.fields__media-edit .fields__media-edit-expanded .fields__media-edit-expanded-item:not(.has-preview-image) .fields__media-edit-expanded-preview-stack {
4561    padding: 8px;
4562  }
4563  
4564  fieldset.fields__media-edit .fields__media-edit-expanded .fields__media-edit-thumbnail {
4565    width: 100%;
4566    height: 100%;
4567    -o-object-fit: cover;
4568    object-fit: cover;
4569    -o-object-position: 50% 50%;
4570    object-position: 50% 50%;
4571  }
4572  
4573  fieldset.fields__media-edit .fields__media-edit-expanded .fields__media-edit-filename {
4574    text-align: center;
4575    flex: none;
4576  }
4577  
4578  fieldset.fields__media-edit .fields__media-edit-expanded .fields__media-edit-picker-button-spinner svg {
4579    margin: 0;
4580  }
4581  
4582  fieldset.fields__media-edit .fields__media-edit-expanded.is-single {
4583    grid-template-columns: 1fr;
4584  }
4585  
4586  fieldset.fields__media-edit .fields__media-edit-expanded.is-single .fields__media-edit-expanded-preview {
4587    aspect-ratio: 2/1;
4588  }
4589  
4590  fieldset.fields__media-edit .fields__media-edit-expanded .fields__media-edit-picker-button {
4591    border-radius: 4px;
4592  }
4593  
4594  fieldset.fields__media-edit .fields__media-edit-expanded.is-empty .fields__media-edit-picker-button {
4595    border-radius: 2px;
4596  }
4597  
4598  fieldset.fields__media-edit .fields__media-edit-expanded.is-multiple:not(.is-empty) {
4599    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
4600  }
4601  
4602  @container (max-width: 500px) {
4603    fieldset.fields__media-edit .fields__media-edit-expanded.is-multiple:not(.is-empty) {
4604      grid-template-columns: repeat(auto-fill, minmax(105px, 1fr));
4605    }
4606  }
4607  fieldset.fields__media-edit .fields__media-edit-expanded:not(.is-empty) .fields__media-edit-picker-button {
4608    padding: 0;
4609  }
4610  
4611  fieldset.fields__media-edit .fields__media-edit-expanded:not(.is-empty) .fields__media-edit-placeholder {
4612    display: flex;
4613    align-items: center;
4614    justify-content: center;
4615    aspect-ratio: var(--fields-media-edit-expanded-multiple-aspect-ratio, 3/2);
4616  }
4617  
4618  .fields-controls__author-avatar {
4619    flex-shrink: 0;
4620    overflow: hidden;
4621    width: 24px;
4622    height: 24px;
4623    align-items: center;
4624    justify-content: left;
4625    display: flex;
4626  }
4627  
4628  .fields-controls__author-avatar img {
4629    width: 16px;
4630    height: 16px;
4631    -o-object-fit: cover;
4632    object-fit: cover;
4633    opacity: 0;
4634    border-radius: 100%;
4635  }
4636  
4637  @media not (prefers-reduced-motion) {
4638    .fields-controls__author-avatar img {
4639      transition: opacity 0.1s linear;
4640    }
4641  }
4642  .fields-controls__author-avatar.is-loaded img {
4643    opacity: 1;
4644  }
4645  
4646  .fields-controls__author-icon {
4647    display: flex;
4648    flex-shrink: 0;
4649    width: 24px;
4650    height: 24px;
4651  }
4652  
4653  .fields-controls__author-icon svg {
4654    margin-left: -4px;
4655    fill: currentColor;
4656  }
4657  
4658  .fields-controls__author-name {
4659    text-overflow: ellipsis;
4660    overflow: hidden;
4661  }
4662  
4663  .fields-controls__slug {
4664    border: 0;
4665    padding: 0;
4666    margin: 0;
4667  }
4668  
4669  .fields-controls__slug .fields-controls__slug-external-icon {
4670    margin-left: 5ch;
4671  }
4672  
4673  .fields-controls__slug .fields-controls__slug-input input.components-input-control__input {
4674    padding-inline-start: 0 !important;
4675  }
4676  
4677  .fields-controls__slug .fields-controls__slug-help-link {
4678    word-break: break-word;
4679  }
4680  
4681  .fields-controls__slug .fields-controls__slug-help {
4682    display: flex;
4683    flex-direction: column;
4684  }
4685  
4686  .fields-controls__slug .fields-controls__slug-help .fields-controls__slug-help-slug {
4687    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
4688  }
4689  
4690  .fields-controls__featured-image-image,
4691  .fields-controls__featured-image-placeholder {
4692    width: 100%;
4693    height: 100%;
4694    display: block;
4695    border-radius: 4px;
4696  }
4697  
4698  .fields-controls__featured-image-placeholder {
4699    box-shadow: none;
4700    background: #f0f0f0;
4701  }
4702  
4703  .fields-controls__parent {
4704    border: 0;
4705    padding: 0;
4706    margin: 0;
4707  }
4708  
4709  .fields-controls__password {
4710    border: 0;
4711    padding: 0;
4712    margin: 0;
4713  }
4714  
4715  .fields-controls__status-icon {
4716    height: 24px;
4717    width: 24px;
4718  }
4719  
4720  .fields-controls__status-icon svg {
4721    fill: currentColor;
4722    margin-left: -4px;
4723  }
4724  
4725  .fields-field__title > span:first-child {
4726    text-overflow: ellipsis;
4727    overflow: hidden;
4728    text-decoration: none;
4729    white-space: nowrap;
4730    display: block;
4731    flex-grow: 0;
4732  }
4733  
4734  .fields-field__pattern-title span:first-child {
4735    flex: 1;
4736  }
4737  
4738  /**
4739   * Colors
4740   */
4741  /**
4742   * SCSS Variables.
4743   *
4744   * Please use variables from this sheet to ensure consistency across the UI.
4745   * Don't add to this sheet unless you're pretty sure the value will be reused in many places.
4746   * For example, don't add rules to this sheet that affect block visuals. It's purely for UI.
4747   */
4748  /**
4749   * Fonts & basic variables.
4750   */
4751  /**
4752   * Typography
4753   */
4754  /**
4755   * Grid System.
4756   * https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/
4757   */
4758  /**
4759   * Radius scale.
4760   */
4761  /**
4762   * Elevation scale.
4763   */
4764  /**
4765   * Dimensions.
4766   */
4767  /**
4768   * Mobile specific styles
4769   */
4770  /**
4771   * Editor styles.
4772   */
4773  /**
4774   * Block & Editor UI.
4775   */
4776  /**
4777   * Block paddings.
4778   */
4779  /**
4780   * React Native specific.
4781   * These variables do not appear to be used anywhere else.
4782   */
4783  .media-editor-preview {
4784    box-sizing: border-box;
4785    display: flex;
4786    justify-content: center;
4787    align-items: center;
4788    min-height: 100%;
4789    padding: 32px;
4790    position: relative;
4791  }
4792  
4793  .media-editor-preview__spinner {
4794    position: absolute;
4795    top: 50%;
4796    left: 50%;
4797    transform: translate(-50%, -50%);
4798  }
4799  
4800  .media-editor-preview--loading {
4801    width: 100%;
4802    height: 100%;
4803  }
4804  
4805  .media-editor-preview--image img {
4806    max-width: 100%;
4807    max-height: 100%;
4808    -o-object-fit: contain;
4809    object-fit: contain;
4810    width: auto;
4811    height: auto;
4812    opacity: 0;
4813  }
4814  
4815  @keyframes __wp-base-styles-fade-in {
4816    from {
4817      opacity: 0;
4818    }
4819    to {
4820      opacity: 1;
4821    }
4822  }
4823  @media not (prefers-reduced-motion) {
4824    .media-editor-preview--image img.loaded {
4825      animation: __wp-base-styles-fade-in 0.08s linear 0s;
4826      animation-fill-mode: forwards;
4827    }
4828  }
4829  .media-editor-preview--video video {
4830    max-width: 100%;
4831    max-height: 100%;
4832    -o-object-fit: contain;
4833    object-fit: contain;
4834    width: auto;
4835    height: auto;
4836  }
4837  
4838  .media-editor-preview--audio audio {
4839    max-width: 100%;
4840  }
4841  
4842  .media-editor-preview--file {
4843    text-align: center;
4844  }
4845  
4846  .media-editor-preview__file-info {
4847    background: #f0f0f0;
4848    padding: 24px;
4849    border-radius: 2px;
4850  }
4851  
4852  .media-editor-preview__file-name {
4853    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
4854    margin-bottom: 8px;
4855  }
4856  
4857  .media-editor-preview__mime-type {
4858    color: #757575;
4859    font-size: 0.9em;
4860    margin-bottom: 16px;
4861  }
4862  
4863  .media-editor-preview__download-link {
4864    display: inline-block;
4865    margin-top: 8px;
4866  }
4867  
4868  .media-editor-preview--error, .media-editor-preview--empty {
4869    color: #757575;
4870    text-align: center;
4871  }
4872  
4873  .media-editor-preview__url {
4874    font-size: 0.9em;
4875    color: #949494;
4876    word-break: break-all;
4877    margin-top: 8px;
4878  }
4879  
4880  .wp-media-editor-image-editor {
4881    position: relative;
4882    overflow: hidden;
4883    width: 100%;
4884    height: 100%;
4885    touch-action: none;
4886    -webkit-user-select: none;
4887    -moz-user-select: none;
4888    user-select: none;
4889    cursor: grab;
4890  }
4891  
4892  .wp-media-editor-image-editor__canvas {
4893    position: absolute;
4894    inset: 24px;
4895    min-height: 100px;
4896    min-width: 100px;
4897  }
4898  
4899  .wp-media-editor-image-editor__canvas:focus {
4900    outline: none;
4901  }
4902  
4903  .wp-media-editor-image-editor__stage {
4904    position: absolute;
4905    inset: 0;
4906  }
4907  
4908  .wp-media-editor-image-editor--dragging {
4909    cursor: grabbing;
4910  }
4911  
4912  .wp-media-editor-image-editor__image {
4913    position: absolute;
4914    top: 0;
4915    left: 0;
4916    will-change: transform;
4917    transform-origin: center center;
4918  }
4919  
4920  .wp-media-editor-image-editor__stencil {
4921    position: absolute;
4922    pointer-events: none;
4923  }
4924  
4925  .wp-media-editor-image-editor__dimming {
4926    position: absolute;
4927    pointer-events: none;
4928    /* Large shadow spread washes everything outside the crop area
4929       toward the canvas grey ($gray-200). Slightly stronger at rest
4930       for clear crop framing, lighter during drag so the user can see
4931       where they're panning. */
4932    box-shadow: 0 0 0 9999px rgba(224, 224, 224, 0.6);
4933    transition: box-shadow 0.15s ease;
4934  }
4935  
4936  .wp-media-editor-image-editor--dragging .wp-media-editor-image-editor__dimming {
4937    box-shadow: 0 0 0 9999px rgba(224, 224, 224, 0.4);
4938  }
4939  
4940  .wp-media-editor-image-editor__grid {
4941    position: absolute;
4942    pointer-events: none;
4943    overflow: hidden;
4944    transition: opacity 0.15s ease;
4945  }
4946  
4947  .wp-media-editor-image-editor__canvas--grid-interactive .wp-media-editor-image-editor__grid {
4948    opacity: 0;
4949    transition-delay: 0.1s;
4950  }
4951  
4952  .wp-media-editor-image-editor__canvas--show-grid .wp-media-editor-image-editor__grid {
4953    opacity: 1;
4954    transition-delay: 0s;
4955  }
4956  
4957  .wp-media-editor-image-editor__canvas--settling .wp-media-editor-image-editor__grid {
4958    opacity: 0;
4959    transition: none;
4960  }
4961  
4962  .wp-media-editor-image-editor__grid-line {
4963    position: absolute;
4964    background: rgba(255, 255, 255, 0.4);
4965  }
4966  
4967  .wp-media-editor-image-editor__grid-line--horizontal {
4968    left: 0;
4969    width: 100%;
4970    height: 1px;
4971  }
4972  
4973  .wp-media-editor-image-editor__grid-line--vertical {
4974    top: 0;
4975    height: 100%;
4976    width: 1px;
4977  }
4978  
4979  .wp-media-editor-image-editor__dimensions-tooltip {
4980    position: absolute;
4981    padding: 2px 6px;
4982    background: #fff;
4983    color: #1e1e1e;
4984    font-size: 11px;
4985    line-height: 1.4;
4986    font-variant-numeric: tabular-nums;
4987    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.06), 0 1px 2px rgba(0, 0, 0, 0.08);
4988    pointer-events: none;
4989    white-space: nowrap;
4990    z-index: 2;
4991  }
4992  
4993  .wp-media-editor-image-editor__stencil-rect {
4994    position: absolute;
4995    border: 1px solid #1e1e1e;
4996    box-sizing: border-box;
4997    pointer-events: none;
4998    transition: border-color 0.15s ease, box-shadow 0.15s ease;
4999  }
5000  
5001  .wp-media-editor-image-editor__canvas--focus-visible:focus .wp-media-editor-image-editor__stencil-rect {
5002    border-color: var(--wp-image-editor-focus-color, var(--wp-admin-theme-color, #007cba));
5003    box-shadow: 0 0 0 1px var(--wp-image-editor-focus-color, var(--wp-admin-theme-color, #007cba));
5004  }
5005  
5006  .wp-media-editor-image-editor__handle {
5007    -webkit-appearance: none;
5008    -moz-appearance: none;
5009    appearance: none;
5010    margin: 0;
5011    padding: 0;
5012    font: inherit;
5013    cursor: default;
5014    position: absolute;
5015    width: 12px;
5016    height: 12px;
5017    background: #fff;
5018    border: 1px solid var(--wp-admin-theme-color, #007cba);
5019    border-radius: 50%;
5020    box-sizing: border-box;
5021    pointer-events: auto;
5022    transition: background-color 0.15s ease, box-shadow 0.15s ease;
5023  }
5024  
5025  .wp-media-editor-image-editor__handle:focus {
5026    outline: none;
5027  }
5028  
5029  .wp-media-editor-image-editor__canvas--focus-visible .wp-media-editor-image-editor__handle:focus {
5030    background: var(--wp-image-editor-focus-color, var(--wp-admin-theme-color, #007cba));
5031    border-color: transparent;
5032    box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--wp-image-editor-focus-color, var(--wp-admin-theme-color, #007cba));
5033  }
5034  
5035  .wp-media-editor-image-editor__handle::before {
5036    content: "";
5037    position: absolute;
5038    top: 50%;
5039    left: 50%;
5040    width: 44px;
5041    height: 44px;
5042    transform: translate(-50%, -50%);
5043  }
5044  
5045  .wp-media-editor-image-editor__handle {
5046    /* Offset by half the handle width (12px / 2 = 6px) to center on crop edge */
5047  }
5048  
5049  .wp-media-editor-image-editor__handle--n {
5050    top: -6px;
5051    left: 50%;
5052    margin-left: -6px;
5053    cursor: ns-resize;
5054  }
5055  
5056  .wp-media-editor-image-editor__handle--s {
5057    bottom: -6px;
5058    left: 50%;
5059    margin-left: -6px;
5060    cursor: ns-resize;
5061  }
5062  
5063  .wp-media-editor-image-editor__handle--e {
5064    top: 50%;
5065    right: -6px;
5066    margin-top: -6px;
5067    cursor: ew-resize;
5068  }
5069  
5070  .wp-media-editor-image-editor__handle--w {
5071    top: 50%;
5072    left: -6px;
5073    margin-top: -6px;
5074    cursor: ew-resize;
5075  }
5076  
5077  .wp-media-editor-image-editor__handle--nw {
5078    top: -6px;
5079    left: -6px;
5080    cursor: nwse-resize;
5081  }
5082  
5083  .wp-media-editor-image-editor__handle--ne {
5084    top: -6px;
5085    right: -6px;
5086    cursor: nesw-resize;
5087  }
5088  
5089  .wp-media-editor-image-editor__handle--sw {
5090    bottom: -6px;
5091    left: -6px;
5092    cursor: nesw-resize;
5093  }
5094  
5095  .wp-media-editor-image-editor__handle--se {
5096    bottom: -6px;
5097    right: -6px;
5098    cursor: nwse-resize;
5099  }
5100  
5101  /**
5102   * Breakpoints & Media Queries
5103   */
5104  /**
5105   * Typography
5106   */
5107  /**
5108  *  Converts a hex value into the rgb equivalent.
5109  *
5110  * @param {string} hex - the hexadecimal value to convert
5111  * @return {string} comma separated rgb values
5112  */
5113  /**
5114   * Long content fade mixin
5115   *
5116   * Creates a fading overlay to signify that the content is longer
5117   * than the space allows.
5118   */
5119  /**
5120   * Breakpoint mixins
5121   */
5122  /**
5123   * Focus styles.
5124   */
5125  /**
5126   * Standard focus rings for the WordPress Design System.
5127   *
5128   * Apply `outset-ring__focus` inside the relevant pseudo-class at the call site,
5129   * e.g. `&:focus { @include outset-ring__focus(); }`.
5130   */
5131  /**
5132   * Applies editor left position to the selector passed as argument
5133   */
5134  /**
5135   * Styles that are reused verbatim in a few places
5136   */
5137  /**
5138   * Allows users to opt-out of animations via OS-level preferences.
5139   */
5140  /**
5141   * Reset default styles for JavaScript UI based pages.
5142   * This is a WP-admin agnostic reset
5143   */
5144  /**
5145   * Reset the WP Admin page styles for Gutenberg-like pages.
5146   */
5147  /**
5148   * Creates a checkerboard pattern background to indicate transparency.
5149   * @param {String} $size - The size of the squares in the checkerboard pattern. Default is 12px.
5150   */
5151  .media-editor {
5152    display: flex;
5153    flex: 1;
5154    flex-direction: column;
5155    height: 100%;
5156    min-height: 0;
5157  }
5158  
5159  .media-editor .media-editor__loading {
5160    height: 100%;
5161    display: flex;
5162    align-items: center;
5163    justify-content: center;
5164  }
5165  
5166  .media-editor .interface-interface-skeleton {
5167    position: relative;
5168    top: auto;
5169    right: auto;
5170    bottom: auto;
5171    left: auto;
5172    height: 100%;
5173    max-height: none;
5174    flex: 1;
5175    flex-direction: column;
5176  }
5177  
5178  .media-editor-modal .media-editor .interface-interface-skeleton.interface-interface-skeleton {
5179    top: auto;
5180  }
5181  
5182  .media-editor .interface-interface-skeleton__editor {
5183    min-width: 0;
5184    flex: 1;
5185  }
5186  
5187  .media-editor .media-editor__content {
5188    display: flex;
5189    flex: 1;
5190    flex-direction: column;
5191    min-height: 0;
5192    margin: 0 24px;
5193    border-radius: 8px;
5194    overflow: hidden;
5195  }
5196  
5197  .media-editor .media-editor__canvas-toolbar {
5198    display: flex;
5199    flex-shrink: 0;
5200    justify-content: center;
5201    background: #e0e0e0;
5202    padding: 8px 16px;
5203  }
5204  
5205  .media-editor .media-editor__canvas-toolbar .media-editor-fine-rotation {
5206    flex: 0 1 360px;
5207    min-width: 0;
5208  }
5209  
5210  .media-editor .media-editor__canvas-area {
5211    display: flex;
5212    align-items: center;
5213    justify-content: center;
5214    background: #e0e0e0;
5215    overflow: auto;
5216    flex: 1;
5217    min-height: 0;
5218  }
5219  
5220  .media-editor .media-editor__canvas-area .media-editor-preview {
5221    height: 100%;
5222  }
5223  
5224  .media-editor .media-editor__canvas-area img,
5225  .media-editor .media-editor__canvas-area video {
5226    max-width: 100%;
5227    max-height: 100%;
5228    -o-object-fit: contain;
5229    object-fit: contain;
5230  }
5231  
5232  .media-editor .media-editor__sidebar {
5233    box-sizing: border-box;
5234  }
5235  
5236  .media-editor .media-editor__sidebar *,
5237  .media-editor .media-editor__sidebar *::before,
5238  .media-editor .media-editor__sidebar *::after {
5239    box-sizing: inherit;
5240  }
5241  
5242  @media (min-width: 600px) {
5243    .media-editor .media-editor__sidebar {
5244      padding-left: 1px;
5245    }
5246  }
5247  .media-editor .media-editor__sidebar-panel {
5248    padding-bottom: 24px;
5249  }
5250  
5251  .media-editor .interface-interface-skeleton__sidebar {
5252    border-top: 0;
5253    box-shadow: none;
5254    outline: 1px solid transparent;
5255  }
5256  
5257  .media-editor .media-editor__panel {
5258    padding: 16px;
5259  }
5260  
5261  @media (min-width: 600px) {
5262    .media-editor .media-editor__panel {
5263      padding: 24px 24px 0 0;
5264    }
5265  }
5266  .media-editor .components-panel__header.media-editor__sidebar-header {
5267    padding-left: 0;
5268    padding-right: 8px;
5269    margin-right: 24px;
5270    margin-right: 0;
5271  }
5272  
5273  @media (min-width: 600px) {
5274    .media-editor .components-panel__header.media-editor__sidebar-header {
5275      margin-right: 24px;
5276    }
5277  }
5278  .media-editor .components-panel__header.media-editor__sidebar-header .components-button.has-icon {
5279    padding: 0;
5280  }
5281  
5282  @media (min-width: 600px) {
5283    .media-editor .components-panel__header.media-editor__sidebar-header .components-button.has-icon {
5284      display: flex;
5285    }
5286  }
5287  @media (min-width: 600px) and (max-width: 781px) {
5288    .media-editor .interface-interface-skeleton__sidebar:has(.interface-complementary-area__fill) {
5289      position: relative !important;
5290    }
5291    .media-editor .interface-complementary-area__fill,
5292    .media-editor .interface-complementary-area {
5293      width: 280px !important;
5294    }
5295  }
5296  @media (max-width: 599px) {
5297    .media-editor .interface-interface-skeleton__sidebar:has(.interface-complementary-area__fill) {
5298      width: 100%;
5299    }
5300    .media-editor .interface-complementary-area__fill,
5301    .media-editor .interface-complementary-area {
5302      width: 100% !important;
5303    }
5304  }
5305  .media-editor__snackbar {
5306    position: fixed;
5307    bottom: 24px;
5308    left: 0;
5309    right: 0;
5310    padding-inline: 16px;
5311    box-sizing: border-box;
5312    display: flex;
5313    flex-direction: column;
5314    pointer-events: none;
5315  }
5316  
5317  .media-editor__snackbar .components-snackbar {
5318    margin-inline: auto;
5319  }
5320  
5321  .media-editor-form .dataforms-layouts-panel__field-control {
5322    text-wrap: pretty;
5323  }
5324  
5325  .media-editor-modal.components-modal__frame .components-modal__content {
5326    padding: 0;
5327    margin-bottom: 0;
5328    display: flex;
5329    flex-direction: column;
5330    min-height: 0;
5331  }
5332  
5333  .media-editor-modal.components-modal__frame .components-modal__children-container {
5334    display: flex;
5335    flex: 1;
5336    flex-direction: column;
5337    min-height: 0;
5338  }
5339  
5340  .media-editor-modal.components-modal__frame .media-editor-modal__footer {
5341    flex-shrink: 0;
5342    display: flex;
5343    gap: 16px;
5344    padding: 16px 32px 24px;
5345    background: #fff;
5346    z-index: 1000001;
5347  }
5348  
5349  .media-editor-modal.components-modal__frame .media-editor-modal__footer.is-wide {
5350    flex-direction: row;
5351    align-items: center;
5352  }
5353  
5354  .media-editor-modal.components-modal__frame .media-editor-modal__footer.is-wide .media-editor__footer-actions {
5355    margin-left: auto;
5356  }
5357  
5358  .media-editor-modal.components-modal__frame .media-editor-modal__footer.is-narrow {
5359    flex-direction: column;
5360  }
5361  
5362  .media-editor-modal.components-modal__frame .media-editor-modal__footer.is-narrow > .media-editor-image-controls {
5363    align-self: center;
5364  }
5365  
5366  .media-editor-modal__footer-row {
5367    display: flex;
5368    flex-wrap: wrap;
5369    align-items: center;
5370    gap: 16px;
5371  }
5372  
5373  .media-editor-modal__footer-row .media-editor-image-controls,
5374  .media-editor-modal__footer-row .media-editor__footer-actions {
5375    margin-left: auto;
5376  }
5377  
5378  .media-editor__history-actions .components-button.has-icon:not([aria-disabled=true]) {
5379    color: var(--wp-admin-theme-color);
5380  }
5381  
5382  .media-editor-modal {
5383    display: flex;
5384    flex-direction: column;
5385  }
5386  
5387  .media-editor-modal__snackbar {
5388    position: fixed;
5389    bottom: 24px;
5390    left: 0;
5391    right: 0;
5392    padding-inline: 16px;
5393    box-sizing: border-box;
5394    display: flex;
5395    flex-direction: column;
5396    pointer-events: none;
5397  }
5398  
5399  .media-editor-modal__snackbar .components-snackbar {
5400    margin-inline: auto;
5401  }
5402  
5403  .media-editor-modal__snackbar {
5404    z-index: 1000001;
5405  }
5406  
5407  .media-editor-canvas {
5408    position: relative;
5409    width: 100%;
5410    height: 100%;
5411  }
5412  
5413  .media-editor-canvas__cropper {
5414    width: 100%;
5415    height: 100%;
5416    opacity: 0;
5417    pointer-events: none;
5418  }
5419  
5420  .media-editor-canvas__cropper.is-loaded {
5421    opacity: 1;
5422    pointer-events: auto;
5423  }
5424  
5425  @keyframes __wp-base-styles-fade-in {
5426    from {
5427      opacity: 0;
5428    }
5429    to {
5430      opacity: 1;
5431    }
5432  }
5433  @media not (prefers-reduced-motion) {
5434    .media-editor-canvas__cropper.is-loaded {
5435      animation: __wp-base-styles-fade-in 0.2s linear 0s;
5436      animation-fill-mode: forwards;
5437    }
5438  }
5439  .media-editor-canvas__spinner {
5440    position: absolute;
5441    top: 50%;
5442    left: 50%;
5443    transform: translate(-50%, -50%);
5444  }
5445  
5446  .media-editor-canvas__error {
5447    display: flex;
5448    align-items: center;
5449    justify-content: center;
5450    width: 100%;
5451    height: 100%;
5452    color: #757575;
5453    text-align: center;
5454  }
5455  
5456  .media-editor-image-controls {
5457    display: flex;
5458    flex-wrap: nowrap;
5459    align-items: center;
5460    gap: 8px;
5461  }
5462  
5463  .media-editor-image-controls.is-stacked {
5464    flex-direction: column;
5465    align-items: flex-start;
5466    gap: 24px;
5467  }
5468  
5469  .media-editor-image-controls__transforms {
5470    display: flex;
5471    gap: 48px;
5472  }
5473  
5474  .media-editor-image-controls__group {
5475    display: flex;
5476    flex-direction: column;
5477    gap: 4px;
5478  }
5479  
5480  .media-editor-image-controls__label {
5481    font-size: 11px;
5482    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
5483    line-height: 1.4;
5484    text-transform: uppercase;
5485  }
5486  
5487  .media-editor-image-controls__buttons {
5488    display: flex;
5489    gap: 8px;
5490    padding-inline: 2px 0;
5491  }
5492  
5493  .media-editor-keyboard-shortcuts-modal {
5494    min-width: 280px;
5495  }
5496  
5497  .media-editor-keyboard-shortcuts-modal .media-editor-keyboard-shortcuts-modal__note {
5498    margin: 0 0 16px;
5499    color: #757575;
5500    font-size: 13px;
5501  }
5502  
5503  .media-editor-keyboard-shortcuts-modal .media-editor-keyboard-shortcuts-modal__shortcut-list {
5504    list-style: none;
5505    margin: 0;
5506    padding: 0;
5507  }
5508  
5509  .media-editor-keyboard-shortcuts-modal .media-editor-keyboard-shortcuts-modal__shortcut {
5510    display: flex;
5511    align-items: baseline;
5512    padding: 0.6rem 0;
5513    border-top: 1px solid #ddd;
5514    margin-bottom: 0;
5515  }
5516  
5517  .media-editor-keyboard-shortcuts-modal .media-editor-keyboard-shortcuts-modal__shortcut:last-child {
5518    border-bottom: 1px solid #ddd;
5519  }
5520  
5521  .media-editor-keyboard-shortcuts-modal .media-editor-keyboard-shortcuts-modal__shortcut-description {
5522    flex: 1;
5523    margin: 0;
5524  }
5525  
5526  .media-editor-keyboard-shortcuts-modal .media-editor-keyboard-shortcuts-modal__shortcut-term {
5527    background: none;
5528    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
5529    margin: 0 0 0 1rem;
5530    padding: 0;
5531    text-align: right;
5532  }
5533  
5534  .media-editor-keyboard-shortcuts-modal .media-editor-keyboard-shortcuts-modal__shortcut-key {
5535    padding: 0.25rem 0.5rem;
5536    border-radius: 8%;
5537    margin: 0 0.2rem 0 0.2rem;
5538  }
5539  
5540  .media-editor-keyboard-shortcuts-modal .media-editor-keyboard-shortcuts-modal__shortcut-key:last-child {
5541    margin: 0 0 0 0.2rem;
5542  }
5543  
5544  .rotation-ruler {
5545    position: relative;
5546    min-width: 180px;
5547    height: 32px;
5548    padding: 0 8px;
5549    box-sizing: border-box;
5550    color: #1e1e1e;
5551    font-family: -apple-system, system-ui, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
5552    -webkit-user-select: none;
5553    -moz-user-select: none;
5554    user-select: none;
5555    touch-action: none;
5556    cursor: ew-resize;
5557    container-type: inline-size;
5558  }
5559  
5560  .rotation-ruler[data-disabled] {
5561    opacity: 0.5;
5562    pointer-events: none;
5563    cursor: default;
5564  }
5565  
5566  .rotation-ruler:has(.rotation-ruler__input:focus-visible) {
5567    outline: 2px solid var(--wp-admin-theme-color, #3858e9);
5568    outline-offset: 2px;
5569    border-radius: 4px;
5570  }
5571  
5572  .rotation-ruler__input {
5573    position: absolute;
5574    width: 1px;
5575    height: 1px;
5576    margin: -1px;
5577    padding: 0;
5578    border: 0;
5579    clip: rect(0 0 0 0);
5580    overflow: hidden;
5581    white-space: nowrap;
5582  }
5583  
5584  .rotation-ruler__pointer {
5585    position: absolute;
5586    bottom: 0;
5587    left: 50%;
5588    width: 2px;
5589    height: 18px;
5590    background: var(--wp-admin-theme-color, #3858e9);
5591    border-radius: 1px;
5592    transform: translateX(-50%);
5593    pointer-events: none;
5594  }
5595  
5596  .rotation-ruler__strip {
5597    position: absolute;
5598    inset: 0;
5599    overflow: hidden;
5600    mask-image: linear-gradient(to right, transparent 0, #000 8px, #000 calc(100% - 8px), transparent 100%);
5601    -webkit-mask-image: linear-gradient(to right, transparent 0, #000 8px, #000 calc(100% - 8px), transparent 100%);
5602  }
5603  
5604  .rotation-ruler__ticks {
5605    position: absolute;
5606    /*rtl:ignore*/
5607    left: 50%;
5608    top: 0;
5609    display: block;
5610    overflow: visible;
5611  }
5612  
5613  .rotation-ruler__tick {
5614    stroke: currentColor;
5615    stroke-width: 1;
5616  }
5617  
5618  .rotation-ruler__tick--minor {
5619    opacity: 0.35;
5620  }
5621  
5622  .rotation-ruler__tick--mid {
5623    opacity: 0.6;
5624  }
5625  
5626  .rotation-ruler__tick--major {
5627    opacity: 1;
5628  }
5629  
5630  .rotation-ruler__label {
5631    fill: currentColor;
5632    font-size: 10px;
5633    font-weight: 400;
5634    opacity: 0.45;
5635  }
5636  
5637  .rotation-ruler__active-label {
5638    position: absolute;
5639    top: 0;
5640    left: 50%;
5641    height: 14px;
5642    transform: translateX(-50%);
5643    font-size: 12px;
5644    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
5645    line-height: 14px;
5646    color: #1e1e1e;
5647    pointer-events: none;
5648  }
5649  
5650  .rotation-ruler__active-label::before {
5651    content: "";
5652    position: absolute;
5653    top: 0;
5654    left: 50%;
5655    width: 60px;
5656    height: 100%;
5657    transform: translateX(-50%);
5658    background: linear-gradient(to right, transparent 0, #e0e0e0 12px, #e0e0e0 calc(100% - 12px), transparent 100%);
5659  }
5660  
5661  .rotation-ruler__active-label-number {
5662    position: relative;
5663    display: inline-block;
5664  }
5665  
5666  .rotation-ruler__active-label-sign {
5667    position: absolute;
5668    top: 0;
5669    right: 100%;
5670  }
5671  
5672  .rotation-ruler__active-label-unit {
5673    position: absolute;
5674    top: 0;
5675    left: 100%;
5676  }
5677  
5678  @container (max-width: 220px) {
5679    .rotation-ruler__tick--minor {
5680      opacity: 0;
5681    }
5682  }
5683  @media (prefers-reduced-motion: reduce) {
5684    .rotation-ruler__ticks {
5685      transition: none;
5686    }
5687  }
5688  .editor-autocompleters__link {
5689    white-space: nowrap;
5690    gap: 8px;
5691  }
5692  
5693  .editor-autocompleters__user .editor-autocompleters__no-avatar::before {
5694    /* stylelint-disable-next-line font-family-no-missing-generic-family-keyword -- dashicons don't need a generic family keyword. */
5695    font: normal 20px/1 dashicons;
5696    content: "\f110";
5697    margin-right: 5px;
5698    vertical-align: middle;
5699  }
5700  .editor-autocompleters__user .editor-autocompleters__user-avatar {
5701    margin-right: 8px;
5702    flex-grow: 0;
5703    flex-shrink: 0;
5704    max-width: none;
5705    width: 24px;
5706    height: 24px;
5707  }
5708  .editor-autocompleters__user .editor-autocompleters__user-name {
5709    white-space: nowrap;
5710    text-overflow: ellipsis;
5711    overflow: hidden;
5712    max-width: 200px;
5713    flex-shrink: 0;
5714    flex-grow: 1;
5715  }
5716  .editor-autocompleters__user .editor-autocompleters__user-slug {
5717    margin-left: 8px;
5718    white-space: nowrap;
5719    text-overflow: ellipsis;
5720    overflow: hidden;
5721    max-width: 100px;
5722    flex-grow: 0;
5723    flex-shrink: 0;
5724  }
5725  .editor-autocompleters__user:not(.is-primary) .editor-autocompleters__user-slug {
5726    color: #757575;
5727  }
5728  
5729  .interface-interface-skeleton__sidebar:has(.editor-collab-sidebar) {
5730    box-shadow: none;
5731  }
5732  .interface-interface-skeleton__sidebar:has(.editor-collab-sidebar) .interface-complementary-area-header {
5733    display: none;
5734  }
5735  
5736  .editor-collab-sidebar {
5737    height: 100%;
5738    overflow: hidden;
5739  }
5740  
5741  .editor-collab-sidebar-panel {
5742    position: relative;
5743    padding: 16px 16px 24px;
5744    height: 100%;
5745    overflow: hidden;
5746  }
5747  
5748  .editor-collab-sidebar-panel__thread {
5749    position: relative;
5750    padding: 16px;
5751    border-radius: 8px;
5752    border: 1px solid #ddd;
5753    background-color: #f0f0f0;
5754    overflow: hidden;
5755    width: auto;
5756  }
5757  .editor-collab-sidebar-panel__thread.is-selected {
5758    background-color: #fff;
5759    box-shadow: 0 2px 3px rgba(0, 0, 0, 0.05), 0 4px 5px rgba(0, 0, 0, 0.04), 0 12px 12px rgba(0, 0, 0, 0.03), 0 16px 16px rgba(0, 0, 0, 0.02);
5760    z-index: 1;
5761  }
5762  .editor-collab-sidebar-panel__thread:focus {
5763    outline: var(--wp-admin-border-width-focus) solid var(--wp-admin-theme-color);
5764    outline-offset: calc(-1 * var(--wp-admin-border-width-focus));
5765  }
5766  .editor-collab-sidebar-panel__thread.is-floating {
5767    left: 16px;
5768    right: 16px;
5769    position: absolute;
5770    margin-top: 16px;
5771    transform: translateY(var(--canvas-scroll, 0));
5772    will-change: transform;
5773    max-height: calc(100dvh - var(--wp-admin--admin-bar--height, 0px) - 128px);
5774    overflow-y: auto;
5775  }
5776  
5777  .editor-collab-sidebar-panel__user-name {
5778    font-size: 12px;
5779    font-weight: 400;
5780    line-height: 16px;
5781    text-align: left;
5782    color: #757575;
5783    text-transform: capitalize;
5784  }
5785  
5786  .editor-collab-sidebar-panel__user-time {
5787    font-size: 12px;
5788    font-weight: 400;
5789    line-height: 16px;
5790    text-align: left;
5791    color: #757575;
5792  }
5793  
5794  .editor-collab-sidebar-panel__show-more-button {
5795    width: -moz-fit-content;
5796    width: fit-content;
5797    color: var(--wpds-color-foreground-interactive-brand, var(--wp-admin-theme-color, #3858e9));
5798    cursor: var(--wpds-cursor-control, pointer);
5799  }
5800  .editor-collab-sidebar-panel__show-more-button:hover, .editor-collab-sidebar-panel__show-more-button:focus, .editor-collab-sidebar-panel__show-more-button:active {
5801    color: var(--wpds-color-foreground-interactive-brand-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 52%, black));
5802  }
5803  
5804  .editor-collab-sidebar-panel__note-content p:last-child {
5805    margin-bottom: 0;
5806  }
5807  .editor-collab-sidebar-panel__note-content.is-collapsed {
5808    -webkit-line-clamp: 3;
5809    line-clamp: 3;
5810    display: -webkit-box;
5811    -webkit-box-orient: vertical;
5812    overflow: hidden;
5813  }
5814  
5815  .editor-collab-sidebar-panel__user-avatar {
5816    border-radius: 50%;
5817    flex-shrink: 0;
5818    border-width: var(--wp-admin-border-width-focus);
5819    border-style: solid;
5820    padding: var(--wp-admin-border-width-focus);
5821    background: #fff;
5822  }
5823  
5824  .editor-collab-sidebar-panel__note-actions {
5825    margin-left: auto;
5826  }
5827  .editor-collab-sidebar-panel__note-actions button.has-icon:not(.has-text) {
5828    min-width: 24px;
5829    padding: 0;
5830    width: 24px;
5831    height: 24px;
5832    flex-shrink: 0;
5833  }
5834  
5835  .editor-collab-sidebar-panel__more-reply-separator::before, .editor-collab-sidebar-panel__more-reply-separator::after,
5836  .editor-collab-sidebar-panel__status-separator::before,
5837  .editor-collab-sidebar-panel__status-separator::after {
5838    content: "";
5839    flex: 1;
5840    height: 1px;
5841    background-color: #ddd;
5842  }
5843  
5844  .editor-collab-sidebar-panel__more-reply-button {
5845    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
5846  }
5847  
5848  .editor-collab-sidebar-panel__deleted-block-notice {
5849    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
5850    color: #757575;
5851  }
5852  
5853  .editor-collab-sidebar-panel__resolution-text {
5854    font-style: italic;
5855  }
5856  
5857  .editor-collab-sidebar-panel__note-form [role=textbox] {
5858    line-height: 20px;
5859    max-height: 418px;
5860    overflow-y: auto;
5861    white-space: pre-wrap;
5862    word-wrap: break-word;
5863  }
5864  .editor-collab-sidebar-panel__note-form [role=textbox] code {
5865    font-family: Menlo, Consolas, monaco, monospace;
5866    font-size: 0.9em;
5867    padding: 0 2px;
5868    background: #f0f0f0;
5869    border-radius: 2px;
5870  }
5871  .editor-collab-sidebar-panel__note-form [role=textbox] a:not(.wp-note-mention) {
5872    color: var(--wp-admin-theme-color);
5873    text-decoration: underline;
5874  }
5875  
5876  .editor-collab-sidebar-panel__skip-to-note,
5877  .editor-collab-sidebar-panel__skip-to-block {
5878    position: absolute;
5879    top: -9999px;
5880    right: -9999px;
5881    overflow: hidden;
5882    clip-path: inset(50%);
5883    background: #fff !important;
5884    z-index: -1;
5885  }
5886  .editor-collab-sidebar-panel__skip-to-note:focus,
5887  .editor-collab-sidebar-panel__skip-to-block:focus {
5888    overflow: visible;
5889    clip-path: none;
5890    z-index: 1;
5891    right: 8px;
5892  }
5893  
5894  .editor-collab-sidebar-panel__skip-to-note:focus {
5895    top: 8px;
5896  }
5897  
5898  .editor-collab-sidebar-panel__skip-to-block:focus {
5899    top: auto;
5900    bottom: 8px;
5901  }
5902  
5903  .editor-note-indicator__avatar {
5904    width: 24px;
5905    border-radius: 50%;
5906    margin-left: -12px;
5907    border-width: var(--wp-admin-border-width-focus);
5908    border-style: solid;
5909    padding: var(--wp-admin-border-width-focus);
5910    background: #fff;
5911    box-sizing: border-box;
5912  }
5913  .editor-note-indicator__avatar:first-child {
5914    margin-left: 0;
5915  }
5916  
5917  .editor-note-indicator__overflow {
5918    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
5919  }
5920  
5921  .show-icon-labels .editor-note-indicator {
5922    width: auto;
5923  }
5924  .show-icon-labels .editor-note-indicator div {
5925    display: none;
5926  }
5927  .show-icon-labels .editor-note-indicator::after {
5928    content: attr(aria-label);
5929    font-size: 12px;
5930  }
5931  
5932  mark.wp-note {
5933    border-radius: 1px;
5934    transition: background-color 0.1s ease-in-out;
5935  }
5936  
5937  .wp-note-mention {
5938    display: inline;
5939    padding: 0 4px;
5940    border-radius: 2px;
5941    background: color-mix(in srgb, var(--wp-admin-theme-color) 12%, transparent);
5942    color: var(--wp-admin-theme-color);
5943    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
5944    white-space: nowrap;
5945    text-decoration: none;
5946  }
5947  
5948  .editor-collab-sidebar-panel__mention-suggestion .editor-autocompleters__user-avatar {
5949    border-radius: 50%;
5950  }
5951  
5952  .editor-avatar {
5953    position: relative;
5954    display: inline-flex;
5955    align-items: center;
5956    border-radius: 9999px;
5957    flex-shrink: 0;
5958    box-shadow: 0 0 0 var(--wp-admin-border-width-focus) #fff, 0 1px 1px rgba(0, 0, 0, 0.03), 0 1px 2px rgba(0, 0, 0, 0.02), 0 3px 3px rgba(0, 0, 0, 0.02), 0 4px 4px rgba(0, 0, 0, 0.01);
5959  }
5960  
5961  .editor-avatar__image {
5962    box-sizing: border-box;
5963    position: relative;
5964    width: 32px;
5965    height: 32px;
5966    border-radius: 9999px;
5967    border: 0;
5968    background-color: var(--wp-admin-theme-color, #3858e9);
5969    overflow: hidden;
5970    overflow: clip;
5971    flex-shrink: 0;
5972    font-size: 0;
5973    color: #fff;
5974  }
5975  .is-small > .editor-avatar__image {
5976    width: 24px;
5977    height: 24px;
5978  }
5979  .has-avatar-border-color > .editor-avatar__image {
5980    border: var(--wp-admin-border-width-focus) solid var(--editor-avatar-outline-color);
5981    background-clip: padding-box;
5982  }
5983  .has-avatar-border-color > .editor-avatar__image::after {
5984    content: "";
5985    position: absolute;
5986    inset: 0;
5987    border-radius: inherit;
5988    box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus, 2px) #fff;
5989    pointer-events: none;
5990    z-index: 1;
5991  }
5992  
5993  .editor-avatar__img {
5994    position: absolute;
5995    inset: 0;
5996    width: 100%;
5997    height: 100%;
5998    -o-object-fit: cover;
5999       object-fit: cover;
6000    border-radius: inherit;
6001    opacity: 0;
6002  }
6003  .has-src > .editor-avatar__image > .editor-avatar__img {
6004    opacity: 1;
6005  }
6006  
6007  .editor-avatar:not(.has-src) > .editor-avatar__image {
6008    display: flex;
6009    align-items: center;
6010    justify-content: center;
6011    font-size: 11px;
6012    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
6013    border: 0;
6014    background-clip: border-box;
6015  }
6016  .editor-avatar:not(.has-src) > .editor-avatar__image::after {
6017    content: none;
6018  }
6019  
6020  .editor-avatar:not(.has-src).has-avatar-border-color > .editor-avatar__image {
6021    background-color: var(--editor-avatar-outline-color);
6022  }
6023  
6024  .editor-avatar__name {
6025    font-size: 13px;
6026    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
6027    line-height: 20px;
6028    color: var(--editor-avatar-name-color, #fff);
6029    min-width: 0;
6030    padding-bottom: 2px;
6031    overflow: hidden;
6032    opacity: 0;
6033    white-space: nowrap;
6034    transition: opacity 0.15s cubic-bezier(0.15, 0, 0.15, 1);
6035  }
6036  
6037  .editor-avatar.is-badge {
6038    display: inline-grid;
6039    grid-template-columns: min-content 0fr;
6040    -moz-column-gap: 0;
6041         column-gap: 0;
6042    padding-inline-end: 0;
6043    background-color: var(--wp-admin-theme-color, #3858e9);
6044    transition: grid-template-columns 0.3s cubic-bezier(0.15, 0, 0.15, 1), column-gap 0.3s cubic-bezier(0.15, 0, 0.15, 1), padding-inline-end 0.3s cubic-bezier(0.15, 0, 0.15, 1);
6045    transition: grid-template-columns 0.3s cubic-bezier(0.15, 0, 0.15, 1), column-gap 0.3s cubic-bezier(0.15, 0, 0.15, 1), padding-inline-end 0.3s cubic-bezier(0.15, 0, 0.15, 1), -moz-column-gap 0.3s cubic-bezier(0.15, 0, 0.15, 1);
6046  }
6047  .editor-avatar.is-badge:hover {
6048    grid-template-columns: min-content 1fr;
6049    -moz-column-gap: 4px;
6050         column-gap: 4px;
6051    padding-inline-end: 8px;
6052    transition-timing-function: cubic-bezier(0.85, 0, 0.85, 1);
6053  }
6054  .editor-avatar.is-badge:hover .editor-avatar__name {
6055    opacity: 1;
6056    transition-timing-function: cubic-bezier(0.85, 0, 0.85, 1);
6057  }
6058  
6059  .editor-avatar.is-badge.has-avatar-border-color {
6060    background-color: var(--editor-avatar-outline-color);
6061  }
6062  
6063  .editor-avatar.is-dimmed > .editor-avatar__image {
6064    opacity: 0.5;
6065    background-color: #757575;
6066  }
6067  
6068  .editor-avatar.is-dimmed.has-avatar-border-color > .editor-avatar__image {
6069    border-color: #757575;
6070  }
6071  
6072  .editor-avatar.is-dimmed .editor-avatar__img {
6073    filter: grayscale(1);
6074  }
6075  
6076  .editor-avatar__status-indicator {
6077    position: absolute;
6078    top: 0;
6079    left: 0;
6080    width: 32px;
6081    height: 32px;
6082    display: flex;
6083    align-items: center;
6084    justify-content: center;
6085    z-index: 1;
6086    color: #1e1e1e;
6087    fill: #1e1e1e;
6088  }
6089  .is-small > .editor-avatar__status-indicator {
6090    width: 24px;
6091    height: 24px;
6092  }
6093  .editor-avatar__status-indicator svg {
6094    width: 75%;
6095    height: 75%;
6096  }
6097  
6098  @media (prefers-reduced-motion: reduce) {
6099    .editor-avatar.is-badge,
6100    .editor-avatar__name {
6101      transition: none;
6102    }
6103  }
6104  .editor-avatar-group {
6105    display: flex;
6106    align-items: center;
6107  }
6108  .editor-avatar-group > .editor-avatar + .editor-avatar {
6109    margin-inline-start: -8px;
6110  }
6111  .editor-avatar-group > .editor-avatar {
6112    position: relative;
6113  }
6114  .editor-avatar-group > .editor-avatar:nth-child(1) {
6115    z-index: 10;
6116  }
6117  .editor-avatar-group > .editor-avatar:nth-child(2) {
6118    z-index: 9;
6119  }
6120  .editor-avatar-group > .editor-avatar:nth-child(3) {
6121    z-index: 8;
6122  }
6123  .editor-avatar-group > .editor-avatar:nth-child(4) {
6124    z-index: 7;
6125  }
6126  .editor-avatar-group > .editor-avatar:nth-child(5) {
6127    z-index: 6;
6128  }
6129  .editor-avatar-group > .editor-avatar:nth-child(6) {
6130    z-index: 5;
6131  }
6132  .editor-avatar-group > .editor-avatar:nth-child(7) {
6133    z-index: 4;
6134  }
6135  .editor-avatar-group > .editor-avatar:nth-child(8) {
6136    z-index: 3;
6137  }
6138  .editor-avatar-group > .editor-avatar:nth-child(9) {
6139    z-index: 2;
6140  }
6141  .editor-avatar-group > .editor-avatar:nth-child(10) {
6142    z-index: 1;
6143  }
6144  
6145  .editor-avatar-group__overflow {
6146    margin-inline-start: 4px;
6147    margin-inline-end: 4px;
6148    font-size: 12px;
6149    line-height: 20px;
6150    color: #1e1e1e;
6151    white-space: nowrap;
6152  }
6153  
6154  .editor-collaborators-presence__list.components-popover .components-popover__content {
6155    border: 1px solid #ddd;
6156    border-width: 1px 0 0 1px;
6157    border-radius: 8px;
6158    background: #fff;
6159    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 2px 3px rgba(0, 0, 0, 0.04), 0 6px 6px rgba(0, 0, 0, 0.03), 0 8px 8px rgba(0, 0, 0, 0.02);
6160  }
6161  .editor-collaborators-presence__list.components-popover .editor-collaborators-presence__list-content {
6162    min-width: 280px;
6163  }
6164  .editor-collaborators-presence__list.components-popover .editor-collaborators-presence__list-header {
6165    display: flex;
6166    justify-content: space-between;
6167    align-items: center;
6168    padding: 8px 16px;
6169  }
6170  .editor-collaborators-presence__list.components-popover .editor-collaborators-presence__list-header-title {
6171    font-size: 13px;
6172    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
6173    line-height: 20px;
6174    display: flex;
6175    gap: 4px;
6176  }
6177  .editor-collaborators-presence__list.components-popover .editor-collaborators-presence__list-header-title span {
6178    color: #757575;
6179  }
6180  .editor-collaborators-presence__list.components-popover .editor-collaborators-presence__list-header-action {
6181    padding: 0;
6182  }
6183  .editor-collaborators-presence__list.components-popover .editor-collaborators-presence__list-header-action button {
6184    color: #1e1e1e;
6185    height: 32px;
6186    width: 32px;
6187    padding: 0;
6188  }
6189  .editor-collaborators-presence__list.components-popover .editor-collaborators-presence__list-items {
6190    display: flex;
6191    flex-direction: column;
6192    padding-bottom: 16px;
6193  }
6194  .editor-collaborators-presence__list.components-popover .editor-collaborators-presence__list-item {
6195    all: unset;
6196    box-sizing: border-box;
6197    display: flex;
6198    align-items: center;
6199    padding: 12px 16px;
6200    gap: 8px;
6201    width: 100%;
6202    cursor: var(--wpds-cursor-control, pointer);
6203    transition: background-color 0.2s ease;
6204  }
6205  .editor-collaborators-presence__list.components-popover .editor-collaborators-presence__list-item:hover:not(:disabled) {
6206    background-color: rgba(var(--wp-admin-theme-color--rgb), 0.04);
6207  }
6208  .editor-collaborators-presence__list.components-popover .editor-collaborators-presence__list-item:active:not(:disabled) {
6209    background-color: rgba(var(--wp-admin-theme-color--rgb), 0.08);
6210  }
6211  .editor-collaborators-presence__list.components-popover .editor-collaborators-presence__list-item:focus-visible {
6212    outline: 2px solid var(--wp-admin-theme-color, #3858e9);
6213    outline-offset: -2px;
6214  }
6215  .editor-collaborators-presence__list.components-popover .editor-collaborators-presence__list-item:disabled {
6216    cursor: default;
6217  }
6218  .editor-collaborators-presence__list.components-popover .editor-collaborators-presence__list-item-info {
6219    display: flex;
6220    flex-direction: column;
6221    flex: 1;
6222    min-width: 0;
6223  }
6224  .editor-collaborators-presence__list.components-popover .editor-collaborators-presence__list-item-name {
6225    font-size: 13px;
6226    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
6227    line-height: 20px;
6228    color: #1e1e1e;
6229    overflow: hidden;
6230    text-overflow: ellipsis;
6231    white-space: nowrap;
6232  }
6233  
6234  .editor-collaborators-presence {
6235    display: flex;
6236    align-items: center;
6237    flex-shrink: 0;
6238    height: 32px;
6239    background: #f0f0f0;
6240    border-radius: 4px;
6241  }
6242  .editor-collaborators-presence:hover {
6243    background-color: #e0e0e0;
6244  }
6245  .editor-collaborators-presence:has(.is-pressed) {
6246    background-color: #e0e0e0;
6247  }
6248  
6249  .editor-header__center .editor-collaborators-presence {
6250    margin-right: 8px;
6251  }
6252  
6253  .editor-collaborators-presence__button.editor-collaborators-presence__button.components-button {
6254    display: flex;
6255    align-items: center;
6256    cursor: var(--wpds-cursor-control, pointer);
6257    position: relative;
6258    padding: 4px;
6259    border-radius: 4px;
6260    height: 100%;
6261    box-sizing: border-box;
6262    color: #2f2f2f;
6263    background: transparent;
6264  }
6265  .editor-collaborators-presence__button.editor-collaborators-presence__button.components-button:hover {
6266    background: transparent;
6267    color: #2f2f2f;
6268  }
6269  .editor-collaborators-presence__button.editor-collaborators-presence__button.components-button.is-pressed, .editor-collaborators-presence__button.editor-collaborators-presence__button.components-button.is-pressed:hover {
6270    background: transparent;
6271    color: #2f2f2f;
6272  }
6273  .editor-collaborators-presence__button.editor-collaborators-presence__button.components-button:focus:not(:active) {
6274    box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus, 2px) var(--wp-admin-theme-color, #007cba);
6275    outline: none;
6276  }
6277  
6278  .editor-collapsible-block-toolbar {
6279    overflow: hidden;
6280    display: flex;
6281    align-items: center;
6282    height: 64px;
6283  }
6284  .editor-collapsible-block-toolbar .block-editor-block-contextual-toolbar {
6285    border-bottom: 0;
6286    height: 100%;
6287    background: transparent;
6288  }
6289  .editor-collapsible-block-toolbar .block-editor-block-toolbar {
6290    height: 100%;
6291    padding-top: 17px;
6292  }
6293  .editor-collapsible-block-toolbar .block-editor-block-toolbar .components-button:not(.block-editor-block-mover-button) {
6294    height: 32px;
6295  }
6296  .editor-collapsible-block-toolbar::after {
6297    content: "";
6298    width: 1px;
6299    height: 24px;
6300    background-color: #ddd;
6301    margin-right: 7px;
6302  }
6303  .editor-collapsible-block-toolbar .components-toolbar-group,
6304  .editor-collapsible-block-toolbar .components-toolbar {
6305    border-right: none;
6306    position: relative;
6307  }
6308  .editor-collapsible-block-toolbar .components-toolbar-group::after,
6309  .editor-collapsible-block-toolbar .components-toolbar::after {
6310    content: "";
6311    width: 1px;
6312    height: 24px;
6313    background-color: #ddd;
6314    top: 4px;
6315    position: absolute;
6316    right: -1px;
6317  }
6318  .editor-collapsible-block-toolbar .components-toolbar-group .components-toolbar-group.components-toolbar-group::after,
6319  .editor-collapsible-block-toolbar .components-toolbar .components-toolbar-group.components-toolbar-group::after {
6320    display: none;
6321  }
6322  .editor-collapsible-block-toolbar .block-editor-block-mover.is-horizontal .block-editor-block-mover-button {
6323    height: 32px;
6324    overflow: visible;
6325  }
6326  @media (min-width: 600px) {
6327    .editor-collapsible-block-toolbar .block-editor-block-mover:not(.is-horizontal) .block-editor-block-mover__move-button-container {
6328      height: 40px;
6329      position: relative;
6330      top: -4px;
6331    }
6332  }
6333  .editor-collapsible-block-toolbar.is-collapsed {
6334    display: none;
6335  }
6336  
6337  .editor-block-visibility__disabled-blocks-count {
6338    border: 1px solid #ddd;
6339    border-width: 1px 0;
6340    box-shadow: -32px 0 0 0 #fff, 32px 0 0 0 #fff;
6341    padding: 8px;
6342    background-color: #fff;
6343    text-align: center;
6344    position: sticky;
6345    top: -5px;
6346    z-index: 1;
6347  }
6348  .editor-block-visibility__disabled-blocks-count ~ .block-editor-block-manager__content .block-editor-block-manager__category-title {
6349    top: 31px;
6350  }
6351  .editor-block-visibility__disabled-blocks-count .is-link {
6352    margin-left: 12px;
6353  }
6354  
6355  .editor-blog-title-dropdown__content .components-popover__content {
6356    min-width: 320px;
6357    padding: 16px;
6358  }
6359  
6360  .editor-document-bar {
6361    display: flex;
6362    align-items: center;
6363    height: 32px;
6364    justify-content: space-between;
6365    min-width: 0;
6366    background: #f0f0f0;
6367    border-radius: 4px;
6368    width: min(100%, 450px);
6369  }
6370  .editor-document-bar:hover {
6371    background-color: #e0e0e0;
6372  }
6373  .editor-document-bar .components-button {
6374    border-radius: 4px;
6375  }
6376  @media not (prefers-reduced-motion) {
6377    .editor-document-bar .components-button {
6378      transition: background-color 0.1s ease-out;
6379    }
6380  }
6381  .editor-document-bar .components-button:hover {
6382    background: #e0e0e0;
6383  }
6384  @media screen and (min-width: 782px) and (max-width: 960px) {
6385    .editor-document-bar.has-back-button .editor-document-bar__post-type-label {
6386      display: none;
6387    }
6388  }
6389  
6390  .editor-document-bar__command {
6391    flex-grow: 1;
6392    color: var(--wp-block-synced-color);
6393    overflow: hidden;
6394  }
6395  
6396  .editor-document-bar__title {
6397    overflow: hidden;
6398    color: #1e1e1e;
6399    margin: 0 auto;
6400    max-width: 70%;
6401  }
6402  .editor-document-bar__title h1 {
6403    display: flex;
6404    align-items: center;
6405    justify-content: center;
6406    font-weight: 400;
6407    white-space: nowrap;
6408    overflow: hidden;
6409  }
6410  
6411  .editor-document-bar__post-title {
6412    color: currentColor;
6413    flex: 1;
6414    overflow: hidden;
6415    text-overflow: ellipsis;
6416  }
6417  
6418  .editor-document-bar__post-type-label {
6419    flex: 0;
6420    color: #2f2f2f;
6421    padding-left: 4px;
6422  }
6423  @media screen and (max-width: 600px) {
6424    .editor-document-bar__post-type-label {
6425      display: none;
6426    }
6427  }
6428  
6429  .editor-document-bar__back.components-button.has-icon.has-text {
6430    min-width: 36px;
6431    flex-shrink: 0;
6432    color: #757575;
6433    gap: 0;
6434    z-index: 1;
6435    position: absolute;
6436  }
6437  .editor-document-bar__back.components-button.has-icon.has-text:hover {
6438    color: #1e1e1e;
6439    background-color: transparent;
6440  }
6441  
6442  .editor-document-bar__icon-layout.editor-document-bar__icon-layout {
6443    position: absolute;
6444    margin-left: 12px;
6445    display: none;
6446    pointer-events: none;
6447  }
6448  .editor-document-bar__icon-layout.editor-document-bar__icon-layout svg {
6449    fill: #949494;
6450  }
6451  @media (min-width: 600px) {
6452    .editor-document-bar__icon-layout.editor-document-bar__icon-layout {
6453      display: flex;
6454    }
6455  }
6456  
6457  .document-outline ul {
6458    margin: 0;
6459    padding: 0;
6460  }
6461  
6462  .document-outline__item {
6463    display: flex;
6464    margin: 4px 0;
6465  }
6466  .document-outline__item a {
6467    text-decoration: none;
6468  }
6469  .document-outline__item .document-outline__emdash::before {
6470    color: #ddd;
6471    margin-right: 4px;
6472  }
6473  .document-outline__item.is-h2 .document-outline__emdash::before {
6474    content: "—";
6475  }
6476  .document-outline__item.is-h3 .document-outline__emdash::before {
6477    content: "——";
6478  }
6479  .document-outline__item.is-h4 .document-outline__emdash::before {
6480    content: "———";
6481  }
6482  .document-outline__item.is-h5 .document-outline__emdash::before {
6483    content: "————";
6484  }
6485  .document-outline__item.is-h6 .document-outline__emdash::before {
6486    content: "—————";
6487  }
6488  
6489  .document-outline__button {
6490    cursor: var(--wpds-cursor-control, pointer);
6491    background: none;
6492    border: none;
6493    display: flex;
6494    align-items: flex-start;
6495    margin: 0 0 0 -1px;
6496    padding: 2px 5px 2px 1px;
6497    color: #1e1e1e;
6498    text-align: left;
6499    border-radius: 2px;
6500  }
6501  .document-outline__button[aria-disabled=true], .document-outline__button:disabled {
6502    cursor: default;
6503    color: #757575;
6504  }
6505  .document-outline__button:focus {
6506    box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
6507    outline: 2px solid transparent;
6508  }
6509  
6510  .document-outline__level {
6511    background: #ddd;
6512    color: #1e1e1e;
6513    border-radius: 3px;
6514    font-size: 13px;
6515    padding: 1px 6px;
6516    margin-right: 4px;
6517  }
6518  .is-invalid .document-outline__level {
6519    background: #f0b849;
6520  }
6521  
6522  .document-outline__item-content {
6523    padding: 1px 0;
6524  }
6525  
6526  .editor-document-outline.has-no-headings > svg {
6527    margin-top: 28px;
6528  }
6529  .editor-document-outline.has-no-headings > p {
6530    padding-left: 32px;
6531    padding-right: 32px;
6532  }
6533  .editor-document-outline.has-no-headings {
6534    text-align: center;
6535    color: #757575;
6536  }
6537  
6538  .editor-document-tools {
6539    display: inline-flex;
6540    align-items: center;
6541  }
6542  .editor-document-tools .editor-document-tools__left > .editor-history__redo,
6543  .editor-document-tools .editor-document-tools__left > .editor-history__undo {
6544    display: none;
6545  }
6546  @media (min-width: 782px) {
6547    .editor-document-tools .editor-document-tools__left > .editor-history__redo,
6548    .editor-document-tools .editor-document-tools__left > .editor-history__undo {
6549      display: inline-flex;
6550    }
6551  }
6552  .editor-document-tools .editor-document-tools__left > .editor-document-tools__inserter-toggle {
6553    display: inline-flex;
6554  }
6555  @media not (prefers-reduced-motion) {
6556    .editor-document-tools .editor-document-tools__left > .editor-document-tools__inserter-toggle svg {
6557      transition: transform cubic-bezier(0.165, 0.84, 0.44, 1) 0.2s;
6558    }
6559  }
6560  .editor-document-tools .editor-document-tools__left > .editor-document-tools__inserter-toggle.is-pressed svg {
6561    transform: rotate(45deg);
6562  }
6563  .editor-document-tools .block-editor-list-view {
6564    display: none;
6565  }
6566  @media (min-width: 600px) {
6567    .editor-document-tools .block-editor-list-view {
6568      display: flex;
6569    }
6570  }
6571  .editor-document-tools .editor-document-tools__left > .components-button.has-icon,
6572  .editor-document-tools .editor-document-tools__left > .components-dropdown > .components-button.has-icon {
6573    height: 32px;
6574    min-width: 32px;
6575    padding: 4px;
6576  }
6577  .editor-document-tools .editor-document-tools__left > .components-button.has-icon.is-pressed,
6578  .editor-document-tools .editor-document-tools__left > .components-dropdown > .components-button.has-icon.is-pressed {
6579    background: #1e1e1e;
6580  }
6581  .editor-document-tools .editor-document-tools__left > .components-button.has-icon:focus:not(:disabled),
6582  .editor-document-tools .editor-document-tools__left > .components-dropdown > .components-button.has-icon:focus:not(:disabled) {
6583    box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color), inset 0 0 0 1px #fff;
6584    outline: 1px solid transparent;
6585  }
6586  .editor-document-tools .editor-document-tools__left > .components-button.has-icon::before,
6587  .editor-document-tools .editor-document-tools__left > .components-dropdown > .components-button.has-icon::before {
6588    display: none;
6589  }
6590  
6591  .editor-document-tools__left {
6592    display: inline-flex;
6593    align-items: center;
6594    gap: 8px;
6595  }
6596  .editor-document-tools__left:not(:last-child) {
6597    margin-inline-end: 8px;
6598  }
6599  
6600  .show-icon-labels .editor-document-tools .editor-document-tools__left > .editor-document-tools__inserter-toggle.has-icon {
6601    width: auto;
6602    padding: 0 8px;
6603  }
6604  
6605  .show-icon-labels .editor-document-tools__left > * + * {
6606    margin-left: 8px;
6607  }
6608  
6609  .editor-editor-interface .entities-saved-states__panel-header {
6610    height: 65px;
6611  }
6612  
6613  .editor-editor-interface .interface-interface-skeleton__content {
6614    isolation: isolate;
6615  }
6616  
6617  .editor-editor-interface .editor-notices {
6618    padding: var(--wpds-dimension-padding-md, 12px);
6619  }
6620  
6621  .editor-visual-editor {
6622    flex: 1 0 auto;
6623  }
6624  
6625  .editor-notices__dismissible,
6626  .editor-notices__pinned {
6627    position: relative;
6628    left: 0;
6629    top: 0;
6630    right: 0;
6631  }
6632  
6633  .entities-saved-states__panel-header {
6634    box-sizing: border-box;
6635    background: #fff;
6636    padding-left: 16px;
6637    padding-right: 16px;
6638    height: 64px;
6639    border-bottom: 1px solid #ddd;
6640  }
6641  
6642  .entities-saved-states__text-prompt {
6643    padding: 16px;
6644    padding-bottom: 4px;
6645  }
6646  .entities-saved-states__text-prompt .entities-saved-states__text-prompt--header {
6647    display: block;
6648    margin-bottom: 12px;
6649  }
6650  
6651  .entities-saved-states__panel.is-inline .entities-saved-states__text-prompt {
6652    padding: 0;
6653  }
6654  .entities-saved-states__panel.is-inline .entities-saved-states__panel-body {
6655    padding-left: 0;
6656    padding-right: 0;
6657    border: 0;
6658  }
6659  .entities-saved-states__panel.is-inline .entities-saved-states__panel-body > h2 {
6660    margin-left: -16px;
6661    margin-right: -16px;
6662    margin-bottom: 0;
6663  }
6664  .entities-saved-states__panel.is-inline .entities-saved-states__panel-body > h2 button {
6665    font-size: 11px;
6666    text-transform: uppercase;
6667  }
6668  .entities-saved-states__panel.is-inline .entities-saved-states__text-prompt--header-wrapper {
6669    display: none;
6670  }
6671  .entities-saved-states__panel.is-inline .entities-saved-states__text-prompt--changes-count {
6672    margin-top: 0;
6673    margin-bottom: 8px;
6674  }
6675  .entities-saved-states__panel.is-inline .entities-saved-states__panel-footer {
6676    margin-top: 16px;
6677  }
6678  
6679  .entities-saved-states__change-control {
6680    flex: 1;
6681  }
6682  
6683  .entities-saved-states__changes {
6684    font-size: 13px;
6685    margin: 4px 16px 0 24px;
6686    list-style: disc;
6687  }
6688  .entities-saved-states__changes li {
6689    margin-bottom: 4px;
6690  }
6691  
6692  .editor-error-boundary {
6693    font-family: -apple-system, system-ui, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
6694    margin: auto;
6695    max-width: 780px;
6696    padding: 1em;
6697    margin-top: 64px;
6698    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.08), 0 15px 27px rgba(0, 0, 0, 0.07), 0 30px 36px rgba(0, 0, 0, 0.04), 0 50px 43px rgba(0, 0, 0, 0.02);
6699    border: 1px solid #1e1e1e;
6700    border-radius: 2px;
6701    background-color: #fff;
6702  }
6703  
6704  .editor-global-styles-header__description {
6705    padding: 0 16px;
6706  }
6707  
6708  .editor-global-styles-header {
6709    margin-bottom: 0 !important;
6710  }
6711  
6712  .editor-global-styles-sidebar {
6713    display: flex;
6714    flex-direction: column;
6715    min-height: 100%;
6716  }
6717  .editor-global-styles-sidebar__panel {
6718    flex: 1;
6719  }
6720  
6721  .editor-global-styles-sidebar .editor-global-styles-sidebar__header-title {
6722    margin: 0;
6723  }
6724  
6725  .editor-global-styles-sidebar .editor-global-styles-sidebar__header-actions {
6726    flex: 1;
6727  }
6728  
6729  .editor-global-styles-sidebar .block-editor-panel-color-gradient-settings {
6730    border: 0;
6731  }
6732  
6733  .editor-global-styles-sidebar .single-column {
6734    grid-column: span 1;
6735  }
6736  
6737  .editor-global-styles-sidebar .components-tools-panel .span-columns {
6738    grid-column: 1/-1;
6739  }
6740  
6741  .editor-global-styles-sidebar__blocks-group {
6742    padding-top: 24px;
6743    border-top: 1px solid #e0e0e0;
6744  }
6745  
6746  .editor-global-styles-sidebar__blocks-group-help {
6747    padding: 0 16px;
6748  }
6749  
6750  .global-styles-ui-color-palette-panel,
6751  .global-styles-ui-gradient-palette-panel {
6752    padding: 16px;
6753  }
6754  
6755  .editor-global-styles-sidebar hr {
6756    margin: 0;
6757  }
6758  
6759  .show-icon-labels .editor-global-styles-sidebar__header .components-button.has-icon {
6760    width: auto;
6761  }
6762  .show-icon-labels .editor-global-styles-sidebar__header .components-button.has-icon svg {
6763    display: none;
6764  }
6765  .show-icon-labels .editor-global-styles-sidebar__header .components-button.has-icon::after {
6766    content: attr(aria-label);
6767    font-size: 12px;
6768  }
6769  
6770  .editor-welcome-guide {
6771    width: 312px;
6772  }
6773  .editor-welcome-guide.guide-styles .editor-welcome-guide__image {
6774    background: #00a0d2;
6775  }
6776  .editor-welcome-guide__image {
6777    margin: 0 0 16px;
6778  }
6779  .editor-welcome-guide__image > img {
6780    display: block;
6781    max-width: 100%;
6782    -o-object-fit: cover;
6783       object-fit: cover;
6784  }
6785  .editor-welcome-guide__heading {
6786    font-family: -apple-system, system-ui, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
6787    font-size: 24px;
6788    line-height: 1.4;
6789    margin: 16px 0 16px 0;
6790    padding: 0 32px;
6791  }
6792  .editor-welcome-guide__text {
6793    font-size: 13px;
6794    line-height: 1.4;
6795    margin: 0 0 16px 0;
6796    padding: 0 32px;
6797  }
6798  .editor-welcome-guide__text img {
6799    vertical-align: bottom;
6800  }
6801  .editor-welcome-guide .components-button:hover svg {
6802    fill: #fff;
6803  }
6804  
6805  .editor-header {
6806    box-sizing: border-box;
6807  }
6808  .editor-header *,
6809  .editor-header *::before,
6810  .editor-header *::after {
6811    box-sizing: inherit;
6812  }
6813  .editor-header {
6814    height: 64px;
6815    background: #fff;
6816    display: grid;
6817    grid-auto-flow: row;
6818    grid-template: auto/32px minmax(0, max-content) minmax(min-content, 1fr) 64px;
6819  }
6820  .editor-header:has(> .editor-header__center) {
6821    grid-template: auto/32px min-content 1fr min-content 64px;
6822  }
6823  @media (min-width: 782px) {
6824    .editor-header:has(> .editor-header__center) {
6825      grid-template: auto/32px minmax(min-content, 2fr) 2.5fr minmax(min-content, 2fr) 64px;
6826    }
6827  }
6828  @media (min-width: 480px) {
6829    .editor-header {
6830      gap: 16px;
6831    }
6832  }
6833  .editor-header {
6834    align-items: center;
6835    max-width: 100vw;
6836    justify-content: space-between;
6837  }
6838  @media (min-width: 280px) {
6839    .editor-header {
6840      flex-wrap: nowrap;
6841    }
6842  }
6843  
6844  .editor-header__back-button {
6845    padding-left: 8px;
6846  }
6847  
6848  .editor-header__toolbar {
6849    grid-column: 1/3;
6850  }
6851  .editor-header__toolbar > :first-child {
6852    margin-inline: 16px 0;
6853  }
6854  .editor-header__back-button + .editor-header__toolbar {
6855    grid-column: 2/3;
6856  }
6857  @media (min-width: 480px) {
6858    .editor-header__back-button + .editor-header__toolbar > :first-child {
6859      margin-inline: 0;
6860    }
6861  }
6862  .editor-header__toolbar {
6863    display: flex;
6864    min-width: 0;
6865    align-items: center;
6866    clip-path: inset(-2px);
6867  }
6868  @media (min-width: 480px) {
6869    .editor-header__toolbar {
6870      clip-path: none;
6871    }
6872  }
6873  .editor-header__toolbar .table-of-contents {
6874    display: none;
6875  }
6876  @media (min-width: 600px) {
6877    .editor-header__toolbar .table-of-contents {
6878      display: block;
6879    }
6880  }
6881  .editor-header__toolbar .editor-collapsible-block-toolbar {
6882    margin-inline: 8px 0;
6883  }
6884  .editor-header__toolbar .editor-collapsible-block-toolbar.is-collapsed ~ .editor-collapsible-block-toolbar__toggle {
6885    margin-inline: 8px 0;
6886  }
6887  
6888  .editor-header__center {
6889    grid-column: 3/4;
6890    display: flex;
6891    justify-content: center;
6892    align-items: center;
6893    min-width: 0;
6894  }
6895  @media (max-width: 479px) {
6896    .editor-header__center > :first-child {
6897      margin-inline-start: 8px;
6898    }
6899    .editor-header__center > :last-child {
6900      margin-inline-end: 8px;
6901    }
6902  }
6903  
6904  /**
6905   * Buttons on the right side
6906   */
6907  .editor-header__settings {
6908    grid-column: 3/-1;
6909  }
6910  .editor-header:has(> .editor-header__center) .editor-header__settings {
6911    grid-column: 4/-1;
6912  }
6913  .editor-header__settings {
6914    justify-self: end;
6915    display: inline-flex;
6916    align-items: center;
6917    flex-wrap: nowrap;
6918    padding-right: 4px;
6919  }
6920  @media (min-width: 600px) {
6921    .editor-header__settings {
6922      padding-right: 8px;
6923    }
6924  }
6925  .editor-header__settings {
6926    gap: 8px;
6927  }
6928  
6929  /**
6930   * Show icon labels.
6931   */
6932  .show-icon-labels.interface-pinned-items .components-button.has-icon,
6933  .show-icon-labels .editor-header .components-button.has-icon {
6934    width: auto;
6935  }
6936  .show-icon-labels.interface-pinned-items .components-button.has-icon svg,
6937  .show-icon-labels .editor-header .components-button.has-icon svg {
6938    display: none;
6939  }
6940  .show-icon-labels.interface-pinned-items .components-button.has-icon::after,
6941  .show-icon-labels .editor-header .components-button.has-icon::after {
6942    content: attr(aria-label);
6943    white-space: nowrap;
6944  }
6945  .show-icon-labels.interface-pinned-items .components-button.has-icon[aria-disabled=true],
6946  .show-icon-labels .editor-header .components-button.has-icon[aria-disabled=true] {
6947    background-color: transparent;
6948  }
6949  .show-icon-labels.interface-pinned-items .is-tertiary:active,
6950  .show-icon-labels .editor-header .is-tertiary:active {
6951    box-shadow: 0 0 0 1.5px var(--wp-admin-theme-color);
6952    background-color: transparent;
6953  }
6954  .show-icon-labels.interface-pinned-items .components-button.has-icon.button-toggle svg,
6955  .show-icon-labels .editor-header .components-button.has-icon.button-toggle svg {
6956    display: block;
6957  }
6958  .show-icon-labels.interface-pinned-items .components-button.has-icon.button-toggle::after,
6959  .show-icon-labels .editor-header .components-button.has-icon.button-toggle::after {
6960    content: none;
6961  }
6962  .show-icon-labels.interface-pinned-items .components-menu-items-choice .components-menu-items__item-icon.components-menu-items__item-icon,
6963  .show-icon-labels .editor-header .components-menu-items-choice .components-menu-items__item-icon.components-menu-items__item-icon {
6964    display: block;
6965  }
6966  .show-icon-labels.interface-pinned-items .editor-document-tools__inserter-toggle.editor-document-tools__inserter-toggle,
6967  .show-icon-labels.interface-pinned-items .interface-pinned-items .components-button,
6968  .show-icon-labels .editor-header .editor-document-tools__inserter-toggle.editor-document-tools__inserter-toggle,
6969  .show-icon-labels .editor-header .interface-pinned-items .components-button {
6970    padding-left: 8px;
6971    padding-right: 8px;
6972  }
6973  @media (min-width: 600px) {
6974    .show-icon-labels.interface-pinned-items .editor-document-tools__inserter-toggle.editor-document-tools__inserter-toggle,
6975    .show-icon-labels.interface-pinned-items .interface-pinned-items .components-button,
6976    .show-icon-labels .editor-header .editor-document-tools__inserter-toggle.editor-document-tools__inserter-toggle,
6977    .show-icon-labels .editor-header .interface-pinned-items .components-button {
6978      padding-left: 12px;
6979      padding-right: 12px;
6980    }
6981  }
6982  .show-icon-labels.interface-pinned-items .editor-post-save-draft.editor-post-save-draft::after,
6983  .show-icon-labels.interface-pinned-items .editor-post-saved-state.editor-post-saved-state::after,
6984  .show-icon-labels .editor-header .editor-post-save-draft.editor-post-save-draft::after,
6985  .show-icon-labels .editor-header .editor-post-saved-state.editor-post-saved-state::after {
6986    content: none;
6987  }
6988  
6989  .show-icon-labels .editor-header__toolbar .block-editor-block-mover {
6990    border-left: none;
6991  }
6992  .show-icon-labels .editor-header__toolbar .block-editor-block-mover::before {
6993    content: "";
6994    width: 1px;
6995    height: 24px;
6996    background-color: #ddd;
6997    margin-top: 4px;
6998    margin-left: 8px;
6999  }
7000  .show-icon-labels .editor-header__toolbar .block-editor-block-mover .block-editor-block-mover__move-button-container::before {
7001    width: calc(100% - 24px);
7002    background: #ddd;
7003    left: calc(50% + 1px);
7004  }
7005  
7006  .show-icon-labels.interface-pinned-items {
7007    padding: 6px 12px 12px;
7008    margin-top: 0;
7009    margin-bottom: 0;
7010    margin-left: -12px;
7011    margin-right: -12px;
7012    border-bottom: 1px solid #ccc;
7013    display: block;
7014  }
7015  .show-icon-labels.interface-pinned-items > .components-button.has-icon {
7016    margin: 0;
7017    padding: 6px 6px 6px 8px;
7018    width: 14.625rem;
7019    justify-content: flex-start;
7020  }
7021  .show-icon-labels.interface-pinned-items > .components-button.has-icon[aria-expanded=true] svg {
7022    display: block;
7023    max-width: 24px;
7024  }
7025  .show-icon-labels.interface-pinned-items > .components-button.has-icon[aria-expanded=false] {
7026    padding-left: 40px;
7027  }
7028  .show-icon-labels.interface-pinned-items > .components-button.has-icon svg {
7029    margin-right: 8px;
7030  }
7031  
7032  @media (min-width: 480px) {
7033    .editor-header__post-preview-button {
7034      display: none;
7035    }
7036  }
7037  
7038  .editor-editor-interface.is-distraction-free .interface-interface-skeleton__header {
7039    border-bottom: none;
7040  }
7041  .editor-editor-interface.is-distraction-free .editor-header {
7042    background-color: #fff;
7043    width: 100%;
7044  }
7045  @media (min-width: 782px) {
7046    .editor-editor-interface.is-distraction-free .editor-header {
7047      box-shadow: 0 1px 0 0 rgba(0, 0, 0, 0.133);
7048      position: absolute;
7049    }
7050  }
7051  .editor-editor-interface.is-distraction-free .editor-header > .edit-post-header__settings > .edit-post-header__post-preview-button {
7052    visibility: hidden;
7053  }
7054  .editor-editor-interface.is-distraction-free .editor-header > .editor-header__toolbar .editor-document-tools__document-overview-toggle, .editor-editor-interface.is-distraction-free .editor-header > .editor-header__settings > .editor-preview-dropdown, .editor-editor-interface.is-distraction-free .editor-header > .editor-header__settings > .interface-pinned-items, .editor-editor-interface.is-distraction-free .editor-header > .editor-header__settings > .editor-zoom-out-toggle {
7055    display: none;
7056  }
7057  .editor-editor-interface.is-distraction-free .interface-interface-skeleton__header:focus-within {
7058    opacity: 1 !important;
7059  }
7060  .editor-editor-interface.is-distraction-free .interface-interface-skeleton__header:focus-within div {
7061    transform: translateX(0) translateZ(0) !important;
7062  }
7063  .editor-editor-interface.is-distraction-free .components-editor-notices__dismissible {
7064    position: absolute;
7065    z-index: 35;
7066  }
7067  
7068  .components-popover.more-menu-dropdown__content {
7069    z-index: 99998;
7070  }
7071  
7072  .editor-inserter-sidebar {
7073    box-sizing: border-box;
7074  }
7075  .editor-inserter-sidebar *,
7076  .editor-inserter-sidebar *::before,
7077  .editor-inserter-sidebar *::after {
7078    box-sizing: inherit;
7079  }
7080  .editor-inserter-sidebar {
7081    height: 100%;
7082    display: flex;
7083    flex-direction: column;
7084  }
7085  
7086  .editor-inserter-sidebar__content {
7087    height: 100%;
7088  }
7089  
7090  .editor-keyboard-shortcut-help-modal__section {
7091    margin: 0 0 2rem 0;
7092  }
7093  .editor-keyboard-shortcut-help-modal__section-title {
7094    font-size: 0.9rem;
7095    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
7096  }
7097  .editor-keyboard-shortcut-help-modal__shortcut {
7098    display: flex;
7099    align-items: baseline;
7100    padding: 0.6rem 0;
7101    border-top: 1px solid #ddd;
7102    margin-bottom: 0;
7103  }
7104  .editor-keyboard-shortcut-help-modal__shortcut:last-child {
7105    border-bottom: 1px solid #ddd;
7106  }
7107  .editor-keyboard-shortcut-help-modal__shortcut:empty {
7108    display: none;
7109  }
7110  .editor-keyboard-shortcut-help-modal__shortcut-term {
7111    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
7112    margin: 0 0 0 1rem;
7113    text-align: right;
7114  }
7115  .editor-keyboard-shortcut-help-modal__shortcut-description {
7116    flex: 1;
7117    margin: 0;
7118  }
7119  .editor-keyboard-shortcut-help-modal__shortcut-key-combination {
7120    display: block;
7121    background: none;
7122    margin: 0;
7123    padding: 0;
7124  }
7125  .editor-keyboard-shortcut-help-modal__shortcut-key-combination + .editor-keyboard-shortcut-help-modal__shortcut-key-combination {
7126    margin-top: 10px;
7127  }
7128  .editor-keyboard-shortcut-help-modal__shortcut-key {
7129    padding: 0.25rem 0.5rem;
7130    border-radius: 8%;
7131    margin: 0 0.2rem 0 0.2rem;
7132  }
7133  .editor-keyboard-shortcut-help-modal__shortcut-key:last-child {
7134    margin: 0 0 0 0.2rem;
7135  }
7136  
7137  .editor-list-view-sidebar {
7138    height: 100%;
7139  }
7140  @media (min-width: 782px) {
7141    .editor-list-view-sidebar {
7142      width: 350px;
7143    }
7144  }
7145  
7146  .editor-list-view-sidebar__list-view-panel-content,
7147  .editor-list-view-sidebar__list-view-container > .document-outline {
7148    height: 100%;
7149  }
7150  .editor-list-view-sidebar__list-view-panel-content::-webkit-scrollbar,
7151  .editor-list-view-sidebar__list-view-container > .document-outline::-webkit-scrollbar {
7152    width: 12px;
7153    height: 12px;
7154  }
7155  .editor-list-view-sidebar__list-view-panel-content::-webkit-scrollbar-track,
7156  .editor-list-view-sidebar__list-view-container > .document-outline::-webkit-scrollbar-track {
7157    background-color: transparent;
7158  }
7159  .editor-list-view-sidebar__list-view-panel-content::-webkit-scrollbar-thumb,
7160  .editor-list-view-sidebar__list-view-container > .document-outline::-webkit-scrollbar-thumb {
7161    background-color: transparent;
7162    border-radius: 8px;
7163    border: 3px solid transparent;
7164    background-clip: padding-box;
7165  }
7166  .editor-list-view-sidebar__list-view-panel-content:hover::-webkit-scrollbar-thumb, .editor-list-view-sidebar__list-view-panel-content:focus::-webkit-scrollbar-thumb, .editor-list-view-sidebar__list-view-panel-content:focus-within::-webkit-scrollbar-thumb,
7167  .editor-list-view-sidebar__list-view-container > .document-outline:hover::-webkit-scrollbar-thumb,
7168  .editor-list-view-sidebar__list-view-container > .document-outline:focus::-webkit-scrollbar-thumb,
7169  .editor-list-view-sidebar__list-view-container > .document-outline:focus-within::-webkit-scrollbar-thumb {
7170    background-color: #949494;
7171  }
7172  .editor-list-view-sidebar__list-view-panel-content,
7173  .editor-list-view-sidebar__list-view-container > .document-outline {
7174    scrollbar-width: thin;
7175    scrollbar-gutter: stable both-edges;
7176    scrollbar-color: transparent transparent;
7177  }
7178  .editor-list-view-sidebar__list-view-panel-content:hover, .editor-list-view-sidebar__list-view-panel-content:focus, .editor-list-view-sidebar__list-view-panel-content:focus-within,
7179  .editor-list-view-sidebar__list-view-container > .document-outline:hover,
7180  .editor-list-view-sidebar__list-view-container > .document-outline:focus,
7181  .editor-list-view-sidebar__list-view-container > .document-outline:focus-within {
7182    scrollbar-color: #949494 transparent;
7183  }
7184  .editor-list-view-sidebar__list-view-panel-content,
7185  .editor-list-view-sidebar__list-view-container > .document-outline {
7186    will-change: transform;
7187  }
7188  @media (hover: none) {
7189    .editor-list-view-sidebar__list-view-panel-content,
7190    .editor-list-view-sidebar__list-view-container > .document-outline {
7191      scrollbar-color: #949494 transparent;
7192    }
7193  }
7194  .editor-list-view-sidebar__list-view-panel-content,
7195  .editor-list-view-sidebar__list-view-container > .document-outline {
7196    overflow: auto;
7197    scrollbar-gutter: auto;
7198  }
7199  
7200  .editor-list-view-sidebar__list-view-panel-content {
7201    padding: 4px;
7202  }
7203  
7204  .editor-list-view-sidebar__list-view-container {
7205    display: flex;
7206    flex-direction: column;
7207    height: 100%;
7208  }
7209  .editor-list-view-sidebar__list-view-container > .document-outline {
7210    padding: 16px;
7211  }
7212  
7213  .editor-list-view-sidebar__tab-panel {
7214    height: 100%;
7215  }
7216  
7217  .editor-list-view-sidebar__outline {
7218    display: flex;
7219    flex-direction: column;
7220    gap: 8px;
7221    border-bottom: 1px solid #ddd;
7222    padding: 16px;
7223  }
7224  .editor-list-view-sidebar__outline > div > span:first-child {
7225    width: 90px;
7226    display: inline-block;
7227  }
7228  .editor-list-view-sidebar__outline > div > span {
7229    font-size: 12px;
7230    line-height: 1.4;
7231    color: #757575;
7232  }
7233  
7234  .editor-post-parent__panel,
7235  .editor-post-order__panel {
7236    padding-top: 8px;
7237  }
7238  .editor-post-parent__panel .editor-post-panel__row-control > div,
7239  .editor-post-order__panel .editor-post-panel__row-control > div {
7240    width: 100%;
7241  }
7242  
7243  .editor-post-parent__panel-dialog .editor-post-parent,
7244  .editor-post-parent__panel-dialog .editor-post-order,
7245  .editor-post-order__panel-dialog .editor-post-parent,
7246  .editor-post-order__panel-dialog .editor-post-order {
7247    margin: 8px;
7248  }
7249  .editor-post-parent__panel-dialog .components-popover__content,
7250  .editor-post-order__panel-dialog .components-popover__content {
7251    min-width: 320px;
7252  }
7253  
7254  .editor-post-author__panel {
7255    padding-top: 8px;
7256  }
7257  
7258  .editor-post-author__panel .editor-post-panel__row-control > div {
7259    width: 100%;
7260  }
7261  
7262  .editor-post-author__panel-dialog .editor-post-author {
7263    min-width: 248px;
7264    margin: 8px;
7265  }
7266  
7267  .editor-action-modal {
7268    z-index: 1000001;
7269  }
7270  
7271  .editor-post-card-panel__content {
7272    flex-grow: 1;
7273  }
7274  .editor-post-card-panel__title {
7275    width: 100%;
7276  }
7277  .editor-post-card-panel__title.editor-post-card-panel__title {
7278    font-family: -apple-system, system-ui, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
7279    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
7280    font-size: 13px;
7281    line-height: 20px;
7282    margin: 0;
7283    display: flex;
7284    align-items: center;
7285    flex-wrap: wrap;
7286    -moz-column-gap: 8px;
7287         column-gap: 8px;
7288    row-gap: 4px;
7289    word-break: break-word;
7290  }
7291  .editor-post-card-panel__icon {
7292    flex: 0 0 24px;
7293    width: 24px;
7294    height: 24px;
7295  }
7296  .editor-post-card-panel__header {
7297    display: flex;
7298    justify-content: space-between;
7299  }
7300  .editor-post-card-panel.has-description .editor-post-card-panel__header {
7301    margin-bottom: 8px;
7302  }
7303  .editor-post-card-panel .editor-post-card-panel__title-name {
7304    padding: 2px 0;
7305  }
7306  .editor-post-card-panel .editor-post-card-panel__description {
7307    color: #757575;
7308  }
7309  
7310  .editor-post-content-information {
7311    color: #757575;
7312  }
7313  .editor-post-content-information .components-text {
7314    color: inherit;
7315  }
7316  
7317  .editor-post-discussion__panel-dialog .editor-post-discussion {
7318    min-width: 248px;
7319    margin: 8px;
7320  }
7321  
7322  .editor-post-discussion__panel-toggle .components-text {
7323    color: inherit;
7324  }
7325  
7326  .editor-post-discussion__panel-dialog .components-popover__content {
7327    min-width: 320px;
7328  }
7329  
7330  .editor-post-excerpt__textarea {
7331    width: 100%;
7332    margin-bottom: 10px;
7333  }
7334  
7335  .editor-post-excerpt__dropdown__content .components-popover__content {
7336    min-width: 320px;
7337    padding: 16px;
7338  }
7339  
7340  .editor-post-featured-image {
7341    padding: 0;
7342  }
7343  .editor-post-featured-image .hidden {
7344    display: none;
7345  }
7346  .editor-post-featured-image .components-spinner {
7347    position: absolute;
7348    top: 50%;
7349    left: 50%;
7350    margin-top: -9px;
7351    margin-left: -9px;
7352  }
7353  
7354  .editor-post-featured-image__container {
7355    position: relative;
7356  }
7357  .editor-post-featured-image__container:hover .editor-post-featured-image__actions:not(.editor-post-featured-image__actions-is-requesting-image), .editor-post-featured-image__container:focus .editor-post-featured-image__actions:not(.editor-post-featured-image__actions-is-requesting-image), .editor-post-featured-image__container:focus-within .editor-post-featured-image__actions:not(.editor-post-featured-image__actions-is-requesting-image) {
7358    opacity: 1;
7359  }
7360  .editor-post-featured-image__container .editor-post-featured-image__actions.editor-post-featured-image__actions-missing-image {
7361    opacity: 1;
7362    margin-top: 16px;
7363  }
7364  .editor-post-featured-image__container .components-drop-zone__content {
7365    border-radius: 2px;
7366  }
7367  .editor-post-featured-image__container:has(.editor-post-featured-image__toggle) .components-drop-zone .components-drop-zone__content-inner {
7368    display: flex;
7369    align-items: center;
7370    gap: 8px;
7371  }
7372  .editor-post-featured-image__container:has(.editor-post-featured-image__toggle) .components-drop-zone .components-drop-zone__content-inner .components-drop-zone__content-icon {
7373    margin: 0;
7374  }
7375  
7376  .editor-post-featured-image__toggle,
7377  .editor-post-featured-image__preview {
7378    width: 100%;
7379    padding: 0;
7380    border-color: #ccc;
7381    overflow: hidden;
7382    outline-offset: -1px;
7383    min-height: 40px;
7384    display: flex;
7385    justify-content: center;
7386  }
7387  
7388  .editor-post-featured-image__preview {
7389    height: auto !important;
7390    outline: 1px solid rgba(0, 0, 0, 0.1);
7391    /*rtl:begin:ignore*/
7392    background-image: repeating-linear-gradient(45deg, #e0e0e0 25%, transparent 25%, transparent 75%, #e0e0e0 75%, #e0e0e0), repeating-linear-gradient(45deg, #e0e0e0 25%, transparent 25%, transparent 75%, #e0e0e0 75%, #e0e0e0);
7393    background-position: 0 0, 12px 12px;
7394    /*rtl:end:ignore*/
7395    background-size: 24px 24px;
7396  }
7397  .editor-post-featured-image__preview .editor-post-featured-image__preview-image {
7398    -o-object-fit: cover;
7399       object-fit: cover;
7400    width: 100%;
7401    -o-object-position: 50% 50%;
7402       object-position: 50% 50%;
7403    aspect-ratio: 2/1;
7404  }
7405  
7406  .editor-post-featured-image__actions:not(.editor-post-featured-image__actions-missing-image) {
7407    bottom: 0;
7408    opacity: 0;
7409    padding: 8px;
7410    position: absolute;
7411  }
7412  @media not (prefers-reduced-motion) {
7413    .editor-post-featured-image__actions:not(.editor-post-featured-image__actions-missing-image) {
7414      transition: opacity 50ms ease-out;
7415    }
7416  }
7417  .editor-post-featured-image__actions:not(.editor-post-featured-image__actions-missing-image) .editor-post-featured-image__action {
7418    backdrop-filter: blur(16px) saturate(180%);
7419    background: rgba(255, 255, 255, 0.75);
7420  }
7421  .editor-post-featured-image__actions .editor-post-featured-image__action {
7422    flex-grow: 1;
7423    justify-content: center;
7424  }
7425  
7426  [class].editor-post-format__suggestion {
7427    margin: 4px 0 0 0;
7428  }
7429  
7430  .editor-post-format__dialog .editor-post-format__dialog-content {
7431    min-width: 248px;
7432    margin: 8px;
7433  }
7434  
7435  .editor-post-last-edited-panel {
7436    color: #757575;
7437  }
7438  .editor-post-last-edited-panel .components-text {
7439    color: inherit;
7440  }
7441  
7442  .editor-post-last-revision__title {
7443    width: 100%;
7444    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
7445  }
7446  
7447  .editor-post-last-revision__title.components-button.has-icon {
7448    height: 100%;
7449    justify-content: space-between;
7450  }
7451  .editor-post-last-revision__title.components-button.has-icon:hover, .editor-post-last-revision__title.components-button.has-icon:active {
7452    background: #f0f0f0;
7453  }
7454  .editor-post-last-revision__title.components-button.has-icon:focus {
7455    box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
7456    border-radius: 0;
7457  }
7458  
7459  .components-panel__body.is-opened.editor-post-last-revision__panel {
7460    padding: 0;
7461    height: 48px;
7462  }
7463  .components-panel__body.is-opened.editor-post-last-revision__panel .editor-post-last-revision__title.components-button.components-button {
7464    padding: 16px;
7465  }
7466  
7467  .editor-post-locked-modal__buttons {
7468    margin-top: 24px;
7469  }
7470  
7471  .editor-post-locked-modal__avatar {
7472    border-radius: 50%;
7473    margin-top: 16px;
7474    min-width: initial !important;
7475  }
7476  
7477  .editor-post-panel__row {
7478    width: 100%;
7479    min-height: 32px;
7480    justify-content: flex-start !important;
7481    align-items: flex-start !important;
7482  }
7483  
7484  .editor-post-panel__row-label {
7485    width: 38%;
7486    flex-shrink: 0;
7487    min-height: 32px;
7488    display: flex;
7489    align-items: center;
7490    padding: 6px 0;
7491    line-height: 20px;
7492    hyphens: auto;
7493    word-break: break-word;
7494  }
7495  
7496  .editor-post-panel__row-control {
7497    flex-grow: 1;
7498    min-height: 32px;
7499    display: flex;
7500    align-items: center;
7501  }
7502  .editor-post-panel__row-control .components-button {
7503    max-width: 100%;
7504    text-align: left;
7505    white-space: normal;
7506    text-wrap: balance;
7507    text-wrap: pretty;
7508    height: auto;
7509    min-height: 32px;
7510    font-weight: var(--wpds-typography-font-weight-default, 400);
7511  }
7512  .editor-post-panel__row-control .components-dropdown {
7513    max-width: 100%;
7514  }
7515  
7516  .editor-post-panel__section {
7517    padding: 16px;
7518  }
7519  
7520  .editor-post-publish-panel__content {
7521    min-height: calc(100% - 148px);
7522  }
7523  .editor-post-publish-panel__content > .components-spinner {
7524    display: block;
7525    margin: 100px auto 0;
7526  }
7527  
7528  .editor-post-publish-panel__header {
7529    background: #fff;
7530    padding-left: 16px;
7531    padding-right: 16px;
7532    height: 65px;
7533    border-bottom: 1px solid #ddd;
7534    display: flex;
7535    align-items: center;
7536    align-content: space-between;
7537  }
7538  .editor-post-publish-panel__header .components-button {
7539    width: 100%;
7540    justify-content: center;
7541  }
7542  .editor-post-publish-panel__header .has-icon {
7543    margin-left: auto;
7544    width: auto;
7545  }
7546  
7547  .components-site-card {
7548    display: flex;
7549    align-items: center;
7550    margin: 16px 0;
7551  }
7552  
7553  .components-site-icon {
7554    border: none;
7555    border-radius: 2px;
7556    margin-right: 12px;
7557    flex-shrink: 0;
7558    height: 36px;
7559    width: 36px;
7560  }
7561  
7562  .components-site-name {
7563    display: block;
7564    font-size: 14px;
7565  }
7566  
7567  .components-site-home {
7568    display: block;
7569    color: #757575;
7570    font-size: 12px;
7571    word-break: break-word;
7572  }
7573  
7574  .editor-post-publish-panel__header-publish-button,
7575  .editor-post-publish-panel__header-cancel-button {
7576    flex: 1;
7577  }
7578  @media (min-width: 480px) {
7579    .editor-post-publish-panel__header-publish-button,
7580    .editor-post-publish-panel__header-cancel-button {
7581      max-width: 160px;
7582    }
7583  }
7584  
7585  .editor-post-publish-panel__header-publish-button {
7586    padding-left: 4px;
7587    justify-content: center;
7588  }
7589  
7590  .editor-post-publish-panel__header-cancel-button {
7591    padding-right: 4px;
7592  }
7593  
7594  .editor-post-publish-panel__header-published {
7595    flex-grow: 1;
7596  }
7597  
7598  .editor-post-publish-panel__footer {
7599    padding: 16px;
7600  }
7601  
7602  .components-button.editor-post-publish-panel__toggle.is-primary {
7603    display: inline-flex;
7604    align-items: center;
7605  }
7606  .components-button.editor-post-publish-panel__toggle.is-primary.is-busy .dashicon {
7607    display: none;
7608  }
7609  .components-button.editor-post-publish-panel__toggle.is-primary .dashicon {
7610    margin-right: -4px;
7611  }
7612  
7613  .editor-post-publish-panel__link {
7614    font-weight: 400;
7615    padding-left: 4px;
7616  }
7617  
7618  .editor-post-publish-panel__prepublish {
7619    padding: 16px;
7620  }
7621  .editor-post-publish-panel__prepublish strong {
7622    color: #1e1e1e;
7623  }
7624  .editor-post-publish-panel__prepublish .components-panel__body {
7625    background: #fff;
7626    margin-left: -16px;
7627    margin-right: -16px;
7628  }
7629  .editor-post-publish-panel__prepublish .editor-post-visibility__dialog-legend {
7630    display: none;
7631  }
7632  .editor-post-publish-panel__prepublish .components-panel__body-title .components-button {
7633    align-items: flex-start;
7634    text-wrap: balance;
7635    text-wrap: pretty;
7636  }
7637  
7638  .post-publish-panel__postpublish .components-panel__body {
7639    border-bottom: 1px solid #e0e0e0;
7640    border-top: none;
7641    word-break: break-word;
7642  }
7643  
7644  .post-publish-panel__postpublish-buttons {
7645    display: flex;
7646    align-content: space-between;
7647    flex-wrap: wrap;
7648    gap: 16px;
7649  }
7650  .post-publish-panel__postpublish-buttons .components-button,
7651  .post-publish-panel__postpublish-buttons .components-button.has-icon {
7652    justify-content: center;
7653    flex: 1;
7654    min-width: unset;
7655  }
7656  .post-publish-panel__postpublish-buttons .components-clipboard-button {
7657    width: 100%;
7658  }
7659  
7660  .post-publish-panel__postpublish-post-address-container {
7661    display: flex;
7662    align-items: flex-end;
7663    margin-bottom: 16px;
7664  }
7665  .post-publish-panel__postpublish-post-address-container .post-publish-panel__postpublish-post-address {
7666    flex: 1;
7667  }
7668  .post-publish-panel__postpublish-post-address-container input[readonly] {
7669    padding: 12px;
7670    background: #f0f0f0;
7671    border-color: #ccc;
7672    overflow: hidden;
7673    text-overflow: ellipsis;
7674    height: 36px;
7675  }
7676  
7677  .post-publish-panel__postpublish-post-address__copy-button-wrap {
7678    flex-shrink: 0;
7679    margin-left: 16px;
7680  }
7681  
7682  .post-publish-panel__postpublish-header {
7683    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
7684  }
7685  
7686  .post-publish-panel__postpublish-subheader {
7687    margin: 0 0 8px;
7688  }
7689  
7690  .post-publish-panel__tip {
7691    color: #f0b849;
7692  }
7693  
7694  @media screen and (max-width: 782px) {
7695    .post-publish-panel__postpublish-post-address__button-wrap .components-button {
7696      height: 40px;
7697    }
7698  }
7699  .editor-post-publish-panel {
7700    box-sizing: border-box;
7701  }
7702  .editor-post-publish-panel *,
7703  .editor-post-publish-panel *::before,
7704  .editor-post-publish-panel *::after {
7705    box-sizing: inherit;
7706  }
7707  .editor-post-publish-panel {
7708    position: fixed;
7709    z-index: 100001;
7710    background: #fff;
7711    top: 46px;
7712    bottom: 0;
7713    right: 0;
7714    left: 0;
7715    overflow: auto;
7716  }
7717  @media (min-width: 782px) {
7718    .editor-post-publish-panel {
7719      z-index: 99998;
7720      top: 32px;
7721      left: auto;
7722      width: 281px;
7723      border-left: 1px solid #ddd;
7724    }
7725  }
7726  @media (min-width: 782px) and (not (prefers-reduced-motion)) {
7727    .editor-post-publish-panel {
7728      transform: translateX(100%);
7729      animation: editor-post-publish-panel__slide-in-animation 0.1s forwards;
7730    }
7731  }
7732  @media (min-width: 782px) {
7733    body.is-fullscreen-mode .editor-post-publish-panel {
7734      top: var(--wp-admin--admin-bar--height, 0);
7735    }
7736    [role=region]:focus .editor-post-publish-panel {
7737      transform: translateX(0%);
7738    }
7739  }
7740  
7741  @keyframes editor-post-publish-panel__slide-in-animation {
7742    100% {
7743      transform: translateX(0%);
7744    }
7745  }
7746  .editor-revisions-header__slider {
7747    width: 100%;
7748  }
7749  .editor-revisions-header__slider .components-range-control__tooltip {
7750    white-space: nowrap;
7751  }
7752  
7753  .editor-revisions-header__no-revisions {
7754    color: #757575;
7755    font-size: 13px;
7756  }
7757  
7758  .editor-revisions-canvas__loading {
7759    display: flex;
7760    align-items: center;
7761    justify-content: center;
7762    height: 100%;
7763  }
7764  
7765  .editor-revisions-canvas__content {
7766    display: flex;
7767    height: 100%;
7768  }
7769  .editor-revisions-canvas__content .editor-visual-editor {
7770    flex: 1;
7771    min-width: 0;
7772  }
7773  
7774  .revision-diff-markers {
7775    position: relative;
7776    flex-shrink: 0;
7777    width: max(16px, 1rem);
7778    background: rgba(0, 0, 0, 0.05);
7779  }
7780  .revision-diff-markers .revision-diff-marker {
7781    position: absolute;
7782    width: 100%;
7783    min-height: 4px;
7784    border: none;
7785    padding: 0;
7786    cursor: var(--wpds-cursor-control, pointer);
7787    transition: opacity 0.1s ease;
7788  }
7789  .revision-diff-markers .revision-diff-marker.is-added {
7790    background: #008a20;
7791  }
7792  .revision-diff-markers .revision-diff-marker.is-removed {
7793    background: repeating-linear-gradient(45deg, #d63638, #d63638 6px, rgba(214, 54, 56, 0.45) 6px, rgba(214, 54, 56, 0.45) 8px);
7794  }
7795  .revision-diff-markers .revision-diff-marker.is-modified {
7796    background: repeating-linear-gradient(-45deg, #9a7000, #9a7000 6px, rgba(154, 112, 0, 0.45) 6px, rgba(154, 112, 0, 0.45) 8px);
7797  }
7798  .revision-diff-markers .revision-diff-marker:hover {
7799    opacity: 0.7;
7800  }
7801  .revision-diff-markers .revision-diff-marker:focus {
7802    outline: 2px solid #1e1e1e;
7803    outline-offset: -2px;
7804  }
7805  
7806  .interface-complementary-area:has(.editor-post-revisions-timeline) {
7807    display: flex;
7808    flex-direction: column;
7809    overflow: hidden;
7810  }
7811  .interface-complementary-area:has(.editor-post-revisions-timeline) .editor-sidebar__panel-tabs {
7812    flex-shrink: 0;
7813  }
7814  
7815  .editor-sidebar__panel:has(.editor-post-revisions-timeline) {
7816    display: flex;
7817    flex-direction: column;
7818    flex: 1;
7819    min-height: 0;
7820  }
7821  .editor-sidebar__panel:has(.editor-post-revisions-timeline) [role=tabpanel]:has(.editor-post-revisions-timeline) {
7822    display: flex;
7823    flex-direction: column;
7824    flex: 1;
7825    min-height: 0;
7826  }
7827  .editor-sidebar__panel:has(.editor-post-revisions-timeline) .editor-revision-meta-diff__content {
7828    max-height: 80px;
7829    overflow-y: auto;
7830  }
7831  .editor-sidebar__panel:has(.editor-post-revisions-timeline) .editor-post-revisions-timeline {
7832    flex: 1;
7833    min-height: 0;
7834  }
7835  
7836  .editor-revision-fields-diff__value {
7837    word-break: break-word;
7838  }
7839  
7840  .editor-revision-fields-diff__added {
7841    background-color: color-mix(in srgb, currentColor 5%, #00a32a 15%);
7842    text-decoration: none;
7843  }
7844  
7845  .editor-revision-fields-diff__removed {
7846    text-decoration: line-through;
7847    color: #d63638;
7848  }
7849  
7850  .editor-post-saved-state {
7851    display: flex;
7852    align-items: center;
7853    width: 28px;
7854    padding: 12px 4px;
7855    color: #757575;
7856    overflow: hidden;
7857    white-space: nowrap;
7858  }
7859  .editor-post-saved-state.is-saving[aria-disabled=true], .editor-post-saved-state.is-saving[aria-disabled=true]:hover, .editor-post-saved-state.is-saved[aria-disabled=true], .editor-post-saved-state.is-saved[aria-disabled=true]:hover {
7860    background: transparent;
7861    color: #757575;
7862  }
7863  .editor-post-saved-state svg {
7864    display: inline-block;
7865    flex: 0 0 auto;
7866    fill: currentColor;
7867    margin-right: 8px;
7868  }
7869  @media (min-width: 600px) {
7870    .editor-post-saved-state {
7871      width: auto;
7872      padding: 8px 12px;
7873      text-indent: inherit;
7874    }
7875    .editor-post-saved-state svg {
7876      margin-right: 0;
7877    }
7878  }
7879  
7880  .editor-post-save-draft.has-text.has-icon svg {
7881    margin-right: 0;
7882  }
7883  
7884  .editor-post-schedule__panel-dropdown {
7885    width: 100%;
7886  }
7887  
7888  .editor-post-schedule__dialog .components-popover__content {
7889    min-width: 320px;
7890    padding: 16px;
7891  }
7892  
7893  .editor-post-status {
7894    max-width: 100%;
7895  }
7896  .editor-post-status.is-read-only {
7897    padding: 6px 12px;
7898  }
7899  .editor-post-status .editor-post-status__toggle.editor-post-status__toggle {
7900    padding-top: 4px;
7901    padding-bottom: 4px;
7902  }
7903  
7904  .editor-change-status__password-fieldset,
7905  .editor-change-status__publish-date-wrapper {
7906    border-top: 1px solid #e0e0e0;
7907    padding-top: 16px;
7908  }
7909  
7910  .editor-change-status__content .components-popover__content {
7911    min-width: 320px;
7912    padding: 16px;
7913  }
7914  .editor-change-status__content .editor-change-status__password-legend {
7915    padding: 0;
7916    margin-bottom: 8px;
7917  }
7918  .editor-change-status__content p.components-base-control__help:has(.components-checkbox-control__help) {
7919    margin-top: 4px;
7920  }
7921  
7922  .editor-post-sticky__checkbox-control {
7923    border-top: 1px solid #e0e0e0;
7924    padding-top: 16px;
7925  }
7926  
7927  .editor-post-sync-status__value {
7928    padding: 6px 0 6px 12px;
7929  }
7930  
7931  .editor-post-taxonomies__hierarchical-terms-list {
7932    max-height: 14em;
7933    overflow: auto;
7934    margin-left: -6px;
7935    padding-left: 6px;
7936    margin-top: -6px;
7937    padding-top: 6px;
7938  }
7939  
7940  .editor-post-taxonomies__hierarchical-terms-choice {
7941    margin-bottom: 8px;
7942  }
7943  .editor-post-taxonomies__hierarchical-terms-choice:last-child {
7944    margin-bottom: 4px;
7945  }
7946  
7947  .editor-post-taxonomies__hierarchical-terms-subchoices {
7948    margin-top: 8px;
7949    margin-left: 16px;
7950  }
7951  
7952  .editor-post-taxonomies__flat-term-most-used .editor-post-taxonomies__flat-term-most-used-label {
7953    margin-bottom: 4px;
7954  }
7955  
7956  .editor-post-taxonomies__flat-term-most-used-list {
7957    margin: 0;
7958  }
7959  .editor-post-taxonomies__flat-term-most-used-list li {
7960    display: inline-block;
7961    margin-right: 8px;
7962  }
7963  
7964  .editor-sync-connection-error-modal {
7965    z-index: 1000001;
7966  }
7967  
7968  .editor-sync-connection-error-modal p {
7969    margin: 0;
7970  }
7971  
7972  .editor-sync-connection-error-modal__retry-countdown {
7973    color: #757575;
7974  }
7975  
7976  .editor-post-template__swap-template-modal {
7977    z-index: 1000001;
7978  }
7979  .editor-post-template__swap-template-modal .editor-post-template__swap-template-search {
7980    background: #fff;
7981    position: sticky;
7982    top: 0;
7983    padding: 16px 0;
7984    transform: translateY(-4px);
7985    margin-bottom: -4px;
7986    z-index: 2;
7987  }
7988  
7989  .editor-post-template__create-template-modal {
7990    z-index: 1000001;
7991  }
7992  
7993  .editor-post-template__swap-template-modal-content .block-editor-block-patterns-list {
7994    -moz-column-count: 2;
7995         column-count: 2;
7996    -moz-column-gap: 24px;
7997         column-gap: 24px;
7998    padding-top: 2px;
7999  }
8000  @media (min-width: 782px) {
8001    .editor-post-template__swap-template-modal-content .block-editor-block-patterns-list {
8002      -moz-column-count: 3;
8003           column-count: 3;
8004    }
8005  }
8006  @media (min-width: 1280px) {
8007    .editor-post-template__swap-template-modal-content .block-editor-block-patterns-list {
8008      -moz-column-count: 4;
8009           column-count: 4;
8010    }
8011  }
8012  .editor-post-template__swap-template-modal-content .block-editor-block-patterns-list .block-editor-block-patterns-list__list-item {
8013    -moz-column-break-inside: avoid;
8014         break-inside: avoid-column;
8015  }
8016  
8017  .editor-post-template__dropdown .components-popover__content {
8018    min-width: 240px;
8019  }
8020  .editor-post-template__dropdown .components-button.is-pressed,
8021  .editor-post-template__dropdown .components-button.is-pressed:hover {
8022    background: inherit;
8023    color: inherit;
8024  }
8025  
8026  .editor-post-template__classic-theme-dropdown {
8027    padding: 8px;
8028  }
8029  
8030  .editor-template-actions-panel__preview .block-editor-block-preview__container {
8031    display: flex;
8032    aspect-ratio: 4/3;
8033    overflow: hidden;
8034    border-radius: 4px;
8035  }
8036  .editor-template-actions-panel__preview .block-editor-block-preview__container::after {
8037    outline: 1px solid rgba(0, 0, 0, 0.1);
8038    outline-offset: -1px;
8039    border-radius: 4px;
8040  }
8041  @media not (prefers-reduced-motion) {
8042    .editor-template-actions-panel__preview .block-editor-block-preview__container::after {
8043      transition: outline 0.1s linear;
8044    }
8045  }
8046  .editor-template-actions-panel__preview[role=button] {
8047    cursor: var(--wpds-cursor-control, pointer);
8048  }
8049  .editor-template-actions-panel__preview[role=button]:hover .block-editor-block-preview__container::after {
8050    outline-color: rgba(0, 0, 0, 0.3);
8051  }
8052  .editor-template-actions-panel__preview[role=button]:focus-visible .block-editor-block-preview__container::after {
8053    outline-color: var(--wp-admin-theme-color);
8054    outline-width: var(--wp-admin-border-width-focus);
8055    outline-offset: calc(-1 * var(--wp-admin-border-width-focus));
8056  }
8057  
8058  .editor-template-actions-panel__action {
8059    flex: 1;
8060    justify-content: center;
8061  }
8062  
8063  textarea.editor-post-text-editor {
8064    border: 1px solid #949494;
8065    border-radius: 0;
8066    display: block;
8067    margin: 0;
8068    width: 100%;
8069    box-shadow: none;
8070    resize: none;
8071    overflow: hidden;
8072    font-family: Menlo, Consolas, monaco, monospace;
8073    line-height: 2.4;
8074    min-height: 200px;
8075  }
8076  @media not (prefers-reduced-motion) {
8077    textarea.editor-post-text-editor {
8078      transition: border 0.1s ease-out, box-shadow 0.1s linear;
8079    }
8080  }
8081  textarea.editor-post-text-editor {
8082    padding: 16px;
8083  }
8084  @media (min-width: 600px) {
8085    textarea.editor-post-text-editor {
8086      padding: 24px;
8087    }
8088  }
8089  textarea.editor-post-text-editor {
8090    /* Fonts smaller than 16px causes mobile safari to zoom. */
8091    font-size: 16px !important;
8092  }
8093  @media (min-width: 600px) {
8094    textarea.editor-post-text-editor {
8095      font-size: 15px !important;
8096    }
8097  }
8098  textarea.editor-post-text-editor:focus {
8099    border-color: var(--wp-admin-theme-color);
8100    box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
8101    position: relative;
8102  }
8103  textarea.editor-post-text-editor::-moz-placeholder {
8104    color: rgba(30, 30, 30, 0.62);
8105  }
8106  textarea.editor-post-text-editor::placeholder {
8107    color: rgba(30, 30, 30, 0.62);
8108  }
8109  
8110  .editor-post-title.is-raw-text {
8111    margin-bottom: 24px;
8112    margin-top: 2px;
8113    max-width: none;
8114  }
8115  
8116  .editor-post-url__panel-dropdown {
8117    width: 100%;
8118  }
8119  
8120  .editor-post-url__panel-dialog .editor-post-url {
8121    min-width: 248px;
8122    margin: 8px;
8123  }
8124  
8125  /* rtl:begin:ignore */
8126  .editor-post-url__link,
8127  .editor-post-url__front-page-link {
8128    direction: ltr;
8129    word-break: break-word;
8130  }
8131  
8132  /* rtl:end:ignore */
8133  .editor-post-url__front-page-link {
8134    padding: 6px 12px;
8135    border-radius: 2px;
8136    color: var(--wp-admin-theme-color);
8137  }
8138  .editor-post-url__front-page-link:hover {
8139    background: color-mix(in srgb, var(--wp-admin-theme-color) 4%, transparent);
8140    color: var(--wp-admin-theme-color-darker-20, #183ad6);
8141  }
8142  .editor-post-url__front-page-link:focus {
8143    box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
8144    color: var(--wp-admin-theme-color);
8145    outline: 3px solid rgba(0, 0, 0, 0);
8146  }
8147  
8148  .editor-post-url__link-slug {
8149    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
8150  }
8151  
8152  .editor-post-url__input input.components-input-control__input {
8153    padding-inline-start: 0 !important;
8154  }
8155  
8156  .editor-post-url__panel-toggle,
8157  .editor-post-parent__panel-toggle {
8158    word-break: break-word;
8159  }
8160  
8161  .editor-post-url__intro {
8162    margin: 0;
8163  }
8164  
8165  .editor-post-url__permalink {
8166    margin-top: 8px;
8167    margin-bottom: 0;
8168  }
8169  .editor-post-url__permalink-visual-label {
8170    display: block;
8171  }
8172  
8173  .editor-posts-per-page-dropdown__content .components-popover__content {
8174    min-width: 320px;
8175    padding: 16px;
8176  }
8177  
8178  .editor-post-trash.components-button {
8179    flex-grow: 1;
8180    justify-content: center;
8181  }
8182  
8183  .editor-preview-dropdown .editor-preview-dropdown__toggle.has-icon.has-text {
8184    padding-right: 4px;
8185    padding-left: 6px;
8186  }
8187  
8188  @media (prefers-reduced-motion: no-preference) {
8189    .editor-resizable-editor:not(.is-resizing) {
8190      transition: width 0.2s ease-out;
8191    }
8192  }
8193  
8194  .editor-resizable-editor.is-resizable {
8195    overflow: visible;
8196    margin: 0 auto;
8197  }
8198  
8199  .editor-resizable-editor__resize-handle {
8200    position: absolute;
8201    top: 0;
8202    bottom: 0;
8203    padding: 0;
8204    margin: auto 0;
8205    width: 12px;
8206    -webkit-appearance: none;
8207       -moz-appearance: none;
8208            appearance: none;
8209    cursor: ew-resize;
8210    outline: none;
8211    background: none;
8212    border-radius: 9999px;
8213    border: 0;
8214    height: 100px;
8215  }
8216  .editor-resizable-editor__resize-handle::after {
8217    position: absolute;
8218    top: 16px;
8219    left: 4px;
8220    right: 0;
8221    bottom: 16px;
8222    content: "";
8223    width: 4px;
8224    background-color: rgba(117, 117, 117, 0.4);
8225    border-radius: 9999px;
8226  }
8227  .editor-resizable-editor__resize-handle.is-left {
8228    left: -18px;
8229  }
8230  .editor-resizable-editor__resize-handle.is-right {
8231    right: -18px;
8232  }
8233  .editor-resizable-editor__resize-handle:hover, .editor-resizable-editor__resize-handle:focus, .editor-resizable-editor__resize-handle:active {
8234    opacity: 1;
8235  }
8236  .editor-resizable-editor__resize-handle:hover::after, .editor-resizable-editor__resize-handle:focus::after, .editor-resizable-editor__resize-handle:active::after {
8237    background-color: var(--wp-admin-theme-color);
8238  }
8239  
8240  .editor-layout__toggle-publish-panel,
8241  .editor-layout__toggle-sidebar-panel,
8242  .editor-layout__toggle-entities-saved-states-panel {
8243    z-index: 100000;
8244    position: fixed !important;
8245    top: -9999em;
8246    bottom: auto;
8247    left: auto;
8248    right: 0;
8249    box-sizing: border-box;
8250    width: 280px;
8251    background-color: #fff;
8252    border: 1px dotted #ddd;
8253    height: auto !important;
8254    padding: 24px;
8255    display: flex;
8256    justify-content: center;
8257  }
8258  
8259  .interface-interface-skeleton__actions:focus .editor-layout__toggle-entities-saved-states-panel, .interface-interface-skeleton__actions:focus-within .editor-layout__toggle-entities-saved-states-panel,
8260  .interface-interface-skeleton__actions:focus .editor-layout__toggle-publish-panel,
8261  .interface-interface-skeleton__actions:focus-within .editor-layout__toggle-publish-panel {
8262    top: auto;
8263    bottom: 0;
8264  }
8265  
8266  .editor-start-page-options__modal .editor-start-page-options__modal__actions {
8267    position: absolute;
8268    bottom: 0;
8269    width: 100%;
8270    height: 72px;
8271    background-color: #fff;
8272    margin-left: -32px;
8273    margin-right: -32px;
8274    padding-left: 32px;
8275    padding-right: 32px;
8276    border-top: 1px solid #ddd;
8277    z-index: 1;
8278  }
8279  .editor-start-page-options__modal .block-editor-block-patterns-list {
8280    padding-bottom: 72px;
8281  }
8282  
8283  .editor-start-page-options__modal-content .block-editor-block-patterns-list {
8284    -moz-column-count: 2;
8285         column-count: 2;
8286    -moz-column-gap: 24px;
8287         column-gap: 24px;
8288  }
8289  @media (min-width: 782px) {
8290    .editor-start-page-options__modal-content .block-editor-block-patterns-list {
8291      -moz-column-count: 3;
8292           column-count: 3;
8293    }
8294  }
8295  @media (min-width: 1280px) {
8296    .editor-start-page-options__modal-content .block-editor-block-patterns-list {
8297      -moz-column-count: 4;
8298           column-count: 4;
8299    }
8300  }
8301  .editor-start-page-options__modal-content .block-editor-block-patterns-list .block-editor-block-patterns-list__list-item {
8302    -moz-column-break-inside: avoid;
8303         break-inside: avoid-column;
8304    margin-bottom: 24px;
8305  }
8306  .editor-start-page-options__modal-content .block-editor-block-patterns-list .block-editor-block-patterns-list__list-item .block-editor-block-preview__container {
8307    min-height: 100px;
8308  }
8309  .editor-start-page-options__modal-content .block-editor-block-patterns-list .block-editor-block-patterns-list__list-item .block-editor-block-preview__content {
8310    width: 100%;
8311  }
8312  
8313  .editor-start-template-options__modal .editor-start-template-options__modal__actions {
8314    position: absolute;
8315    bottom: 0;
8316    width: 100%;
8317    height: 92px;
8318    background-color: #fff;
8319    margin-left: -32px;
8320    margin-right: -32px;
8321    padding-left: 32px;
8322    padding-right: 32px;
8323    border-top: 1px solid #ddd;
8324    z-index: 1;
8325  }
8326  .editor-start-template-options__modal .block-editor-block-patterns-list {
8327    padding-bottom: 92px;
8328  }
8329  
8330  .editor-start-template-options__modal-content .block-editor-block-patterns-list {
8331    -moz-column-count: 2;
8332         column-count: 2;
8333    -moz-column-gap: 24px;
8334         column-gap: 24px;
8335  }
8336  @media (min-width: 782px) {
8337    .editor-start-template-options__modal-content .block-editor-block-patterns-list {
8338      -moz-column-count: 3;
8339           column-count: 3;
8340    }
8341  }
8342  @media (min-width: 1280px) {
8343    .editor-start-template-options__modal-content .block-editor-block-patterns-list {
8344      -moz-column-count: 4;
8345           column-count: 4;
8346    }
8347  }
8348  .editor-start-template-options__modal-content .block-editor-block-patterns-list .block-editor-block-patterns-list__list-item {
8349    -moz-column-break-inside: avoid;
8350         break-inside: avoid-column;
8351  }
8352  .editor-start-template-options__modal-content .block-editor-block-patterns-list .block-editor-block-patterns-list__list-item .block-editor-block-patterns-list__item-title {
8353    display: none;
8354  }
8355  
8356  .components-panel__header.editor-sidebar__panel-tabs {
8357    padding-left: 0;
8358    padding-right: 8px;
8359  }
8360  .components-panel__header.editor-sidebar__panel-tabs .components-button.has-icon {
8361    padding: 0;
8362  }
8363  @media (min-width: 782px) {
8364    .components-panel__header.editor-sidebar__panel-tabs .components-button.has-icon {
8365      display: flex;
8366    }
8367  }
8368  
8369  .editor-post-summary .components-v-stack:empty {
8370    display: none;
8371  }
8372  
8373  .editor-sidebar {
8374    box-sizing: border-box;
8375  }
8376  .editor-sidebar *,
8377  .editor-sidebar *::before,
8378  .editor-sidebar *::after {
8379    box-sizing: inherit;
8380  }
8381  .editor-sidebar__revisions-block-message {
8382    padding: 16px;
8383    color: #757575;
8384    font-size: 13px;
8385  }
8386  
8387  .fields-controls__password {
8388    border-top: 1px solid #e0e0e0;
8389    padding-top: 16px;
8390  }
8391  
8392  .editor-site-discussion-dropdown__content .components-popover__content {
8393    min-width: 320px;
8394    padding: 16px;
8395  }
8396  
8397  .editor-style-book {
8398    height: 100%;
8399  }
8400  .editor-style-book.is-button {
8401    border-radius: 8px;
8402  }
8403  
8404  .editor-style-book__iframe {
8405    display: block;
8406    height: 100%;
8407    width: 100%;
8408  }
8409  .editor-style-book__iframe.is-button {
8410    border-radius: 8px;
8411  }
8412  .editor-style-book__iframe.is-focused {
8413    outline: calc(2 * var(--wp-admin-border-width-focus)) solid var(--wp-admin-theme-color);
8414    outline-offset: calc(-2 * var(--wp-admin-border-width-focus));
8415  }
8416  
8417  .editor-style-book__tabs {
8418    height: 100%;
8419    display: flex;
8420    flex-direction: column;
8421  }
8422  
8423  .editor-style-book__tablist-container {
8424    flex: none;
8425    display: flex;
8426    width: 100%;
8427    padding-right: 56px;
8428    background: #fff;
8429  }
8430  
8431  .editor-style-book__tabpanel {
8432    flex: 1 0 auto;
8433    overflow: auto;
8434  }
8435  
8436  .editor-styles-canvas {
8437    height: 100%;
8438    padding: 24px;
8439    background-color: var(--wp-editor-canvas-background);
8440  }
8441  .editor-styles-canvas iframe {
8442    display: block;
8443    width: 100%;
8444    height: 100%;
8445  }
8446  
8447  .editor-styles-canvas__section {
8448    background: #fff;
8449    bottom: 0;
8450    left: 0;
8451    overflow: hidden;
8452    position: absolute;
8453    right: 0;
8454    top: 0;
8455  }
8456  @media not (prefers-reduced-motion) {
8457    .editor-styles-canvas__section {
8458      transition: all 0.3s;
8459    }
8460  }
8461  
8462  .editor-styles-canvas__close-button {
8463    position: absolute;
8464    right: 8px;
8465    top: 8px;
8466    z-index: 2;
8467    background: #fff;
8468  }
8469  
8470  .table-of-contents__popover.components-popover .components-popover__content {
8471    min-width: 380px;
8472  }
8473  
8474  .components-popover.table-of-contents__popover {
8475    z-index: 99998;
8476  }
8477  
8478  .table-of-contents__popover .components-popover__content {
8479    padding: 16px;
8480  }
8481  @media (min-width: 600px) {
8482    .table-of-contents__popover .components-popover__content {
8483      max-height: calc(100vh - 120px);
8484      overflow-y: auto;
8485    }
8486  }
8487  .table-of-contents__popover hr {
8488    margin: 10px -16px 0;
8489  }
8490  
8491  .table-of-contents__wrapper:focus::before {
8492    content: "";
8493    display: block;
8494    position: absolute;
8495    top: 0;
8496    right: 0;
8497    bottom: 0;
8498    left: 0;
8499    box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
8500    pointer-events: none;
8501  }
8502  
8503  .table-of-contents__counts {
8504    display: flex;
8505    flex-wrap: wrap;
8506    margin: 0;
8507    margin-top: -8px;
8508  }
8509  
8510  .table-of-contents__count {
8511    flex-basis: 33%;
8512    display: flex;
8513    flex-direction: column;
8514    font-size: 13px;
8515    color: #1e1e1e;
8516    padding-right: 8px;
8517    margin-bottom: 0;
8518    margin-top: 8px;
8519  }
8520  .table-of-contents__count:nth-child(4n) {
8521    padding-right: 0;
8522  }
8523  
8524  .table-of-contents__number,
8525  .table-of-contents__popover .word-count {
8526    font-size: 21px;
8527    font-weight: 400;
8528    line-height: 30px;
8529    color: #1e1e1e;
8530  }
8531  
8532  .table-of-contents__title {
8533    display: block;
8534    margin-top: 20px;
8535    font-size: 15px;
8536    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
8537  }
8538  
8539  .editor-text-editor {
8540    box-sizing: border-box;
8541  }
8542  .editor-text-editor *,
8543  .editor-text-editor *::before,
8544  .editor-text-editor *::after {
8545    box-sizing: inherit;
8546  }
8547  .editor-text-editor {
8548    position: relative;
8549    isolation: isolate;
8550    width: 100%;
8551    background-color: #fff;
8552    flex-grow: 1;
8553  }
8554  .editor-text-editor .editor-post-title:not(.is-raw-text),
8555  .editor-text-editor .editor-post-title.is-raw-text textarea {
8556    max-width: none;
8557    line-height: 1.4;
8558    font-family: Menlo, Consolas, monaco, monospace;
8559    font-size: 2.5em;
8560    font-weight: normal;
8561    border: 1px solid #949494;
8562    border-radius: 0;
8563    padding: 16px;
8564  }
8565  @media (min-width: 600px) {
8566    .editor-text-editor .editor-post-title:not(.is-raw-text),
8567    .editor-text-editor .editor-post-title.is-raw-text textarea {
8568      padding: 24px;
8569    }
8570  }
8571  .editor-text-editor .editor-post-title:not(.is-raw-text):focus,
8572  .editor-text-editor .editor-post-title.is-raw-text textarea:focus {
8573    border-color: var(--wp-admin-theme-color);
8574    box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
8575  }
8576  
8577  .editor-text-editor__body {
8578    width: 100%;
8579    padding: 0 12px 12px 12px;
8580    max-width: 1080px;
8581    margin-left: auto;
8582    margin-right: auto;
8583  }
8584  @media (min-width: 960px) {
8585    .editor-text-editor__body {
8586      padding: 0 24px 24px 24px;
8587    }
8588  }
8589  
8590  .editor-text-editor__toolbar {
8591    position: sticky;
8592    z-index: 1;
8593    top: 0;
8594    left: 0;
8595    right: 0;
8596    display: flex;
8597    background: rgba(255, 255, 255, 0.8);
8598    padding: 4px 12px;
8599  }
8600  @media (min-width: 600px) {
8601    .editor-text-editor__toolbar {
8602      padding: 12px;
8603    }
8604  }
8605  @media (min-width: 960px) {
8606    .editor-text-editor__toolbar {
8607      padding: 12px 24px;
8608    }
8609  }
8610  .editor-text-editor__toolbar h2 {
8611    line-height: 40px;
8612    margin: 0 auto 0 0;
8613    font-size: 13px;
8614    color: #1e1e1e;
8615  }
8616  
8617  .editor-upload-progress-snackbar__spinner,
8618  .editor-upload-progress-snackbar__check {
8619    display: inline-flex;
8620    align-items: center;
8621    justify-content: center;
8622    width: 24px;
8623    height: 24px;
8624  }
8625  
8626  .editor-upload-progress-snackbar__spinner .components-spinner {
8627    margin: 0;
8628  }
8629  
8630  .editor-upload-progress-snackbar__check svg {
8631    width: 24px;
8632    height: 24px;
8633    fill: currentColor;
8634  }
8635  
8636  .editor-visual-editor {
8637    position: relative;
8638    display: flex;
8639    max-height: 100%;
8640    background-color: var(--wp-editor-canvas-background);
8641  }
8642  .editor-visual-editor iframe[name=editor-canvas] {
8643    background-color: transparent;
8644  }
8645  .editor-visual-editor {
8646    align-items: center;
8647  }
8648  @media (prefers-reduced-motion: no-preference) {
8649    .editor-visual-editor {
8650      transition: padding 0.2s ease-out;
8651    }
8652  }
8653  .editor-visual-editor.has-vertical-padding {
8654    padding-top: 24px;
8655    padding-bottom: 24px;
8656  }
8657  .editor-visual-editor.has-horizontal-padding {
8658    padding-left: 24px;
8659    padding-right: 24px;
8660  }
8661  .editor-visual-editor {
8662    overflow: hidden;
8663  }
8664  .editor-visual-editor .components-button {
8665    font-family: -apple-system, system-ui, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
8666    font-size: 13px;
8667    padding: 6px 12px;
8668  }
8669  .editor-visual-editor .components-button.is-tertiary, .editor-visual-editor .components-button.has-icon {
8670    padding: 6px;
8671  }
8672  
8673  .editor-fields-content-preview {
8674    display: flex;
8675    flex-direction: column;
8676    height: 100%;
8677    border-radius: 4px;
8678  }
8679  .dataviews-view-table .editor-fields-content-preview {
8680    width: 96px;
8681    flex-grow: 0;
8682  }
8683  .editor-fields-content-preview .block-editor-block-preview__container,
8684  .editor-fields-content-preview .editor-fields-content-preview__empty {
8685    margin-top: auto;
8686    margin-bottom: auto;
8687  }
8688  
8689  .editor-fields-content-preview__empty {
8690    text-align: center;
8691  }
8692  
8693  .editor-push-changes-to-global-styles-control .components-button {
8694    justify-content: center;
8695    width: 100%;
8696  }