[ Index ]

PHP Cross Reference of WordPress Trunk (Updated Daily)

Search

title

Body

[close]

/wp-includes/css/dist/block-editor/ -> style.css (source)

   1  /**
   2   * Typography
   3   */
   4  /**
   5   * SCSS Variables.
   6   *
   7   * Please use variables from this sheet to ensure consistency across the UI.
   8   * Don't add to this sheet unless you're pretty sure the value will be reused in many places.
   9   * For example, don't add rules to this sheet that affect block visuals. It's purely for UI.
  10   */
  11  /**
  12   * Colors
  13   */
  14  /**
  15   * Fonts & basic variables.
  16   */
  17  /**
  18   * Typography
  19   */
  20  /**
  21   * Grid System.
  22   * https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/
  23   */
  24  /**
  25   * Radius scale.
  26   */
  27  /**
  28   * Elevation scale.
  29   */
  30  /**
  31   * Dimensions.
  32   */
  33  /**
  34   * Mobile specific styles
  35   */
  36  /**
  37   * Editor styles.
  38   */
  39  /**
  40   * Block & Editor UI.
  41   */
  42  /**
  43   * Block paddings.
  44   */
  45  /**
  46   * React Native specific.
  47   * These variables do not appear to be used anywhere else.
  48   */
  49  /**
  50   * Breakpoints & Media Queries
  51   */
  52  /**
  53  *  Converts a hex value into the rgb equivalent.
  54  *
  55  * @param {string} hex - the hexadecimal value to convert
  56  * @return {string} comma separated rgb values
  57  */
  58  /**
  59   * Long content fade mixin
  60   *
  61   * Creates a fading overlay to signify that the content is longer
  62   * than the space allows.
  63   */
  64  /**
  65   * Breakpoint mixins
  66   */
  67  /**
  68   * Focus styles.
  69   */
  70  /**
  71   * Standard focus rings for the WordPress Design System.
  72   *
  73   * Apply `outset-ring__focus` inside the relevant pseudo-class at the call site,
  74   * e.g. `&:focus { @include outset-ring__focus(); }`.
  75   */
  76  /**
  77   * Applies editor left position to the selector passed as argument
  78   */
  79  /**
  80   * Styles that are reused verbatim in a few places
  81   */
  82  /**
  83   * Allows users to opt-out of animations via OS-level preferences.
  84   */
  85  /**
  86   * Reset default styles for JavaScript UI based pages.
  87   * This is a WP-admin agnostic reset
  88   */
  89  /**
  90   * Reset the WP Admin page styles for Gutenberg-like pages.
  91   */
  92  /**
  93   * Creates a checkerboard pattern background to indicate transparency.
  94   * @param {String} $size - The size of the squares in the checkerboard pattern. Default is 12px.
  95   */
  96  :root {
  97    --wp-block-synced-color: #7a00df;
  98    --wp-block-synced-color--rgb: 122, 0, 223;
  99    --wp-bound-block-color: var(--wp-block-synced-color);
 100    --wp-editor-canvas-background: #ddd;
 101    --wp-admin-theme-color: #007cba;
 102    --wp-admin-theme-color--rgb: 0, 124, 186;
 103    --wp-admin-theme-color-darker-10: rgb(0, 107, 160.5);
 104    --wp-admin-theme-color-darker-10--rgb: 0, 107, 160.5;
 105    --wp-admin-theme-color-darker-20: #005a87;
 106    --wp-admin-theme-color-darker-20--rgb: 0, 90, 135;
 107    --wp-admin-border-width-focus: 2px;
 108  }
 109  @media (min-resolution: 192dpi) {
 110    :root {
 111      --wp-admin-border-width-focus: 1.5px;
 112    }
 113  }
 114  
 115  .block-editor-autocompleters__block {
 116    white-space: nowrap;
 117  }
 118  .block-editor-autocompleters__block .block-editor-block-icon {
 119    margin-right: 8px;
 120  }
 121  .block-editor-autocompleters__block[aria-selected=true] .block-editor-block-icon {
 122    color: inherit !important;
 123  }
 124  
 125  .block-editor-global-styles-background-panel__inspector-media-replace-container {
 126    position: relative;
 127  }
 128  .block-editor-global-styles-background-panel__inspector-media-replace-container.is-open {
 129    background-color: #f0f0f0;
 130  }
 131  .block-editor-global-styles-background-panel__inspector-media-replace-container .block-editor-global-styles-background-panel__image-tools-panel-item {
 132    flex-grow: 1;
 133    border: 0;
 134  }
 135  .block-editor-global-styles-background-panel__inspector-media-replace-container .block-editor-global-styles-background-panel__image-tools-panel-item .components-dropdown {
 136    display: block;
 137  }
 138  .block-editor-global-styles-background-panel__inspector-media-replace-container .block-editor-global-styles-background-panel__inspector-preview-inner {
 139    height: 100%;
 140  }
 141  .block-editor-global-styles-background-panel__inspector-media-replace-container .components-dropdown {
 142    display: block;
 143  }
 144  .block-editor-global-styles-background-panel__inspector-media-replace-container .components-dropdown .block-editor-global-styles-background-panel__dropdown-toggle {
 145    height: 40px;
 146  }
 147  
 148  .block-editor-global-styles-background-panel__image-tools-panel-item {
 149    border: 1px solid #ddd;
 150    grid-column: 1/-1;
 151    position: relative;
 152  }
 153  .block-editor-global-styles-background-panel__image-tools-panel-item .components-drop-zone__content-icon {
 154    display: none;
 155  }
 156  .block-editor-global-styles-background-panel__image-tools-panel-item .components-dropdown {
 157    display: block;
 158  }
 159  .block-editor-global-styles-background-panel__image-tools-panel-item button.components-button {
 160    color: #1e1e1e;
 161    width: 100%;
 162    display: block;
 163  }
 164  .block-editor-global-styles-background-panel__image-tools-panel-item button.components-button:hover {
 165    color: var(--wp-admin-theme-color);
 166  }
 167  .block-editor-global-styles-background-panel__image-tools-panel-item .block-editor-global-styles-background-panel__loading {
 168    height: 100%;
 169    position: absolute;
 170    z-index: 1;
 171    width: 100%;
 172    padding: 10px 0 0 0;
 173  }
 174  .block-editor-global-styles-background-panel__image-tools-panel-item .block-editor-global-styles-background-panel__loading svg {
 175    margin: 0;
 176  }
 177  
 178  .block-editor-global-styles-background-panel__dropdown-toggle {
 179    cursor: var(--wpds-cursor-control, pointer);
 180    background: transparent;
 181    border: none;
 182    height: 100%;
 183    width: 100%;
 184    padding-left: 12px;
 185    padding-right: 32px;
 186  }
 187  
 188  .block-editor-global-styles-background-panel__reset {
 189    position: absolute;
 190    right: 0;
 191    top: 8px;
 192    margin: auto 8px auto;
 193    opacity: 0;
 194  }
 195  @media not (prefers-reduced-motion) {
 196    .block-editor-global-styles-background-panel__reset {
 197      transition: opacity 0.1s ease-in-out;
 198    }
 199  }
 200  .block-editor-global-styles-background-panel__reset.has-local-override-from-global-styles__reset {
 201    position: absolute;
 202    display: inline-flex;
 203    align-items: center;
 204    justify-content: center;
 205    top: 50%;
 206    transform: translateY(-50%);
 207    margin-block: 0;
 208    margin-inline: 0 8px;
 209    opacity: 1;
 210  }
 211  .block-editor-global-styles-background-panel__reset.block-editor-global-styles-background-panel__reset {
 212    border-radius: 2px;
 213  }
 214  .block-editor-global-styles-background-panel__dropdown-toggle:hover + .block-editor-global-styles-background-panel__reset, .block-editor-global-styles-background-panel__reset:focus, .block-editor-global-styles-background-panel__reset:focus-within, .block-editor-global-styles-background-panel__reset:hover {
 215    opacity: 1;
 216  }
 217  @media (hover: none) {
 218    .block-editor-global-styles-background-panel__reset {
 219      opacity: 1;
 220    }
 221  }
 222  
 223  .block-editor-global-styles-background-panel__inspector-media-replace-title {
 224    word-break: break-all;
 225    white-space: normal;
 226    text-align: start;
 227  }
 228  
 229  .block-editor-global-styles-background-panel__inspector-image-indicator {
 230    width: 20px;
 231    height: 20px;
 232    border-radius: 2px;
 233    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.2);
 234    background: #fff linear-gradient(-45deg, transparent 48%, #ddd 48%, #ddd 52%, transparent 52%);
 235    background-size: cover;
 236    outline: 1px solid transparent;
 237  }
 238  
 239  .block-editor-global-styles-background-panel__dropdown-content-wrapper {
 240    min-width: 260px;
 241    overflow-x: hidden;
 242  }
 243  .block-editor-global-styles-background-panel__dropdown-content-wrapper .components-focal-point-picker-wrapper {
 244    background-color: #f0f0f0;
 245    width: 100%;
 246    border-radius: 2px;
 247    border: 1px solid #ddd;
 248  }
 249  .block-editor-global-styles-background-panel__dropdown-content-wrapper .components-focal-point-picker__media--image {
 250    max-height: 180px;
 251  }
 252  .block-editor-global-styles-background-panel__dropdown-content-wrapper .components-focal-point-picker::after {
 253    content: none;
 254  }
 255  
 256  .modal-open .block-editor-global-styles-background-panel__popover {
 257    z-index: 159890;
 258  }
 259  
 260  .block-editor-global-styles-background-panel__media-replace-popover .components-popover__content {
 261    width: auto;
 262  }
 263  .block-editor-global-styles-background-panel__media-replace-popover .components-menu-item__button.components-button {
 264    padding: 0 8px;
 265  }
 266  .block-editor-global-styles-background-panel__media-replace-popover .components-button .components-menu-items__item-icon.has-icon-right {
 267    margin-left: 16px;
 268  }
 269  
 270  .block-editor-block-alignment-control__menu-group .components-menu-item__info {
 271    margin-top: 0;
 272  }
 273  
 274  iframe[name=editor-canvas] {
 275    box-sizing: border-box;
 276    width: 100%;
 277    height: 100%;
 278    display: block;
 279  }
 280  @media not (prefers-reduced-motion) {
 281    iframe[name=editor-canvas] {
 282      transition: all 400ms cubic-bezier(0.46, 0.03, 0.52, 0.96);
 283    }
 284  }
 285  iframe[name=editor-canvas] {
 286    background-color: var(--wp-editor-canvas-background);
 287  }
 288  
 289  .block-editor-block-icon {
 290    display: flex;
 291    align-items: center;
 292    justify-content: center;
 293    width: 24px;
 294    height: 24px;
 295  }
 296  .block-editor-block-icon.has-colors svg {
 297    fill: currentColor;
 298  }
 299  .block-editor-block-icon svg {
 300    min-width: 20px;
 301    min-height: 20px;
 302    max-width: 24px;
 303    max-height: 24px;
 304  }
 305  
 306  .block-editor-block-inspector p:not(.components-base-control__help) {
 307    margin-top: 0;
 308  }
 309  .block-editor-block-inspector h2,
 310  .block-editor-block-inspector h3 {
 311    font-size: 13px;
 312    color: #1e1e1e;
 313    margin-bottom: 1.5em;
 314  }
 315  .block-editor-block-inspector .components-base-control:where(:not(:last-child)),
 316  .block-editor-block-inspector .components-radio-control:where(:not(:last-child)),
 317  .block-editor-block-inspector .block-editor-html-element-control:where(:not(:last-child)),
 318  .block-editor-block-inspector .block-editor-image-size-control:where(:not(:last-child)) {
 319    margin-bottom: 16px;
 320  }
 321  .block-editor-block-inspector .components-focal-point-picker-control .components-base-control,
 322  .block-editor-block-inspector .components-query-controls .components-base-control,
 323  .block-editor-block-inspector .components-range-control .components-base-control,
 324  .block-editor-block-inspector .block-editor-html-element-control .components-base-control,
 325  .block-editor-block-inspector .block-editor-image-size-control .components-base-control {
 326    margin-bottom: 0;
 327  }
 328  .block-editor-block-inspector .components-panel__body {
 329    border: none;
 330    border-top: 1px solid #e0e0e0;
 331    margin-top: -1px;
 332  }
 333  
 334  .block-editor-block-inspector__no-blocks,
 335  .block-editor-block-inspector__no-block-tools {
 336    display: block;
 337    font-size: 13px;
 338    background: #fff;
 339    padding: 32px 16px;
 340    text-align: center;
 341  }
 342  
 343  .block-editor-block-inspector__state-badges {
 344    display: flex;
 345    align-items: center;
 346    flex-wrap: wrap;
 347    gap: 8px;
 348    padding: 8px 16px;
 349    margin-top: -16px;
 350  }
 351  
 352  .block-editor-block-inspector__state-badges-text {
 353    white-space: nowrap;
 354  }
 355  
 356  .block-editor-block-inspector__no-block-tools {
 357    border-top: 1px solid #ddd;
 358  }
 359  
 360  .block-editor-block-inspector-edit-contents {
 361    margin: 0 16px 16px 16px;
 362  }
 363  .block-editor-block-inspector-edit-contents .block-editor-block-inspector-edit-contents__button {
 364    justify-content: center;
 365  }
 366  
 367  /**
 368   * Insertion Point.
 369   */
 370  .block-editor-block-list__insertion-point {
 371    position: absolute;
 372    top: 0;
 373    bottom: 0;
 374    left: 0;
 375    right: 0;
 376  }
 377  
 378  .block-editor-block-list__insertion-point-indicator {
 379    position: absolute;
 380    background: var(--wp-admin-theme-color);
 381    border-radius: 2px;
 382    transform-origin: center;
 383    opacity: 0;
 384    will-change: transform, opacity;
 385  }
 386  .block-editor-block-list__insertion-point.is-vertical > .block-editor-block-list__insertion-point-indicator {
 387    top: calc(50% - 2px);
 388    height: 4px;
 389    width: 100%;
 390  }
 391  .block-editor-block-list__insertion-point.is-horizontal > .block-editor-block-list__insertion-point-indicator {
 392    top: 0;
 393    bottom: 0;
 394    left: calc(50% - 2px);
 395    width: 4px;
 396  }
 397  
 398  .block-editor-block-list__insertion-point-inserter {
 399    display: none;
 400    position: absolute;
 401    will-change: transform;
 402  }
 403  @media (min-width: 480px) {
 404    .block-editor-block-list__insertion-point-inserter {
 405      display: flex;
 406    }
 407  }
 408  .block-editor-block-list__insertion-point-inserter {
 409    justify-content: center;
 410    top: calc(50% - 12px);
 411    left: calc(50% - 12px);
 412  }
 413  
 414  .block-editor-block-list__block-side-inserter-popover .components-popover__content > div {
 415    pointer-events: none;
 416  }
 417  .block-editor-block-list__block-side-inserter-popover .components-popover__content > div > * {
 418    pointer-events: all;
 419  }
 420  
 421  .block-editor-block-list__empty-block-inserter.block-editor-block-list__empty-block-inserter {
 422    position: absolute;
 423    top: 0;
 424    right: 0;
 425    line-height: 0;
 426  }
 427  .block-editor-block-list__empty-block-inserter.block-editor-block-list__empty-block-inserter:disabled {
 428    display: none;
 429  }
 430  
 431  .block-editor-block-list__empty-block-inserter .block-editor-inserter__toggle.components-button.has-icon,
 432  .block-editor-block-list__insertion-point-inserter .block-editor-inserter__toggle.components-button.has-icon {
 433    background: #1e1e1e;
 434    color: #fff;
 435    padding: 0;
 436    min-width: 24px;
 437    height: 24px;
 438  }
 439  .block-editor-block-list__empty-block-inserter .block-editor-inserter__toggle.components-button.has-icon:hover,
 440  .block-editor-block-list__insertion-point-inserter .block-editor-inserter__toggle.components-button.has-icon:hover {
 441    color: #fff;
 442    background: var(--wp-admin-theme-color);
 443  }
 444  @media not (prefers-reduced-motion) {
 445    .block-editor-block-list__empty-block-inserter .block-editor-inserter__toggle.components-button.has-icon svg,
 446    .block-editor-block-list__insertion-point-inserter .block-editor-inserter__toggle.components-button.has-icon svg {
 447      transition: transform cubic-bezier(0.165, 0.84, 0.44, 1) 0.2s;
 448    }
 449  }
 450  .block-editor-block-list__empty-block-inserter .block-editor-inserter__toggle.components-button.has-icon.is-pressed svg,
 451  .block-editor-block-list__insertion-point-inserter .block-editor-inserter__toggle.components-button.has-icon.is-pressed svg {
 452    transform: rotate(45deg);
 453  }
 454  
 455  .block-editor-block-list__insertion-point-inserter .block-editor-inserter__toggle.components-button.has-icon {
 456    background: var(--wp-admin-theme-color);
 457  }
 458  .block-editor-block-list__insertion-point-inserter .block-editor-inserter__toggle.components-button.has-icon:hover {
 459    background: #1e1e1e;
 460  }
 461  
 462  @keyframes hide-during-dragging {
 463    to {
 464      position: fixed;
 465      transform: translate(9999px, 9999px);
 466    }
 467  }
 468  .components-popover.block-editor-block-list__block-popover .block-editor-block-contextual-toolbar {
 469    pointer-events: all;
 470    margin-top: 8px;
 471    margin-bottom: 8px;
 472    border: 1px solid #1e1e1e;
 473    border-radius: 2px;
 474    overflow: visible;
 475    position: static;
 476    width: auto;
 477  }
 478  .components-popover.block-editor-block-list__block-popover .block-editor-block-contextual-toolbar.has-parent {
 479    margin-left: calc(48px + 8px);
 480  }
 481  .show-icon-labels .components-popover.block-editor-block-list__block-popover .block-editor-block-contextual-toolbar.has-parent {
 482    margin-left: 0;
 483  }
 484  .components-popover.block-editor-block-list__block-popover .block-editor-block-contextual-toolbar.has-parent:has(.block-editor-block-parent-selector__inserter) {
 485    margin-left: calc(48px + 24px + 12px + 8px + 2 * 1px);
 486  }
 487  .show-icon-labels .components-popover.block-editor-block-list__block-popover .block-editor-block-contextual-toolbar.has-parent:has(.block-editor-block-parent-selector__inserter) {
 488    margin-left: 0;
 489  }
 490  .components-popover.block-editor-block-list__block-popover .block-editor-block-toolbar {
 491    overflow: visible;
 492  }
 493  .components-popover.block-editor-block-list__block-popover .block-editor-block-toolbar .components-toolbar-group,
 494  .components-popover.block-editor-block-list__block-popover .block-editor-block-toolbar .components-toolbar {
 495    border-right-color: #1e1e1e;
 496  }
 497  .components-popover.block-editor-block-list__block-popover.is-insertion-point-visible {
 498    visibility: hidden;
 499  }
 500  .is-dragging-components-draggable .components-popover.block-editor-block-list__block-popover {
 501    opacity: 0;
 502  }
 503  @media not (prefers-reduced-motion) {
 504    .is-dragging-components-draggable .components-popover.block-editor-block-list__block-popover {
 505      animation: hide-during-dragging 1ms linear forwards;
 506    }
 507  }
 508  .components-popover.block-editor-block-list__block-popover .block-editor-block-parent-selector {
 509    position: absolute;
 510    left: calc(-48px - 8px - 1px);
 511  }
 512  .components-popover.block-editor-block-list__block-popover .block-editor-block-parent-selector:has(.block-editor-block-parent-selector__inserter) {
 513    left: calc(-48px - 24px - 12px - 8px - 3 * 1px);
 514    border: 1px solid #1e1e1e;
 515    border-radius: 2px;
 516    background-color: #fff;
 517  }
 518  .components-popover.block-editor-block-list__block-popover .block-editor-block-parent-selector:has(.block-editor-block-parent-selector__inserter) > .components-toolbar-group:last-child {
 519    border-right: none;
 520  }
 521  .components-popover.block-editor-block-list__block-popover .block-editor-block-parent-selector:has(.block-editor-block-parent-selector__inserter) .block-editor-block-parent-selector__button {
 522    border: none;
 523    background: none;
 524  }
 525  .components-popover.block-editor-block-list__block-popover .block-editor-block-parent-selector .block-editor-block-parent-selector__inserter.components-button.has-icon {
 526    color: #fff;
 527    background: transparent;
 528  }
 529  .components-popover.block-editor-block-list__block-popover .block-editor-block-parent-selector .block-editor-block-parent-selector__inserter.components-button.has-icon::after {
 530    content: "";
 531    position: absolute;
 532    z-index: -1;
 533    top: 50%;
 534    left: 50%;
 535    transform: translate(-50%, -50%);
 536    width: 24px;
 537    height: 24px;
 538    border-radius: 2px;
 539    background: #1e1e1e;
 540  }
 541  .components-popover.block-editor-block-list__block-popover .block-editor-block-parent-selector .block-editor-block-parent-selector__inserter.components-button.has-icon:hover {
 542    color: #fff;
 543  }
 544  .components-popover.block-editor-block-list__block-popover .block-editor-block-parent-selector .block-editor-block-parent-selector__inserter.components-button.has-icon:hover::after {
 545    background: var(--wp-admin-theme-color);
 546  }
 547  .show-icon-labels .components-popover.block-editor-block-list__block-popover .block-editor-block-parent-selector .block-editor-block-parent-selector__inserter.components-button.has-icon {
 548    width: auto;
 549    padding: 0 12px;
 550    color: inherit;
 551  }
 552  .show-icon-labels .components-popover.block-editor-block-list__block-popover .block-editor-block-parent-selector .block-editor-block-parent-selector__inserter.components-button.has-icon svg {
 553    display: none;
 554  }
 555  .show-icon-labels .components-popover.block-editor-block-list__block-popover .block-editor-block-parent-selector .block-editor-block-parent-selector__inserter.components-button.has-icon::after {
 556    content: attr(aria-label);
 557    position: static;
 558    transform: none;
 559    width: auto;
 560    height: auto;
 561    border-radius: 0;
 562    background: none;
 563    white-space: nowrap;
 564  }
 565  .show-icon-labels .components-popover.block-editor-block-list__block-popover .block-editor-block-parent-selector .block-editor-block-parent-selector__inserter.components-button.has-icon:hover {
 566    color: var(--wp-admin-theme-color);
 567  }
 568  .show-icon-labels .components-popover.block-editor-block-list__block-popover .block-editor-block-parent-selector .block-editor-block-parent-selector__inserter.components-button.has-icon:hover::after {
 569    background: none;
 570  }
 571  .components-popover.block-editor-block-list__block-popover .block-editor-block-parent-selector::before {
 572    content: "";
 573  }
 574  .components-popover.block-editor-block-list__block-popover .block-editor-block-parent-selector::after {
 575    display: none;
 576  }
 577  .components-popover.block-editor-block-list__block-popover .block-editor-block-parent-selector .block-editor-block-parent-selector__button {
 578    border: 1px solid #1e1e1e;
 579    padding-right: 6px;
 580    padding-left: 6px;
 581    background-color: #fff;
 582  }
 583  .show-icon-labels .components-popover.block-editor-block-list__block-popover .block-editor-block-parent-selector .block-editor-block-parent-selector__button {
 584    padding-right: 12px;
 585    padding-left: 12px;
 586  }
 587  .show-icon-labels .components-popover.block-editor-block-list__block-popover .block-editor-block-parent-selector {
 588    position: relative;
 589    left: auto;
 590    margin-left: -1px;
 591  }
 592  .show-icon-labels .components-popover.block-editor-block-list__block-popover .block-editor-block-mover__move-button-container,
 593  .show-icon-labels .components-popover.block-editor-block-list__block-popover .block-editor-block-toolbar__block-controls .block-editor-block-mover {
 594    border-left: 1px solid #1e1e1e;
 595  }
 596  
 597  .is-dragging-components-draggable .components-tooltip {
 598    display: none;
 599  }
 600  
 601  .components-popover.block-editor-block-popover__inbetween .block-editor-button-pattern-inserter__button {
 602    pointer-events: all;
 603    position: absolute;
 604    transform: translateX(-50%) translateY(-50%);
 605    top: 50%;
 606    left: 50%;
 607  }
 608  
 609  .block-editor-block-tools--is-dragging > .popover-slot {
 610    display: none;
 611  }
 612  
 613  .block-editor-block-lock-modal {
 614    z-index: 1000001;
 615  }
 616  
 617  .block-editor-block-lock-modal__options {
 618    border: 0;
 619    padding: 0;
 620    margin: 0;
 621  }
 622  
 623  .block-editor-block-lock-modal__options legend {
 624    margin-bottom: 16px;
 625    padding: 0;
 626  }
 627  
 628  .block-editor-block-lock-modal__checklist {
 629    list-style: none;
 630    padding: 0;
 631    margin: 0;
 632  }
 633  
 634  .block-editor-block-lock-modal__options-all {
 635    padding: 12px 0;
 636  }
 637  .block-editor-block-lock-modal__options-all .components-checkbox-control__label {
 638    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
 639  }
 640  
 641  .block-editor-block-lock-modal__checklist-item {
 642    display: flex;
 643    justify-content: space-between;
 644    align-items: center;
 645    gap: 12px;
 646    margin-bottom: 0;
 647    padding: 12px 0 12px 32px;
 648  }
 649  .block-editor-block-lock-modal__checklist-item .block-editor-block-lock-modal__lock-icon {
 650    flex-shrink: 0;
 651    margin-right: 12px;
 652    color: #1e1e1e;
 653  }
 654  .block-editor-block-lock-modal__checklist-item:hover {
 655    background-color: #f0f0f0;
 656    border-radius: 2px;
 657  }
 658  
 659  .block-editor-block-lock-modal__template-lock {
 660    border-top: 1px solid #ddd;
 661    margin-top: 16px;
 662    padding-top: 16px;
 663  }
 664  
 665  .block-editor-block-lock-modal__actions {
 666    margin-top: 24px;
 667  }
 668  
 669  .block-editor-block-lock-toolbar .components-button.has-icon {
 670    min-width: 36px !important;
 671  }
 672  
 673  .block-editor-block-toolbar__block-controls .block-editor-block-lock-toolbar {
 674    margin-left: -6px !important;
 675  }
 676  
 677  .show-icon-labels .block-editor-block-toolbar__block-controls .block-editor-block-lock-toolbar {
 678    border-left: 1px solid #1e1e1e;
 679    margin-left: 6px !important;
 680    margin-right: -6px;
 681  }
 682  
 683  .block-editor-block-allowed-blocks-control:not(:only-child) {
 684    margin-top: 16px;
 685  }
 686  
 687  .block-editor-block-allowed-blocks-control__button {
 688    width: 100%;
 689    justify-content: center;
 690  }
 691  
 692  .block-editor-block-allowed-blocks-modal {
 693    z-index: 1000001;
 694  }
 695  
 696  .block-editor-block-allowed-blocks-modal__actions {
 697    background-color: #fff;
 698    border-top: 1px solid #ddd;
 699    bottom: -24px;
 700    left: 0;
 701    margin: 0 -24px -24px;
 702    padding: 16px 24px;
 703    position: sticky;
 704    z-index: 1;
 705  }
 706  
 707  .block-editor-block-breadcrumb {
 708    list-style: none;
 709    padding: 0;
 710    margin: 0;
 711  }
 712  .block-editor-block-breadcrumb li {
 713    display: inline-flex;
 714    margin: 0;
 715    white-space: nowrap;
 716  }
 717  .block-editor-block-breadcrumb li .block-editor-block-breadcrumb__separator {
 718    fill: currentColor;
 719    margin-left: -4px;
 720    margin-right: -4px;
 721    transform: scaleX(1) /*rtl:scaleX(-1);*/;
 722  }
 723  .block-editor-block-breadcrumb li:last-child .block-editor-block-breadcrumb__separator {
 724    display: none;
 725  }
 726  
 727  .block-editor-block-breadcrumb__current {
 728    cursor: default;
 729  }
 730  
 731  .block-editor-block-breadcrumb__button.block-editor-block-breadcrumb__button,
 732  .block-editor-block-breadcrumb__current {
 733    color: #1e1e1e;
 734    padding: 0 8px;
 735    font-size: inherit;
 736  }
 737  
 738  .block-editor-block-card {
 739    color: #1e1e1e;
 740    padding: 16px;
 741  }
 742  .block-editor-block-card.is-parent {
 743    padding-bottom: 4px;
 744  }
 745  .block-editor-block-card.is-child {
 746    padding-top: 4px;
 747  }
 748  
 749  .block-editor-block-card__parent-select-button {
 750    padding: 0;
 751    align-items: start;
 752    text-align: start;
 753    height: auto !important;
 754  }
 755  
 756  .block-editor-block-card__title {
 757    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
 758    display: flex;
 759    align-items: center;
 760    flex-wrap: wrap;
 761    gap: 4px 8px;
 762    overflow-wrap: anywhere;
 763  }
 764  .block-editor-block-card__title.block-editor-block-card__title {
 765    font-size: 13px;
 766    line-height: 1.4;
 767    margin: 0;
 768  }
 769  
 770  .block-editor-block-card__name {
 771    padding: 3px 0;
 772  }
 773  
 774  .block-editor-block-card .block-editor-block-icon,
 775  .block-editor-block-card__child-indicator-icon {
 776    flex: 0 0 24px;
 777    margin-left: 0;
 778    margin-right: 12px;
 779    width: 24px;
 780    height: 24px;
 781  }
 782  
 783  .block-editor-block-card.is-synced .block-editor-block-icon {
 784    color: var(--wp-block-synced-color);
 785  }
 786  
 787  /**
 788   * Invalid block comparison
 789   */
 790  .block-editor-block-compare {
 791    height: auto;
 792  }
 793  
 794  .block-editor-block-compare__wrapper {
 795    display: flex;
 796    padding-bottom: 16px;
 797  }
 798  .block-editor-block-compare__wrapper > div {
 799    display: flex;
 800    justify-content: space-between;
 801    flex-direction: column;
 802    width: 50%;
 803    padding: 0 16px 0 0;
 804    min-width: 200px;
 805    max-width: 600px;
 806  }
 807  .block-editor-block-compare__wrapper > div button {
 808    float: right;
 809  }
 810  .block-editor-block-compare__wrapper .block-editor-block-compare__converted {
 811    border-left: 1px solid #ddd;
 812    padding-left: 15px;
 813    padding-right: 0;
 814  }
 815  .block-editor-block-compare__wrapper .block-editor-block-compare__html {
 816    font-family: Menlo, Consolas, monaco, monospace;
 817    font-size: 12px;
 818    color: #1e1e1e;
 819    border-bottom: 1px solid #ddd;
 820    padding-bottom: 15px;
 821    line-height: 1.7;
 822  }
 823  .block-editor-block-compare__wrapper .block-editor-block-compare__html span {
 824    background-color: #e6ffed;
 825    padding-top: 3px;
 826    padding-bottom: 3px;
 827  }
 828  .block-editor-block-compare__wrapper .block-editor-block-compare__html span.block-editor-block-compare__added {
 829    background-color: #acf2bd;
 830  }
 831  .block-editor-block-compare__wrapper .block-editor-block-compare__html span.block-editor-block-compare__removed {
 832    background-color: #cc1818;
 833  }
 834  .block-editor-block-compare__wrapper .block-editor-block-compare__preview {
 835    padding: 0;
 836    padding-top: 16px;
 837  }
 838  .block-editor-block-compare__wrapper .block-editor-block-compare__preview p {
 839    font-size: 12px;
 840    margin-top: 0;
 841  }
 842  .block-editor-block-compare__wrapper .block-editor-block-compare__action {
 843    margin-top: 16px;
 844  }
 845  .block-editor-block-compare__wrapper .block-editor-block-compare__heading {
 846    font-size: 1em;
 847    font-weight: 400;
 848    margin: 0.67em 0;
 849  }
 850  
 851  .block-editor-block-draggable-chip-wrapper {
 852    position: absolute;
 853    top: -24px;
 854    left: 0;
 855  }
 856  
 857  .block-editor-block-draggable-chip {
 858    background-color: #1e1e1e;
 859    border-radius: 2px;
 860    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);
 861    color: #fff;
 862    cursor: grabbing;
 863    display: inline-flex;
 864    height: 48px;
 865    padding: 0 13px;
 866    position: relative;
 867    -webkit-user-select: none;
 868            user-select: none;
 869    width: max-content;
 870  }
 871  .block-editor-block-draggable-chip svg {
 872    fill: currentColor;
 873  }
 874  .block-editor-block-draggable-chip .block-editor-block-draggable-chip__content {
 875    margin: auto;
 876    justify-content: flex-start;
 877  }
 878  .block-editor-block-draggable-chip .block-editor-block-draggable-chip__content > .components-flex__item {
 879    margin-right: 6px;
 880  }
 881  .block-editor-block-draggable-chip .block-editor-block-draggable-chip__content > .components-flex__item:last-child {
 882    margin-right: 0;
 883  }
 884  .block-editor-block-draggable-chip .block-editor-block-draggable-chip__content .block-editor-block-icon svg {
 885    min-width: 18px;
 886    min-height: 18px;
 887  }
 888  .block-editor-block-draggable-chip .components-flex__item {
 889    font-family: -apple-system, system-ui, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
 890    font-size: 13px;
 891  }
 892  
 893  .block-editor-block-draggable-chip__disabled.block-editor-block-draggable-chip__disabled {
 894    opacity: 0;
 895    position: absolute;
 896    top: 0;
 897    right: 0;
 898    left: 0;
 899    bottom: 0;
 900    display: flex;
 901    justify-content: center;
 902    align-items: center;
 903    background-color: transparent;
 904  }
 905  @media not (prefers-reduced-motion) {
 906    .block-editor-block-draggable-chip__disabled.block-editor-block-draggable-chip__disabled {
 907      transition: all 0.1s linear 0.1s;
 908    }
 909  }
 910  .block-editor-block-draggable-chip__disabled.block-editor-block-draggable-chip__disabled .block-editor-block-draggable-chip__disabled-icon {
 911    width: 20px;
 912    height: 20px;
 913    box-shadow: inset 0 0 0 1.5px #fff;
 914    border-radius: 50%;
 915    display: inline-block;
 916    padding: 0;
 917    background: transparent linear-gradient(-45deg, transparent 47.5%, #fff 47.5%, #fff 52.5%, transparent 52.5%);
 918  }
 919  
 920  .block-draggable-invalid-drag-token .block-editor-block-draggable-chip__disabled.block-editor-block-draggable-chip__disabled {
 921    background-color: #757575;
 922    opacity: 1;
 923    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);
 924  }
 925  
 926  .block-editor-block-manager__no-results {
 927    font-style: italic;
 928    padding: 24px 0;
 929    text-align: center;
 930  }
 931  
 932  .block-editor-block-manager__category {
 933    isolation: isolate;
 934    margin: 0 0 24px 0;
 935  }
 936  
 937  .block-editor-block-manager__category-title {
 938    position: sticky;
 939    top: -4px;
 940    padding: 16px 0;
 941    background-color: #fff;
 942    z-index: 1;
 943  }
 944  .block-editor-block-manager__category-title .components-checkbox-control__label {
 945    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
 946  }
 947  
 948  .block-editor-block-manager__checklist {
 949    margin-top: 0;
 950  }
 951  
 952  .block-editor-block-manager__category-title,
 953  .block-editor-block-manager__checklist-item {
 954    border-bottom: 1px solid #ddd;
 955  }
 956  
 957  .block-editor-block-manager__checklist-item {
 958    display: flex;
 959    justify-content: space-between;
 960    align-items: center;
 961    margin-bottom: 0;
 962    padding: 8px 0 8px 16px;
 963  }
 964  .components-modal__content .block-editor-block-manager__checklist-item.components-checkbox-control__input-container {
 965    margin: 0 8px;
 966  }
 967  .block-editor-block-manager__checklist-item .block-editor-block-icon {
 968    margin-right: 10px;
 969    fill: #1e1e1e;
 970    color: #1e1e1e;
 971  }
 972  
 973  .block-editor-block-manager__results {
 974    border-top: 1px solid #ddd;
 975  }
 976  
 977  .block-editor-block-manager__disabled-blocks-count + .block-editor-block-manager__results {
 978    border-top-width: 0;
 979  }
 980  
 981  .block-editor-block-mover__move-button-container {
 982    display: flex;
 983    padding: 0;
 984    border: none;
 985    justify-content: center;
 986  }
 987  @media (min-width: 600px) {
 988    .block-editor-block-mover:not(.is-horizontal) .block-editor-block-mover__move-button-container {
 989      flex-direction: column;
 990    }
 991    .block-editor-block-mover:not(.is-horizontal) .block-editor-block-mover__move-button-container > * {
 992      height: 20px;
 993      width: 100%;
 994      min-width: 0 !important;
 995    }
 996    .block-editor-block-mover:not(.is-horizontal) .block-editor-block-mover__move-button-container > *::before {
 997      height: calc(100% - 4px);
 998    }
 999    .block-editor-block-mover:not(.is-horizontal) .block-editor-block-mover__move-button-container .block-editor-block-mover-button.is-up-button svg {
1000      top: 3px;
1001      flex-shrink: 0;
1002    }
1003    .block-editor-block-mover:not(.is-horizontal) .block-editor-block-mover__move-button-container .block-editor-block-mover-button.is-down-button svg {
1004      bottom: 3px;
1005      flex-shrink: 0;
1006    }
1007    .block-editor-block-mover.is-horizontal .block-editor-block-mover__move-button-container {
1008      width: 48px;
1009    }
1010    .block-editor-block-mover.is-horizontal .block-editor-block-mover__move-button-container > * {
1011      width: 24px;
1012      min-width: 0 !important;
1013      overflow: hidden;
1014    }
1015    .block-editor-block-mover.is-horizontal .block-editor-block-mover__move-button-container .block-editor-block-mover-button {
1016      padding-left: 0;
1017      padding-right: 0;
1018    }
1019    .block-editor-block-mover.is-horizontal .block-editor-block-mover__move-button-container .block-editor-block-mover-button.is-up-button svg {
1020      left: 5px;
1021    }
1022    .block-editor-block-mover.is-horizontal .block-editor-block-mover__move-button-container .block-editor-block-mover-button.is-down-button svg {
1023      right: 5px;
1024    }
1025  }
1026  
1027  .block-editor-block-mover__drag-handle {
1028    cursor: grab;
1029  }
1030  @media (min-width: 600px) {
1031    .block-editor-block-mover__drag-handle {
1032      width: 24px;
1033      min-width: 0 !important;
1034      overflow: hidden;
1035    }
1036    .block-editor-block-mover .block-editor-block-mover__drag-handle.has-icon.has-icon {
1037      padding-left: 0;
1038      padding-right: 0;
1039    }
1040  }
1041  
1042  .components-button.block-editor-block-mover-button {
1043    overflow: hidden;
1044  }
1045  .components-button.block-editor-block-mover-button::before {
1046    content: "";
1047    position: absolute;
1048    display: block;
1049    border-radius: 2px;
1050    height: 32px;
1051    left: 8px;
1052    right: 8px;
1053    z-index: -1;
1054  }
1055  @media not (prefers-reduced-motion) {
1056    .components-button.block-editor-block-mover-button::before {
1057      animation: components-button__appear-animation 0.1s ease;
1058      animation-fill-mode: forwards;
1059    }
1060  }
1061  
1062  .block-editor-block-navigation__container {
1063    min-width: 280px;
1064  }
1065  
1066  .block-editor-block-navigation__label {
1067    margin: 0 0 12px;
1068    color: #757575;
1069    text-transform: uppercase;
1070    font-size: 11px;
1071    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
1072  }
1073  
1074  .block-editor-block-patterns-list__list-item {
1075    cursor: var(--wpds-cursor-control, pointer);
1076    margin-bottom: 16px;
1077    position: relative;
1078  }
1079  .block-editor-block-patterns-list__list-item.is-placeholder {
1080    min-height: 100px;
1081  }
1082  .block-editor-block-patterns-list__list-item[draggable=true] {
1083    cursor: grab;
1084  }
1085  
1086  .block-editor-block-patterns-list__item {
1087    height: 100%;
1088    scroll-margin-top: 24px;
1089    scroll-margin-bottom: 56px;
1090    outline: 0;
1091  }
1092  .block-editor-block-patterns-list__item .block-editor-block-patterns-list__item-title {
1093    flex-grow: 1;
1094    text-align: left;
1095  }
1096  .block-editor-block-patterns-list__item .block-editor-block-preview__container {
1097    display: flex;
1098    align-items: center;
1099    overflow: hidden;
1100    border-radius: 4px;
1101  }
1102  .block-editor-block-patterns-list__item .block-editor-block-preview__container::after {
1103    outline: 1px solid rgba(0, 0, 0, 0.1);
1104    outline-offset: -1px;
1105    border-radius: 4px;
1106  }
1107  @media not (prefers-reduced-motion) {
1108    .block-editor-block-patterns-list__item .block-editor-block-preview__container::after {
1109      transition: outline 0.1s linear;
1110    }
1111  }
1112  .block-editor-block-patterns-list__item.is-selected .block-editor-block-preview__container::after {
1113    outline-color: #1e1e1e;
1114    outline-width: var(--wp-admin-border-width-focus);
1115    outline-offset: calc(-1 * var(--wp-admin-border-width-focus));
1116  }
1117  .block-editor-block-patterns-list__item:hover .block-editor-block-preview__container::after {
1118    outline-color: rgba(0, 0, 0, 0.3);
1119  }
1120  .block-editor-block-patterns-list__item[data-focus-visible] .block-editor-block-preview__container::after {
1121    outline-color: var(--wp-admin-theme-color);
1122    outline-width: var(--wp-admin-border-width-focus);
1123    outline-offset: calc(-1 * var(--wp-admin-border-width-focus));
1124  }
1125  .block-editor-block-patterns-list__item .block-editor-patterns__pattern-details:not(:empty) {
1126    align-items: center;
1127    margin-top: 8px;
1128    padding-bottom: 4px;
1129  }
1130  .block-editor-block-patterns-list__item .block-editor-patterns__pattern-icon-wrapper {
1131    min-width: 24px;
1132    height: 24px;
1133  }
1134  .block-editor-block-patterns-list__item .block-editor-patterns__pattern-icon-wrapper .block-editor-patterns__pattern-icon {
1135    color: var(--wp-block-synced-color);
1136  }
1137  
1138  .block-editor-patterns__grid-pagination-wrapper .block-editor-patterns__grid-pagination {
1139    border-top: 1px solid #2f2f2f;
1140    padding: 4px;
1141    justify-content: center;
1142  }
1143  
1144  .show-icon-labels .block-editor-patterns__grid-pagination-button {
1145    width: auto;
1146  }
1147  .show-icon-labels .block-editor-patterns__grid-pagination-button span {
1148    display: none;
1149  }
1150  .show-icon-labels .block-editor-patterns__grid-pagination-button::before {
1151    content: attr(aria-label);
1152  }
1153  
1154  .components-popover.block-editor-block-popover {
1155    z-index: 31;
1156    position: absolute;
1157    margin: 0 !important;
1158    pointer-events: none;
1159  }
1160  .components-popover.block-editor-block-popover .components-popover__content {
1161    margin: 0 !important;
1162    min-width: auto;
1163    width: max-content;
1164    overflow-y: visible;
1165  }
1166  .components-popover.block-editor-block-popover:not(.block-editor-block-popover__inbetween, .block-editor-block-popover__drop-zone, .block-editor-block-list__block-side-inserter-popover) .components-popover__content * {
1167    pointer-events: all;
1168  }
1169  
1170  .components-popover.block-editor-block-popover__inbetween {
1171    pointer-events: none;
1172  }
1173  .components-popover.block-editor-block-popover__inbetween * {
1174    pointer-events: none;
1175  }
1176  .components-popover.block-editor-block-popover__inbetween .is-with-inserter {
1177    pointer-events: all;
1178  }
1179  .components-popover.block-editor-block-popover__inbetween .is-with-inserter * {
1180    pointer-events: all;
1181  }
1182  
1183  .components-popover.block-editor-block-popover__drop-zone * {
1184    pointer-events: none;
1185  }
1186  .components-popover.block-editor-block-popover__drop-zone .block-editor-block-popover__drop-zone-foreground {
1187    position: absolute;
1188    inset: 0;
1189    background-color: var(--wp-admin-theme-color);
1190    border-radius: 2px;
1191  }
1192  
1193  .block-editor-block-preview__container {
1194    position: relative;
1195    width: 100%;
1196    overflow: hidden;
1197  }
1198  .block-editor-block-preview__container .block-editor-block-preview__content {
1199    width: 100%;
1200    top: 0;
1201    left: 0;
1202    transform-origin: top left;
1203    text-align: initial;
1204    margin: 0;
1205    overflow: visible;
1206    min-height: auto;
1207  }
1208  .block-editor-block-preview__container .block-editor-block-preview__content .block-editor-block-list__insertion-point,
1209  .block-editor-block-preview__container .block-editor-block-preview__content .block-list-appender {
1210    display: none;
1211  }
1212  
1213  .block-editor-block-preview__container::after {
1214    content: "";
1215    position: absolute;
1216    top: 0;
1217    left: 0;
1218    right: 0;
1219    bottom: 0;
1220    z-index: 1;
1221  }
1222  
1223  .block-editor-block-quick-navigation__item {
1224    font-weight: var(--wpds-typography-font-weight-default, 400);
1225  }
1226  
1227  .block-editor-block-rename-modal {
1228    z-index: 1000001;
1229  }
1230  
1231  .block-editor-block-styles__preview-panel {
1232    display: none;
1233    z-index: 90;
1234  }
1235  @media (min-width: 782px) {
1236    .block-editor-block-styles__preview-panel {
1237      display: block;
1238    }
1239  }
1240  .block-editor-block-styles__preview-panel .block-editor-block-icon {
1241    display: none;
1242  }
1243  
1244  .block-editor-block-styles {
1245    grid-column: 1/-1;
1246  }
1247  
1248  .block-editor-block-styles__variants {
1249    display: grid;
1250    gap: 8px;
1251  }
1252  .block-editor-block-styles__variants .block-editor-block-styles__row {
1253    display: grid;
1254    grid-template-columns: repeat(2, minmax(0, 1fr));
1255    gap: 8px;
1256  }
1257  .block-editor-block-styles__variants .block-editor-block-styles__item-text {
1258    text-align: start;
1259    text-align-last: center;
1260  }
1261  
1262  .components-popover.block-editor-block-switcher__popover .components-popover__content {
1263    min-width: 300px;
1264  }
1265  
1266  .block-editor-block-switcher__popover-preview-container {
1267    left: 0;
1268    position: absolute;
1269    top: -1px;
1270    width: 100%;
1271    bottom: 0;
1272    pointer-events: none;
1273  }
1274  
1275  .block-editor-block-switcher__popover-preview {
1276    overflow: hidden;
1277  }
1278  .block-editor-block-switcher__popover-preview .components-popover__content {
1279    width: 300px;
1280    border: 1px solid #1e1e1e;
1281    background: #fff;
1282    border-radius: 4px;
1283    outline: none;
1284    box-shadow: none;
1285    overflow: auto;
1286  }
1287  .block-editor-block-switcher__popover-preview .block-editor-block-switcher__preview {
1288    max-height: calc(500px - 32px);
1289    margin: 16px 0;
1290    padding: 0 16px;
1291    overflow: hidden;
1292  }
1293  .block-editor-block-switcher__popover-preview .block-editor-block-switcher__preview.is-pattern-list-preview {
1294    overflow: unset;
1295  }
1296  
1297  .block-editor-block-switcher__preview-patterns-container {
1298    padding-bottom: 16px;
1299  }
1300  .block-editor-block-switcher__preview-patterns-container .block-editor-block-switcher__preview-patterns-container-list__list-item {
1301    margin-top: 16px;
1302  }
1303  .block-editor-block-switcher__preview-patterns-container .block-editor-block-switcher__preview-patterns-container-list__list-item .block-editor-block-preview__container {
1304    cursor: var(--wpds-cursor-control, pointer);
1305  }
1306  .block-editor-block-switcher__preview-patterns-container .block-editor-block-switcher__preview-patterns-container-list__list-item .block-editor-block-switcher__preview-patterns-container-list__item {
1307    height: 100%;
1308    border-radius: 2px;
1309  }
1310  @media not (prefers-reduced-motion) {
1311    .block-editor-block-switcher__preview-patterns-container .block-editor-block-switcher__preview-patterns-container-list__list-item .block-editor-block-switcher__preview-patterns-container-list__item {
1312      transition: all 0.05s ease-in-out;
1313    }
1314  }
1315  .block-editor-block-switcher__preview-patterns-container .block-editor-block-switcher__preview-patterns-container-list__list-item .block-editor-block-switcher__preview-patterns-container-list__item {
1316    position: relative;
1317    border: 1px solid transparent;
1318  }
1319  .block-editor-block-switcher__preview-patterns-container .block-editor-block-switcher__preview-patterns-container-list__list-item .block-editor-block-switcher__preview-patterns-container-list__item:hover, .block-editor-block-switcher__preview-patterns-container .block-editor-block-switcher__preview-patterns-container-list__list-item .block-editor-block-switcher__preview-patterns-container-list__item:focus {
1320    box-shadow: inset 0 0 0 1px #fff, 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
1321    outline: 2px solid transparent;
1322  }
1323  .block-editor-block-switcher__preview-patterns-container .block-editor-block-switcher__preview-patterns-container-list__list-item .block-editor-block-switcher__preview-patterns-container-list__item:hover {
1324    box-shadow: inset 0 0 0 1px #fff, 0 0 0 var(--wp-admin-border-width-focus) #1e1e1e;
1325  }
1326  .block-editor-block-switcher__preview-patterns-container .block-editor-block-switcher__preview-patterns-container-list__list-item .block-editor-block-switcher__preview-patterns-container-list__item .block-editor-block-switcher__preview-patterns-container-list__item-title {
1327    padding: 4px;
1328    font-size: 12px;
1329    text-align: center;
1330    cursor: var(--wpds-cursor-control, pointer);
1331  }
1332  
1333  .block-editor-block-switcher__no-transforms {
1334    color: #757575;
1335    padding: 6px 8px;
1336    margin: 0;
1337  }
1338  
1339  .block-editor-block-switcher__binding-indicator {
1340    display: block;
1341    padding: 8px;
1342  }
1343  
1344  .block-editor-block-types-list > [role=presentation] {
1345    display: flex;
1346    flex-wrap: wrap;
1347  }
1348  
1349  .block-editor-block-pattern-setup {
1350    display: flex;
1351    flex-direction: column;
1352    justify-content: center;
1353    align-items: flex-start;
1354    width: 100%;
1355    border-radius: 2px;
1356  }
1357  .block-editor-block-pattern-setup.view-mode-grid {
1358    padding-top: 4px;
1359  }
1360  .block-editor-block-pattern-setup.view-mode-grid .block-editor-block-pattern-setup__toolbar {
1361    justify-content: center;
1362  }
1363  .block-editor-block-pattern-setup.view-mode-grid .block-editor-block-pattern-setup__container {
1364    column-gap: 24px;
1365    display: block;
1366    width: 100%;
1367    padding: 32px;
1368    padding-bottom: 0;
1369    padding-top: 0;
1370    column-count: 2;
1371  }
1372  @media (min-width: 1440px) {
1373    .block-editor-block-pattern-setup.view-mode-grid .block-editor-block-pattern-setup__container {
1374      column-count: 3;
1375    }
1376  }
1377  .block-editor-block-pattern-setup.view-mode-grid .block-editor-block-pattern-setup__container .block-editor-block-preview__container,
1378  .block-editor-block-pattern-setup.view-mode-grid .block-editor-block-pattern-setup__container div[role=button] {
1379    cursor: var(--wpds-cursor-control, pointer);
1380  }
1381  .block-editor-block-pattern-setup.view-mode-grid .block-editor-block-pattern-setup__container .block-editor-block-pattern-setup-list__item {
1382    scroll-margin: 5px 0;
1383  }
1384  .block-editor-block-pattern-setup.view-mode-grid .block-editor-block-pattern-setup__container .block-editor-block-pattern-setup-list__item:hover .block-editor-block-preview__container {
1385    box-shadow: 0 0 0 2px var(--wp-admin-theme-color);
1386  }
1387  .block-editor-block-pattern-setup.view-mode-grid .block-editor-block-pattern-setup__container .block-editor-block-pattern-setup-list__item:focus .block-editor-block-preview__container {
1388    box-shadow: 0 0 0 var(--wp-admin-border-width-focus) #fff, 0 0 0 calc(2 * var(--wp-admin-border-width-focus)) var(--wp-admin-theme-color);
1389    outline: 2px solid transparent;
1390    outline-offset: 2px;
1391  }
1392  .block-editor-block-pattern-setup.view-mode-grid .block-editor-block-pattern-setup__container .block-editor-block-pattern-setup-list__item:hover .block-editor-block-pattern-setup-list__item-title, .block-editor-block-pattern-setup.view-mode-grid .block-editor-block-pattern-setup__container .block-editor-block-pattern-setup-list__item:focus .block-editor-block-pattern-setup-list__item-title {
1393    color: var(--wp-admin-theme-color);
1394  }
1395  .block-editor-block-pattern-setup.view-mode-grid .block-editor-block-pattern-setup__container .block-editor-block-pattern-setup-list__list-item {
1396    break-inside: avoid-column;
1397    margin-bottom: 24px;
1398  }
1399  .block-editor-block-pattern-setup.view-mode-grid .block-editor-block-pattern-setup__container .block-editor-block-pattern-setup-list__list-item .block-editor-block-pattern-setup-list__item-title {
1400    padding-top: 8px;
1401    font-size: 12px;
1402    text-align: center;
1403    cursor: var(--wpds-cursor-control, pointer);
1404  }
1405  .block-editor-block-pattern-setup.view-mode-grid .block-editor-block-pattern-setup__container .block-editor-block-pattern-setup-list__list-item .block-editor-block-preview__container {
1406    min-height: 100px;
1407    border-radius: 4px;
1408    border: 1px solid #ddd;
1409  }
1410  .block-editor-block-pattern-setup.view-mode-grid .block-editor-block-pattern-setup__container .block-editor-block-pattern-setup-list__list-item .block-editor-block-preview__content {
1411    width: 100%;
1412  }
1413  .block-editor-block-pattern-setup .block-editor-block-pattern-setup__toolbar {
1414    height: 64px;
1415    box-sizing: border-box;
1416    padding: 16px;
1417    width: 100%;
1418    text-align: left;
1419    margin: 0;
1420    color: #1e1e1e;
1421    position: absolute;
1422    bottom: 0;
1423    background-color: #fff;
1424    display: flex;
1425    flex-direction: row;
1426    align-items: center;
1427    justify-content: space-between;
1428    border-top: 1px solid #ddd;
1429    align-self: stretch;
1430  }
1431  .block-editor-block-pattern-setup .block-editor-block-pattern-setup__toolbar .block-editor-block-pattern-setup__display-controls {
1432    display: flex;
1433  }
1434  .block-editor-block-pattern-setup .block-editor-block-pattern-setup__toolbar .block-editor-block-pattern-setup__navigation,
1435  .block-editor-block-pattern-setup .block-editor-block-pattern-setup__toolbar .block-editor-block-pattern-setup__actions {
1436    width: calc(50% - 36px);
1437    display: flex;
1438  }
1439  .block-editor-block-pattern-setup .block-editor-block-pattern-setup__toolbar .block-editor-block-pattern-setup__actions {
1440    justify-content: flex-end;
1441  }
1442  .block-editor-block-pattern-setup .block-editor-block-pattern-setup__container {
1443    display: flex;
1444    flex-direction: column;
1445    width: 100%;
1446    height: 100%;
1447    box-sizing: border-box;
1448  }
1449  .block-editor-block-pattern-setup .block-editor-block-pattern-setup__container .carousel-container {
1450    overflow: hidden;
1451    position: relative;
1452    padding: 0;
1453    margin: 0;
1454    height: 100%;
1455    list-style: none;
1456    transform-style: preserve-3d;
1457  }
1458  .block-editor-block-pattern-setup .block-editor-block-pattern-setup__container .carousel-container * {
1459    box-sizing: border-box;
1460  }
1461  .block-editor-block-pattern-setup .block-editor-block-pattern-setup__container .carousel-container .pattern-slide {
1462    position: absolute;
1463    top: 0;
1464    width: 100%;
1465    height: 100%;
1466    background-color: #fff;
1467    margin: auto;
1468    padding: 0;
1469  }
1470  @media not (prefers-reduced-motion) {
1471    .block-editor-block-pattern-setup .block-editor-block-pattern-setup__container .carousel-container .pattern-slide {
1472      transition: transform 0.5s, z-index 0.5s;
1473    }
1474  }
1475  .block-editor-block-pattern-setup .block-editor-block-pattern-setup__container .carousel-container .pattern-slide {
1476    z-index: 100;
1477  }
1478  .block-editor-block-pattern-setup .block-editor-block-pattern-setup__container .carousel-container .pattern-slide.active-slide {
1479    opacity: 1;
1480    position: relative;
1481    z-index: 102;
1482  }
1483  .block-editor-block-pattern-setup .block-editor-block-pattern-setup__container .carousel-container .pattern-slide.previous-slide {
1484    transform: translateX(-100%);
1485    z-index: 101;
1486  }
1487  .block-editor-block-pattern-setup .block-editor-block-pattern-setup__container .carousel-container .pattern-slide.next-slide {
1488    transform: translateX(100%);
1489    z-index: 101;
1490  }
1491  .block-editor-block-pattern-setup .block-editor-block-pattern-setup__container .block-list-appender {
1492    display: none;
1493  }
1494  
1495  .block-editor-block-pattern-setup__carousel,
1496  .block-editor-block-pattern-setup__grid {
1497    width: 100%;
1498  }
1499  
1500  .block-editor-block-variation-transforms {
1501    box-sizing: border-box;
1502    padding: 0 16px 16px;
1503  }
1504  .block-editor-block-variation-transforms:where(fieldset) {
1505    border: 0;
1506    margin: 0;
1507    min-inline-size: 0;
1508  }
1509  
1510  .block-editor-block-variation-transforms__button {
1511    width: 100%;
1512    justify-content: center;
1513  }
1514  
1515  .components-border-radius-control__header {
1516    height: 16px;
1517    margin-bottom: 12px;
1518  }
1519  
1520  .components-border-radius-control {
1521    border: 0;
1522    padding: 0;
1523    margin: 0;
1524    margin-bottom: 12px;
1525  }
1526  .components-border-radius-control legend {
1527    margin-bottom: 0;
1528  }
1529  .components-border-radius-control .components-border-radius-control__linked-button {
1530    display: flex;
1531    justify-content: center;
1532  }
1533  .components-border-radius-control .components-border-radius-control__linked-button svg {
1534    margin-right: 0;
1535  }
1536  
1537  .block-editor-color-gradient-control .block-editor-color-gradient-control__color-indicator {
1538    margin-bottom: 12px;
1539  }
1540  
1541  .block-editor-color-gradient-control__fieldset {
1542    border: 0;
1543    padding: 0;
1544    margin: 0;
1545    min-width: 0;
1546  }
1547  
1548  @media screen and (min-width: 782px) {
1549    .block-editor-panel-color-gradient-settings .components-circular-option-picker__swatches {
1550      display: grid;
1551      grid-template-columns: repeat(6, 28px);
1552    }
1553  }
1554  .block-editor-block-inspector .block-editor-panel-color-gradient-settings .components-base-control {
1555    margin-bottom: inherit;
1556  }
1557  .block-editor-panel-color-gradient-settings {
1558    /* Increased specificity required to remove the slot wrapper's row gap */
1559  }
1560  .block-editor-panel-color-gradient-settings.block-editor-panel-color-gradient-settings .block-editor-panel-color-gradient-settings__inner-wrapper {
1561    grid-column: 1/-1;
1562    row-gap: 0;
1563  }
1564  .block-editor-panel-color-gradient-settings.block-editor-panel-color-gradient-settings .block-editor-panel-color-gradient-settings__inner-wrapper > * {
1565    grid-column: 1/-1;
1566  }
1567  
1568  .block-editor-panel-color-gradient-settings__dropdown-content {
1569    min-height: 160px;
1570  }
1571  .block-editor-panel-color-gradient-settings__dropdown-content .block-editor-color-gradient-control__panel {
1572    width: 260px;
1573    padding: 16px;
1574  }
1575  
1576  .block-editor-panel-color-gradient-settings__color-indicator {
1577    background: linear-gradient(-45deg, transparent 48%, #ddd 48%, #ddd 52%, transparent 52%);
1578  }
1579  
1580  .block-editor-panel-color-gradient-settings__contrast-notice {
1581    margin-top: 16px;
1582  }
1583  
1584  /**
1585  * The following styles replicate the separated border of the
1586  * `ItemGroup` component but allows for hidden items. This is because
1587  * to maintain the order of `ToolsPanel` controls, each `ToolsPanelItem`
1588  * must at least render a placeholder which would otherwise interfere
1589  * with the `:last-child` styles.
1590  *
1591  * Applied via the shared `block-editor-color-gradient-item` class on
1592  * color/gradient dropdown items across the Color, Background, and
1593  * Typography panels.
1594  */
1595  .block-editor-color-gradient-item {
1596    padding: 0;
1597    max-width: 100%;
1598    position: relative;
1599    border-left: 1px solid #ddd;
1600    border-right: 1px solid #ddd;
1601    border-bottom: 1px solid #ddd;
1602  }
1603  .block-editor-color-gradient-item:nth-child(1 of .block-editor-color-gradient-item) {
1604    border-top-left-radius: 2px;
1605    border-top-right-radius: 2px;
1606    border-top: 1px solid #ddd;
1607  }
1608  .block-editor-color-gradient-item:nth-last-child(1 of .block-editor-color-gradient-item) {
1609    border-bottom-left-radius: 2px;
1610    border-bottom-right-radius: 2px;
1611  }
1612  .block-editor-color-gradient-item > div,
1613  .block-editor-color-gradient-item > div > button {
1614    border-radius: inherit;
1615  }
1616  
1617  .block-editor-tools-panel-color-gradient-settings__dropdown {
1618    display: block;
1619    padding: 0;
1620  }
1621  .block-editor-tools-panel-color-gradient-settings__dropdown > button {
1622    height: auto;
1623    padding-top: 10px;
1624    padding-bottom: 10px;
1625    text-align: left;
1626  }
1627  .block-editor-tools-panel-color-gradient-settings__dropdown > button.is-open {
1628    background: #f0f0f0;
1629    color: var(--wp-admin-theme-color);
1630  }
1631  .block-editor-tools-panel-color-gradient-settings__dropdown .block-editor-panel-color-gradient-settings__color-name {
1632    min-width: 0;
1633    white-space: nowrap;
1634    overflow: hidden;
1635    text-overflow: ellipsis;
1636    max-width: calc(100% - 44px);
1637  }
1638  .block-editor-tools-panel-color-gradient-settings__dropdown > button.has-contrast-warning .block-editor-panel-color-gradient-settings__color-name {
1639    max-width: calc(100% - 72px);
1640  }
1641  
1642  .block-editor-panel-color-gradient-settings__dropdown {
1643    width: 100%;
1644  }
1645  .block-editor-panel-color-gradient-settings__dropdown .component-color-indicator {
1646    flex-shrink: 0;
1647  }
1648  
1649  .block-editor-panel-color-gradient-settings__labeled-indicators {
1650    width: 100%;
1651    min-width: 0;
1652  }
1653  
1654  .block-editor-panel-color-gradient-settings__color-indicators {
1655    display: flex;
1656    flex-shrink: 0;
1657  }
1658  .block-editor-panel-color-gradient-settings__color-indicators > * + * {
1659    margin-inline-start: -8px;
1660  }
1661  
1662  .block-editor-panel-color-gradient-settings__reset {
1663    position: absolute;
1664    right: 0;
1665    top: 8px;
1666    margin: auto 8px auto;
1667    opacity: 0;
1668  }
1669  @media not (prefers-reduced-motion) {
1670    .block-editor-panel-color-gradient-settings__reset {
1671      transition: opacity 0.1s ease-in-out;
1672    }
1673  }
1674  .block-editor-panel-color-gradient-settings__reset.block-editor-panel-color-gradient-settings__reset {
1675    border-radius: 2px;
1676  }
1677  .block-editor-panel-color-gradient-settings__dropdown:hover + .block-editor-panel-color-gradient-settings__reset, .block-editor-panel-color-gradient-settings__reset:focus, .block-editor-panel-color-gradient-settings__reset:hover {
1678    opacity: 1;
1679  }
1680  @media (hover: none) {
1681    .block-editor-panel-color-gradient-settings__reset {
1682      opacity: 1;
1683    }
1684  }
1685  .block-editor-panel-color-gradient-settings__dropdown.has-contrast-warning + .block-editor-panel-color-gradient-settings__reset {
1686    right: 28px;
1687  }
1688  
1689  .block-editor-panel-color-gradient-settings__contrast-warning {
1690    position: absolute;
1691    right: 0;
1692    top: 8px;
1693    margin: auto 8px auto;
1694  }
1695  .block-editor-panel-color-gradient-settings__contrast-warning.block-editor-panel-color-gradient-settings__contrast-warning {
1696    border-radius: 2px;
1697  }
1698  
1699  .block-editor-date-format-picker {
1700    margin: 0 0 16px;
1701    padding: 0;
1702    border: none;
1703  }
1704  
1705  .block-editor-date-format-picker__custom-format-select-control__custom-option {
1706    border-top: 1px solid #ddd;
1707  }
1708  
1709  .block-editor-dimension-control {
1710    border: 0;
1711    margin: 0;
1712    padding: 0;
1713  }
1714  
1715  .block-editor-duotone-control__popover.components-popover > .components-popover__content {
1716    padding: 8px;
1717    width: 260px;
1718  }
1719  .block-editor-duotone-control__popover.components-popover .components-menu-group__label {
1720    padding: 0;
1721  }
1722  .block-editor-duotone-control__popover.components-popover .components-circular-option-picker__swatches {
1723    display: grid;
1724    grid-template-columns: repeat(6, 28px);
1725    gap: 12px;
1726    justify-content: space-between;
1727  }
1728  
1729  .block-editor-duotone-control__unset-indicator {
1730    background: linear-gradient(-45deg, transparent 48%, #ddd 48%, #ddd 52%, transparent 52%);
1731  }
1732  
1733  .block-editor-fit-text-size-warning {
1734    grid-column: span 2;
1735  }
1736  
1737  .components-font-appearance-control [role=option] {
1738    color: #1e1e1e;
1739    text-transform: capitalize;
1740  }
1741  
1742  .block-editor-global-styles__toggle-icon {
1743    fill: currentColor;
1744  }
1745  
1746  .block-editor-global-styles__shadow-popover-container {
1747    width: 230px;
1748  }
1749  
1750  .block-editor-global-styles__shadow__list {
1751    display: flex;
1752    gap: 12px;
1753    flex-wrap: wrap;
1754    padding-bottom: 8px;
1755  }
1756  
1757  .block-editor-global-styles__clear-shadow {
1758    text-align: right;
1759  }
1760  
1761  .block-editor-global-styles-state-control {
1762    margin-top: -4px;
1763  }
1764  
1765  .block-editor-global-styles-state-control__badges {
1766    min-height: 24px;
1767  }
1768  
1769  .block-editor-global-styles-state-control__badge-tooltip-trigger {
1770    display: inline-flex;
1771    max-width: 100%;
1772  }
1773  
1774  .block-editor-global-styles-filters-panel__dropdown,
1775  .block-editor-global-styles__shadow-dropdown {
1776    display: block;
1777    padding: 0;
1778    position: relative;
1779    border: 1px solid #ddd;
1780    border-radius: 2px;
1781  }
1782  
1783  .block-editor-global-styles-filters-panel__dropdown-toggle,
1784  .block-editor-global-styles__shadow-dropdown-toggle {
1785    width: 100%;
1786    padding: 8px;
1787  }
1788  .block-editor-global-styles-filters-panel__dropdown-toggle.is-open,
1789  .block-editor-global-styles__shadow-dropdown-toggle.is-open {
1790    background-color: #f0f0f0;
1791  }
1792  
1793  .block-editor-panel-duotone-settings__label-row {
1794    width: 100%;
1795    min-width: 0;
1796  }
1797  
1798  .block-editor-panel-duotone-settings__label {
1799    min-width: 0;
1800  }
1801  
1802  .block-editor-global-styles__shadow-editor__remove-button {
1803    position: absolute;
1804    right: 0;
1805    top: 8px;
1806    margin: auto 8px auto;
1807    opacity: 0;
1808  }
1809  @media not (prefers-reduced-motion) {
1810    .block-editor-global-styles__shadow-editor__remove-button {
1811      transition: opacity 0.1s ease-in-out;
1812    }
1813  }
1814  .block-editor-global-styles__shadow-dropdown:hover .block-editor-global-styles__shadow-editor__remove-button, .block-editor-global-styles__shadow-editor__remove-button:focus, .block-editor-global-styles__shadow-editor__remove-button:hover {
1815    opacity: 1;
1816  }
1817  @media (hover: none) {
1818    .block-editor-global-styles__shadow-editor__remove-button {
1819      opacity: 1;
1820    }
1821  }
1822  
1823  .block-editor-global-styles__shadow-indicator {
1824    appearance: none;
1825    background: none;
1826    color: #2f2f2f;
1827    border: #e0e0e0 1px solid;
1828    border-radius: 2px;
1829    cursor: var(--wpds-cursor-control, pointer);
1830    display: inline-flex;
1831    align-items: center;
1832    padding: 0;
1833    height: 26px;
1834    width: 26px;
1835    box-sizing: border-box;
1836    transform: scale(1);
1837  }
1838  @media not (prefers-reduced-motion) {
1839    .block-editor-global-styles__shadow-indicator {
1840      transition: transform 0.1s ease;
1841    }
1842  }
1843  .block-editor-global-styles__shadow-indicator {
1844    will-change: transform;
1845  }
1846  .block-editor-global-styles__shadow-indicator:focus {
1847    border: 2px solid #757575;
1848  }
1849  .block-editor-global-styles__shadow-indicator:hover {
1850    transform: scale(1.2);
1851  }
1852  .block-editor-global-styles__shadow-indicator.unset {
1853    background: linear-gradient(-45deg, transparent 48%, #ddd 48%, #ddd 52%, transparent 52%);
1854  }
1855  
1856  .block-editor-global-styles-advanced-panel__custom-css-input {
1857    margin-bottom: 16px;
1858  }
1859  .block-editor-global-styles-advanced-panel__custom-css-input textarea {
1860    font-family: Menlo, Consolas, monaco, monospace;
1861    /*rtl:ignore*/
1862    direction: ltr;
1863  }
1864  
1865  .block-editor-panel-duotone-settings__reset {
1866    position: absolute;
1867    right: 0;
1868    top: 8px;
1869    margin: auto 8px auto;
1870    opacity: 0;
1871  }
1872  @media not (prefers-reduced-motion) {
1873    .block-editor-panel-duotone-settings__reset {
1874      transition: opacity 0.1s ease-in-out;
1875    }
1876  }
1877  .block-editor-global-styles-filters-panel__dropdown:hover .block-editor-panel-duotone-settings__reset, .block-editor-panel-duotone-settings__reset:focus, .block-editor-panel-duotone-settings__reset:hover {
1878    opacity: 1;
1879  }
1880  @media (hover: none) {
1881    .block-editor-panel-duotone-settings__reset {
1882      opacity: 1;
1883    }
1884  }
1885  
1886  .block-editor-global-styles__text-shadow {
1887    width: 260px;
1888    padding: 8px;
1889  }
1890  
1891  .block-editor-global-styles__text-shadow-preview {
1892    display: flex;
1893    align-items: center;
1894    justify-content: center;
1895    height: 80px;
1896    border: #ddd 1px solid;
1897    border-radius: 2px;
1898    font-size: 24px;
1899    margin-bottom: 16px;
1900    /*rtl:begin:ignore*/
1901    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);
1902    background-position: 0 0, 8px 8px;
1903    /*rtl:end:ignore*/
1904    background-size: 16px 16px;
1905  }
1906  
1907  .block-editor-global-styles__text-shadow-list-item {
1908    justify-content: space-between;
1909    gap: 8px;
1910    width: 100%;
1911  }
1912  .block-editor-global-styles__text-shadow-list-item:not(.is-active) svg {
1913    opacity: 0;
1914  }
1915  
1916  .block-editor-global-styles__text-shadow-dropdown {
1917    display: block;
1918    padding: 0;
1919    position: relative;
1920    border: 1px solid #ddd;
1921    border-radius: 2px;
1922  }
1923  
1924  .block-editor-global-styles__text-shadow-dropdown-toggle {
1925    width: 100%;
1926    padding: 8px;
1927  }
1928  .block-editor-global-styles__text-shadow-dropdown-toggle.is-open {
1929    background-color: #f0f0f0;
1930  }
1931  
1932  .block-editor-global-styles__text-shadow-remove-button {
1933    position: absolute;
1934    right: 8px;
1935    top: 8px;
1936    opacity: 0;
1937  }
1938  @media not (prefers-reduced-motion) {
1939    .block-editor-global-styles__text-shadow-remove-button {
1940      transition: opacity 0.1s ease-in-out;
1941    }
1942  }
1943  .block-editor-global-styles__text-shadow-dropdown:hover .block-editor-global-styles__text-shadow-remove-button, .block-editor-global-styles__text-shadow-remove-button:focus, .block-editor-global-styles__text-shadow-remove-button:hover {
1944    opacity: 1;
1945  }
1946  @media (hover: none) {
1947    .block-editor-global-styles__text-shadow-remove-button {
1948      opacity: 1;
1949    }
1950  }
1951  
1952  .is-inherited-from-global-styles .components-base-control__label,
1953  .is-inherited-from-global-styles .components-input-control__label {
1954    text-decoration-line: underline;
1955    text-decoration-style: dotted;
1956    text-decoration-thickness: 1px;
1957    text-underline-offset: 0.2em;
1958  }
1959  .is-inherited-from-global-styles .block-editor-panel-color-gradient-settings__color-name,
1960  .is-inherited-from-global-styles .block-editor-global-styles-background-panel__inspector-media-replace-title,
1961  .is-inherited-from-global-styles .block-editor-panel-duotone-settings__label {
1962    border-bottom: 1px dotted currentColor;
1963  }
1964  
1965  .has-local-override-from-global-styles {
1966    position: relative;
1967  }
1968  
1969  .global-styles-inheritance-affordance {
1970    position: absolute;
1971    inset-block-start: 0;
1972    inset-inline-end: 0;
1973    z-index: 1;
1974    display: flex;
1975    align-items: center;
1976    justify-content: center;
1977    pointer-events: none;
1978    height: 16px;
1979  }
1980  .global-styles-inheritance-affordance--offset-toggle {
1981    inset-inline-end: 32px;
1982  }
1983  .global-styles-inheritance-affordance .has-local-override-from-global-styles__reset {
1984    pointer-events: auto;
1985    margin-inline-start: 0 !important;
1986  }
1987  
1988  .has-local-override-from-global-styles__reset {
1989    display: inline-flex !important;
1990    align-items: center;
1991    justify-content: center;
1992    vertical-align: middle;
1993    position: relative;
1994    margin-inline-start: 6px;
1995    min-width: 14px !important;
1996    width: 14px !important;
1997    height: 14px !important;
1998    padding: 0 !important;
1999    border-radius: 50% !important;
2000    background: transparent !important;
2001    box-shadow: none !important;
2002    overflow: hidden;
2003    text-transform: none;
2004    letter-spacing: normal;
2005    cursor: var(--wpds-cursor-control, pointer);
2006  }
2007  .has-local-override-from-global-styles__reset:hover, .has-local-override-from-global-styles__reset:focus {
2008    background: transparent !important;
2009  }
2010  .has-local-override-from-global-styles__reset:hover .has-local-override-from-global-styles__dot, .has-local-override-from-global-styles__reset:focus .has-local-override-from-global-styles__dot {
2011    display: none;
2012  }
2013  .has-local-override-from-global-styles__reset:hover .has-local-override-from-global-styles__reset-icon, .has-local-override-from-global-styles__reset:focus .has-local-override-from-global-styles__reset-icon {
2014    display: block;
2015  }
2016  .has-local-override-from-global-styles__reset:focus-visible {
2017    outline: 1.5px solid var(--wp-admin-theme-color, #007cba);
2018    outline-offset: 1px;
2019  }
2020  .has-local-override-from-global-styles__reset.block-editor-panel-color-gradient-settings__reset {
2021    position: absolute;
2022    justify-content: center;
2023    top: 50%;
2024    transform: translateY(-50%);
2025    margin-block: 0;
2026    margin-inline-start: 0;
2027    opacity: 1;
2028  }
2029  .has-local-override-from-global-styles__reset.block-editor-global-styles__shadow-editor__remove-button {
2030    position: absolute;
2031    justify-content: center;
2032    inset-inline-end: 8px;
2033    top: 50%;
2034    transform: translateY(-50%);
2035    margin-block: 0;
2036    margin-inline-start: 0;
2037    opacity: 1;
2038  }
2039  .has-local-override-from-global-styles__reset.block-editor-panel-duotone-settings__reset {
2040    position: absolute;
2041    justify-content: center;
2042    inset-inline-end: 8px;
2043    top: 50%;
2044    transform: translateY(-50%);
2045    margin-block: 0;
2046    margin-inline-start: 0;
2047    opacity: 1;
2048  }
2049  
2050  .has-local-override-from-global-styles__dot {
2051    display: block;
2052    width: 8px;
2053    height: 8px;
2054    background-color: var(--wp-admin-theme-color, #007cba);
2055    border-radius: 50%;
2056  }
2057  
2058  .has-local-override-from-global-styles__reset-icon {
2059    display: none;
2060    position: absolute;
2061    top: 50%;
2062    left: 50%;
2063    transform: translate(-50%, -50%);
2064    color: var(--wp-admin-theme-color, #007cba);
2065  }
2066  
2067  .block-editor-grid-visualizer.block-editor-grid-visualizer.block-editor-grid-visualizer {
2068    z-index: 30;
2069  }
2070  .block-editor-grid-visualizer.block-editor-grid-visualizer.block-editor-grid-visualizer .components-popover__content * {
2071    pointer-events: none;
2072  }
2073  .block-editor-grid-visualizer.block-editor-grid-visualizer.block-editor-grid-visualizer.is-dropping-allowed .block-editor-grid-visualizer__drop-zone {
2074    pointer-events: all;
2075  }
2076  .block-editor-grid-visualizer.block-editor-grid-visualizer.block-editor-grid-visualizer .block-editor-inserter * {
2077    pointer-events: auto;
2078  }
2079  
2080  .block-editor-grid-visualizer__grid {
2081    display: grid;
2082    position: absolute;
2083  }
2084  
2085  .block-editor-grid-visualizer__cell {
2086    display: grid;
2087    position: relative;
2088  }
2089  .block-editor-grid-visualizer__cell .block-editor-inserter {
2090    color: inherit;
2091    z-index: 32;
2092    position: absolute;
2093    top: 0;
2094    bottom: 0;
2095    left: 0;
2096    right: 0;
2097    overflow: hidden;
2098  }
2099  .block-editor-grid-visualizer__cell .block-editor-inserter .block-editor-grid-visualizer__appender {
2100    box-shadow: inset 0 0 0 1px color-mix(in srgb, currentColor 20%, rgba(0, 0, 0, 0));
2101    color: inherit;
2102    overflow: hidden;
2103    height: 100%;
2104    width: 100%;
2105    padding: 0 !important;
2106    opacity: 0;
2107  }
2108  .block-editor-grid-visualizer__cell.is-highlighted .block-editor-inserter,
2109  .block-editor-grid-visualizer__cell.is-highlighted .block-editor-grid-visualizer__drop-zone {
2110    background: var(--wp-admin-theme-color);
2111  }
2112  .block-editor-grid-visualizer__cell:hover .block-editor-grid-visualizer__appender,
2113  .block-editor-grid-visualizer__cell .block-editor-grid-visualizer__appender:focus {
2114    opacity: 1;
2115    background-color: color-mix(in srgb, currentColor 20%, rgba(0, 0, 0, 0));
2116  }
2117  
2118  .block-editor-grid-visualizer__drop-zone {
2119    background: rgba(204, 204, 204, 0.1);
2120    width: 100%;
2121    height: 100%;
2122    grid-column: 1;
2123    grid-row: 1;
2124    min-width: 8px;
2125    min-height: 8px;
2126  }
2127  
2128  .block-editor-grid-item-resizer.block-editor-grid-item-resizer.block-editor-grid-item-resizer {
2129    z-index: 30;
2130  }
2131  .block-editor-grid-item-resizer.block-editor-grid-item-resizer.block-editor-grid-item-resizer .components-popover__content * {
2132    pointer-events: none;
2133  }
2134  
2135  .block-editor-grid-item-resizer__box {
2136    border: 1px solid var(--wp-admin-theme-color);
2137  }
2138  .block-editor-grid-item-resizer__box .components-resizable-box__handle.components-resizable-box__handle.components-resizable-box__handle {
2139    pointer-events: all;
2140  }
2141  
2142  .block-editor-grid-item-mover__move-button-container {
2143    display: flex;
2144    padding: 0;
2145    border: none;
2146    justify-content: center;
2147  }
2148  .block-editor-grid-item-mover__move-button-container .block-editor-grid-item-mover-button {
2149    width: 24px;
2150    min-width: 0 !important;
2151    padding-left: 0;
2152    padding-right: 0;
2153  }
2154  .block-editor-grid-item-mover__move-button-container .block-editor-grid-item-mover-button svg {
2155    min-width: 24px;
2156  }
2157  .block-editor-grid-item-mover__move-button-container .block-editor-grid-item-mover-button::before {
2158    content: "";
2159    position: absolute;
2160    display: block;
2161    border-radius: 2px;
2162    height: 32px;
2163    left: 8px;
2164    right: 8px;
2165    z-index: -1;
2166  }
2167  @media not (prefers-reduced-motion) {
2168    .block-editor-grid-item-mover__move-button-container .block-editor-grid-item-mover-button::before {
2169      animation: components-button__appear-animation 0.1s ease;
2170      animation-fill-mode: forwards;
2171    }
2172  }
2173  
2174  .block-editor-grid-item-mover__move-vertical-button-container {
2175    display: flex;
2176    position: relative;
2177  }
2178  @media (min-width: 600px) {
2179    .block-editor-grid-item-mover__move-vertical-button-container {
2180      flex-direction: column;
2181      justify-content: space-around;
2182    }
2183    .block-editor-grid-item-mover__move-vertical-button-container > .block-editor-grid-item-mover-button.block-editor-grid-item-mover-button {
2184      height: 20px !important;
2185      width: 100%;
2186      min-width: 0 !important;
2187    }
2188    .block-editor-grid-item-mover__move-vertical-button-container > .block-editor-grid-item-mover-button.block-editor-grid-item-mover-button::before {
2189      height: calc(100% - 4px);
2190    }
2191    .block-editor-grid-item-mover__move-vertical-button-container .block-editor-grid-item-mover-button.is-up-button svg,
2192    .block-editor-grid-item-mover__move-vertical-button-container .block-editor-grid-item-mover-button.is-down-button svg {
2193      flex-shrink: 0;
2194      height: 20px;
2195    }
2196  }
2197  
2198  @media (min-width: 600px) {
2199    .editor-collapsible-block-toolbar .block-editor-grid-item-mover__move-vertical-button-container {
2200      height: 40px;
2201      position: relative;
2202      top: -4px;
2203    }
2204  }
2205  
2206  .show-icon-labels .block-editor-grid-item-mover__move-horizontal-button-container {
2207    position: relative;
2208  }
2209  @media (min-width: 600px) {
2210    .show-icon-labels .block-editor-grid-item-mover__move-horizontal-button-container::before {
2211      content: "";
2212      height: 100%;
2213      width: 1px;
2214      background: #e0e0e0;
2215      position: absolute;
2216      top: 0;
2217    }
2218  }
2219  @media (min-width: 782px) {
2220    .show-icon-labels .block-editor-grid-item-mover__move-horizontal-button-container::before {
2221      background: #1e1e1e;
2222    }
2223  }
2224  .show-icon-labels .block-editor-grid-item-mover__move-horizontal-button-container.is-left {
2225    padding-right: 6px;
2226  }
2227  .show-icon-labels .block-editor-grid-item-mover__move-horizontal-button-container.is-left::before {
2228    right: 0;
2229  }
2230  .show-icon-labels .block-editor-grid-item-mover__move-horizontal-button-container.is-right {
2231    padding-left: 6px;
2232  }
2233  .show-icon-labels .block-editor-grid-item-mover__move-horizontal-button-container.is-right::before {
2234    left: 0;
2235  }
2236  @media (min-width: 600px) {
2237    .show-icon-labels .block-editor-grid-item-mover__move-vertical-button-container::before {
2238      content: "";
2239      height: 1px;
2240      width: 100%;
2241      background: #e0e0e0;
2242      position: absolute;
2243      top: 50%;
2244      left: 50%;
2245      transform: translate(-50%, 0);
2246      margin-top: -0.5px;
2247    }
2248  }
2249  @media (min-width: 782px) {
2250    .show-icon-labels .block-editor-grid-item-mover__move-vertical-button-container::before {
2251      background: #1e1e1e;
2252    }
2253  }
2254  .show-icon-labels .block-editor-grid-item-mover-button {
2255    white-space: nowrap;
2256  }
2257  .show-icon-labels .editor-collapsible-block-toolbar .block-editor-grid-item-mover__move-horizontal-button-container::before {
2258    height: 24px;
2259    background: #ddd;
2260    top: 4px;
2261  }
2262  .show-icon-labels .editor-collapsible-block-toolbar .block-editor-grid-item-mover__move-vertical-button-container::before {
2263    background: #ddd;
2264    width: calc(100% - 24px);
2265  }
2266  
2267  .block-editor-height-control {
2268    border: 0;
2269    margin: 0;
2270    padding: 0;
2271  }
2272  
2273  .block-editor-iframe__container {
2274    width: 100%;
2275    height: 100%;
2276  }
2277  
2278  .block-editor-iframe__scale-container {
2279    height: 100%;
2280  }
2281  
2282  .block-editor-iframe__scale-container.is-zoomed-out {
2283    width: var(--wp-block-editor-iframe-zoom-out-scale-container-width, 100vw);
2284    position: absolute;
2285    right: 0;
2286  }
2287  
2288  .wp-block-image__crop-area {
2289    position: relative;
2290    max-width: 100%;
2291    width: 100%;
2292    overflow: hidden;
2293  }
2294  .wp-block-image__crop-area .reactEasyCrop_Container {
2295    pointer-events: auto;
2296  }
2297  .wp-block-image__crop-area .reactEasyCrop_Container .reactEasyCrop_Image {
2298    border: none;
2299    border-radius: 0;
2300  }
2301  
2302  .wp-block-image__zoom .components-popover__content {
2303    min-width: 260px;
2304    overflow: visible !important;
2305  }
2306  
2307  .block-editor-block-types-list__list-item {
2308    display: block;
2309    width: 33.33%;
2310    padding: 0;
2311    margin: 0;
2312  }
2313  .block-editor-block-types-list__list-item.is-synced .components-button.block-editor-block-types-list__item:not(:disabled) .block-editor-block-icon.has-colors {
2314    color: var(--wp-block-synced-color);
2315  }
2316  .block-editor-block-types-list__list-item.is-synced .components-button.block-editor-block-types-list__item:not(:disabled):hover .block-editor-block-types-list__item-title {
2317    color: var(--wp-block-synced-color) !important;
2318    filter: brightness(0.95);
2319  }
2320  .block-editor-block-types-list__list-item.is-synced .components-button.block-editor-block-types-list__item:not(:disabled):hover svg {
2321    color: var(--wp-block-synced-color) !important;
2322  }
2323  .block-editor-block-types-list__list-item.is-synced .components-button.block-editor-block-types-list__item:not(:disabled)::after {
2324    background: var(--wp-block-synced-color);
2325  }
2326  
2327  .components-button.block-editor-block-types-list__item {
2328    display: flex;
2329    flex-direction: column;
2330    width: 100%;
2331    font-size: 13px;
2332    color: #1e1e1e;
2333    padding: 8px;
2334    align-items: stretch;
2335    justify-content: center;
2336    cursor: var(--wpds-cursor-control, pointer);
2337    background: transparent;
2338    word-break: normal;
2339    overflow-wrap: break-word;
2340  }
2341  @media not (prefers-reduced-motion) {
2342    .components-button.block-editor-block-types-list__item {
2343      transition: all 0.05s ease-in-out;
2344    }
2345  }
2346  .components-button.block-editor-block-types-list__item {
2347    position: relative;
2348    height: auto;
2349  }
2350  .components-button.block-editor-block-types-list__item:disabled, .components-button.block-editor-block-types-list__item[aria-disabled=true] {
2351    opacity: 0.6;
2352    cursor: default;
2353  }
2354  .components-button.block-editor-block-types-list__item:not(:disabled, [aria-disabled=true]):hover .block-editor-block-types-list__item-title {
2355    color: var(--wp-admin-theme-color) !important;
2356    filter: brightness(0.95);
2357  }
2358  .components-button.block-editor-block-types-list__item:not(:disabled, [aria-disabled=true]):hover svg {
2359    color: var(--wp-admin-theme-color) !important;
2360  }
2361  .components-button.block-editor-block-types-list__item:not(:disabled, [aria-disabled=true]):hover::after {
2362    content: "";
2363    position: absolute;
2364    top: 0;
2365    bottom: 0;
2366    left: 0;
2367    right: 0;
2368    border-radius: 2px;
2369    opacity: 0.04;
2370    background: var(--wp-admin-theme-color);
2371    pointer-events: none;
2372  }
2373  
2374  .block-editor-block-types-list__item-icon {
2375    padding: 12px 20px;
2376    color: #1e1e1e;
2377  }
2378  @media not (prefers-reduced-motion) {
2379    .block-editor-block-types-list__item-icon {
2380      transition: all 0.05s ease-in-out;
2381    }
2382  }
2383  .block-editor-block-types-list__item-icon .block-editor-block-icon {
2384    margin-left: auto;
2385    margin-right: auto;
2386  }
2387  @media not (prefers-reduced-motion) {
2388    .block-editor-block-types-list__item-icon svg {
2389      transition: all 0.15s ease-out;
2390    }
2391  }
2392  .block-editor-block-types-list__list-item[draggable=true] .block-editor-block-types-list__item-icon {
2393    cursor: grab;
2394  }
2395  
2396  .block-editor-block-types-list__item-title {
2397    padding: 4px 2px 8px;
2398    font-size: 12px;
2399    hyphens: auto;
2400  }
2401  
2402  .modal-open .block-editor-inspector-list-view-content-popover {
2403    z-index: 99999;
2404  }
2405  
2406  .block-editor-block-inspector__tabs [role=tablist] {
2407    width: 100%;
2408  }
2409  
2410  .block-editor-inspector-popover-header {
2411    margin-bottom: 16px;
2412  }
2413  
2414  .items-justified-left {
2415    justify-content: flex-start;
2416  }
2417  
2418  .items-justified-center {
2419    justify-content: center;
2420  }
2421  
2422  .items-justified-right {
2423    justify-content: flex-end;
2424  }
2425  
2426  .items-justified-space-between {
2427    justify-content: space-between;
2428  }
2429  
2430  @keyframes loadingpulse {
2431    0% {
2432      opacity: 1;
2433    }
2434    50% {
2435      opacity: 0;
2436    }
2437    100% {
2438      opacity: 1;
2439    }
2440  }
2441  .block-editor-link-control {
2442    position: relative;
2443    min-width: 350px;
2444  }
2445  .components-popover__content .block-editor-link-control {
2446    min-width: auto;
2447    width: 90vw;
2448    max-width: 350px;
2449  }
2450  .show-icon-labels .block-editor-link-control .components-button.has-icon svg {
2451    display: none;
2452  }
2453  .show-icon-labels .block-editor-link-control .components-button.has-icon::before {
2454    content: attr(aria-label);
2455  }
2456  .show-icon-labels .block-editor-link-control .block-editor-link-control__preview {
2457    gap: 4px;
2458    flex-wrap: wrap;
2459  }
2460  .show-icon-labels .block-editor-link-control .block-editor-link-control__preview .components-button.has-icon {
2461    width: auto;
2462    padding: 4px;
2463  }
2464  .show-icon-labels .block-editor-link-control .block-editor-link-control__preview .block-editor-link-control_link-information {
2465    min-width: 100%;
2466    margin-right: 0;
2467  }
2468  
2469  .block-editor-link-control__search-input-wrapper {
2470    margin-bottom: 8px;
2471    position: relative;
2472  }
2473  
2474  .block-editor-link-control__help {
2475    padding: 0 16px;
2476    margin-top: -8px;
2477    margin-bottom: 0;
2478    font-size: 12px;
2479    font-style: normal;
2480    color: #757575;
2481  }
2482  
2483  .block-editor-link-control__search-input-container,
2484  .block-editor-link-control__search-input-wrapper {
2485    position: relative;
2486  }
2487  
2488  .block-editor-link-control__field {
2489    margin: 16px;
2490  }
2491  .block-editor-link-control__field .components-base-control__label {
2492    color: #1e1e1e;
2493  }
2494  
2495  .block-editor-link-control__search-error {
2496    margin: -8px 16px 16px;
2497  }
2498  
2499  .block-editor-link-control__search-actions {
2500    padding: 8px 16px 16px;
2501  }
2502  
2503  .block-editor-link-control__search-results-wrapper {
2504    position: relative;
2505  }
2506  .block-editor-link-control__search-results-wrapper::before, .block-editor-link-control__search-results-wrapper::after {
2507    content: "";
2508    position: absolute;
2509    left: -1px;
2510    right: 16px;
2511    display: block;
2512    pointer-events: none;
2513    z-index: 100;
2514  }
2515  .block-editor-link-control__search-results-wrapper::before {
2516    height: 8px;
2517    top: 0;
2518    bottom: auto;
2519  }
2520  .block-editor-link-control__search-results-wrapper::after {
2521    height: 16px;
2522    bottom: 0;
2523    top: auto;
2524  }
2525  
2526  .block-editor-link-control__search-results {
2527    margin-top: -16px;
2528    padding: 8px;
2529    max-height: 200px;
2530    overflow-y: auto;
2531  }
2532  .block-editor-link-control__search-results.is-loading {
2533    opacity: 0.2;
2534  }
2535  
2536  .block-editor-link-control__search-item.components-button.components-menu-item__button {
2537    height: auto;
2538    text-align: left;
2539  }
2540  .block-editor-link-control__search-item .components-menu-item__item {
2541    overflow: hidden;
2542    text-overflow: ellipsis;
2543    display: inline-block;
2544    width: 100%;
2545  }
2546  .block-editor-link-control__search-item .components-menu-item__item mark {
2547    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
2548    color: inherit;
2549    background-color: transparent;
2550  }
2551  .block-editor-link-control__search-item .components-menu-item__shortcut {
2552    color: #757575;
2553    white-space: nowrap;
2554  }
2555  .block-editor-link-control__search-item[aria-selected] {
2556    background: #f0f0f0;
2557  }
2558  
2559  .block-editor-link-control__preview {
2560    background: transparent;
2561    border: 0;
2562    padding: 16px;
2563  }
2564  .block-editor-link-control__preview .block-editor-link-control__link-information {
2565    margin-right: 8px;
2566    white-space: pre-wrap;
2567    overflow-wrap: break-word;
2568  }
2569  .block-editor-link-control__preview .block-editor-link-control__link-information .block-editor-link-control__preview-info {
2570    color: #757575;
2571    line-height: 1.1;
2572    font-size: 12px;
2573    word-break: break-all;
2574  }
2575  .block-editor-link-control__preview.is-url-title .block-editor-link-control__preview-title {
2576    word-break: break-all;
2577  }
2578  .block-editor-link-control__preview .block-editor-link-control__preview-image,
2579  .block-editor-link-control__preview .block-editor-link-control__preview-icon {
2580    position: relative;
2581    flex-shrink: 0;
2582    background-color: #f0f0f0;
2583    width: 32px;
2584    height: 32px;
2585    border-radius: 2px;
2586  }
2587  .block-editor-link-control__preview .block-editor-link-control__preview-icon img {
2588    width: 16px;
2589  }
2590  .block-editor-link-control__preview.is-error .block-editor-link-control__preview-icon {
2591    top: 0;
2592    width: 32px;
2593    max-height: 32px;
2594  }
2595  .block-editor-link-control__preview .block-editor-link-control__preview-title {
2596    line-height: var(--wpds-typography-line-height-sm, 20px);
2597  }
2598  .block-editor-link-control__preview .block-editor-link-control__preview-title:focus {
2599    box-shadow: none;
2600  }
2601  .block-editor-link-control__preview .block-editor-link-control__preview-title:focus-visible {
2602    box-shadow: inset 0 0 0 1px #fff, 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
2603    outline: 2px solid transparent;
2604    text-decoration: none;
2605  }
2606  .block-editor-link-control__preview .block-editor-link-control__preview-title mark {
2607    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
2608    color: inherit;
2609    background-color: transparent;
2610  }
2611  .block-editor-link-control__preview .block-editor-link-control__preview-title span {
2612    font-weight: 400;
2613  }
2614  .block-editor-link-control__preview .block-editor-link-control__preview-title .components-external-link__icon {
2615    position: absolute;
2616    width: 1px;
2617    height: 1px;
2618    padding: 0;
2619    margin: -1px;
2620    overflow: hidden;
2621    clip-path: inset(50%);
2622    border: 0;
2623  }
2624  
2625  .block-editor-link-control__preview.is-fetching .block-editor-link-control__preview-icon svg,
2626  .block-editor-link-control__preview.is-fetching .block-editor-link-control__preview-icon img {
2627    opacity: 0;
2628  }
2629  .block-editor-link-control__preview.is-fetching .block-editor-link-control__preview-icon::before {
2630    content: "";
2631    display: block;
2632    background-color: #f0f0f0;
2633    position: absolute;
2634    top: 0;
2635    left: 0;
2636    right: 0;
2637    bottom: 0;
2638    border-radius: 100%;
2639  }
2640  @media not (prefers-reduced-motion) {
2641    .block-editor-link-control__preview.is-fetching .block-editor-link-control__preview-icon::before {
2642      animation: loadingpulse 1s linear infinite;
2643      animation-delay: 0.5s;
2644    }
2645  }
2646  
2647  .block-editor-link-control__loading {
2648    margin: 16px;
2649    display: flex;
2650    align-items: center;
2651  }
2652  .block-editor-link-control__loading .components-spinner {
2653    margin-top: 0;
2654  }
2655  
2656  .components-button + .block-editor-link-control__search-create {
2657    overflow: visible;
2658    padding: 12px 16px;
2659  }
2660  .components-button + .block-editor-link-control__search-create::before {
2661    content: "";
2662    position: absolute;
2663    top: -10px;
2664    left: 0;
2665    display: block;
2666    width: 100%;
2667  }
2668  
2669  .block-editor-link-control__search-create {
2670    align-items: center;
2671  }
2672  .block-editor-link-control__search-create .block-editor-link-control__preview-title {
2673    margin-bottom: 0;
2674  }
2675  .block-editor-link-control__search-create .block-editor-link-control__search-item-icon {
2676    top: 0;
2677  }
2678  
2679  .block-editor-link-control__drawer-inner {
2680    display: flex;
2681    flex-direction: column;
2682    flex-basis: 100%;
2683    position: relative;
2684  }
2685  
2686  .block-editor-link-control__settings {
2687    border: 0;
2688    padding: 0;
2689    margin: 0;
2690  }
2691  
2692  .block-editor-link-control__setting {
2693    margin-bottom: 0;
2694    flex: 1;
2695    padding: 8px 24px;
2696  }
2697  .block-editor-link-control__setting .components-base-control:not(.components-input-control) .components-base-control__field {
2698    display: flex;
2699  }
2700  .block-editor-link-control__setting .components-base-control__field .components-checkbox-control__label {
2701    color: #1e1e1e;
2702  }
2703  .block-editor-link-control__setting input {
2704    margin-left: 0;
2705  }
2706  .is-preview .block-editor-link-control__setting {
2707    padding: 20px 8px 8px 0;
2708  }
2709  
2710  .block-editor-link-control__tools {
2711    padding: 8px 8px 0 8px;
2712    margin-top: -16px;
2713  }
2714  .block-editor-link-control__tools .components-button.block-editor-link-control__drawer-toggle {
2715    padding-left: 0;
2716    gap: 0;
2717  }
2718  .block-editor-link-control__tools .components-button.block-editor-link-control__drawer-toggle[aria-expanded=true] {
2719    color: #1e1e1e;
2720  }
2721  .block-editor-link-control__tools .components-button.block-editor-link-control__drawer-toggle[aria-expanded=true] svg {
2722    visibility: visible;
2723  }
2724  @media not (prefers-reduced-motion) {
2725    .block-editor-link-control__tools .components-button.block-editor-link-control__drawer-toggle[aria-expanded=true] svg {
2726      transition: transform 0.1s ease;
2727    }
2728  }
2729  .block-editor-link-control__tools .components-button.block-editor-link-control__drawer-toggle[aria-expanded=true] svg {
2730    transform: rotate(90deg);
2731  }
2732  .block-editor-link-control__tools .components-button.block-editor-link-control__drawer-toggle[aria-expanded=false] svg {
2733    visibility: visible;
2734    transform: rotate(0deg);
2735  }
2736  @media not (prefers-reduced-motion) {
2737    .block-editor-link-control__tools .components-button.block-editor-link-control__drawer-toggle[aria-expanded=false] svg {
2738      transition: transform 0.1s ease;
2739    }
2740  }
2741  
2742  .block-editor-link-control .block-editor-link-control__search-input .components-spinner {
2743    display: block;
2744  }
2745  .block-editor-link-control .block-editor-link-control__search-input .components-spinner.components-spinner {
2746    position: absolute;
2747    left: auto;
2748    bottom: auto;
2749    top: calc(50% - 16px / 2);
2750    right: 40px;
2751  }
2752  
2753  .block-editor-link-control .block-editor-link-control__search-input-wrapper.has-actions .components-spinner {
2754    top: calc(50% + 16px / 4);
2755    right: 12px;
2756  }
2757  
2758  /**
2759   * Link Picker Styles
2760   */
2761  .link-preview-button.components-button {
2762    width: 100%;
2763    height: auto;
2764    padding: 12px;
2765    border-color: #949494;
2766  }
2767  
2768  .link-preview-button__image-container {
2769    width: 24px;
2770    height: 24px;
2771    flex-shrink: 0;
2772  }
2773  
2774  .link-preview-button__image {
2775    width: 100%;
2776    height: 100%;
2777    object-fit: cover;
2778    border-radius: 2px;
2779  }
2780  
2781  .link-preview-button__content {
2782    min-width: 0;
2783    flex: 1;
2784  }
2785  
2786  .link-preview-button__details {
2787    min-width: 0;
2788    flex: 1;
2789  }
2790  
2791  .link-preview-button__title,
2792  .link-preview-button__hint {
2793    min-width: 0;
2794    display: block;
2795    width: 100%;
2796    text-align: left;
2797    overflow: hidden;
2798    text-overflow: ellipsis;
2799    white-space: nowrap;
2800  }
2801  
2802  .link-preview-button__title {
2803    margin-top: 4px;
2804    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
2805    color: #1e1e1e;
2806    display: block;
2807  }
2808  
2809  .link-preview-button__hint {
2810    font-size: 12px;
2811    color: #757575;
2812    font-weight: 400;
2813  }
2814  
2815  .link-preview-button__icon {
2816    color: #1e1e1e;
2817  }
2818  
2819  .link-preview-button__badges {
2820    margin-top: 8px;
2821  }
2822  
2823  .block-editor-list-view-tree {
2824    width: 100%;
2825    border-collapse: collapse;
2826    padding: 0;
2827    margin: 0;
2828  }
2829  .components-modal__content .block-editor-list-view-tree {
2830    margin: -12px -6px 0;
2831    width: calc(100% + 12px);
2832  }
2833  .block-editor-list-view-tree.is-dragging tbody {
2834    pointer-events: none;
2835  }
2836  
2837  .block-editor-list-view-leaf {
2838    position: relative;
2839    transform: translateY(0);
2840  }
2841  .block-editor-list-view-leaf:focus-within, .block-editor-list-view-leaf.is-nesting {
2842    z-index: 1;
2843  }
2844  .block-editor-list-view-leaf.is-draggable, .block-editor-list-view-leaf.is-draggable .block-editor-list-view-block-contents {
2845    cursor: grab;
2846  }
2847  .block-editor-list-view-leaf .block-editor-list-view-block-select-button[aria-expanded=true] {
2848    color: inherit;
2849  }
2850  .block-editor-list-view-leaf .block-editor-list-view-block-select-button:hover {
2851    color: var(--wp-admin-theme-color);
2852  }
2853  .block-editor-list-view-leaf .block-editor-list-view-block-select-button svg {
2854    fill: currentColor;
2855  }
2856  .is-dragging-components-draggable .block-editor-list-view-leaf:not(.is-selected) .block-editor-list-view-block-select-button:hover {
2857    color: inherit;
2858  }
2859  .block-editor-list-view-leaf.is-selected td {
2860    background: var(--wp-admin-theme-color);
2861  }
2862  .block-editor-list-view-leaf.is-selected.is-synced td {
2863    background: var(--wp-block-synced-color);
2864  }
2865  .block-editor-list-view-leaf.is-synced:not(.is-selected) .block-editor-list-view-block-contents:hover, .block-editor-list-view-leaf.is-synced:not(.is-selected) .block-editor-list-view-block-contents:focus,
2866  .block-editor-list-view-leaf.is-synced:not(.is-selected) .block-editor-list-view-block-contents .block-editor-block-icon {
2867    color: var(--wp-block-synced-color);
2868  }
2869  .block-editor-list-view-leaf.is-synced .block-editor-list-view-block-contents:focus::after {
2870    --focus-color: var(--wp-block-synced-color);
2871  }
2872  .block-editor-list-view-leaf.is-synced:not(.is-selected) .block-editor-list-view-block__menu:focus {
2873    --focus-color: var(--wp-block-synced-color);
2874    outline: var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)) solid var(--focus-color, var(--wpds-color-stroke-focus, var(--wp-admin-theme-color, #3858e9)));
2875    outline-offset: var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px));
2876  }
2877  .block-editor-list-view-leaf.is-selected .block-editor-list-view-block-contents, .block-editor-list-view-leaf.is-selected .components-button.has-icon {
2878    color: #fff;
2879  }
2880  .block-editor-list-view-leaf.is-selected .block-editor-list-view-block__menu:focus {
2881    --focus-color: var(--wpds-color-foreground-interactive-brand-strong, #fff);
2882    outline: var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)) solid var(--focus-color, var(--wpds-color-stroke-focus, var(--wp-admin-theme-color, #3858e9)));
2883    outline-offset: var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px));
2884    outline-offset: calc(-1 * var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)));
2885  }
2886  @media (forced-colors: active) {
2887    .block-editor-list-view-leaf.is-selected td, .block-editor-list-view-leaf.is-selected.is-synced td {
2888      background: SelectedItem;
2889    }
2890    .block-editor-list-view-leaf.is-selected .block-editor-list-view-block-contents, .block-editor-list-view-leaf.is-selected .components-button.has-icon {
2891      color: SelectedItemText;
2892    }
2893    .block-editor-list-view-leaf.is-selected svg, .block-editor-list-view-leaf.is-selected .block-editor-block-icon.has-colors svg {
2894      fill: SelectedItemText;
2895    }
2896    .block-editor-list-view-leaf.is-selected .block-editor-list-view-block-select-button__title {
2897      forced-color-adjust: none;
2898    }
2899    .block-editor-list-view-leaf.is-selected .block-editor-list-view-block-contents:focus::after {
2900      --focus-color: CanvasText;
2901    }
2902    .block-editor-list-view-leaf.is-selected .block-editor-list-view-block__menu:focus {
2903      --focus-color: SelectedItemText;
2904    }
2905  }
2906  .block-editor-list-view-leaf.is-first-selected td:first-child {
2907    border-top-left-radius: 2px;
2908  }
2909  .block-editor-list-view-leaf.is-first-selected td:last-child {
2910    border-top-right-radius: 2px;
2911  }
2912  .block-editor-list-view-leaf.is-last-selected td:first-child {
2913    border-bottom-left-radius: 2px;
2914  }
2915  .block-editor-list-view-leaf.is-last-selected td:last-child {
2916    border-bottom-right-radius: 2px;
2917  }
2918  .block-editor-list-view-leaf.is-branch-selected:not(.is-selected):not(.is-synced-branch) {
2919    background: rgba(var(--wp-admin-theme-color--rgb), 0.04);
2920  }
2921  .block-editor-list-view-leaf.is-synced-branch.is-branch-selected {
2922    background: rgba(var(--wp-block-synced-color--rgb), 0.04);
2923  }
2924  .block-editor-list-view-leaf.is-branch-selected.is-first-selected td:first-child {
2925    border-top-left-radius: 2px;
2926  }
2927  .block-editor-list-view-leaf.is-branch-selected.is-first-selected td:last-child {
2928    border-top-right-radius: 2px;
2929  }
2930  .block-editor-list-view-leaf[data-expanded=false].is-branch-selected.is-first-selected td:first-child {
2931    border-top-left-radius: 2px;
2932  }
2933  .block-editor-list-view-leaf[data-expanded=false].is-branch-selected.is-first-selected td:last-child {
2934    border-top-right-radius: 2px;
2935  }
2936  .block-editor-list-view-leaf[data-expanded=false].is-branch-selected.is-last-selected td:first-child {
2937    border-bottom-left-radius: 2px;
2938  }
2939  .block-editor-list-view-leaf[data-expanded=false].is-branch-selected.is-last-selected td:last-child {
2940    border-bottom-right-radius: 2px;
2941  }
2942  .block-editor-list-view-leaf.is-branch-selected:not(.is-selected) td {
2943    border-radius: 0;
2944  }
2945  @media not (prefers-reduced-motion) {
2946    .block-editor-list-view-leaf.is-displacement-normal {
2947      transition: transform 0.2s;
2948    }
2949  }
2950  .block-editor-list-view-leaf.is-displacement-normal {
2951    transform: translateY(0);
2952  }
2953  @media not (prefers-reduced-motion) {
2954    .block-editor-list-view-leaf.is-displacement-up {
2955      transition: transform 0.2s;
2956    }
2957  }
2958  .block-editor-list-view-leaf.is-displacement-up {
2959    transform: translateY(-32px);
2960  }
2961  @media not (prefers-reduced-motion) {
2962    .block-editor-list-view-leaf.is-displacement-down {
2963      transition: transform 0.2s;
2964    }
2965  }
2966  .block-editor-list-view-leaf.is-displacement-down {
2967    transform: translateY(32px);
2968  }
2969  @media not (prefers-reduced-motion) {
2970    .block-editor-list-view-leaf.is-after-dragged-blocks {
2971      transition: transform 0.2s;
2972    }
2973  }
2974  .block-editor-list-view-leaf.is-after-dragged-blocks {
2975    transform: translateY(calc(var(--wp-admin--list-view-dragged-items-height, 32px) * -1));
2976  }
2977  @media not (prefers-reduced-motion) {
2978    .block-editor-list-view-leaf.is-after-dragged-blocks.is-displacement-up {
2979      transition: transform 0.2s;
2980    }
2981  }
2982  .block-editor-list-view-leaf.is-after-dragged-blocks.is-displacement-up {
2983    transform: translateY(calc(-32px + var(--wp-admin--list-view-dragged-items-height, 32px) * -1));
2984  }
2985  @media not (prefers-reduced-motion) {
2986    .block-editor-list-view-leaf.is-after-dragged-blocks.is-displacement-down {
2987      transition: transform 0.2s;
2988    }
2989  }
2990  .block-editor-list-view-leaf.is-after-dragged-blocks.is-displacement-down {
2991    transform: translateY(calc(32px + var(--wp-admin--list-view-dragged-items-height, 32px) * -1));
2992  }
2993  .block-editor-list-view-leaf.is-dragging {
2994    opacity: 0;
2995    left: 0;
2996    pointer-events: none;
2997    z-index: -9999;
2998  }
2999  .block-editor-list-view-leaf .block-editor-list-view-block-contents {
3000    display: flex;
3001    align-items: center;
3002    width: 100%;
3003    height: 32px;
3004    padding: 6px 4px 6px 0;
3005    text-align: left;
3006    position: relative;
3007    white-space: nowrap;
3008    border-radius: 2px;
3009    box-sizing: border-box;
3010    color: inherit;
3011    font-family: inherit;
3012    font-size: 13px;
3013    font-weight: 400;
3014    margin: 0;
3015    text-decoration: none;
3016  }
3017  @media not (prefers-reduced-motion) {
3018    .block-editor-list-view-leaf .block-editor-list-view-block-contents {
3019      transition: box-shadow 0.1s linear;
3020    }
3021  }
3022  .components-modal__content .block-editor-list-view-leaf .block-editor-list-view-block-contents {
3023    padding-left: 0;
3024    padding-right: 0;
3025  }
3026  .block-editor-list-view-leaf.is-nesting .block-editor-list-view-block-contents,
3027  .block-editor-list-view-leaf .block-editor-list-view-block-contents:focus {
3028    box-shadow: none;
3029    outline: none;
3030  }
3031  .block-editor-list-view-leaf.is-nesting .block-editor-list-view-block-contents::after,
3032  .block-editor-list-view-leaf .block-editor-list-view-block-contents:focus::after {
3033    content: "";
3034    position: absolute;
3035    top: 0;
3036    right: -28px;
3037    bottom: 0;
3038    left: 0;
3039    border-radius: inherit;
3040    outline: var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)) solid var(--focus-color, var(--wpds-color-stroke-focus, var(--wp-admin-theme-color, #3858e9)));
3041    outline-offset: var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px));
3042    outline-offset: 1px;
3043    box-shadow: 0 0 0 calc(var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)) + 2px) var(--wpds-color-background-surface-neutral-strong, #fff);
3044    z-index: 2;
3045    pointer-events: none;
3046  }
3047  .block-editor-list-view-leaf.has-single-cell .block-editor-list-view-block-contents:focus::after {
3048    right: 0;
3049  }
3050  .block-editor-list-view-leaf.is-visible .block-editor-list-view-block-contents {
3051    opacity: 1;
3052  }
3053  @keyframes __wp-base-styles-fade-in {
3054    from {
3055      opacity: 0;
3056    }
3057    to {
3058      opacity: 1;
3059    }
3060  }
3061  @media not (prefers-reduced-motion) {
3062    .block-editor-list-view-leaf.is-visible .block-editor-list-view-block-contents {
3063      animation: __wp-base-styles-fade-in 0.08s linear 0s;
3064      animation-fill-mode: forwards;
3065    }
3066  }
3067  .block-editor-list-view-leaf .block-editor-block-icon {
3068    margin-right: 4px;
3069    flex: 0 0 24px;
3070  }
3071  .block-editor-list-view-leaf .block-editor-list-view-block__menu-cell,
3072  .block-editor-list-view-leaf .block-editor-list-view-block__mover-cell,
3073  .block-editor-list-view-leaf .block-editor-list-view-block__contents-cell {
3074    padding: 0;
3075  }
3076  .block-editor-list-view-leaf .block-editor-list-view-block__menu-cell,
3077  .block-editor-list-view-leaf .block-editor-list-view-block__mover-cell {
3078    line-height: 0;
3079    width: 28px;
3080    vertical-align: middle;
3081  }
3082  .block-editor-list-view-leaf .block-editor-list-view-block__menu-cell > *,
3083  .block-editor-list-view-leaf .block-editor-list-view-block__mover-cell > * {
3084    opacity: 0;
3085  }
3086  .block-editor-list-view-leaf .block-editor-list-view-block__menu-cell:hover > *, .block-editor-list-view-leaf .block-editor-list-view-block__menu-cell:focus-within > *, .block-editor-list-view-leaf .block-editor-list-view-block__menu-cell.is-visible > *,
3087  .block-editor-list-view-leaf .block-editor-list-view-block__mover-cell:hover > *,
3088  .block-editor-list-view-leaf .block-editor-list-view-block__mover-cell:focus-within > *,
3089  .block-editor-list-view-leaf .block-editor-list-view-block__mover-cell.is-visible > * {
3090    opacity: 1;
3091  }
3092  .block-editor-list-view-leaf .block-editor-list-view-block__mover-cell-alignment-wrapper {
3093    display: flex;
3094    height: 100%;
3095    flex-direction: column;
3096    align-items: center;
3097  }
3098  .block-editor-list-view-leaf .block-editor-block-mover-button {
3099    position: relative;
3100    width: 36px;
3101    height: 24px;
3102  }
3103  .block-editor-list-view-leaf .block-editor-block-mover-button svg {
3104    position: relative;
3105    height: 24px;
3106  }
3107  .block-editor-list-view-leaf .block-editor-block-mover-button.is-up-button {
3108    margin-top: -6px;
3109    align-items: flex-end;
3110  }
3111  .block-editor-list-view-leaf .block-editor-block-mover-button.is-up-button svg {
3112    bottom: -4px;
3113  }
3114  .block-editor-list-view-leaf .block-editor-block-mover-button.is-down-button {
3115    margin-bottom: -6px;
3116    align-items: flex-start;
3117  }
3118  .block-editor-list-view-leaf .block-editor-block-mover-button.is-down-button svg {
3119    top: -4px;
3120  }
3121  .block-editor-list-view-leaf .block-editor-inserter__toggle {
3122    background: #1e1e1e;
3123    color: #fff;
3124    height: 24px;
3125    margin: 6px 6px 6px 1px;
3126    min-width: 24px;
3127  }
3128  .block-editor-list-view-leaf .block-editor-inserter__toggle:active {
3129    color: #fff;
3130  }
3131  .block-editor-list-view-leaf .block-editor-list-view-block-select-button__label-wrapper {
3132    width: 100%;
3133  }
3134  .block-editor-list-view-leaf .block-editor-list-view-block-select-button__label-wrapper > * {
3135    min-width: 0;
3136  }
3137  .block-editor-list-view-leaf .block-editor-list-view-block-select-button__label-wrapper svg {
3138    left: 2px;
3139    position: relative;
3140  }
3141  .block-editor-list-view-leaf .block-editor-list-view-block-select-button__title {
3142    flex: 1;
3143    position: relative;
3144  }
3145  .block-editor-list-view-leaf .block-editor-list-view-block-select-button__title .components-truncate {
3146    position: absolute;
3147    width: 100%;
3148    transform: translateY(-50%);
3149  }
3150  .block-editor-list-view-leaf .block-editor-list-view-block-select-button__anchor-wrapper {
3151    position: relative;
3152    max-width: min(110px, 40%);
3153    width: 100%;
3154  }
3155  .block-editor-list-view-leaf .block-editor-list-view-block-select-button__anchor {
3156    position: absolute;
3157    right: 0;
3158    transform: translateY(-50%);
3159    box-sizing: border-box;
3160    max-width: 100%;
3161    padding: 2px 8px;
3162    border-radius: 2px;
3163    background: #f0f0f0;
3164    color: #2f2f2f;
3165    font-size: 12px;
3166    line-height: 20px;
3167    overflow: hidden;
3168    text-overflow: ellipsis;
3169    white-space: nowrap;
3170  }
3171  .block-editor-list-view-leaf.is-selected .block-editor-list-view-block-select-button__anchor {
3172    background: rgba(0, 0, 0, 0.3);
3173    color: #fff;
3174  }
3175  .block-editor-list-view-leaf .block-editor-list-view-block-select-button__block-visibility,
3176  .block-editor-list-view-leaf .block-editor-list-view-block-select-button__lock,
3177  .block-editor-list-view-leaf .block-editor-list-view-block-select-button__sticky {
3178    line-height: 0;
3179  }
3180  .block-editor-list-view-leaf .block-editor-list-view-block-select-button__images {
3181    display: flex;
3182  }
3183  .block-editor-list-view-leaf .block-editor-list-view-block-select-button__image {
3184    background-size: cover;
3185    width: 18px;
3186    height: 18px;
3187    border-radius: 1px;
3188  }
3189  .block-editor-list-view-leaf .block-editor-list-view-block-select-button__image:not(:only-child) {
3190    box-shadow: 0 0 0 2px #fff;
3191  }
3192  .block-editor-list-view-leaf .block-editor-list-view-block-select-button__image:not(:first-child) {
3193    margin-left: -6px;
3194  }
3195  .block-editor-list-view-leaf.is-selected .block-editor-list-view-block-select-button__image:not(:only-child) {
3196    box-shadow: 0 0 0 2px var(--wp-admin-theme-color);
3197  }
3198  .block-editor-list-view-leaf.is-disabled {
3199    opacity: 0.2;
3200  }
3201  @media not (prefers-reduced-motion) {
3202    .block-editor-list-view-leaf.is-disabled {
3203      transition: opacity 0.1s linear;
3204    }
3205  }
3206  .block-editor-list-view-leaf.is-disabled:hover {
3207    opacity: 0.2;
3208  }
3209  .block-editor-list-view-leaf.is-disabled .block-editor-list-view__expander {
3210    cursor: default;
3211  }
3212  .block-editor-list-view-leaf.is-disabled .block-editor-list-view-block-select-button:hover {
3213    color: inherit;
3214  }
3215  
3216  .block-editor-list-view-draggable-chip {
3217    opacity: 0.8;
3218  }
3219  
3220  .block-editor-list-view-block__contents-cell .block-editor-list-view-block__contents-container,
3221  .block-editor-list-view-block__contents-cell .block-editor-list-view-appender__container,
3222  .block-editor-list-view-appender__cell .block-editor-list-view-block__contents-container,
3223  .block-editor-list-view-appender__cell .block-editor-list-view-appender__container {
3224    display: flex;
3225  }
3226  
3227  .block-editor-list-view__expander {
3228    height: 24px;
3229    width: 24px;
3230    cursor: var(--wpds-cursor-control, pointer);
3231  }
3232  
3233  .block-editor-list-view-leaf[aria-level] .block-editor-list-view__expander {
3234    margin-left: 192px;
3235  }
3236  
3237  .block-editor-list-view-leaf[aria-level="1"] .block-editor-list-view__expander {
3238    margin-left: 0;
3239  }
3240  
3241  .block-editor-list-view-leaf[aria-level="2"] .block-editor-list-view__expander {
3242    margin-left: 24px;
3243  }
3244  
3245  .block-editor-list-view-leaf[aria-level="3"] .block-editor-list-view__expander {
3246    margin-left: 48px;
3247  }
3248  
3249  .block-editor-list-view-leaf[aria-level="4"] .block-editor-list-view__expander {
3250    margin-left: 72px;
3251  }
3252  
3253  .block-editor-list-view-leaf[aria-level="5"] .block-editor-list-view__expander {
3254    margin-left: 96px;
3255  }
3256  
3257  .block-editor-list-view-leaf[aria-level="6"] .block-editor-list-view__expander {
3258    margin-left: 120px;
3259  }
3260  
3261  .block-editor-list-view-leaf[aria-level="7"] .block-editor-list-view__expander {
3262    margin-left: 144px;
3263  }
3264  
3265  .block-editor-list-view-leaf[aria-level="8"] .block-editor-list-view__expander {
3266    margin-left: 168px;
3267  }
3268  
3269  .block-editor-list-view-leaf .block-editor-list-view__expander {
3270    visibility: hidden;
3271  }
3272  
3273  .block-editor-list-view-leaf[data-expanded=true] .block-editor-list-view__expander svg {
3274    visibility: visible;
3275  }
3276  @media not (prefers-reduced-motion) {
3277    .block-editor-list-view-leaf[data-expanded=true] .block-editor-list-view__expander svg {
3278      transition: transform 0.2s ease;
3279    }
3280  }
3281  .block-editor-list-view-leaf[data-expanded=true] .block-editor-list-view__expander svg {
3282    transform: rotate(90deg);
3283  }
3284  
3285  .block-editor-list-view-leaf[data-expanded=false] .block-editor-list-view__expander svg {
3286    visibility: visible;
3287    transform: rotate(0deg);
3288  }
3289  @media not (prefers-reduced-motion) {
3290    .block-editor-list-view-leaf[data-expanded=false] .block-editor-list-view__expander svg {
3291      transition: transform 0.2s ease;
3292    }
3293  }
3294  
3295  .block-editor-list-view-drop-indicator {
3296    pointer-events: none;
3297  }
3298  .block-editor-list-view-drop-indicator .block-editor-list-view-drop-indicator__line {
3299    background: var(--wp-admin-theme-color);
3300    height: 4px;
3301    border-radius: 4px;
3302  }
3303  
3304  .block-editor-list-view-drop-indicator--preview {
3305    pointer-events: none;
3306  }
3307  .block-editor-list-view-drop-indicator--preview .components-popover__content {
3308    overflow: hidden !important;
3309  }
3310  .block-editor-list-view-drop-indicator--preview .block-editor-list-view-drop-indicator__line {
3311    background: rgba(var(--wp-admin-theme-color--rgb), 0.04);
3312    height: 32px;
3313    border-radius: 4px;
3314    overflow: hidden;
3315  }
3316  .block-editor-list-view-drop-indicator--preview .block-editor-list-view-drop-indicator__line--darker {
3317    background: rgba(var(--wp-admin-theme-color--rgb), 0.09);
3318  }
3319  
3320  .block-editor-list-view-placeholder {
3321    padding: 0;
3322    margin: 0;
3323    height: 32px;
3324  }
3325  
3326  .list-view-appender .block-editor-inserter__toggle {
3327    background-color: #1e1e1e;
3328    color: #fff;
3329    margin: 8px 0 0 24px;
3330    height: 24px;
3331    padding: 0;
3332  }
3333  .list-view-appender .block-editor-inserter__toggle.has-icon.is-next-40px-default-size {
3334    min-width: 24px;
3335  }
3336  .list-view-appender .block-editor-inserter__toggle:hover, .list-view-appender .block-editor-inserter__toggle:focus {
3337    background: var(--wp-admin-theme-color);
3338    color: #fff;
3339  }
3340  
3341  .list-view-appender__description {
3342    display: none;
3343  }
3344  
3345  .block-editor-media-placeholder__url-input-form {
3346    min-width: 260px;
3347  }
3348  @media (min-width: 600px) {
3349    .block-editor-media-placeholder__url-input-form {
3350      width: 300px;
3351    }
3352  }
3353  .block-editor-media-placeholder__url-input-form input {
3354    /* rtl:ignore */
3355    direction: ltr;
3356  }
3357  
3358  .modal-open .block-editor-media-replace-flow__options {
3359    z-index: 99999;
3360  }
3361  
3362  .block-editor-media-replace-flow__indicator {
3363    margin-left: 4px;
3364  }
3365  
3366  .block-editor-media-replace-flow__media-upload-menu:not(:empty) + .block-editor-media-flow__url-input {
3367    border-top: 1px solid #ddd;
3368    margin-top: 8px;
3369    padding-bottom: 8px;
3370  }
3371  
3372  .block-editor-media-replace-flow__options.is-variant-toolbar .block-editor-media-replace-flow__media-upload-menu:not(:empty) + .block-editor-media-flow__url-input {
3373    border-top-color: #1e1e1e;
3374  }
3375  
3376  .block-editor-media-flow__url-input {
3377    margin-right: -8px;
3378    margin-left: -8px;
3379    padding: 16px;
3380  }
3381  .block-editor-media-flow__url-input .block-editor-media-replace-flow__image-url-label {
3382    display: block;
3383    top: 16px;
3384    margin-bottom: 8px;
3385  }
3386  .block-editor-media-flow__url-input .block-editor-link-control {
3387    width: 300px;
3388  }
3389  .block-editor-media-flow__url-input .block-editor-link-control .block-editor-url-input {
3390    padding: 0;
3391    margin: 0;
3392  }
3393  .block-editor-media-flow__url-input .block-editor-link-control .block-editor-link-control__tools {
3394    justify-content: flex-end;
3395    padding: 16px var(--wp-admin-border-width-focus) var(--wp-admin-border-width-focus);
3396  }
3397  .block-editor-media-flow__url-input .block-editor-link-control .block-editor-link-control__preview.is-current {
3398    width: auto;
3399    padding: 0;
3400  }
3401  .block-editor-media-flow__url-input .block-editor-link-control .block-editor-link-control__search-input.block-editor-link-control__search-input input[type=text] {
3402    margin: 0;
3403    width: 100%;
3404  }
3405  .block-editor-media-flow__url-input .block-editor-link-control .block-editor-link-control__search-actions {
3406    padding: 8px 0 0;
3407  }
3408  
3409  .block-editor-multi-selection-inspector__card {
3410    padding: 16px;
3411  }
3412  
3413  .block-editor-multi-selection-inspector__card-title {
3414    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
3415  }
3416  
3417  .block-editor-multi-selection-inspector__card-description {
3418    color: #757575;
3419  }
3420  
3421  .block-editor-multi-selection-inspector__card .block-editor-block-icon {
3422    margin-left: -2px;
3423    padding: 0 3px;
3424    width: 36px;
3425    height: 24px;
3426  }
3427  
3428  .block-editor-plain-text {
3429    width: 100%;
3430    field-sizing: content;
3431  }
3432  
3433  .block-editor-responsive-block-control {
3434    margin-bottom: 28px;
3435    border-bottom: 1px solid #ccc;
3436    padding-bottom: 14px;
3437  }
3438  .block-editor-responsive-block-control:last-child {
3439    padding-bottom: 0;
3440    border-bottom: 0;
3441  }
3442  
3443  .block-editor-responsive-block-control__title {
3444    margin: 0;
3445    margin-bottom: 0.6em;
3446    margin-left: -3px;
3447  }
3448  
3449  .block-editor-responsive-block-control__label {
3450    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
3451    margin-bottom: 0.6em;
3452    margin-left: -3px;
3453  }
3454  
3455  .block-editor-responsive-block-control__inner {
3456    margin-left: -1px;
3457  }
3458  
3459  .block-editor-responsive-block-control__toggle {
3460    margin-left: 1px;
3461  }
3462  
3463  .block-editor-responsive-block-control .components-base-control__help {
3464    border: 0;
3465    clip-path: inset(50%);
3466    height: 1px;
3467    margin: -1px;
3468    overflow: hidden;
3469    padding: 0;
3470    position: absolute;
3471    width: 1px;
3472    overflow-wrap: normal !important;
3473    word-break: normal !important;
3474  }
3475  
3476  .preset-input-control__wrapper > * {
3477    flex: 1;
3478  }
3479  .preset-input-control__wrapper > .preset-input-control__icon,
3480  .preset-input-control__wrapper > .preset-input-control__custom-toggle {
3481    flex: none;
3482  }
3483  
3484  .components-popover.block-editor-rich-text__inline-format-toolbar {
3485    z-index: 99998;
3486  }
3487  .components-popover.block-editor-rich-text__inline-format-toolbar .components-popover__content {
3488    width: auto;
3489    min-width: auto;
3490    margin-bottom: 8px;
3491    box-shadow: none;
3492    outline: none;
3493    border-radius: 2px;
3494  }
3495  .components-popover.block-editor-rich-text__inline-format-toolbar .components-toolbar {
3496    border-radius: 2px;
3497  }
3498  .components-popover.block-editor-rich-text__inline-format-toolbar .components-toolbar-group {
3499    background: none;
3500  }
3501  .components-popover.block-editor-rich-text__inline-format-toolbar .components-toolbar__control,
3502  .components-popover.block-editor-rich-text__inline-format-toolbar .components-dropdown-menu__toggle {
3503    min-width: 48px;
3504    min-height: 48px;
3505    padding-left: 12px;
3506    padding-right: 12px;
3507  }
3508  
3509  .block-editor-rich-text__inline-format-toolbar-group .components-dropdown-menu__toggle {
3510    justify-content: center;
3511  }
3512  
3513  .show-icon-labels .block-editor-rich-text__inline-format-toolbar-group .components-button.has-icon {
3514    width: auto;
3515  }
3516  .show-icon-labels .block-editor-rich-text__inline-format-toolbar-group .components-button.has-icon svg {
3517    display: none;
3518  }
3519  .show-icon-labels .block-editor-rich-text__inline-format-toolbar-group .components-button.has-icon::after {
3520    content: attr(aria-label);
3521  }
3522  
3523  .block-editor-skip-to-selected-block {
3524    position: absolute;
3525    top: -9999em;
3526  }
3527  .block-editor-skip-to-selected-block:focus {
3528    font-size: 14px;
3529    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
3530    background: #f1f1f1;
3531    z-index: 100000;
3532  }
3533  
3534  .block-editor-tabbed-sidebar {
3535    background-color: #fff;
3536    height: 100%;
3537    display: flex;
3538    flex-direction: column;
3539    flex-grow: 1;
3540    overflow: hidden;
3541  }
3542  
3543  .block-editor-tabbed-sidebar__tablist-and-close-button {
3544    border-bottom: 1px solid #ddd;
3545    display: flex;
3546    justify-content: space-between;
3547    padding-right: 8px;
3548  }
3549  
3550  .block-editor-tabbed-sidebar__close-button {
3551    background: #fff;
3552    /* stylelint-disable-next-line property-disallowed-list -- This should be removed when https://github.com/WordPress/gutenberg/issues/59013 is fixed. */
3553    order: 1;
3554    align-self: center;
3555  }
3556  
3557  .block-editor-tabbed-sidebar__tablist {
3558    margin-bottom: -1px;
3559  }
3560  
3561  .block-editor-tabbed-sidebar__tabpanel {
3562    display: flex;
3563    flex-grow: 1;
3564    flex-direction: column;
3565    overflow-y: auto;
3566    scrollbar-gutter: auto;
3567  }
3568  
3569  .block-editor-block-list__block .block-editor-url-input,
3570  .components-popover .block-editor-url-input,
3571  .block-editor-url-input {
3572    flex-grow: 1;
3573    position: relative;
3574    padding: 1px;
3575  }
3576  @media (min-width: 600px) {
3577    .block-editor-block-list__block .block-editor-url-input,
3578    .components-popover .block-editor-url-input,
3579    .block-editor-url-input {
3580      min-width: 300px;
3581      width: auto;
3582    }
3583  }
3584  .block-editor-block-list__block .block-editor-url-input.is-full-width,
3585  .components-popover .block-editor-url-input.is-full-width,
3586  .block-editor-url-input.is-full-width {
3587    width: 100%;
3588  }
3589  .block-editor-block-list__block .block-editor-url-input.is-full-width__suggestions,
3590  .components-popover .block-editor-url-input.is-full-width__suggestions,
3591  .block-editor-url-input.is-full-width__suggestions {
3592    width: 100%;
3593  }
3594  .block-editor-block-list__block .block-editor-url-input .components-spinner,
3595  .components-popover .block-editor-url-input .components-spinner,
3596  .block-editor-url-input .components-spinner {
3597    position: absolute;
3598    margin: 0;
3599    top: calc(50% - 16px / 2);
3600    right: 8px;
3601  }
3602  
3603  .block-editor-url-input__suggestions {
3604    max-height: 200px;
3605  }
3606  @media not (prefers-reduced-motion) {
3607    .block-editor-url-input__suggestions {
3608      transition: all 0.15s ease-in-out;
3609    }
3610  }
3611  .block-editor-url-input__suggestions {
3612    padding: 4px 0;
3613    width: 302px;
3614    overflow-y: auto;
3615  }
3616  
3617  .block-editor-url-input__suggestions,
3618  .block-editor-url-input .components-spinner {
3619    display: none;
3620  }
3621  @media (min-width: 600px) {
3622    .block-editor-url-input__suggestions,
3623    .block-editor-url-input .components-spinner {
3624      display: grid;
3625    }
3626  }
3627  
3628  .block-editor-url-input__suggestion {
3629    min-height: 36px;
3630    height: auto;
3631    color: #757575;
3632    display: block;
3633    font-size: 13px;
3634    cursor: var(--wpds-cursor-control, pointer);
3635    background: #fff;
3636    width: 100%;
3637    border: none;
3638    text-align: left;
3639    box-shadow: none;
3640  }
3641  .block-editor-url-input__suggestion:hover {
3642    background: #ddd;
3643  }
3644  .block-editor-url-input__suggestion:focus, .block-editor-url-input__suggestion.is-selected {
3645    background: var(--wp-admin-theme-color-darker-20);
3646    color: #fff;
3647    outline: none;
3648  }
3649  
3650  .components-toolbar-group > .block-editor-url-input__button,
3651  .components-toolbar > .block-editor-url-input__button {
3652    position: inherit;
3653  }
3654  
3655  .block-editor-url-input__button .block-editor-url-input__back {
3656    margin-right: 4px;
3657    overflow: visible;
3658  }
3659  .block-editor-url-input__button .block-editor-url-input__back::after {
3660    content: "";
3661    position: absolute;
3662    display: block;
3663    width: 1px;
3664    height: 24px;
3665    right: -1px;
3666    background: #ddd;
3667  }
3668  
3669  .block-editor-url-input__button-modal {
3670    box-shadow: 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);
3671    border: 1px solid #ddd;
3672    background: #fff;
3673  }
3674  
3675  .block-editor-url-input__button-modal-line {
3676    display: flex;
3677    flex-direction: row;
3678    flex-grow: 1;
3679    flex-shrink: 1;
3680    min-width: 0;
3681    align-items: flex-start;
3682  }
3683  
3684  .block-editor-url-popover__additional-controls {
3685    border-top: 1px solid #1e1e1e;
3686    padding: 8px 8px;
3687  }
3688  
3689  .block-editor-url-popover__input-container {
3690    padding: 8px;
3691  }
3692  
3693  .block-editor-url-popover__row {
3694    display: flex;
3695    gap: 4px;
3696    align-items: center;
3697  }
3698  
3699  .block-editor-url-popover__row > :not(.block-editor-url-popover__settings-toggle) {
3700    flex-grow: 1;
3701    gap: 8px;
3702  }
3703  
3704  .block-editor-url-popover__additional-controls .components-button.has-icon {
3705    padding-left: 8px;
3706    padding-right: 8px;
3707    height: auto;
3708    text-align: left;
3709  }
3710  .block-editor-url-popover__additional-controls .components-button.has-icon > svg {
3711    margin-right: 8px;
3712  }
3713  
3714  .block-editor-url-popover__settings-toggle {
3715    flex-shrink: 0;
3716  }
3717  .block-editor-url-popover__settings-toggle[aria-expanded=true] .dashicon {
3718    transform: rotate(180deg);
3719  }
3720  
3721  .block-editor-url-popover__settings {
3722    display: block;
3723    padding: 16px;
3724    border-top: 1px solid #1e1e1e;
3725  }
3726  
3727  .block-editor-url-popover__link-container-content {
3728    display: flex;
3729    align-items: center;
3730  }
3731  
3732  .block-editor-url-popover__link-editor,
3733  .block-editor-url-popover__link-viewer {
3734    display: flex;
3735  }
3736  
3737  .block-editor-url-popover__link-viewer-url {
3738    display: flex;
3739    align-items: center;
3740    flex-grow: 1;
3741    flex-shrink: 1;
3742    overflow: hidden;
3743    text-overflow: ellipsis;
3744    white-space: nowrap;
3745    margin-right: 8px;
3746    min-width: 150px;
3747    max-width: 350px;
3748  }
3749  .block-editor-url-popover__link-viewer-url.has-invalid-link {
3750    color: #cc1818;
3751  }
3752  
3753  .block-editor-url-popover__expand-on-click {
3754    display: flex;
3755    align-items: center;
3756    min-width: 350px;
3757    white-space: nowrap;
3758  }
3759  .block-editor-url-popover__expand-on-click .text {
3760    flex-grow: 1;
3761  }
3762  .block-editor-url-popover__expand-on-click .text p {
3763    margin: 0;
3764    line-height: 16px;
3765  }
3766  .block-editor-url-popover__expand-on-click .text p.description {
3767    color: #757575;
3768    font-size: 12px;
3769  }
3770  
3771  .background-block-support-panel {
3772    /* Increased specificity required to remove the slot wrapper's row gap */
3773  }
3774  .background-block-support-panel.background-block-support-panel .background-block-support-panel__inner-wrapper {
3775    row-gap: 0;
3776  }
3777  
3778  .block-editor-hooks__block-hooks {
3779    /**
3780     * Un-reverse the flex direction for the toggle's label.
3781     */
3782  }
3783  .block-editor-hooks__block-hooks .components-toggle-control .components-h-stack .components-h-stack {
3784    flex-direction: row;
3785  }
3786  .block-editor-hooks__block-hooks .block-editor-hooks__block-hooks-helptext {
3787    color: #757575;
3788    font-size: 12px;
3789    margin-bottom: 16px;
3790  }
3791  
3792  div.block-editor-bindings__panel {
3793    grid-template-columns: repeat(auto-fit, minmax(100%, 1fr));
3794  }
3795  div.block-editor-bindings__panel button:hover .block-editor-bindings__item span {
3796    color: inherit;
3797  }
3798  
3799  .border-block-support-panel .single-column {
3800    grid-column: span 1;
3801  }
3802  
3803  .color-block-support-panel .block-editor-contrast-checker {
3804    grid-column: span 2;
3805    margin-top: 16px;
3806  }
3807  .color-block-support-panel {
3808    /* Increased specificity required to remove the slot wrapper's row gap */
3809  }
3810  .color-block-support-panel.color-block-support-panel .color-block-support-panel__inner-wrapper {
3811    row-gap: 0;
3812  }
3813  
3814  .elements-block-support-panel {
3815    /* Increased specificity required to remove the slot wrapper's row gap */
3816  }
3817  .elements-block-support-panel.elements-block-support-panel .elements-block-support-panel__inner-wrapper {
3818    row-gap: 0;
3819  }
3820  
3821  .dimensions-block-support-panel .single-column {
3822    grid-column: span 1;
3823  }
3824  
3825  .block-editor-hooks__layout-constrained .components-base-control {
3826    margin-bottom: 0;
3827  }
3828  
3829  .block-editor-hooks__layout-constrained-helptext {
3830    color: #757575;
3831    font-size: 12px;
3832    margin-bottom: 0;
3833  }
3834  
3835  .layout-block-support-panel .block-editor-hooks__flex-layout-controls {
3836    grid-column: 1/-1;
3837  }
3838  
3839  .block-editor-hooks__flex-layout-justification-controls,
3840  .block-editor-hooks__flex-layout-orientation-controls {
3841    margin-bottom: 12px;
3842  }
3843  .block-editor-hooks__flex-layout-justification-controls legend,
3844  .block-editor-hooks__flex-layout-orientation-controls legend {
3845    margin-bottom: 8px;
3846  }
3847  
3848  .block-editor-hooks__grid-layout-columns-and-rows-controls,
3849  .block-editor-hooks__grid-layout-minimum-width-control {
3850    border: 0;
3851    padding: 0;
3852    margin: 0;
3853  }
3854  
3855  .block-editor__spacing-visualizer {
3856    position: absolute;
3857    top: 0;
3858    bottom: 0;
3859    left: 0;
3860    right: 0;
3861    opacity: 0.5;
3862    border-color: var(--wp-admin-theme-color);
3863    border-style: solid;
3864    pointer-events: none;
3865    box-sizing: border-box;
3866  }
3867  
3868  .typography-block-support-panel .single-column {
3869    grid-column: span 1;
3870  }
3871  
3872  /**
3873   * Block Toolbar
3874   */
3875  .block-editor-block-toolbar {
3876    display: flex;
3877    flex-grow: 1;
3878    width: 100%;
3879    position: relative;
3880    overflow-y: hidden;
3881    overflow-x: auto;
3882  }
3883  @media not (prefers-reduced-motion) {
3884    .block-editor-block-toolbar {
3885      transition: border-color 0.1s linear, box-shadow 0.1s linear;
3886    }
3887  }
3888  @media (min-width: 600px) {
3889    .block-editor-block-toolbar {
3890      overflow: inherit;
3891    }
3892  }
3893  .block-editor-block-toolbar .components-toolbar-group,
3894  .block-editor-block-toolbar .components-toolbar {
3895    background: none;
3896    margin-top: -1px;
3897    margin-bottom: -1px;
3898    border: 0;
3899    border-right: 1px solid #ddd;
3900  }
3901  .block-editor-block-toolbar.is-connected .block-editor-block-switcher .components-button::before {
3902    background: color-mix(in srgb, var(--wp-block-synced-color) 10%, transparent);
3903    border-radius: 2px;
3904  }
3905  .block-editor-block-toolbar .components-button.block-editor-block-toolbar__block-icon-button[aria-disabled=true] {
3906    color: #1e1e1e;
3907  }
3908  .block-editor-block-toolbar .components-button.block-editor-block-toolbar__block-icon-button[aria-disabled=true]:hover {
3909    color: #1e1e1e;
3910  }
3911  .block-editor-block-toolbar.is-synced .block-editor-block-toolbar__block-icon, .block-editor-block-toolbar.is-connected .block-editor-block-toolbar__block-icon {
3912    color: var(--wp-block-synced-color);
3913  }
3914  .block-editor-block-toolbar > :last-child,
3915  .block-editor-block-toolbar > :last-child .components-toolbar-group,
3916  .block-editor-block-toolbar > :last-child .components-toolbar, .block-editor-block-toolbar:has(> :last-child:empty) > :nth-last-child(2), .block-editor-block-toolbar:has(> :last-child:empty) > :nth-last-child(2) .components-toolbar-group, .block-editor-block-toolbar:has(> :last-child:empty) > :nth-last-child(2) .components-toolbar {
3917    border-right: none;
3918  }
3919  .block-editor-block-toolbar .components-toolbar-group:empty {
3920    display: none;
3921  }
3922  
3923  .block-editor-block-contextual-toolbar {
3924    position: sticky;
3925    top: 0;
3926    z-index: 31;
3927    display: block;
3928    width: 100%;
3929    background-color: #fff;
3930    flex-shrink: 3;
3931  }
3932  .block-editor-block-contextual-toolbar.components-accessible-toolbar {
3933    border: none;
3934    border-radius: 0;
3935  }
3936  .block-editor-block-contextual-toolbar.is-unstyled {
3937    box-shadow: 0 1px 0 0 rgba(0, 0, 0, 0.133);
3938  }
3939  .block-editor-block-contextual-toolbar .block-editor-block-toolbar {
3940    overflow: auto;
3941    overflow-y: hidden;
3942  }
3943  .block-editor-block-contextual-toolbar .block-editor-block-toolbar::-webkit-scrollbar {
3944    width: 12px;
3945    height: 12px;
3946  }
3947  .block-editor-block-contextual-toolbar .block-editor-block-toolbar::-webkit-scrollbar-track {
3948    background-color: transparent;
3949  }
3950  .block-editor-block-contextual-toolbar .block-editor-block-toolbar::-webkit-scrollbar-thumb {
3951    background-color: #e0e0e0;
3952    border-radius: 8px;
3953    border: 3px solid transparent;
3954    background-clip: padding-box;
3955  }
3956  .block-editor-block-contextual-toolbar .block-editor-block-toolbar:hover::-webkit-scrollbar-thumb, .block-editor-block-contextual-toolbar .block-editor-block-toolbar:focus::-webkit-scrollbar-thumb, .block-editor-block-contextual-toolbar .block-editor-block-toolbar:focus-within::-webkit-scrollbar-thumb {
3957    background-color: #949494;
3958  }
3959  .block-editor-block-contextual-toolbar .block-editor-block-toolbar {
3960    scrollbar-width: thin;
3961    scrollbar-gutter: stable both-edges;
3962    scrollbar-color: #e0e0e0 transparent;
3963  }
3964  .block-editor-block-contextual-toolbar .block-editor-block-toolbar:hover, .block-editor-block-contextual-toolbar .block-editor-block-toolbar:focus, .block-editor-block-contextual-toolbar .block-editor-block-toolbar:focus-within {
3965    scrollbar-color: #949494 transparent;
3966  }
3967  .block-editor-block-contextual-toolbar .block-editor-block-toolbar {
3968    will-change: transform;
3969  }
3970  @media (hover: none) {
3971    .block-editor-block-contextual-toolbar .block-editor-block-toolbar {
3972      scrollbar-color: #949494 transparent;
3973    }
3974  }
3975  .block-editor-block-contextual-toolbar .block-editor-block-toolbar {
3976    scrollbar-gutter: auto;
3977  }
3978  .block-editor-block-contextual-toolbar .block-editor-block-toolbar > :last-child::after,
3979  .block-editor-block-contextual-toolbar .block-editor-block-toolbar > :last-child .components-toolbar-group::after,
3980  .block-editor-block-contextual-toolbar .block-editor-block-toolbar > :last-child .components-toolbar::after {
3981    display: none;
3982  }
3983  .block-editor-block-contextual-toolbar > .block-editor-block-toolbar {
3984    flex-grow: initial;
3985    width: initial;
3986  }
3987  .block-editor-block-contextual-toolbar .block-editor-block-parent-selector {
3988    position: relative;
3989    margin-top: -1px;
3990    margin-bottom: -1px;
3991  }
3992  .block-editor-block-contextual-toolbar .block-editor-block-parent-selector::after {
3993    align-items: center;
3994    background-color: #1e1e1e;
3995    border-radius: 100%;
3996    content: "";
3997    display: inline-flex;
3998    height: 2px;
3999    position: absolute;
4000    top: 15px;
4001    width: 2px;
4002  }
4003  
4004  .block-editor-block-toolbar__block-controls .components-toolbar-group {
4005    padding: 0;
4006  }
4007  
4008  .block-editor-block-toolbar__pattern-overrides-popover .components-popover__content {
4009    min-width: 260px;
4010    padding: 16px;
4011  }
4012  
4013  .block-editor-block-toolbar .components-toolbar-group,
4014  .block-editor-block-toolbar .components-toolbar,
4015  .block-editor-rich-text__inline-format-toolbar-group .components-toolbar-group,
4016  .block-editor-rich-text__inline-format-toolbar-group .components-toolbar {
4017    display: flex;
4018    flex-wrap: nowrap;
4019  }
4020  
4021  .block-editor-block-toolbar__slot {
4022    display: inline-flex;
4023  }
4024  
4025  .show-icon-labels .block-editor-block-toolbar .components-button.has-icon:where(:not(.has-text)) {
4026    width: auto;
4027  }
4028  .show-icon-labels .block-editor-block-toolbar .components-button.has-icon:where(:not(.has-text)) svg {
4029    display: none;
4030  }
4031  .show-icon-labels .block-editor-block-toolbar .components-button.has-icon:where(:not(.has-text))::after {
4032    content: attr(aria-label);
4033    font-size: 12px;
4034  }
4035  .show-icon-labels .block-editor-block-toolbar .block-editor-block-icon {
4036    width: 0 !important;
4037    height: 0 !important;
4038    min-width: 0 !important;
4039  }
4040  .show-icon-labels .components-accessible-toolbar .components-toolbar-group > div:first-child:last-child > .components-button.has-icon {
4041    padding-left: 6px;
4042    padding-right: 6px;
4043  }
4044  .show-icon-labels .block-editor-block-parent-selector .block-editor-block-parent-selector__button {
4045    border-top-right-radius: 0;
4046    border-bottom-right-radius: 0;
4047    padding-left: 12px;
4048    padding-right: 12px;
4049    text-wrap: nowrap;
4050  }
4051  .show-icon-labels .block-editor-block-parent-selector .block-editor-block-parent-selector__button .block-editor-block-icon {
4052    width: 0;
4053  }
4054  .show-icon-labels .block-editor-block-mover .block-editor-block-mover__move-button-container {
4055    width: auto;
4056    position: relative;
4057  }
4058  @media (min-width: 600px) {
4059    .show-icon-labels .block-editor-block-mover:not(.is-horizontal) .block-editor-block-mover__move-button-container::before {
4060      content: "";
4061      height: 1px;
4062      width: 100%;
4063      background: #e0e0e0;
4064      position: absolute;
4065      top: 50%;
4066      left: 50%;
4067      transform: translate(-50%, 0);
4068      margin-top: -0.5px;
4069    }
4070  }
4071  @media (min-width: 782px) {
4072    .show-icon-labels .block-editor-block-mover:not(.is-horizontal) .block-editor-block-mover__move-button-container::before {
4073      background: #1e1e1e;
4074    }
4075  }
4076  .show-icon-labels .block-editor-block-mover.is-horizontal .block-editor-block-mover__move-button-container,
4077  .show-icon-labels .block-editor-block-mover.is-horizontal .block-editor-block-mover-button {
4078    padding-left: 6px;
4079    padding-right: 6px;
4080  }
4081  .show-icon-labels .block-editor-block-mover:not(.is-horizontal) .block-editor-block-mover-button {
4082    padding-left: 8px;
4083    padding-right: 8px;
4084  }
4085  .show-icon-labels .block-editor-block-toolbar__block-controls .block-editor-block-mover {
4086    border-left: 1px solid #ddd;
4087    margin-left: 6px;
4088    margin-right: -6px;
4089    white-space: nowrap;
4090  }
4091  .show-icon-labels .block-editor-block-mover .block-editor-block-mover__drag-handle.has-icon {
4092    padding-left: 12px;
4093    padding-right: 12px;
4094  }
4095  .show-icon-labels .block-editor-block-contextual-toolbar .block-editor-block-mover.is-horizontal .block-editor-block-mover-button.block-editor-block-mover-button {
4096    width: auto;
4097  }
4098  .show-icon-labels .components-toolbar,
4099  .show-icon-labels .components-toolbar-group {
4100    flex-shrink: 1;
4101  }
4102  .show-icon-labels .block-editor-rich-text__inline-format-toolbar-group .components-button + .components-button {
4103    margin-left: 6px;
4104  }
4105  
4106  .block-editor-block-toolbar-change-design-content-wrapper {
4107    padding: 12px;
4108    width: 320px;
4109  }
4110  .block-editor-block-toolbar-change-design-content-wrapper .block-editor-block-patterns-list {
4111    display: grid;
4112    grid-template-columns: 1fr 1fr;
4113    gap: 12px;
4114  }
4115  .block-editor-block-toolbar-change-design-content-wrapper .block-editor-block-patterns-list .block-editor-block-patterns-list__list-item {
4116    margin-bottom: 0;
4117  }
4118  .block-editor-block-toolbar-change-design-content-wrapper .block-editor-block-patterns-list .block-editor-inserter__media-list__list-item {
4119    min-height: 100px;
4120  }
4121  
4122  .block-editor-inserter {
4123    display: inline-block;
4124    background: none;
4125    border: none;
4126    padding: 0;
4127    font-family: -apple-system, system-ui, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
4128    font-size: 13px;
4129    line-height: 0;
4130  }
4131  @media (min-width: 782px) {
4132    .block-editor-inserter {
4133      position: relative;
4134    }
4135  }
4136  
4137  .block-editor-inserter__main-area {
4138    height: 100%;
4139    gap: 16px;
4140    position: relative;
4141  }
4142  .block-editor-inserter__main-area.show-as-tabs {
4143    gap: 0;
4144  }
4145  @media (min-width: 782px) {
4146    .block-editor-inserter__main-area .block-editor-tabbed-sidebar {
4147      width: 350px;
4148    }
4149  }
4150  
4151  .block-editor-inserter__popover.is-quick .components-popover__content {
4152    border: none;
4153    outline: none;
4154    box-shadow: 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);
4155  }
4156  .block-editor-inserter__popover.is-quick .components-popover__content .block-editor-inserter__quick-inserter > * {
4157    border-left: 1px solid #ccc;
4158    border-right: 1px solid #ccc;
4159  }
4160  .block-editor-inserter__popover.is-quick .components-popover__content .block-editor-inserter__quick-inserter > *:first-child {
4161    border-top: 1px solid #ccc;
4162    border-radius: 4px 4px 0 0;
4163  }
4164  .block-editor-inserter__popover.is-quick .components-popover__content .block-editor-inserter__quick-inserter > *:last-child {
4165    border-bottom: 1px solid #ccc;
4166    border-radius: 0 0 4px 4px;
4167  }
4168  .block-editor-inserter__popover.is-quick .components-popover__content .block-editor-inserter__quick-inserter > *.components-button {
4169    border: 1px solid #1e1e1e;
4170  }
4171  
4172  .block-editor-inserter__popover .block-editor-inserter__menu {
4173    margin: -12px;
4174  }
4175  .block-editor-inserter__popover .block-editor-inserter__menu .block-editor-inserter__tablist {
4176    top: 60px;
4177  }
4178  .block-editor-inserter__popover .block-editor-inserter__menu .block-editor-inserter__main-area {
4179    overflow: visible;
4180    height: auto;
4181  }
4182  .block-editor-inserter__popover .block-editor-inserter__menu .block-editor-inserter__preview-container {
4183    display: none;
4184  }
4185  
4186  .block-editor-inserter__toggle.components-button {
4187    display: inline-flex;
4188    align-items: center;
4189    cursor: var(--wpds-cursor-control, pointer);
4190    border: none;
4191    outline: none;
4192    padding: 0;
4193  }
4194  @media not (prefers-reduced-motion) {
4195    .block-editor-inserter__toggle.components-button {
4196      transition: color 0.2s ease;
4197    }
4198  }
4199  
4200  .block-editor-inserter__menu {
4201    height: 100%;
4202    position: relative;
4203    overflow: visible;
4204  }
4205  @media (min-width: 782px) {
4206    .block-editor-inserter__menu.show-panel {
4207      width: 630px;
4208    }
4209  }
4210  
4211  .block-editor-inserter__inline-elements {
4212    margin-top: -1px;
4213  }
4214  
4215  .block-editor-inserter__menu.is-bottom::after {
4216    border-bottom-color: #fff;
4217  }
4218  
4219  .components-popover.block-editor-inserter__popover {
4220    z-index: 99999;
4221  }
4222  
4223  .block-editor-inserter__search {
4224    padding: 16px;
4225    position: sticky;
4226    top: 0;
4227    z-index: 2;
4228    background-color: #fff;
4229    border-bottom: 1px solid transparent;
4230  }
4231  @media not (prefers-reduced-motion) {
4232    .block-editor-inserter__search {
4233      transition: border-bottom-color 0.1s linear;
4234    }
4235  }
4236  .block-editor-inserter__search.is-scrolled {
4237    border-bottom-color: #e0e0e0;
4238  }
4239  
4240  .block-editor-inserter__no-tab-container {
4241    overflow-y: auto;
4242    flex-grow: 1;
4243    position: relative;
4244  }
4245  
4246  .block-editor-inserter__panel-header {
4247    position: relative;
4248    display: inline-flex;
4249    align-items: center;
4250    padding: 0 16px;
4251  }
4252  
4253  .block-editor-inserter__panel-content {
4254    padding: 16px;
4255  }
4256  
4257  .block-editor-inserter__panel-title,
4258  .block-editor-inserter__panel-title button {
4259    margin: 0 12px 0 0;
4260    color: #757575;
4261    text-transform: uppercase;
4262    font-size: 11px;
4263    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
4264  }
4265  
4266  .block-editor-inserter__panel-dropdown select.components-select-control__input.components-select-control__input.components-select-control__input {
4267    height: 36px;
4268    line-height: 36px;
4269  }
4270  
4271  .block-editor-inserter__panel-dropdown select {
4272    border: none;
4273  }
4274  
4275  .block-editor-inserter__reusable-blocks-panel {
4276    position: relative;
4277    text-align: right;
4278  }
4279  
4280  .block-editor-inserter__no-results,
4281  .block-editor-inserter__patterns-loading {
4282    padding: 32px;
4283    text-align: center;
4284  }
4285  
4286  .block-editor-inserter__child-blocks {
4287    padding: 0 16px;
4288  }
4289  
4290  .block-editor-inserter__parent-block-header {
4291    display: flex;
4292    align-items: center;
4293  }
4294  .block-editor-inserter__parent-block-header h2 {
4295    font-size: 13px;
4296  }
4297  .block-editor-inserter__parent-block-header .block-editor-block-icon {
4298    margin-right: 8px;
4299  }
4300  
4301  .block-editor-inserter__preview-container {
4302    display: none;
4303    width: 280px;
4304    padding: 16px;
4305    max-height: calc(100% - 32px);
4306    overflow-y: hidden;
4307  }
4308  @media (min-width: 782px) {
4309    .block-editor-inserter__preview-container {
4310      display: block;
4311    }
4312  }
4313  .block-editor-inserter__preview-container .block-editor-inserter__media-list__list-item {
4314    height: 100%;
4315  }
4316  .block-editor-inserter__preview-container .block-editor-block-card {
4317    padding-left: 0;
4318    padding-right: 0;
4319    padding-bottom: 4px;
4320  }
4321  
4322  .block-editor-inserter__insertable-blocks-at-selection {
4323    border-bottom: 1px solid #e0e0e0;
4324  }
4325  
4326  .block-editor-inserter__media-tabs-container,
4327  .block-editor-inserter__block-patterns-tabs-container {
4328    flex-grow: 1;
4329    padding: 0 16px 16px;
4330    display: flex;
4331    flex-direction: column;
4332    justify-content: space-between;
4333  }
4334  
4335  .block-editor-inserter__media-tabs-container {
4336    padding-top: 16px;
4337  }
4338  
4339  .block-editor-inserter__category-tablist {
4340    margin-bottom: 8px;
4341  }
4342  
4343  .block-editor-inserter__category-panel {
4344    outline: 1px solid transparent;
4345    display: flex;
4346    flex-direction: column;
4347    padding: 0 16px;
4348  }
4349  @media (min-width: 782px) {
4350    .block-editor-inserter__category-panel {
4351      border-left: 1px solid #e0e0e0;
4352      padding: 0;
4353      left: 350px;
4354      width: 280px;
4355      position: absolute;
4356      top: -1px;
4357      height: calc(100% + 1px);
4358      background: #f0f0f0;
4359      border-top: 1px solid #e0e0e0;
4360    }
4361    .block-editor-inserter__category-panel .block-editor-inserter__media-list,
4362    .block-editor-inserter__category-panel .block-editor-block-patterns-list {
4363      padding: 0 24px 16px;
4364    }
4365  }
4366  
4367  .block-editor-inserter__patterns-category-panel-header {
4368    padding: 8px 0;
4369  }
4370  @media (min-width: 782px) {
4371    .block-editor-inserter__patterns-category-panel-header {
4372      padding: 8px 24px;
4373    }
4374  }
4375  
4376  .block-editor-inserter__patterns-category-no-results {
4377    margin-top: 24px;
4378  }
4379  
4380  .block-editor-inserter__patterns-filter-help {
4381    padding: 16px;
4382    border-top: 1px solid #ddd;
4383    color: #757575;
4384    min-width: 280px;
4385  }
4386  
4387  .block-editor-inserter__media-list,
4388  .block-editor-block-patterns-list {
4389    overflow-y: auto;
4390    flex-grow: 1;
4391    height: 100%;
4392  }
4393  
4394  .block-editor-inserter__preview-content {
4395    background: #f0f0f0;
4396    display: grid;
4397    flex-grow: 1;
4398    align-items: center;
4399  }
4400  
4401  .block-editor-inserter__preview-content-missing {
4402    flex: 1;
4403    display: flex;
4404    justify-content: center;
4405    align-items: center;
4406    min-height: 144px;
4407    color: #757575;
4408    background: #f0f0f0;
4409    border-radius: 2px;
4410  }
4411  
4412  .block-editor-inserter__tips {
4413    border-top: 1px solid #ddd;
4414    padding: 16px;
4415    flex-shrink: 0;
4416    position: relative;
4417  }
4418  
4419  .block-editor-inserter__quick-inserter {
4420    width: 100%;
4421    max-width: 100%;
4422  }
4423  @media (min-width: 782px) {
4424    .block-editor-inserter__quick-inserter {
4425      width: 350px;
4426    }
4427  }
4428  
4429  .block-editor-inserter__quick-inserter-results .block-editor-inserter__panel-header {
4430    height: 0;
4431    padding: 0;
4432    float: left;
4433  }
4434  
4435  .block-editor-inserter__quick-inserter.has-search .block-editor-inserter__panel-content,
4436  .block-editor-inserter__quick-inserter.has-expand .block-editor-inserter__panel-content {
4437    padding: 16px;
4438  }
4439  
4440  .block-editor-inserter__quick-inserter-patterns .block-editor-block-patterns-list {
4441    display: grid;
4442    grid-template-columns: 1fr 1fr;
4443    gap: 8px;
4444  }
4445  .block-editor-inserter__quick-inserter-patterns .block-editor-block-patterns-list .block-editor-block-patterns-list__list-item {
4446    margin-bottom: 0;
4447  }
4448  .block-editor-inserter__quick-inserter-patterns .block-editor-block-patterns-list .block-editor-inserter__media-list__list-item {
4449    min-height: 100px;
4450  }
4451  
4452  .block-editor-inserter__quick-inserter-separator {
4453    border-top: 1px solid #ddd;
4454  }
4455  
4456  .block-editor-inserter__popover.is-quick > .components-popover__content {
4457    padding: 0;
4458  }
4459  
4460  .block-editor-inserter__quick-inserter-expand {
4461    padding: 0 16px 16px;
4462  }
4463  
4464  .block-editor-inserter__quick-inserter-expand-toggle {
4465    width: 100%;
4466    justify-content: center;
4467  }
4468  
4469  .block-editor-block-patterns-explorer__sidebar {
4470    padding-bottom: 24px;
4471  }
4472  @media (min-width: 782px) {
4473    .block-editor-block-patterns-explorer__sidebar {
4474      position: absolute;
4475      top: 72px;
4476      left: 0;
4477      bottom: 0;
4478      width: 280px;
4479      padding: 24px;
4480      overflow-x: visible;
4481      overflow-y: auto;
4482    }
4483  }
4484  
4485  @media (min-width: 782px) {
4486    .block-editor-block-patterns-explorer__panel {
4487      margin-inline-start: 280px;
4488    }
4489  }
4490  
4491  .block-editor-block-patterns-explorer__no-results {
4492    padding: 32px;
4493    text-align: center;
4494  }
4495  
4496  .block-editor-block-patterns-explorer__list {
4497    padding: 24px 0 32px;
4498  }
4499  .block-editor-block-patterns-explorer__list .block-editor-patterns__sync-status-filter .components-input-control__container {
4500    width: 380px;
4501  }
4502  
4503  .block-editor-block-patterns-explorer .block-editor-block-patterns-list {
4504    display: grid;
4505    gap: 32px;
4506    grid-template-columns: repeat(1, 1fr);
4507    margin-bottom: 16px;
4508  }
4509  @media (min-width: 1080px) {
4510    .block-editor-block-patterns-explorer .block-editor-block-patterns-list {
4511      grid-template-columns: repeat(2, 1fr);
4512    }
4513  }
4514  @media (min-width: 1440px) {
4515    .block-editor-block-patterns-explorer .block-editor-block-patterns-list {
4516      grid-template-columns: repeat(3, 1fr);
4517    }
4518  }
4519  .block-editor-block-patterns-explorer .block-editor-block-patterns-list .block-editor-block-patterns-list__list-item {
4520    min-height: 240px;
4521  }
4522  .block-editor-block-patterns-explorer .block-editor-block-patterns-list .block-editor-inserter__media-list__list-item {
4523    height: inherit;
4524    min-height: 100px;
4525    max-height: 800px;
4526  }
4527  
4528  .components-heading.block-editor-inserter__patterns-category-panel-title {
4529    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
4530  }
4531  
4532  .block-editor-inserter__patterns-explore-button.components-button,
4533  .block-editor-inserter__media-library-button.components-button {
4534    padding: 16px;
4535    justify-content: center;
4536    margin-top: 16px;
4537    width: 100%;
4538  }
4539  
4540  .block-editor-inserter__media-mobile-screen {
4541    display: flex;
4542    flex-direction: column;
4543    align-self: stretch;
4544  }
4545  
4546  .block-editor-inserter__media-panel {
4547    padding: 0 16px;
4548    display: flex;
4549    flex-direction: column;
4550    flex: 1;
4551    min-height: 0;
4552  }
4553  @media (min-width: 782px) {
4554    .block-editor-inserter__media-panel {
4555      padding: 0;
4556      flex: 0 1 auto;
4557      min-height: 100%;
4558    }
4559  }
4560  .block-editor-inserter__media-panel .block-editor-inserter__media-panel-spinner {
4561    height: 100%;
4562    display: flex;
4563    align-items: center;
4564    justify-content: center;
4565    flex: 1;
4566  }
4567  .block-editor-inserter__media-panel .block-editor-inserter__media-panel-search {
4568    margin-bottom: 24px;
4569  }
4570  @media (min-width: 782px) {
4571    .block-editor-inserter__media-panel .block-editor-inserter__media-panel-search {
4572      margin-bottom: 0;
4573      padding: 16px 24px 16px;
4574    }
4575  }
4576  .block-editor-inserter__media-panel .block-editor-inserter__no-results {
4577    flex-grow: 1;
4578  }
4579  .block-editor-inserter__media-panel .block-editor-inserter__media-panel-footer {
4580    flex-shrink: 0;
4581    padding-top: 16px;
4582    padding-bottom: 16px;
4583  }
4584  @media (min-width: 782px) {
4585    .block-editor-inserter__media-panel .block-editor-inserter__media-panel-footer {
4586      padding-left: 24px;
4587      padding-right: 24px;
4588    }
4589  }
4590  .block-editor-inserter__media-panel .block-editor-inserter__media-panel-attach.components-button {
4591    justify-content: center;
4592    padding: 16px;
4593  }
4594  .block-editor-inserter__media-panel .block-editor-inserter__media-panel-results {
4595    display: flex;
4596    flex-direction: column;
4597    flex-grow: 1;
4598    min-height: 0;
4599  }
4600  .block-editor-inserter__media-panel .block-editor-inserter__media-panel-results.is-loading .block-editor-inserter__media-list {
4601    opacity: 0.5;
4602    pointer-events: none;
4603  }
4604  @media not (prefers-reduced-motion) {
4605    .block-editor-inserter__media-panel .block-editor-inserter__media-panel-results.is-loading .block-editor-inserter__media-list {
4606      opacity: 1;
4607      animation: inserter-media-panel-pulse 1s ease-in-out infinite;
4608    }
4609  }
4610  .block-editor-inserter__media-panel.has-footer .block-editor-inserter__media-list {
4611    padding-bottom: 0;
4612  }
4613  
4614  @keyframes inserter-media-panel-pulse {
4615    0%, 100% {
4616      opacity: 1;
4617    }
4618    50% {
4619      opacity: 0.5;
4620    }
4621  }
4622  .block-editor-inserter__media-panel-detach-modal {
4623    z-index: 1000001;
4624  }
4625  .block-editor-inserter__media-panel-detach-modal p {
4626    margin-top: 0;
4627  }
4628  
4629  .block-editor-inserter__media-panel-detach-actions {
4630    display: flex;
4631    justify-content: flex-end;
4632    gap: 8px;
4633    margin-top: 16px;
4634  }
4635  
4636  .block-editor-inserter__media-list__list-item {
4637    position: relative;
4638    cursor: var(--wpds-cursor-control, pointer);
4639    margin-bottom: 24px;
4640  }
4641  .block-editor-inserter__media-list__list-item.is-placeholder {
4642    min-height: 100px;
4643  }
4644  .block-editor-inserter__media-list__list-item[draggable=true] .block-editor-inserter__media-list__list-item {
4645    cursor: grab;
4646  }
4647  .block-editor-inserter__media-list__list-item.is-hovered .block-editor-inserter__media-list__item-preview > * {
4648    outline-color: rgba(0, 0, 0, 0.3);
4649  }
4650  .block-editor-inserter__media-list__list-item.is-hovered .block-editor-inserter__media-list__item-preview-options > button, .block-editor-inserter__media-list__list-item:focus-within .block-editor-inserter__media-list__item-preview-options > button {
4651    display: block;
4652  }
4653  .block-editor-inserter__media-list__list-item .block-editor-inserter__media-list__item-preview-options {
4654    position: absolute;
4655    right: 8px;
4656    top: 8px;
4657  }
4658  .block-editor-inserter__media-list__list-item .block-editor-inserter__media-list__item-preview-options > button {
4659    background: #fff;
4660    display: none;
4661  }
4662  .block-editor-inserter__media-list__list-item .block-editor-inserter__media-list__item-preview-options > button.is-opened, .block-editor-inserter__media-list__list-item .block-editor-inserter__media-list__item-preview-options > button:focus {
4663    display: block;
4664  }
4665  .block-editor-inserter__media-list__list-item .block-editor-inserter__media-list__item-preview-options > button:hover {
4666    box-shadow: inset 0 0 0 2px #fff, 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
4667    outline: 2px solid transparent;
4668  }
4669  
4670  .block-editor-inserter__media-list__item {
4671    height: 100%;
4672  }
4673  .block-editor-inserter__media-list__item .block-editor-inserter__media-list__item-preview {
4674    display: flex;
4675    align-items: center;
4676    overflow: hidden;
4677    border-radius: 2px;
4678  }
4679  .block-editor-inserter__media-list__item .block-editor-inserter__media-list__item-preview > * {
4680    margin: 0 auto;
4681    max-width: 100%;
4682    outline: 1px solid rgba(0, 0, 0, 0.1);
4683    outline-offset: -1px;
4684  }
4685  .block-editor-inserter__media-list__item .block-editor-inserter__media-list__item-preview .block-editor-inserter__media-list__item-preview-spinner {
4686    display: flex;
4687    height: 100%;
4688    width: 100%;
4689    position: absolute;
4690    justify-content: center;
4691    background: rgba(255, 255, 255, 0.7);
4692    align-items: center;
4693    pointer-events: none;
4694  }
4695  .block-editor-inserter__media-list__item:focus .block-editor-inserter__media-list__item-preview > * {
4696    outline-color: var(--wp-admin-theme-color);
4697    outline-width: var(--wp-admin-border-width-focus);
4698    outline-offset: calc(-1 * var(--wp-admin-border-width-focus));
4699  }
4700  @media not (prefers-reduced-motion) {
4701    .block-editor-inserter__media-list__item:focus .block-editor-inserter__media-list__item-preview > * {
4702      transition: outline 0.1s linear;
4703    }
4704  }
4705  
4706  .block-editor-inserter__media-list__item-preview-options__popover .components-menu-item__button .components-menu-item__item {
4707    min-width: auto;
4708  }
4709  
4710  .block-editor-inserter__mobile-tab-navigation {
4711    padding: 16px;
4712    height: 100%;
4713  }
4714  .block-editor-inserter__mobile-tab-navigation > * {
4715    height: 100%;
4716  }
4717  
4718  @media (min-width: 600px) {
4719    .block-editor-inserter-media-tab-media-preview-inserter-external-image-modal {
4720      max-width: 480px;
4721    }
4722  }
4723  .block-editor-inserter-media-tab-media-preview-inserter-external-image-modal p {
4724    margin: 0;
4725  }
4726  
4727  .block-editor-inserter__hint {
4728    margin: 16px 16px 0;
4729  }
4730  
4731  .block-editor-patterns__sync-status-filter .components-input-control__container select.components-select-control__input {
4732    height: 40px;
4733  }
4734  
4735  .block-editor-inserter__pattern-panel-placeholder {
4736    display: none;
4737  }
4738  
4739  .block-editor-inserter__menu.is-zoom-out {
4740    display: flex;
4741  }
4742  @media (min-width: 782px) {
4743    .block-editor-inserter__menu.is-zoom-out.show-panel::after {
4744      content: "";
4745      display: block;
4746      width: 300px;
4747      height: 100%;
4748    }
4749  }
4750  
4751  @media (max-width: 959px) {
4752    .show-icon-labels .block-editor-block-patterns-explorer .block-editor-patterns__grid-pagination {
4753      flex-direction: column;
4754    }
4755    .show-icon-labels .block-editor-block-patterns-explorer .block-editor-patterns__grid-pagination .block-editor-patterns__grid-pagination-previous,
4756    .show-icon-labels .block-editor-block-patterns-explorer .block-editor-patterns__grid-pagination .block-editor-patterns__grid-pagination-next {
4757      flex-direction: column;
4758    }
4759  }
4760  .show-icon-labels .block-editor-inserter__category-panel .block-editor-patterns__grid-pagination {
4761    flex-direction: column;
4762  }
4763  .show-icon-labels .block-editor-inserter__category-panel .block-editor-patterns__grid-pagination .block-editor-patterns__grid-pagination-previous,
4764  .show-icon-labels .block-editor-inserter__category-panel .block-editor-patterns__grid-pagination .block-editor-patterns__grid-pagination-next {
4765    flex-direction: column;
4766  }
4767  
4768  .block-editor-tabbed-sidebar__tabpanel .block-editor-inserter__help-text {
4769    display: none;
4770    padding: 0 24px 16px;
4771  }
4772  @media (min-width: 480px) {
4773    .block-editor-tabbed-sidebar__tabpanel .block-editor-inserter__help-text {
4774      display: block;
4775    }
4776  }
4777  
4778  .spacing-sizes-control {
4779    border: 0;
4780    padding: 0;
4781    margin: 0;
4782  }
4783  .spacing-sizes-control .spacing-sizes-control__unit-control,
4784  .spacing-sizes-control .spacing-sizes-control__label {
4785    margin-bottom: 0;
4786  }
4787  .spacing-sizes-control .spacing-sizes-control__preset-range,
4788  .spacing-sizes-control .spacing-sizes-control__custom-value-range {
4789    flex: 1;
4790    margin-bottom: 0;
4791  }
4792  
4793  .spacing-sizes-control__header {
4794    height: 16px;
4795    margin-bottom: 12px;
4796  }
4797  
4798  .spacing-sizes-control__wrapper {
4799    align-items: center;
4800  }
4801  
4802  .spacing-sizes-control__dropdown {
4803    height: 24px;
4804  }
4805  
4806  .spacing-sizes-control__wrapper .preset-input-control__icon {
4807    margin-left: -4px;
4808  }
4809  
4810  .block-editor-block-visibility-modal {
4811    z-index: 1000001;
4812  }
4813  .block-editor-block-visibility-modal__options {
4814    border: 0;
4815    padding: 0;
4816    list-style: none;
4817    margin: 24px 0;
4818  }
4819  .block-editor-block-visibility-modal__options-item {
4820    display: flex;
4821    align-items: center;
4822    justify-content: space-between;
4823    margin: 0 0 16px 0;
4824    gap: 24px;
4825  }
4826  .block-editor-block-visibility-modal__options-item:last-child {
4827    margin: 0;
4828  }
4829  .block-editor-block-visibility-modal__options-item--everywhere {
4830    flex-direction: column;
4831    align-items: start;
4832  }
4833  .block-editor-block-visibility-modal__options-checkbox--everywhere {
4834    font-weight: var(--wpds-typography-font-weight-emphasis, 600);
4835  }
4836  .block-editor-block-visibility-modal__options-icon--checked {
4837    color: #ddd;
4838  }
4839  .block-editor-block-visibility-modal__sub-options {
4840    width: 100%;
4841    padding-inline-start: 12px;
4842  }
4843  .block-editor-block-visibility-modal__description {
4844    font-size: 12px;
4845    color: #757575;
4846  }
4847  
4848  .block-editor-block-visibility-info {
4849    margin: 0 16px 16px;
4850  }
4851  
4852  /* The stop element is invisible, so its focus indication is drawn around the
4853     canvas it stands for. For the iframed canvas it is an overlay instead of
4854     an outline, because Safari paints an outline on an iframe element
4855     underneath the iframe's content. */
4856  .block-editor-iframe__scale-container > .block-editor-writing-flow__canvas-stop:focus::after {
4857    content: "";
4858    position: absolute;
4859    inset: 0;
4860    z-index: 1;
4861    pointer-events: none;
4862    border: var(--wp-admin-border-width-focus) solid var(--wp-admin-theme-color);
4863  }
4864  
4865  .block-editor-writing-flow__canvas-stop:focus + .block-editor-writing-flow {
4866    outline: var(--wp-admin-border-width-focus) solid var(--wp-admin-theme-color);
4867    outline-offset: calc(-1 * var(--wp-admin-border-width-focus));
4868  }
4869  
4870  /* Looks like a tooltip. Shown at the top of the canvas while the stop is
4871     focused. Sticky, because on the widgets screen the stop spans scrolling
4872     content and the hint must stay in view; anywhere else there is nothing
4873     to scroll and it stays at the top of the canvas. */
4874  .block-editor-writing-flow__canvas-stop-hint {
4875    display: none;
4876    position: sticky;
4877    top: 16px;
4878    margin-inline: auto;
4879    width: fit-content;
4880    z-index: 2;
4881    background: #000;
4882    font-family: -apple-system, system-ui, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
4883    border-radius: 4px;
4884    color: #f0f0f0;
4885    text-align: center;
4886    line-height: 1.4;
4887    font-size: 12px;
4888    padding: 4px 8px;
4889    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);
4890    white-space: nowrap;
4891    pointer-events: none;
4892  }
4893  
4894  .block-editor-writing-flow__canvas-stop:focus > .block-editor-writing-flow__canvas-stop-hint {
4895    display: block;
4896  }


Generated : Wed Oct 14 08:20:33 2026 Cross-referenced by PHPXref