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