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