[Summary view] [Print] [Text view]

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