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