PluginProbe
Gutenberg / 23.7.2
Gutenberg v23.7.2
23.9.1 23.9.0 23.8.0 23.7.2 23.7.1 23.7.0 23.6.1 23.6.2 23.6.0 23.5.3 23.5.2 23.5.1 23.5.0 23.4.0 23.3.2 23.3.1 23.3.0 23.2.0 23.2.1 23.2.2 23.1.1 23.1.0 23.0.1 12.6.0 7.4.0 All 402 releases
gutenberg / build / styles / block-library / editor-rtl.css

editor-rtl.css in Gutenberg 23.7.2, at build/styles/block-library/editor-rtl.css

2,885 lines 74.4 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 /**
2 * Typography
3 */
4 /**
5 * SCSS Variables.
6 *
7 * Please use variables from this sheet to ensure consistency across the UI.
8 * Don't add to this sheet unless you're pretty sure the value will be reused in many places.
9 * For example, don't add rules to this sheet that affect block visuals. It's purely for UI.
10 */
11 /**
12 * Colors
13 */
14 /**
15 * Fonts & basic variables.
16 */
17 /**
18 * Typography
19 */
20 /**
21 * Grid System.
22 * https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/
23 */
24 /**
25 * Radius scale.
26 */
27 /**
28 * Elevation scale.
29 */
30 /**
31 * Dimensions.
32 */
33 /**
34 * Mobile specific styles
35 */
36 /**
37 * Editor styles.
38 */
39 /**
40 * Block & Editor UI.
41 */
42 /**
43 * Block paddings.
44 */
45 /**
46 * React Native specific.
47 * These variables do not appear to be used anywhere else.
48 */
49 /**
50 * Breakpoints & Media Queries
51 */
52 /**
53 * Converts a hex value into the rgb equivalent.
54 *
55 * @param {string} hex - the hexadecimal value to convert
56 * @return {string} comma separated rgb values
57 */
58 /**
59 * Long content fade mixin
60 *
61 * Creates a fading overlay to signify that the content is longer
62 * than the space allows.
63 */
64 /**
65 * Breakpoint mixins
66 */
67 /**
68 * Focus styles.
69 */
70 /**
71 * Standard focus rings for the WordPress Design System.
72 *
73 * Apply `outset-ring__focus` inside the relevant pseudo-class at the call site,
74 * e.g. `&:focus { @include outset-ring__focus(); }`.
75 */
76 /**
77 * Applies editor left position to the selector passed as argument
78 */
79 /**
80 * Styles that are reused verbatim in a few places
81 */
82 /**
83 * Allows users to opt-out of animations via OS-level preferences.
84 */
85 /**
86 * Reset default styles for JavaScript UI based pages.
87 * This is a WP-admin agnostic reset
88 */
89 /**
90 * Reset the WP Admin page styles for Gutenberg-like pages.
91 */
92 /**
93 * Creates a checkerboard pattern background to indicate transparency.
94 * @param {String} $size - The size of the squares in the checkerboard pattern. Default is 12px.
95 */
96 .block-library-utils__media-control {
97 position: relative;
98 }
99 .block-library-utils__media-control .components-drop-zone__content-icon {
100 display: none;
101 }
102 .block-library-utils__media-control .block-library-utils__media-control__replace-flow {
103 display: block;
104 }
105 .block-library-utils__media-control .block-library-utils__media-control__replace-flow button.components-button {
106 color: #1e1e1e;
107 border-color: #ccc;
108 width: 100%;
109 display: block;
110 height: 40px;
111 padding-left: 32px;
112 }
113 .block-library-utils__media-control .block-library-utils__media-control__replace-flow button.components-button:hover {
114 color: var(--wp-admin-theme-color);
115 }
116
117 .block-library-utils__media-control__inspector-media-replace-title {
118 word-break: break-all;
119 white-space: normal;
120 text-align: start;
121 }
122
123 .block-library-utils__media-control__inspector-image-indicator {
124 width: 20px;
125 height: 20px;
126 border-radius: 2px;
127 box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.2);
128 background: #fff linear-gradient(45deg, transparent 48%, #ddd 48%, #ddd 52%, transparent 52%);
129 background-size: cover;
130 outline: 1px solid transparent;
131 }
132
133 .block-library-utils__media-control__reset {
134 position: absolute;
135 left: 0;
136 top: 8px;
137 margin: auto 8px auto;
138 opacity: 0;
139 border-radius: 2px;
140 }
141 @media not (prefers-reduced-motion) {
142 .block-library-utils__media-control__reset {
143 transition: opacity 0.1s ease-in-out;
144 }
145 }
146 .block-library-utils__media-control:hover .block-library-utils__media-control__reset, .block-library-utils__media-control__reset:focus, .block-library-utils__media-control__reset:hover {
147 opacity: 1;
148 }
149 @media (hover: none) {
150 .block-library-utils__media-control__reset {
151 opacity: 1;
152 }
153 }
154
155 .wp-block-audio {
156 margin-right: 0;
157 margin-left: 0;
158 position: relative;
159 }
160 .wp-block-audio.is-transient audio {
161 opacity: 0.3;
162 }
163 .wp-block-audio .components-spinner {
164 position: absolute;
165 top: 50%;
166 right: 50%;
167 margin-top: -9px;
168 margin-right: -9px;
169 }
170
171 .wp-block-avatar__image img {
172 width: 100%;
173 }
174
175 .wp-block-avatar.aligncenter .components-resizable-box__container {
176 margin: 0 auto;
177 }
178
179 .wp-block[data-align=center] > .wp-block-button {
180 text-align: center;
181 margin-right: auto;
182 margin-left: auto;
183 }
184
185 .wp-block[data-align=right] > .wp-block-button {
186 text-align: right;
187 }
188
189 .wp-block-button {
190 position: relative;
191 cursor: text;
192 }
193 .wp-block-button:focus {
194 box-shadow: 0 0 0 1px #fff, 0 0 0 3px var(--wp-admin-theme-color);
195 outline: 2px solid transparent;
196 outline-offset: -2px;
197 }
198 .wp-block-button[data-rich-text-placeholder]::after {
199 opacity: 0.8;
200 }
201
202 div[data-type="core/button"] {
203 display: table;
204 }
205
206 .wp-block-buttons > .wp-block {
207 margin: 0;
208 }
209 .wp-block-buttons > .wp-block-button.wp-block-button.wp-block-button.wp-block-button.wp-block-button {
210 margin: 0;
211 }
212 .wp-block-buttons > .block-list-appender {
213 display: inline-flex;
214 align-items: center;
215 }
216 .wp-block-buttons.is-vertical > .block-list-appender .block-list-appender__toggle {
217 justify-content: flex-start;
218 }
219 .wp-block-buttons > .wp-block-button:focus {
220 box-shadow: none;
221 }
222 .wp-block-buttons {
223 /* stylelint-disable @stylistic/indentation -- Disable the stylelint rule, otherwise this selector is ugly! */
224 }
225 .wp-block-buttons:not(.is-content-justification-space-between,
226 .is-content-justification-right,
227 .is-content-justification-left,
228 .is-content-justification-center) .wp-block[data-align=center] {
229 /* stylelint-enable @stylistic/indentation */
230 margin-right: auto;
231 margin-left: auto;
232 margin-top: 0;
233 width: 100%;
234 }
235 .wp-block-buttons:not(.is-content-justification-space-between,
236 .is-content-justification-right,
237 .is-content-justification-left,
238 .is-content-justification-center) .wp-block[data-align=center] .wp-block-button {
239 margin-bottom: 0;
240 }
241
242 .wp-block[data-align=center] > .wp-block-buttons {
243 align-items: center;
244 justify-content: center;
245 }
246
247 .wp-block[data-align=right] > .wp-block-buttons {
248 justify-content: flex-end;
249 }
250
251 .wp-block-categories ul {
252 padding-right: 2.5em;
253 }
254 .wp-block-categories ul ul {
255 margin-top: 6px;
256 }
257
258 /* Center alignment for classic themes. */
259 [data-align=center] .wp-block-categories {
260 text-align: center;
261 }
262
263 .wp-block-categories__indentation {
264 padding-right: 16px;
265 }
266
267 .wp-block-code code {
268 background: none;
269 }
270
271 .wp-block-columns :where(.wp-block) {
272 max-width: none;
273 margin-right: 0;
274 margin-left: 0;
275 }
276
277 html :where(.wp-block-column) {
278 margin-top: 0;
279 margin-bottom: 0;
280 }
281
282 /* Styles for backwards compatibility with the legacy `post-comments` block */
283 .wp-block-post-comments, .wp-block-comments__legacy-placeholder {
284 box-sizing: border-box;
285 /* utility classes */
286 }
287 .wp-block-post-comments .alignleft, .wp-block-comments__legacy-placeholder .alignleft {
288 float: right;
289 }
290 .wp-block-post-comments .alignright, .wp-block-comments__legacy-placeholder .alignright {
291 float: left;
292 }
293 .wp-block-post-comments, .wp-block-comments__legacy-placeholder {
294 /* end utility classes */
295 }
296 .wp-block-post-comments .navigation::after, .wp-block-comments__legacy-placeholder .navigation::after {
297 content: "";
298 display: table;
299 clear: both;
300 }
301 .wp-block-post-comments .commentlist, .wp-block-comments__legacy-placeholder .commentlist {
302 clear: both;
303 list-style: none;
304 margin: 0;
305 padding: 0;
306 }
307 .wp-block-post-comments .commentlist .comment, .wp-block-comments__legacy-placeholder .commentlist .comment {
308 min-height: 2.25em;
309 padding-right: 3.25em;
310 }
311 .wp-block-post-comments .commentlist .comment p, .wp-block-comments__legacy-placeholder .commentlist .comment p {
312 font-size: 1em;
313 line-height: 1.8;
314 margin: 1em 0;
315 }
316 .wp-block-post-comments .commentlist .children, .wp-block-comments__legacy-placeholder .commentlist .children {
317 list-style: none;
318 margin: 0;
319 padding: 0;
320 }
321 .wp-block-post-comments .comment-author, .wp-block-comments__legacy-placeholder .comment-author {
322 line-height: 1.5;
323 }
324 .wp-block-post-comments .comment-author .avatar, .wp-block-comments__legacy-placeholder .comment-author .avatar {
325 border-radius: 1.5em;
326 display: block;
327 float: right;
328 height: 2.5em;
329 margin-top: 0.5em;
330 margin-left: 0.75em;
331 width: 2.5em;
332 }
333 .wp-block-post-comments .comment-author cite, .wp-block-comments__legacy-placeholder .comment-author cite {
334 font-style: normal;
335 }
336 .wp-block-post-comments .comment-meta, .wp-block-comments__legacy-placeholder .comment-meta {
337 font-size: 0.875em;
338 line-height: 1.5;
339 }
340 .wp-block-post-comments .comment-meta b, .wp-block-comments__legacy-placeholder .comment-meta b {
341 font-weight: normal;
342 }
343 .wp-block-post-comments .comment-meta .comment-awaiting-moderation, .wp-block-comments__legacy-placeholder .comment-meta .comment-awaiting-moderation {
344 margin-top: 1em;
345 margin-bottom: 1em;
346 display: block;
347 }
348 .wp-block-post-comments .comment-body .commentmetadata, .wp-block-comments__legacy-placeholder .comment-body .commentmetadata {
349 font-size: 0.875em;
350 }
351 .wp-block-post-comments .comment-form-comment label, .wp-block-comments__legacy-placeholder .comment-form-comment label,
352 .wp-block-post-comments .comment-form-author label,
353 .wp-block-comments__legacy-placeholder .comment-form-author label,
354 .wp-block-post-comments .comment-form-email label,
355 .wp-block-comments__legacy-placeholder .comment-form-email label,
356 .wp-block-post-comments .comment-form-url label,
357 .wp-block-comments__legacy-placeholder .comment-form-url label {
358 display: block;
359 margin-bottom: 0.25em;
360 }
361 .wp-block-post-comments .comment-form textarea, .wp-block-comments__legacy-placeholder .comment-form textarea,
362 .wp-block-post-comments .comment-form input:not([type=submit]):not([type=checkbox]),
363 .wp-block-comments__legacy-placeholder .comment-form input:not([type=submit]):not([type=checkbox]) {
364 display: block;
365 box-sizing: border-box;
366 width: 100%;
367 }
368 .wp-block-post-comments .comment-form-cookies-consent, .wp-block-comments__legacy-placeholder .comment-form-cookies-consent {
369 display: flex;
370 gap: 0.25em;
371 }
372 .wp-block-post-comments .comment-form-cookies-consent #wp-comment-cookies-consent, .wp-block-comments__legacy-placeholder .comment-form-cookies-consent #wp-comment-cookies-consent {
373 margin-top: 0.35em;
374 }
375 .wp-block-post-comments .comment-reply-title, .wp-block-comments__legacy-placeholder .comment-reply-title {
376 margin-bottom: 0;
377 }
378 .wp-block-post-comments .comment-reply-title :where(small), .wp-block-comments__legacy-placeholder .comment-reply-title :where(small) {
379 font-size: var(--wp--preset--font-size--medium, smaller);
380 margin-right: 0.5em;
381 }
382 .wp-block-post-comments .reply, .wp-block-comments__legacy-placeholder .reply {
383 font-size: 0.875em;
384 margin-bottom: 1.4em;
385 }
386 .wp-block-post-comments textarea, .wp-block-comments__legacy-placeholder textarea,
387 .wp-block-post-comments input:not([type=submit]),
388 .wp-block-comments__legacy-placeholder input:not([type=submit]) {
389 border: 1px solid #949494;
390 font-size: 1em;
391 font-family: inherit;
392 }
393 .wp-block-post-comments textarea, .wp-block-comments__legacy-placeholder textarea,
394 .wp-block-post-comments input:not([type=submit]):not([type=checkbox]),
395 .wp-block-comments__legacy-placeholder input:not([type=submit]):not([type=checkbox]) {
396 padding: calc(0.667em + 2px);
397 }
398
399 :where(.wp-block-post-comments input[type=submit], .wp-block-comments__legacy-placeholder input[type=submit]) {
400 border: none;
401 }
402
403 .wp-block-comments {
404 box-sizing: border-box;
405 }
406
407 .block-library-comments-toolbar__popover .components-popover__content {
408 min-width: 230px;
409 }
410
411 .wp-block-comments__legacy-placeholder * {
412 pointer-events: none;
413 }
414
415 .wp-block-comment-author-avatar__placeholder {
416 border: currentColor 1px dashed;
417 width: 100%;
418 height: 100%;
419 stroke: currentColor;
420 stroke-dasharray: 3;
421 }
422
423 .wp-block[data-align=center] > .wp-block-comments-pagination {
424 justify-content: center;
425 }
426
427 :where(.editor-styles-wrapper) .wp-block-comments-pagination {
428 max-width: 100%;
429 }
430
431 .wp-block-comments-pagination > .wp-block-comments-pagination-next,
432 .wp-block-comments-pagination > .wp-block-comments-pagination-previous,
433 .wp-block-comments-pagination > .wp-block-comments-pagination-numbers {
434 font-size: inherit;
435 }
436
437 .wp-block-comments-pagination-numbers a {
438 text-decoration: underline;
439 }
440 .wp-block-comments-pagination-numbers .page-numbers {
441 margin-left: 2px;
442 }
443 .wp-block-comments-pagination-numbers .page-numbers:last-child {
444 margin-right: 0;
445 }
446
447 .wp-block-comments-title.has-background {
448 padding: inherit;
449 }
450
451 .wp-block-cover.is-placeholder {
452 padding: 0 !important;
453 display: flex;
454 align-items: stretch;
455 min-height: 240px;
456 }
457 .wp-block-cover.is-placeholder .components-placeholder.is-large {
458 justify-content: flex-start;
459 z-index: 1;
460 }
461 .wp-block-cover.is-placeholder:focus::after {
462 min-height: auto;
463 }
464 .wp-block-cover.components-placeholder h2 {
465 color: inherit;
466 }
467 .wp-block-cover.is-transient {
468 position: relative;
469 }
470 .wp-block-cover.is-transient::before {
471 background-color: #fff;
472 content: "";
473 height: 100%;
474 opacity: 0.3;
475 position: absolute;
476 width: 100%;
477 z-index: 1;
478 }
479 .wp-block-cover.is-transient .wp-block-cover__inner-container {
480 z-index: 2;
481 }
482 .wp-block-cover.is-transient .components-spinner {
483 z-index: 3;
484 }
485 .wp-block-cover .components-spinner {
486 position: absolute;
487 top: 50%;
488 right: 50%;
489 transform: translate(50%, -50%);
490 margin: 0;
491 }
492 .wp-block-cover .wp-block-cover__inner-container {
493 text-align: right;
494 margin-right: 0;
495 margin-left: 0;
496 }
497 .wp-block-cover .wp-block-cover__placeholder-background-options {
498 width: 100%;
499 }
500 .wp-block-cover .wp-block-cover__image--placeholder-image {
501 position: absolute;
502 top: 0;
503 left: 0;
504 bottom: 0;
505 right: 0;
506 }
507
508 [data-align=left] > .wp-block-cover,
509 [data-align=right] > .wp-block-cover {
510 max-width: 420px;
511 width: 100%;
512 }
513
514 .block-library-cover__reset-button {
515 margin-right: auto;
516 }
517
518 .block-library-cover__resize-container {
519 position: absolute !important;
520 top: 0;
521 right: 0;
522 left: 0;
523 bottom: 0;
524 min-height: 50px;
525 }
526
527 .components-popover.block-editor-block-popover.block-library-cover__resizable-box-popover .components-popover__content > div,
528 .components-popover.block-editor-block-popover.block-library-cover__resizable-box-popover .block-library-cover__resize-container {
529 pointer-events: none;
530 overflow: visible;
531 }
532
533 .block-editor-block-patterns-list__list-item .has-parallax.wp-block-cover {
534 background-attachment: scroll;
535 }
536
537 .color-block-support-panel__inner-wrapper > :not(.block-editor-tools-panel-color-gradient-settings__item) {
538 margin-top: 24px;
539 }
540
541 .wp-block-details summary div {
542 display: inline;
543 }
544
545 .wp-block-embed {
546 margin-right: 0;
547 margin-left: 0;
548 clear: both;
549 }
550 .wp-block-embed.is-loading {
551 display: flex;
552 justify-content: center;
553 }
554 .wp-block-embed .wp-block-embed__placeholder-input {
555 flex: 1 1 auto;
556 }
557 .wp-block-embed .components-placeholder__error {
558 word-break: break-word;
559 }
560
561 .wp-block-post-content .wp-block-embed__learn-more a {
562 color: var(--wp-admin-theme-color);
563 }
564
565 .block-library-embed__interactive-overlay {
566 position: absolute;
567 top: 0;
568 right: 0;
569 left: 0;
570 bottom: 0;
571 opacity: 0;
572 }
573
574 .wp-block[data-align=left] > .wp-block-embed,
575 .wp-block[data-align=right] > .wp-block-embed {
576 max-width: 360px;
577 width: 100%;
578 }
579 .wp-block[data-align=left] > .wp-block-embed .wp-block-embed__wrapper,
580 .wp-block[data-align=right] > .wp-block-embed .wp-block-embed__wrapper {
581 min-width: 280px;
582 }
583
584 .wp-block[data-align=left] > .wp-block-file, .wp-block[data-align=right] > .wp-block-file {
585 height: auto;
586 }
587 .wp-block[data-align=center] > .wp-block-file {
588 text-align: center;
589 }
590 .wp-block-file {
591 display: flex;
592 flex-wrap: wrap;
593 justify-content: space-between;
594 align-items: center;
595 margin-bottom: 0;
596 }
597 .wp-block-file .components-resizable-box__container {
598 margin-bottom: 1em;
599 }
600 .wp-block-file .wp-block-file__preview {
601 margin-bottom: 1em;
602 width: 100%;
603 height: 100%;
604 }
605 .wp-block-file .wp-block-file__preview-overlay {
606 position: absolute;
607 top: 0;
608 left: 0;
609 bottom: 0;
610 right: 0;
611 }
612 .wp-block-file .wp-block-file__content-wrapper {
613 flex-grow: 1;
614 }
615 .wp-block-file a {
616 min-width: 1em;
617 }
618 .wp-block-file a:not(.wp-block-file__button) {
619 display: inline-block;
620 }
621 .wp-block-file .wp-block-file__button-richtext-wrapper {
622 display: inline-block;
623 margin-right: 0.75em;
624 }
625
626 .wp-block-form-input .is-input-hidden {
627 display: flex;
628 position: relative;
629 font-size: 0.85em;
630 opacity: 0.3;
631 border: 1px dashed;
632 padding: 0.5em;
633 box-sizing: border-box;
634 background: repeating-linear-gradient(-45deg, transparent, transparent 5px, currentColor 5px, currentColor 6px);
635 justify-content: center;
636 align-items: center;
637 }
638 .wp-block-form-input .is-input-hidden::after {
639 content: attr(data-message);
640 }
641 .wp-block-form-input.is-selected .is-input-hidden {
642 opacity: 1;
643 background: none;
644 }
645
646 .wp-block-form-submission-notification > * {
647 opacity: 0.25;
648 border: 1px dashed;
649 box-sizing: border-box;
650 background: repeating-linear-gradient(-45deg, transparent, transparent 5px, currentColor 5px, currentColor 6px);
651 }
652 .wp-block-form-submission-notification.is-selected > *, .wp-block-form-submission-notification:has(.is-selected) > * {
653 opacity: 1;
654 background: none;
655 }
656 .wp-block-form-submission-notification.is-selected::after, .wp-block-form-submission-notification:has(.is-selected)::after {
657 display: none !important;
658 }
659 .wp-block-form-submission-notification::after {
660 display: flex;
661 position: absolute;
662 width: 100%;
663 height: 100%;
664 top: 0;
665 right: 0;
666 justify-content: center;
667 align-items: center;
668 font-size: 1.1em;
669 }
670 .wp-block-form-submission-notification.form-notification-type-success::after {
671 content: attr(data-message-success);
672 }
673 .wp-block-form-submission-notification.form-notification-type-error::after {
674 content: attr(data-message-error);
675 }
676
677 .block-editor-freeform-modal .block-editor-freeform-modal__content .mce-edit-area iframe {
678 height: 50vh !important;
679 }
680 @media (min-width: 960px) {
681 .block-editor-freeform-modal .block-editor-freeform-modal__content:not(.is-full-screen) {
682 height: 9999rem;
683 }
684 .block-editor-freeform-modal .block-editor-freeform-modal__content .components-modal__header + div {
685 height: 100%;
686 }
687 .block-editor-freeform-modal .block-editor-freeform-modal__content .mce-tinymce {
688 height: calc(100% - 36px - 16px);
689 }
690 .block-editor-freeform-modal .block-editor-freeform-modal__content .mce-container-body {
691 height: 100%;
692 display: flex;
693 flex-direction: column;
694 min-width: 50vw;
695 }
696 .block-editor-freeform-modal .block-editor-freeform-modal__content .mce-edit-area {
697 flex-grow: 1;
698 display: flex;
699 flex-direction: column;
700 }
701 .block-editor-freeform-modal .block-editor-freeform-modal__content .mce-edit-area iframe {
702 flex-grow: 1;
703 height: 10px !important;
704 }
705 }
706 .block-editor-freeform-modal__actions {
707 margin-top: 16px;
708 }
709
710 :root :where(figure.wp-block-gallery) {
711 display: block;
712 }
713 :root :where(figure.wp-block-gallery) > .blocks-gallery-caption {
714 flex: 0 0 100%;
715 }
716 :root :where(figure.wp-block-gallery) .block-editor-media-placeholder.is-appender .components-placeholder__label {
717 display: none;
718 }
719 :root :where(figure.wp-block-gallery) .block-editor-media-placeholder.is-appender .block-editor-media-placeholder__button {
720 margin-bottom: 0;
721 }
722 :root :where(figure.wp-block-gallery) .block-editor-media-placeholder {
723 margin: 0;
724 }
725 :root :where(figure.wp-block-gallery) .block-editor-media-placeholder .components-placeholder__label {
726 display: flex;
727 }
728 :root :where(figure.wp-block-gallery) .block-editor-media-placeholder figcaption {
729 z-index: 2;
730 }
731 :root :where(figure.wp-block-gallery) .components-spinner {
732 position: absolute;
733 top: 50%;
734 right: 50%;
735 margin-top: -9px;
736 margin-right: -9px;
737 }
738
739 /**
740 * Gallery inspector controls settings.
741 */
742 .gallery-settings-buttons .components-button:first-child {
743 margin-left: 8px;
744 }
745
746 /**
747 * Deprecated css past this point. This can be removed once all galleries are migrated
748 * to V2.
749 */
750 .blocks-gallery-item figure:not(.is-selected):focus,
751 .blocks-gallery-item img:focus {
752 outline: none;
753 }
754 .blocks-gallery-item figure.is-selected::before {
755 box-shadow: 0 0 0 1px #fff inset, 0 0 0 3px var(--wp-admin-theme-color) inset;
756 content: "";
757 outline: 2px solid transparent;
758 position: absolute;
759 top: 0;
760 left: 0;
761 bottom: 0;
762 right: 0;
763 z-index: 1;
764 pointer-events: none;
765 }
766 .blocks-gallery-item figure.is-transient img {
767 opacity: 0.3;
768 }
769 .blocks-gallery-item .block-editor-media-placeholder {
770 margin: 0;
771 height: 100%;
772 }
773 .blocks-gallery-item .block-editor-media-placeholder .components-placeholder__label {
774 display: flex;
775 }
776
777 .wp-block-gallery ul.blocks-gallery-grid {
778 padding: 0;
779 margin: 0;
780 }
781
782 @media (min-width: 600px) {
783 .wp-block-update-gallery-modal {
784 max-width: 480px;
785 }
786 }
787
788 .wp-block-update-gallery-modal-buttons {
789 display: flex;
790 justify-content: flex-end;
791 gap: 12px;
792 }
793
794 .wp-block-gallery__source-settings {
795 grid-column: 1/-1;
796 display: flex;
797 flex-direction: column;
798 gap: 8px;
799 }
800 .wp-block-gallery__source-settings .wp-block-gallery__source-description {
801 margin: 0;
802 color: #757575;
803 font-size: 12px;
804 }
805 .wp-block-gallery__source-settings .components-button {
806 justify-content: center;
807 width: 100%;
808 }
809
810 .wp-block-gallery__source-notice {
811 grid-column: 1/-1;
812 margin: 0;
813 }
814
815 /**
816 * Group: All Alignment Settings
817 */
818 .wp-block-group .block-editor-block-list__insertion-point {
819 right: 0;
820 left: 0;
821 }
822
823 [data-type="core/group"].is-selected .block-list-appender {
824 margin-right: 0;
825 margin-left: 0;
826 }
827 [data-type="core/group"].is-selected .has-background .block-list-appender {
828 margin-top: 18px;
829 margin-bottom: 18px;
830 }
831
832 .wp-block-group.is-layout-flex.block-editor-block-list__block > .block-list-appender:only-child {
833 gap: inherit;
834 }
835 .wp-block-group.is-layout-flex.block-editor-block-list__block > .block-list-appender:only-child,
836 .wp-block-group.is-layout-flex.block-editor-block-list__block > .block-list-appender:only-child .block-editor-default-block-appender__content,
837 .wp-block-group.is-layout-flex.block-editor-block-list__block > .block-list-appender:only-child .block-editor-inserter {
838 display: inherit;
839 width: 100%;
840 flex-direction: inherit;
841 flex: 1;
842 }
843 .wp-block-group.is-layout-flex.block-editor-block-list__block > .block-list-appender:only-child::after {
844 content: "";
845 display: flex;
846 flex: 1 0 40px;
847 pointer-events: none;
848 min-height: 38px;
849 border: 1px dashed currentColor;
850 }
851 .wp-block-group.is-layout-flex.block-editor-block-list__block > .block-list-appender:only-child {
852 pointer-events: none;
853 }
854 .wp-block-group.is-layout-flex.block-editor-block-list__block > .block-list-appender:only-child .block-editor-inserter,
855 .wp-block-group.is-layout-flex.block-editor-block-list__block > .block-list-appender:only-child .block-editor-button-block-appender {
856 pointer-events: all;
857 }
858
859 .block-library-html__edit .block-library-html__preview-overlay {
860 position: absolute;
861 width: 100%;
862 height: 100%;
863 top: 0;
864 right: 0;
865 }
866
867 .block-library-html__edit-code {
868 margin: 16px;
869 }
870 .block-library-html__edit-code .block-library-html__edit-code-button {
871 justify-content: center;
872 }
873
874 @media (min-width: 600px) {
875 .block-library-html__modal:not(.is-full-screen) {
876 height: 9999rem;
877 }
878 }
879 .block-library-html__modal .components-modal__children-container {
880 height: 100%;
881 }
882
883 .block-library-html__modal-tabs {
884 flex: 1;
885 }
886
887 .block-library-html__modal-content {
888 flex: 1;
889 }
890
891 .block-library-html__modal-tab {
892 height: 100%;
893 display: flex;
894 flex-direction: column;
895 margin: 0;
896 box-sizing: border-box;
897 border: 1px solid #e0e0e0;
898 border-radius: 2px;
899 padding: 16px;
900 font-family: Menlo, Consolas, monaco, monospace;
901 }
902
903 .block-library-html__modal-editor {
904 width: 100%;
905 height: 100%;
906 flex: 1;
907 border: none;
908 background: transparent;
909 padding: 0;
910 font-family: inherit;
911 font-size: inherit;
912 line-height: inherit;
913 color: inherit;
914 resize: none;
915 direction: ltr;
916 overflow-x: auto;
917 box-sizing: border-box;
918 }
919 .block-library-html__modal-editor:focus {
920 outline: none;
921 box-shadow: none;
922 }
923
924 .block-library-html__preview {
925 display: flex;
926 align-items: center;
927 justify-content: center;
928 min-height: 0;
929 overflow-y: auto;
930 flex: 1;
931 }
932 .block-library-html__preview iframe {
933 height: 100%;
934 }
935
936 .wp-block[data-align=center] > .wp-block-icon {
937 display: flex;
938 justify-content: center;
939 }
940
941 .wp-block-icon__inserter-sidebar {
942 padding-bottom: 24px;
943 }
944 @media (min-width: 782px) {
945 .wp-block-icon__inserter-sidebar {
946 overflow-x: visible;
947 overflow-y: auto;
948 position: absolute;
949 top: 72px;
950 right: 0;
951 bottom: 0;
952 width: 280px;
953 padding-top: 24px;
954 padding-inline: 24px;
955 }
956 }
957
958 @media (min-width: 782px) {
959 .wp-block-icon__inserter-panel {
960 margin-inline-start: 280px;
961 }
962 }
963
964 .wp-block-icon__inserter-loading {
965 display: flex;
966 justify-content: center;
967 padding: 24px;
968 }
969
970 .wp-block-icon__inserter-grid-icons-list {
971 display: grid;
972 grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
973 }
974
975 .wp-block-icon__inserter-grid-no-results {
976 display: flex;
977 justify-content: center;
978 }
979
980 .wp-block-icon__inserter-grid-icons-list-item {
981 display: flex;
982 flex-direction: column;
983 height: auto !important;
984 }
985
986 .wp-block-icon__inserter-grid-icons-list-item-icon {
987 padding: 12px;
988 }
989 .wp-block-icon__inserter-grid-icons-list-item-icon svg {
990 display: block;
991 width: 24px;
992 height: 24px;
993 }
994
995 .wp-block-icon__inserter-grid-icons-list-item-title {
996 font-size: 12px;
997 padding: 4px 4px 8px;
998 overflow-wrap: break-word;
999 }
1000
1001 .wp-block-icon__toolbar-content {
1002 width: 250px;
1003 }
1004
1005 .wp-block-icon__placeholder {
1006 backdrop-filter: blur(100px);
1007 }
1008
1009 .wp-block-image.wp-block-image .block-editor-media-placeholder.is-small {
1010 min-height: 60px;
1011 }
1012
1013 figure.wp-block-image:not(.wp-block) {
1014 margin: 0;
1015 }
1016
1017 .wp-block-image {
1018 position: relative;
1019 }
1020 .wp-block-image.is-transient:not(.alignwide):not(.alignfull), .wp-block-image:has(img.is-swapping-media):not(.alignwide):not(.alignfull) {
1021 width: -moz-fit-content;
1022 width: fit-content;
1023 }
1024 .wp-block-image .is-applying img, .wp-block-image.is-transient img,
1025 .wp-block-image img.is-swapping-media {
1026 opacity: 0.3;
1027 }
1028 .wp-block-image figcaption img {
1029 display: inline;
1030 }
1031 .wp-block-image .components-spinner {
1032 position: absolute;
1033 top: 50%;
1034 right: 50%;
1035 transform: translate(50%, -50%);
1036 margin: 0;
1037 }
1038
1039 .wp-block-image__placeholder {
1040 aspect-ratio: 4/3;
1041 }
1042 .wp-block-image__placeholder.has-illustration::before {
1043 background: #fff;
1044 opacity: 0.8;
1045 }
1046 .wp-block-image__placeholder .components-placeholder__illustration {
1047 opacity: 0.1;
1048 }
1049
1050 .wp-block-image.is-selected .block-editor-media-placeholder {
1051 filter: none !important;
1052 }
1053
1054 .block-editor-block-list__block[data-type="core/image"] .block-editor-block-toolbar .block-editor-url-input__button-modal {
1055 position: absolute;
1056 right: 0;
1057 left: 0;
1058 margin: -1px 0;
1059 }
1060 @media (min-width: 600px) {
1061 .block-editor-block-list__block[data-type="core/image"] .block-editor-block-toolbar .block-editor-url-input__button-modal {
1062 margin: -1px;
1063 }
1064 }
1065
1066 [data-align=wide] > .wp-block-image img,
1067 [data-align=full] > .wp-block-image img {
1068 height: auto;
1069 width: 100%;
1070 }
1071
1072 .wp-block[data-align=left] > .wp-block-image,
1073 .wp-block[data-align=center] > .wp-block-image,
1074 .wp-block[data-align=right] > .wp-block-image {
1075 display: table;
1076 }
1077 .wp-block[data-align=left] > .wp-block-image > figcaption,
1078 .wp-block[data-align=center] > .wp-block-image > figcaption,
1079 .wp-block[data-align=right] > .wp-block-image > figcaption {
1080 display: table-caption;
1081 caption-side: bottom;
1082 }
1083
1084 .wp-block[data-align=left] > .wp-block-image {
1085 margin-left: 1em;
1086 margin-right: 0;
1087 margin-top: 0.5em;
1088 margin-bottom: 0.5em;
1089 }
1090
1091 .wp-block[data-align=right] > .wp-block-image {
1092 margin-right: 1em;
1093 margin-left: 0;
1094 margin-top: 0.5em;
1095 margin-bottom: 0.5em;
1096 }
1097
1098 .wp-block[data-align=center] > .wp-block-image {
1099 margin-right: auto;
1100 margin-left: auto;
1101 text-align: center;
1102 }
1103
1104 .wp-block[data-align]:has(> .wp-block-image) {
1105 position: relative;
1106 }
1107
1108 .wp-block-image__toolbar_content_textarea__container {
1109 padding: 8px;
1110 }
1111
1112 .wp-block-image__toolbar_content_textarea {
1113 width: 250px;
1114 }
1115
1116 .wp-block-latest-posts > li {
1117 overflow: hidden;
1118 }
1119
1120 .wp-block-latest-posts li a > div {
1121 display: inline;
1122 }
1123
1124 :root :where(.wp-block-latest-posts) {
1125 padding-right: 2.5em;
1126 }
1127
1128 :root :where(.wp-block-latest-posts.is-grid),
1129 :root :where(.wp-block-latest-posts__list) {
1130 padding-right: 0;
1131 }
1132
1133 .wp-block-math__textarea-control textarea {
1134 font-family: Menlo, Consolas, monaco, monospace;
1135 direction: ltr;
1136 }
1137
1138 .wp-block-media-text__media {
1139 position: relative;
1140 }
1141 .wp-block-media-text__media.is-transient img {
1142 opacity: 0.3;
1143 }
1144 .wp-block-media-text__media .components-spinner {
1145 position: absolute;
1146 top: 50%;
1147 right: 50%;
1148 margin-top: -9px;
1149 margin-right: -9px;
1150 }
1151
1152 .wp-block-media-text .__resizable_base__ {
1153 grid-column: 1/span 2;
1154 grid-row: 2;
1155 }
1156
1157 .wp-block-media-text .editor-media-container__resizer {
1158 width: 100% !important;
1159 }
1160
1161 .wp-block-media-text.is-image-fill .editor-media-container__resizer,
1162 .wp-block-media-text.is-image-fill .components-placeholder.has-illustration,
1163 .wp-block-media-text.is-image-fill-element .editor-media-container__resizer,
1164 .wp-block-media-text.is-image-fill-element .components-placeholder.has-illustration {
1165 height: 100% !important;
1166 }
1167
1168 .wp-block-media-text > .block-editor-block-list__layout > .block-editor-block-list__block {
1169 max-width: unset;
1170 }
1171
1172 /* Make the featured image placeholder the same height as the media selection area. */
1173 .wp-block-media-text--placeholder-image {
1174 min-height: 205px;
1175 }
1176
1177 .block-editor-block-list__block[data-type="core/more"] {
1178 max-width: 100%;
1179 text-align: center;
1180 margin-top: 28px;
1181 margin-bottom: 28px;
1182 }
1183
1184 .wp-block-more {
1185 display: block;
1186 text-align: center;
1187 white-space: nowrap;
1188 }
1189 .wp-block-more .rich-text {
1190 position: relative;
1191 font-size: 13px;
1192 text-transform: uppercase;
1193 font-weight: var(--wpds-typography-font-weight-emphasis, 600);
1194 font-family: -apple-system, system-ui, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
1195 color: #757575;
1196 display: inline-flex;
1197 white-space: nowrap;
1198 text-align: center;
1199 background: #fff;
1200 padding: 10px 36px;
1201 }
1202 .wp-block-more::before {
1203 content: "";
1204 position: absolute;
1205 top: 50%;
1206 right: 0;
1207 left: 0;
1208 border-top: 3px dashed #ccc;
1209 }
1210
1211 /**
1212 * Editor only CSS.
1213 */
1214 .editor-styles-wrapper .wp-block-navigation ul {
1215 margin-top: 0;
1216 margin-bottom: 0;
1217 margin-right: 0;
1218 padding-right: 0;
1219 }
1220 .editor-styles-wrapper .wp-block-navigation .wp-block-navigation-item.wp-block {
1221 margin: revert;
1222 }
1223
1224 .wp-block-navigation-item__label {
1225 display: inline;
1226 }
1227
1228 /**
1229 * Submenus.
1230 */
1231 .wp-block-navigation__container,
1232 .wp-block-navigation-item {
1233 background-color: inherit;
1234 }
1235
1236 .wp-block-navigation:not(.is-selected):not(.has-child-selected) .has-child:hover > .wp-block-navigation__submenu-container {
1237 opacity: 0;
1238 visibility: hidden;
1239 }
1240
1241 .has-child.is-selected > .wp-block-navigation__submenu-container, .has-child.has-child-selected > .wp-block-navigation__submenu-container {
1242 display: flex;
1243 opacity: 1;
1244 visibility: visible;
1245 }
1246
1247 .is-dragging-components-draggable .has-child.is-dragging-within > .wp-block-navigation__submenu-container {
1248 opacity: 1;
1249 visibility: visible;
1250 }
1251
1252 .is-editing > .wp-block-navigation__container {
1253 visibility: visible;
1254 opacity: 1;
1255 display: flex;
1256 flex-direction: column;
1257 }
1258
1259 .is-dragging-components-draggable .wp-block-navigation-link > .wp-block-navigation__container {
1260 opacity: 1;
1261 visibility: hidden;
1262 }
1263 .is-dragging-components-draggable .wp-block-navigation-link > .wp-block-navigation__container .block-editor-block-draggable-chip-wrapper {
1264 visibility: visible;
1265 }
1266
1267 .is-editing > .wp-block-navigation__submenu-container > .block-list-appender {
1268 display: block;
1269 position: static;
1270 width: 100%;
1271 }
1272 .is-editing > .wp-block-navigation__submenu-container > .block-list-appender .block-editor-button-block-appender {
1273 color: #fff;
1274 background: #1e1e1e;
1275 padding: 0;
1276 width: 24px;
1277 margin-left: 0;
1278 margin-right: auto;
1279 }
1280
1281 .wp-block-navigation__submenu-container .block-list-appender {
1282 display: none;
1283 }
1284
1285 /**
1286 * Colors Selector component
1287 */
1288 .block-library-colors-selector {
1289 width: auto;
1290 }
1291 .block-library-colors-selector .block-library-colors-selector__toggle {
1292 display: block;
1293 margin: 0 auto;
1294 padding: 3px;
1295 width: auto;
1296 }
1297 .block-library-colors-selector .block-library-colors-selector__icon-container {
1298 height: 30px;
1299 position: relative;
1300 margin: 0 auto;
1301 padding: 3px;
1302 display: flex;
1303 align-items: center;
1304 border-radius: 4px;
1305 }
1306 .block-library-colors-selector .block-library-colors-selector__state-selection {
1307 margin-right: auto;
1308 margin-left: auto;
1309 border-radius: 11px;
1310 box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.2);
1311 width: 22px;
1312 min-width: 22px;
1313 height: 22px;
1314 min-height: 22px;
1315 line-height: 20px;
1316 padding: 2px;
1317 }
1318 .block-library-colors-selector .block-library-colors-selector__state-selection > svg {
1319 min-width: auto !important;
1320 }
1321 .block-library-colors-selector .block-library-colors-selector__state-selection.has-text-color > svg,
1322 .block-library-colors-selector .block-library-colors-selector__state-selection.has-text-color > svg path {
1323 color: inherit;
1324 }
1325
1326 .block-library-colors-selector__popover .color-palette-controller-container {
1327 padding: 16px;
1328 }
1329 .block-library-colors-selector__popover .components-base-control__label {
1330 height: 20px;
1331 line-height: 20px;
1332 }
1333 .block-library-colors-selector__popover .component-color-indicator {
1334 float: left;
1335 margin-top: 2px;
1336 }
1337 .block-library-colors-selector__popover .components-panel__body-title {
1338 display: none;
1339 }
1340
1341 .wp-block-navigation .wp-block + .block-list-appender .block-editor-button-block-appender {
1342 background-color: #1e1e1e;
1343 color: #fff;
1344 height: 24px;
1345 }
1346 .wp-block-navigation .wp-block + .block-list-appender .block-editor-button-block-appender.block-editor-button-block-appender.block-editor-button-block-appender {
1347 padding: 0;
1348 }
1349
1350 .wp-block-navigation .wp-block .wp-block .block-editor-button-block-appender {
1351 background-color: transparent;
1352 color: #1e1e1e;
1353 }
1354
1355 /**
1356 * Setup state
1357 */
1358 @keyframes loadingpulse {
1359 0% {
1360 opacity: 1;
1361 }
1362 50% {
1363 opacity: 0.5;
1364 }
1365 100% {
1366 opacity: 1;
1367 }
1368 }
1369 .components-placeholder.wp-block-navigation-placeholder {
1370 outline: none;
1371 padding: 0;
1372 box-shadow: none;
1373 background: none;
1374 min-height: 0;
1375 }
1376 .components-placeholder.wp-block-navigation-placeholder .components-placeholder__fieldset {
1377 font-size: inherit;
1378 }
1379 .components-placeholder.wp-block-navigation-placeholder .components-placeholder__fieldset .components-button {
1380 margin-bottom: 0;
1381 }
1382 .components-placeholder.wp-block-navigation-placeholder {
1383 color: inherit;
1384 }
1385 .wp-block-navigation.is-selected .components-placeholder.wp-block-navigation-placeholder {
1386 color: #1e1e1e;
1387 }
1388
1389 .wp-block-navigation-placeholder__preview {
1390 display: flex;
1391 align-items: center;
1392 min-width: 96px;
1393 font-size: 13px;
1394 font-family: -apple-system, system-ui, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
1395 }
1396 .wp-block-navigation.is-selected .wp-block-navigation-placeholder__preview {
1397 display: none;
1398 }
1399 .wp-block-navigation-placeholder__preview {
1400 color: currentColor;
1401 background: transparent;
1402 }
1403 .wp-block-navigation-placeholder__preview::before {
1404 content: "";
1405 display: block;
1406 position: absolute;
1407 top: 0;
1408 left: 0;
1409 bottom: 0;
1410 right: 0;
1411 pointer-events: none;
1412 border: 1px dashed currentColor;
1413 border-radius: inherit;
1414 }
1415 .wp-block-navigation-placeholder__preview > svg {
1416 fill: currentColor;
1417 }
1418
1419 .wp-block-navigation.is-vertical .is-small .components-placeholder__fieldset,
1420 .wp-block-navigation.is-vertical .is-medium .components-placeholder__fieldset {
1421 min-height: 90px;
1422 }
1423
1424 .wp-block-navigation.is-vertical .is-large .components-placeholder__fieldset {
1425 min-height: 132px;
1426 }
1427
1428 .wp-block-navigation-placeholder__preview,
1429 .wp-block-navigation-placeholder__controls {
1430 padding: 6px 8px;
1431 flex-direction: row;
1432 align-items: flex-start;
1433 }
1434
1435 .wp-block-navigation-placeholder__controls {
1436 border-radius: 2px;
1437 background-color: #fff;
1438 box-shadow: inset 0 0 0 1px #1e1e1e;
1439 display: none;
1440 position: relative;
1441 z-index: 1;
1442 }
1443 .wp-block-navigation.is-selected .wp-block-navigation-placeholder__controls {
1444 display: flex;
1445 }
1446 .wp-block-navigation-placeholder__controls {
1447 float: right;
1448 width: 100%;
1449 }
1450 .is-small .wp-block-navigation-placeholder__controls .wp-block-navigation-placeholder__actions__indicator,
1451 .is-small .wp-block-navigation-placeholder__controls .wp-block-navigation-placeholder__actions__indicator + hr, .is-medium .wp-block-navigation-placeholder__controls .wp-block-navigation-placeholder__actions__indicator,
1452 .is-medium .wp-block-navigation-placeholder__controls .wp-block-navigation-placeholder__actions__indicator + hr {
1453 display: none;
1454 }
1455 .is-small .wp-block-navigation-placeholder__controls .wp-block-navigation-placeholder__actions, .wp-block-navigation.is-vertical .wp-block-navigation-placeholder__controls .wp-block-navigation-placeholder__actions {
1456 flex-direction: column;
1457 align-items: flex-start;
1458 }
1459 .is-small .wp-block-navigation-placeholder__controls .wp-block-navigation-placeholder__actions hr, .wp-block-navigation.is-vertical .wp-block-navigation-placeholder__controls .wp-block-navigation-placeholder__actions hr {
1460 display: none;
1461 }
1462 .wp-block-navigation-placeholder__controls .wp-block-navigation-placeholder__icon {
1463 margin-left: 12px;
1464 height: 36px;
1465 }
1466
1467 .wp-block-navigation-placeholder__actions__indicator {
1468 display: flex;
1469 padding: 0 0 0 6px;
1470 align-items: center;
1471 justify-content: flex-start;
1472 line-height: 0;
1473 height: 36px;
1474 margin-right: 4px;
1475 }
1476 .wp-block-navigation-placeholder__actions__indicator svg {
1477 margin-left: 4px;
1478 fill: currentColor;
1479 }
1480
1481 .wp-block-navigation .components-placeholder.is-medium .components-placeholder__fieldset {
1482 flex-direction: row !important;
1483 }
1484
1485 .wp-block-navigation-placeholder__actions {
1486 display: flex;
1487 font-size: 13px;
1488 font-family: -apple-system, system-ui, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
1489 gap: 6px;
1490 align-items: center;
1491 }
1492 .wp-block-navigation-placeholder__actions .components-dropdown,
1493 .wp-block-navigation-placeholder__actions > .components-button {
1494 margin-left: 0;
1495 }
1496 .wp-block-navigation-placeholder__actions {
1497 height: 100%;
1498 }
1499 .wp-block-navigation-placeholder__actions.wp-block-navigation-placeholder__actions hr {
1500 border: 0;
1501 min-height: 1px;
1502 min-width: 1px;
1503 background-color: #1e1e1e;
1504 margin: auto 0;
1505 height: 100%;
1506 max-height: 16px;
1507 }
1508
1509 /**
1510 * Mobile menu.
1511 */
1512 @media (min-width: 600px) {
1513 .wp-block-navigation__responsive-container:not(.is-menu-open) .components-button.wp-block-navigation__responsive-container-close {
1514 display: none;
1515 }
1516 }
1517
1518 .wp-block-navigation__responsive-container.is-menu-open {
1519 position: fixed;
1520 top: 159px;
1521 }
1522 @media (min-width: 782px) {
1523 .wp-block-navigation__responsive-container.is-menu-open {
1524 top: 97px;
1525 }
1526 }
1527 @media (min-width: 782px) {
1528 .wp-block-navigation__responsive-container.is-menu-open {
1529 right: 36px;
1530 }
1531 }
1532 @media (min-width: 960px) {
1533 .wp-block-navigation__responsive-container.is-menu-open {
1534 right: 160px;
1535 }
1536 }
1537
1538 .is-mobile-preview .wp-block-navigation__responsive-container.is-menu-open,
1539 .is-tablet-preview .wp-block-navigation__responsive-container.is-menu-open {
1540 top: 145px;
1541 }
1542
1543 .is-fullscreen-mode .wp-block-navigation__responsive-container.is-menu-open {
1544 right: 0;
1545 top: 159px;
1546 }
1547 @media (min-width: 782px) {
1548 .is-fullscreen-mode .wp-block-navigation__responsive-container.is-menu-open {
1549 top: 65px;
1550 }
1551 }
1552 .is-fullscreen-mode .is-mobile-preview .wp-block-navigation__responsive-container.is-menu-open,
1553 .is-fullscreen-mode .is-tablet-preview .wp-block-navigation__responsive-container.is-menu-open {
1554 top: 113px;
1555 }
1556
1557 body.editor-styles-wrapper .wp-block-navigation__responsive-container.is-menu-open {
1558 top: 0;
1559 left: 0;
1560 bottom: 0;
1561 right: 0;
1562 }
1563
1564 .components-button.wp-block-navigation__responsive-container-open.wp-block-navigation__responsive-container-open,
1565 .components-button.wp-block-navigation__responsive-container-close.wp-block-navigation__responsive-container-close {
1566 padding: 0;
1567 height: auto;
1568 color: inherit;
1569 }
1570
1571 .components-heading.wp-block-navigation-off-canvas-editor__title {
1572 margin: 0;
1573 }
1574
1575 .wp-block-navigation-off-canvas-editor__header {
1576 margin-bottom: 8px;
1577 }
1578
1579 .is-menu-open .wp-block-navigation__responsive-container-content * .block-list-appender {
1580 margin-top: 16px;
1581 }
1582
1583 @keyframes fadein {
1584 0% {
1585 opacity: 0;
1586 }
1587 100% {
1588 opacity: 1;
1589 }
1590 }
1591 .wp-block-navigation__loading-indicator-container {
1592 padding: 8px 12px;
1593 }
1594
1595 .wp-block-navigation .wp-block-navigation__uncontrolled-inner-blocks-loading-indicator {
1596 margin-top: 0;
1597 }
1598
1599 @keyframes fadeouthalf {
1600 0% {
1601 opacity: 1;
1602 }
1603 100% {
1604 opacity: 0.5;
1605 }
1606 }
1607 .wp-block-navigation-delete-menu-button {
1608 width: 100%;
1609 justify-content: center;
1610 margin-bottom: 16px;
1611 }
1612
1613 .components-button.is-link.wp-block-navigation-manage-menus-button {
1614 margin-bottom: 16px;
1615 }
1616
1617 .wp-block-navigation__overlay-menu-preview {
1618 display: flex;
1619 align-items: center;
1620 justify-content: space-between;
1621 width: 100%;
1622 background-color: #f0f0f0;
1623 padding: 0 24px;
1624 height: 64px !important;
1625 grid-column: span 2;
1626 }
1627 .wp-block-navigation__overlay-menu-preview.open {
1628 border-color: #e0e0e0;
1629 background-color: #fff;
1630 }
1631
1632 .wp-block-navigation__toolbar-menu-selector.components-toolbar-group:empty {
1633 display: none;
1634 }
1635
1636 .wp-block-navigation-placeholder__actions hr + hr {
1637 display: none;
1638 }
1639
1640 /**
1641 * Navigation selector styles
1642 */
1643 .wp-block-navigation__navigation-selector {
1644 margin-bottom: 16px;
1645 width: 100%;
1646 }
1647
1648 .wp-block-navigation__navigation-selector-button {
1649 border: 1px solid;
1650 justify-content: space-between;
1651 width: 100%;
1652 }
1653
1654 .wp-block-navigation__navigation-selector-button__icon {
1655 flex: 0 0 auto;
1656 }
1657
1658 .wp-block-navigation__navigation-selector-button__label {
1659 flex: 0 1 auto;
1660 overflow: hidden;
1661 text-overflow: ellipsis;
1662 white-space: nowrap;
1663 }
1664
1665 .wp-block-navigation__navigation-selector-button--createnew {
1666 border: 1px solid;
1667 margin-bottom: 16px;
1668 width: 100%;
1669 }
1670
1671 .wp-block-navigation__responsive-container-open.components-button {
1672 opacity: 1;
1673 }
1674
1675 .wp-block-navigation__menu-inspector-controls__empty-message {
1676 margin-right: 24px;
1677 }
1678
1679 .editor-sidebar__panel .wp-block-navigation__submenu-header {
1680 margin-top: 0;
1681 margin-bottom: 0;
1682 }
1683
1684 .wp-block-navigation__submenu-accessibility-notice {
1685 grid-column: span 2;
1686 }
1687
1688 .wp-block-navigation__overlay-selector {
1689 position: relative;
1690 }
1691
1692 .wp-block-navigation__overlay-selector-controls {
1693 margin-bottom: 8px;
1694 }
1695
1696 .wp-block-navigation__overlay-create-button {
1697 position: absolute;
1698 top: -4px;
1699 left: 0;
1700 z-index: 1;
1701 }
1702
1703 .wp-block-navigation__overlay-preview {
1704 border: 1px solid #ddd;
1705 border-radius: 2px;
1706 overflow-y: auto;
1707 max-height: 200px;
1708 background: #fff;
1709 }
1710
1711 .wp-block-navigation__overlay-preview-loading {
1712 display: flex;
1713 align-items: center;
1714 justify-content: center;
1715 min-height: 200px;
1716 background: #f0f0f0;
1717 }
1718
1719 .wp-block-navigation__overlay-preview-empty {
1720 display: flex;
1721 align-items: center;
1722 justify-content: center;
1723 min-height: 200px;
1724 padding: 16px;
1725 text-align: center;
1726 color: #757575;
1727 background: #f0f0f0;
1728 font-style: italic;
1729 }
1730
1731 .wp-block-navigation__overlay-preview-placeholder {
1732 width: 100%;
1733 height: 200px;
1734 background: #f0f0f0;
1735 animation: wp-block-navigation-overlay-preview-pulse 1.5s ease-in-out infinite;
1736 }
1737
1738 @keyframes wp-block-navigation-overlay-preview-pulse {
1739 0%, 100% {
1740 opacity: 1;
1741 }
1742 50% {
1743 opacity: 0.5;
1744 }
1745 }
1746 .wp-block-navigation__deleted-overlay-warning {
1747 margin-top: 12px;
1748 }
1749
1750 .wp-block-navigation__overlay-create-button-prominent {
1751 width: 100%;
1752 justify-content: center;
1753 margin-bottom: 8px;
1754 }
1755
1756 .wp-block-navigation__overlay-help-text-wrapper {
1757 margin-top: 8px;
1758 }
1759
1760 /**
1761 * Appender
1762 */
1763 .wp-block-navigation .block-list-appender {
1764 position: relative;
1765 }
1766
1767 /**
1768 * Submenus.
1769 */
1770 .wp-block-navigation .has-child {
1771 cursor: pointer;
1772 }
1773 .wp-block-navigation .has-child .wp-block-navigation__submenu-container {
1774 z-index: 28;
1775 }
1776 .wp-block-navigation .has-child:hover .wp-block-navigation__submenu-container {
1777 z-index: 29;
1778 }
1779 .wp-block-navigation .has-child.is-selected > .wp-block-navigation__submenu-container, .wp-block-navigation .has-child.has-child-selected > .wp-block-navigation__submenu-container {
1780 visibility: visible !important;
1781 opacity: 1 !important;
1782 min-width: 200px !important;
1783 height: auto !important;
1784 width: auto !important;
1785 overflow: visible !important;
1786 }
1787
1788 /**
1789 * Navigation Items.
1790 */
1791 .wp-block-navigation-item .wp-block-navigation-item__content {
1792 cursor: text;
1793 }
1794 .wp-block-navigation-item.is-editing, .wp-block-navigation-item.is-selected {
1795 min-width: 20px;
1796 }
1797 .wp-block-navigation-item .block-list-appender {
1798 margin-top: 16px;
1799 margin-left: auto;
1800 margin-bottom: 16px;
1801 margin-right: 16px;
1802 }
1803
1804 .wp-block-navigation-link__invalid-item {
1805 color: #000;
1806 }
1807
1808 /**
1809 * Menu item setup state. Is shown when a menu item has no URL configured.
1810 */
1811 .wp-block-navigation-link__placeholder {
1812 position: relative;
1813 text-decoration: none !important;
1814 box-shadow: none !important;
1815 background-image: none !important;
1816 }
1817 .wp-block-navigation-link__placeholder .wp-block-navigation-link__placeholder-text span {
1818 -webkit-text-decoration: wavy underline;
1819 text-decoration: wavy underline;
1820 -webkit-text-decoration-skip-ink: none;
1821 text-decoration-skip-ink: none;
1822 text-underline-offset: 0.25rem;
1823 }
1824 .wp-block-navigation-link__placeholder.wp-block-navigation-item__content {
1825 cursor: pointer;
1826 }
1827
1828 /**
1829 * Link Control Transforms
1830 */
1831 .link-control-transform {
1832 border-top: 1px solid #ccc;
1833 padding: 0 16px 8px 16px;
1834 }
1835
1836 .link-control-transform__subheading {
1837 font-size: 11px;
1838 text-transform: uppercase;
1839 font-weight: var(--wpds-typography-font-weight-emphasis, 600);
1840 color: #1e1e1e;
1841 margin-bottom: 1.5em;
1842 }
1843
1844 .link-control-transform__items {
1845 display: flex;
1846 justify-content: space-between;
1847 }
1848
1849 .link-control-transform__item {
1850 flex-basis: 33%;
1851 flex-direction: column;
1852 gap: 8px;
1853 height: auto;
1854 }
1855
1856 .link-ui-page-creator {
1857 max-width: 350px;
1858 min-width: auto;
1859 width: 90vw;
1860 padding-top: 8px;
1861 }
1862 .link-ui-page-creator__inner {
1863 padding: 16px;
1864 }
1865 .link-ui-page-creator__back {
1866 margin-right: 8px;
1867 text-transform: uppercase;
1868 }
1869
1870 /**
1871 * Error text styling for missing entity help text.
1872 */
1873 .navigation-link-control__error-text {
1874 color: #cc1818;
1875 }
1876
1877 .navigation-link-to__action-button {
1878 grid-column: auto;
1879 }
1880 .navigation-link-to__action-button:nth-last-child(1 of .navigation-link-to__action-button):nth-child(odd of .navigation-link-to__action-button) {
1881 grid-column: 1/-1;
1882 }
1883 .navigation-link-to__action-button.navigation-link-to__action-button.navigation-link-to__action-button {
1884 justify-content: center;
1885 }
1886
1887 .wp-block-navigation-submenu {
1888 display: block;
1889 }
1890 .wp-block-navigation-submenu .wp-block-navigation__submenu-container {
1891 z-index: 28;
1892 }
1893 .wp-block-navigation-submenu.is-selected > .wp-block-navigation__submenu-container, .wp-block-navigation-submenu.has-child-selected > .wp-block-navigation__submenu-container {
1894 visibility: visible !important;
1895 opacity: 1 !important;
1896 min-width: 200px !important;
1897 height: auto !important;
1898 width: auto !important;
1899 position: absolute;
1900 right: -1px;
1901 top: 100%;
1902 }
1903 @media (min-width: 782px) {
1904 .wp-block-navigation-submenu.is-selected > .wp-block-navigation__submenu-container .wp-block-navigation__submenu-container, .wp-block-navigation-submenu.has-child-selected > .wp-block-navigation__submenu-container .wp-block-navigation__submenu-container {
1905 right: 100%;
1906 top: -1px;
1907 }
1908 .wp-block-navigation-submenu.is-selected > .wp-block-navigation__submenu-container .wp-block-navigation__submenu-container::before, .wp-block-navigation-submenu.has-child-selected > .wp-block-navigation__submenu-container .wp-block-navigation__submenu-container::before {
1909 content: "";
1910 position: absolute;
1911 left: 100%;
1912 height: 100%;
1913 display: block;
1914 width: 0.5em;
1915 background: transparent;
1916 }
1917 }
1918
1919 .block-editor-block-list__block[data-type="core/nextpage"] {
1920 max-width: 100%;
1921 text-align: center;
1922 margin-top: 28px;
1923 margin-bottom: 28px;
1924 }
1925
1926 .wp-block-nextpage {
1927 display: block;
1928 text-align: center;
1929 white-space: nowrap;
1930 }
1931 .wp-block-nextpage > span {
1932 font-size: 13px;
1933 position: relative;
1934 text-transform: uppercase;
1935 font-weight: var(--wpds-typography-font-weight-emphasis, 600);
1936 font-family: -apple-system, system-ui, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
1937 color: #757575;
1938 border-radius: 4px;
1939 background: #fff;
1940 padding: 6px 8px;
1941 height: 24px;
1942 }
1943 .wp-block-nextpage::before {
1944 content: "";
1945 position: absolute;
1946 top: 50%;
1947 right: 0;
1948 left: 0;
1949 border-top: 3px dashed #ccc;
1950 }
1951
1952 .wp-block-navigation.items-justified-space-between .wp-block-page-list > div,
1953 .wp-block-navigation.items-justified-space-between .wp-block-page-list {
1954 display: contents;
1955 flex: 1;
1956 }
1957 .wp-block-navigation.items-justified-space-between.has-child-selected .wp-block-page-list > div, .wp-block-navigation.items-justified-space-between.has-child-selected .wp-block-page-list, .wp-block-navigation.items-justified-space-between.is-selected .wp-block-page-list > div, .wp-block-navigation.items-justified-space-between.is-selected .wp-block-page-list {
1958 flex: inherit;
1959 }
1960
1961 .wp-block-navigation .wp-block-navigation__submenu-container > .wp-block-page-list {
1962 display: block;
1963 }
1964
1965 .wp-block-pages-list__item__link {
1966 pointer-events: none;
1967 }
1968
1969 @media (min-width: 600px) {
1970 .wp-block-page-list-modal {
1971 max-width: 480px;
1972 }
1973 }
1974
1975 .wp-block-page-list-modal-buttons {
1976 display: flex;
1977 justify-content: flex-end;
1978 gap: 12px;
1979 }
1980
1981 .wp-block-page-list .open-on-click:focus-within > .wp-block-navigation__submenu-container {
1982 visibility: visible;
1983 opacity: 1;
1984 width: auto;
1985 height: auto;
1986 min-width: 200px;
1987 }
1988
1989 .wp-block-page-list__loading-indicator-container {
1990 padding: 8px 12px;
1991 }
1992
1993 .block-editor-block-list__block[data-type="core/paragraph"].has-drop-cap:focus {
1994 min-height: auto !important;
1995 }
1996
1997 .block-editor-block-list__block[data-empty=true] [data-rich-text-placeholder] {
1998 opacity: 1;
1999 }
2000
2001 .block-editor-block-list__block[data-empty=true] + .block-editor-block-list__block[data-empty=true]:not([data-custom-placeholder=true]) [data-rich-text-placeholder] {
2002 opacity: 0;
2003 }
2004
2005 .block-editor-block-list__block[data-type="core/paragraph"].has-text-align-right[style*="writing-mode: vertical-rl"],
2006 .block-editor-block-list__block[data-type="core/paragraph"].has-text-align-left[style*="writing-mode: vertical-lr"] {
2007 rotate: 180deg;
2008 }
2009
2010 .is-zoomed-out .block-editor-block-list__block[data-empty=true] [data-rich-text-placeholder] {
2011 opacity: 0;
2012 }
2013
2014 html[dir=rtl] .has-drop-cap:not(:focus)::first-letter {
2015 float: initial;
2016 margin-right: 0.1em;
2017 }
2018
2019 .wp-block-post-author__transform {
2020 background: #f0f0f0;
2021 border-radius: 2px;
2022 margin: 16px;
2023 padding: 16px;
2024 }
2025
2026 .wp-block-playlist__waveform-color-controls {
2027 display: grid;
2028 grid-column: 1/-1;
2029 row-gap: 0;
2030 }
2031
2032 .wp-block-post-excerpt .wp-block-post-excerpt__excerpt.is-inline {
2033 display: inline;
2034 }
2035
2036 .wp-block-pullquote.is-style-solid-color blockquote p {
2037 font-size: 32px;
2038 }
2039 .wp-block-pullquote.is-style-solid-color .wp-block-pullquote__citation {
2040 text-transform: none;
2041 font-style: normal;
2042 }
2043
2044 .wp-block-pullquote__citation {
2045 color: inherit;
2046 }
2047
2048 .wp-block-pullquote[style*=line-height] :where(p) {
2049 line-height: inherit;
2050 }
2051
2052 .wp-block-rss li a > div {
2053 display: inline;
2054 }
2055
2056 .wp-block-rss__placeholder-form .wp-block-rss__placeholder-input {
2057 flex: 1 1 auto;
2058 }
2059
2060 .wp-block-rss .wp-block-rss {
2061 all: inherit;
2062 margin: 0;
2063 padding: 0;
2064 }
2065
2066 .wp-block[data-align=center] .wp-block-search .wp-block-search__inside-wrapper {
2067 margin: auto;
2068 }
2069
2070 .wp-block-search :where(.wp-block-search__button) {
2071 height: auto;
2072 border-radius: initial;
2073 display: flex;
2074 align-items: center;
2075 justify-content: center;
2076 text-align: center;
2077 }
2078
2079 .wp-block-search__inspector-controls .components-base-control {
2080 margin-bottom: 0;
2081 }
2082
2083 .block-editor-block-list__block[data-type="core/separator"] {
2084 padding-top: 0.1px;
2085 padding-bottom: 0.1px;
2086 }
2087
2088 .blocks-shortcode__textarea {
2089 box-sizing: border-box;
2090 max-height: 250px;
2091 resize: none;
2092 font-family: Menlo, Consolas, monaco, monospace !important;
2093 color: #1e1e1e !important;
2094 background: #fff !important;
2095 padding: 12px !important;
2096 border: 1px solid #1e1e1e !important;
2097 box-shadow: none !important;
2098 border-radius: 2px !important;
2099 font-size: 16px !important;
2100 }
2101 @media (min-width: 600px) {
2102 .blocks-shortcode__textarea {
2103 font-size: 13px !important;
2104 }
2105 }
2106 .blocks-shortcode__textarea:focus {
2107 border-color: var(--wp-admin-theme-color) !important;
2108 box-shadow: 0 0 0 1px var(--wp-admin-theme-color) !important;
2109 outline: 2px solid transparent !important;
2110 }
2111
2112 .wp-block[data-align=center] > .wp-block-site-logo,
2113 .wp-block-site-logo.aligncenter > div {
2114 display: table;
2115 margin-right: auto;
2116 margin-left: auto;
2117 }
2118
2119 .wp-block-site-logo a {
2120 pointer-events: none;
2121 }
2122 .wp-block-site-logo .custom-logo-link {
2123 cursor: inherit;
2124 }
2125 .wp-block-site-logo .custom-logo-link:focus {
2126 box-shadow: none;
2127 }
2128 .wp-block-site-logo img {
2129 display: block;
2130 height: auto;
2131 max-width: 100%;
2132 }
2133 .wp-block-site-logo.is-transient {
2134 position: relative;
2135 }
2136 .wp-block-site-logo.is-transient img {
2137 opacity: 0.3;
2138 }
2139 .wp-block-site-logo.is-transient .components-spinner {
2140 position: absolute;
2141 top: 50%;
2142 right: 50%;
2143 transform: translate(50%, -50%);
2144 margin: 0;
2145 }
2146
2147 .wp-block-site-logo.wp-block-site-logo.is-default-size .components-placeholder {
2148 height: 60px;
2149 width: 60px;
2150 }
2151 .wp-block-site-logo.wp-block-site-logo > div,
2152 .wp-block-site-logo.wp-block-site-logo .components-resizable-box__container {
2153 border-radius: inherit;
2154 }
2155 .wp-block-site-logo.wp-block-site-logo .components-placeholder {
2156 display: flex;
2157 justify-content: center;
2158 align-items: center;
2159 padding: 0;
2160 border-radius: inherit;
2161 min-height: 48px;
2162 min-width: 48px;
2163 height: 100%;
2164 width: 100%;
2165 }
2166 .wp-block-site-logo.wp-block-site-logo .components-placeholder .components-form-file-upload {
2167 display: none;
2168 }
2169 .wp-block-site-logo.wp-block-site-logo .components-placeholder .components-drop-zone__content-text {
2170 display: none;
2171 }
2172 .wp-block-site-logo.wp-block-site-logo .components-placeholder .components-button.components-button {
2173 padding: 0;
2174 margin: auto;
2175 display: flex;
2176 justify-content: center;
2177 align-items: center;
2178 width: 48px;
2179 height: 48px;
2180 border-radius: 50%;
2181 position: relative;
2182 background: var(--wp-admin-theme-color);
2183 border-color: var(--wp-admin-theme-color);
2184 border-style: solid;
2185 color: #fff;
2186 }
2187 .wp-block-site-logo.wp-block-site-logo .components-placeholder .components-button.components-button > svg {
2188 color: inherit;
2189 }
2190
2191 .block-library-site-logo__inspector-media-replace-container {
2192 position: relative;
2193 }
2194 .block-library-site-logo__inspector-media-replace-container .block-library-site-logo__inspector-media-replace-title {
2195 word-break: break-all;
2196 white-space: normal;
2197 text-align: start;
2198 -moz-text-align-last: center;
2199 text-align-last: center;
2200 }
2201 .block-library-site-logo__inspector-media-replace-container img {
2202 width: 20px;
2203 min-width: 20px;
2204 aspect-ratio: 1;
2205 box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.2);
2206 border-radius: 2px;
2207 }
2208 .block-library-site-logo__inspector-media-replace-container .block-library-site-logo__inspector-readonly-logo-preview {
2209 padding: 6px 12px;
2210 display: flex;
2211 height: 40px;
2212 }
2213
2214 .wp-block-site-tagline__placeholder {
2215 padding: 1em 0;
2216 border: 1px dashed;
2217 }
2218
2219 .wp-block-site-title__placeholder {
2220 padding: 1em 0;
2221 border: 1px dashed;
2222 }
2223
2224 .wp-block-social-links .wp-social-link {
2225 line-height: 0;
2226 }
2227
2228 .wp-block-social-link-anchor {
2229 align-items: center;
2230 background: none;
2231 border: 0;
2232 box-sizing: border-box;
2233 cursor: pointer;
2234 display: inline-flex;
2235 font-size: inherit;
2236 color: currentColor;
2237 height: auto;
2238 font-weight: inherit;
2239 font-family: inherit;
2240 margin: 0;
2241 opacity: 1;
2242 padding: 0.25em;
2243 }
2244 .wp-block-social-link-anchor:hover {
2245 transform: none;
2246 }
2247
2248 :root :where(.wp-block-social-links.is-style-pill-shape .wp-social-link button) {
2249 padding-right: 0.6666666667em;
2250 padding-left: 0.6666666667em;
2251 }
2252
2253 :root :where(.wp-block-social-links.is-style-logos-only .wp-social-link button) {
2254 padding: 0;
2255 }
2256
2257 .wp-block-social-link__toolbar_content_text {
2258 width: 250px;
2259 }
2260
2261 .wp-block-social-links div.block-editor-url-input {
2262 display: inline-block;
2263 margin-right: 8px;
2264 }
2265
2266 .wp-social-link:hover {
2267 transform: none;
2268 }
2269
2270 :root :where(.wp-block-social-links) {
2271 padding: 0;
2272 }
2273
2274 .wp-block[data-align=center] > .wp-block-social-links,
2275 .wp-block.wp-block-social-links.aligncenter {
2276 justify-content: center;
2277 }
2278
2279 .block-editor-block-preview__content .components-button:disabled {
2280 opacity: 1;
2281 }
2282
2283 .wp-social-link.wp-social-link__is-incomplete {
2284 opacity: 0.5;
2285 }
2286
2287 .wp-block-social-links .is-selected .wp-social-link__is-incomplete,
2288 .wp-social-link.wp-social-link__is-incomplete:hover,
2289 .wp-social-link.wp-social-link__is-incomplete:focus {
2290 opacity: 1;
2291 }
2292
2293 .wp-block-social-links .block-list-appender {
2294 position: static;
2295 }
2296 .wp-block-social-links .block-list-appender .block-editor-inserter {
2297 font-size: inherit;
2298 }
2299 .wp-block-social-links .block-list-appender .block-editor-button-block-appender {
2300 height: 1.5em;
2301 width: 1.5em;
2302 font-size: inherit;
2303 padding: 0;
2304 }
2305
2306 .block-editor-block-list__block[data-type="core/spacer"]::before {
2307 content: "";
2308 display: block;
2309 position: absolute;
2310 z-index: 1;
2311 width: 100%;
2312 min-height: 8px;
2313 min-width: 8px;
2314 height: 100%;
2315 }
2316
2317 .wp-block-spacer.is-hovered .block-library-spacer__resize-container,
2318 .block-library-spacer__resize-container.has-show-handle,
2319 .wp-block-spacer.is-selected.custom-sizes-disabled {
2320 background: rgba(0, 0, 0, 0.1);
2321 }
2322 .is-dark-theme .wp-block-spacer.is-hovered .block-library-spacer__resize-container,
2323 .is-dark-theme .block-library-spacer__resize-container.has-show-handle,
2324 .is-dark-theme .wp-block-spacer.is-selected.custom-sizes-disabled {
2325 background: rgba(255, 255, 255, 0.15);
2326 }
2327
2328 .block-library-spacer__resize-container {
2329 clear: both;
2330 }
2331 .block-library-spacer__resize-container:not(.is-resizing) {
2332 height: 100% !important;
2333 width: 100% !important;
2334 }
2335 .block-library-spacer__resize-container .components-resizable-box__handle::before {
2336 content: none;
2337 }
2338 .block-library-spacer__resize-container.resize-horizontal {
2339 margin-bottom: 0;
2340 height: 100% !important;
2341 }
2342
2343 @media (min-width: 600px) {
2344 .wp-block-tab-list__mover-button {
2345 width: 24px;
2346 min-width: 0 !important;
2347 }
2348 }
2349
2350 .wp-block[data-align=left] > .wp-block-table, .wp-block[data-align=right] > .wp-block-table, .wp-block[data-align=center] > .wp-block-table {
2351 height: auto;
2352 }
2353 .wp-block[data-align=left] > .wp-block-table table, .wp-block[data-align=right] > .wp-block-table table, .wp-block[data-align=center] > .wp-block-table table {
2354 width: auto;
2355 }
2356 .wp-block[data-align=left] > .wp-block-table td,
2357 .wp-block[data-align=left] > .wp-block-table th, .wp-block[data-align=right] > .wp-block-table td,
2358 .wp-block[data-align=right] > .wp-block-table th, .wp-block[data-align=center] > .wp-block-table td,
2359 .wp-block[data-align=center] > .wp-block-table th {
2360 word-break: break-word;
2361 }
2362 .wp-block[data-align=center] > .wp-block-table {
2363 text-align: initial;
2364 }
2365 .wp-block[data-align=center] > .wp-block-table table {
2366 margin: 0 auto;
2367 }
2368 .wp-block-table td,
2369 .wp-block-table th {
2370 border: 1px solid;
2371 padding: 0.5em;
2372 }
2373 .wp-block-table td.is-selected,
2374 .wp-block-table th.is-selected {
2375 border-color: var(--wp-admin-theme-color);
2376 box-shadow: inset 0 0 0 1px var(--wp-admin-theme-color);
2377 border-style: double;
2378 }
2379 .wp-block-table table.has-individual-borders > *,
2380 .wp-block-table table.has-individual-borders tr,
2381 .wp-block-table table.has-individual-borders th,
2382 .wp-block-table table.has-individual-borders td {
2383 border-width: 1px;
2384 border-style: solid;
2385 border-color: currentColor;
2386 }
2387
2388 .blocks-table__placeholder-form.blocks-table__placeholder-form {
2389 display: flex;
2390 flex-direction: column;
2391 align-items: flex-start;
2392 gap: 8px;
2393 }
2394 @media (min-width: 782px) {
2395 .blocks-table__placeholder-form.blocks-table__placeholder-form {
2396 flex-direction: row;
2397 align-items: flex-end;
2398 }
2399 }
2400
2401 .blocks-table__placeholder-input {
2402 width: 112px;
2403 }
2404
2405 .block-editor-template-part__selection-modal {
2406 z-index: 1000001;
2407 }
2408 .block-editor-template-part__selection-modal .block-editor-block-patterns-list {
2409 -moz-column-count: 2;
2410 column-count: 2;
2411 -moz-column-gap: 24px;
2412 column-gap: 24px;
2413 }
2414 @media (min-width: 1280px) {
2415 .block-editor-template-part__selection-modal .block-editor-block-patterns-list {
2416 -moz-column-count: 3;
2417 column-count: 3;
2418 }
2419 }
2420 .block-editor-template-part__selection-modal .block-editor-block-patterns-list .block-editor-block-patterns-list__list-item {
2421 -moz-column-break-inside: avoid;
2422 break-inside: avoid-column;
2423 }
2424
2425 .block-library-template-part__selection-search {
2426 background: #fff;
2427 position: sticky;
2428 top: 0;
2429 padding: 16px 0;
2430 z-index: 2;
2431 }
2432
2433 .block-editor-block-list__block:not(.remove-outline).wp-block-template-part.is-highlighted::after, .block-editor-block-list__block:not(.remove-outline).wp-block-template-part.is-selected::after,
2434 .block-editor-block-list__block:not(.remove-outline).is-reusable.is-highlighted::after,
2435 .block-editor-block-list__block:not(.remove-outline).is-reusable.is-selected::after {
2436 outline-color: var(--wp-block-synced-color);
2437 }
2438 .block-editor-block-list__block:not(.remove-outline).wp-block-template-part.block-editor-block-list__block:not([contenteditable]):focus::after,
2439 .block-editor-block-list__block:not(.remove-outline).is-reusable.block-editor-block-list__block:not([contenteditable]):focus::after {
2440 outline-color: var(--wp-block-synced-color);
2441 }
2442
2443 .is-outline-mode .block-editor-block-list__block:not(.remove-outline).wp-block-template-part.has-editable-outline::after {
2444 border: none;
2445 }
2446
2447 .wp-block-term-template .term-loading .term-loading-placeholder {
2448 width: 100%;
2449 height: 1.5em;
2450 margin-bottom: 0.25em;
2451 background-color: #f0f0f0;
2452 border-radius: 2px;
2453 }
2454 @media not (prefers-reduced-motion) {
2455 .wp-block-term-template .term-loading .term-loading-placeholder {
2456 animation: loadingpulse 1.5s ease-in-out infinite;
2457 }
2458 }
2459
2460 @keyframes loadingpulse {
2461 0% {
2462 opacity: 1;
2463 }
2464 50% {
2465 opacity: 0.5;
2466 }
2467 100% {
2468 opacity: 1;
2469 }
2470 }
2471 .wp-block-text-columns .block-editor-rich-text__editable:focus {
2472 outline: 1px solid #ddd;
2473 }
2474
2475 .wp-block[data-align=center] > .wp-block-video {
2476 text-align: center;
2477 }
2478
2479 .wp-block-video {
2480 position: relative;
2481 }
2482 .wp-block-video.is-transient video {
2483 opacity: 0.3;
2484 }
2485 .wp-block-video .components-spinner {
2486 position: absolute;
2487 top: 50%;
2488 right: 50%;
2489 margin-top: -9px;
2490 margin-right: -9px;
2491 }
2492
2493 .block-library-video-tracks-editor {
2494 z-index: 159990;
2495 }
2496
2497 .modal-open .block-library-video-tracks-editor {
2498 z-index: 99999;
2499 }
2500
2501 .block-library-video-tracks-editor__track-list-track {
2502 padding-right: 12px;
2503 }
2504
2505 .block-library-video-tracks-editor__single-track-editor-kind-select {
2506 max-width: 240px;
2507 }
2508
2509 .block-library-video-tracks-editor__tracks-informative-message-title,
2510 .block-library-video-tracks-editor__single-track-editor-edit-track-label {
2511 margin-top: 4px;
2512 color: #757575;
2513 text-transform: uppercase;
2514 font-size: 11px;
2515 font-weight: var(--wpds-typography-font-weight-emphasis, 600);
2516 display: block;
2517 }
2518
2519 .block-library-video-tracks-editor > .components-popover__content {
2520 width: 360px;
2521 }
2522
2523 .block-library-video-tracks-editor__track-list .components-menu-group__label,
2524 .block-library-video-tracks-editor__add-tracks-container .components-menu-group__label {
2525 padding: 0;
2526 }
2527
2528 .block-library-video-tracks-editor__tracks-informative-message {
2529 padding: 8px;
2530 }
2531 .block-library-video-tracks-editor__tracks-informative-message-description {
2532 margin-bottom: 0;
2533 }
2534
2535 .block-library-query-pattern__selection-modal .block-editor-block-patterns-list {
2536 -moz-column-count: 2;
2537 column-count: 2;
2538 -moz-column-gap: 24px;
2539 column-gap: 24px;
2540 }
2541 @media (min-width: 1280px) {
2542 .block-library-query-pattern__selection-modal .block-editor-block-patterns-list {
2543 -moz-column-count: 3;
2544 column-count: 3;
2545 }
2546 }
2547 .block-library-query-pattern__selection-modal .block-editor-block-patterns-list .block-editor-block-patterns-list__list-item {
2548 -moz-column-break-inside: avoid;
2549 break-inside: avoid-column;
2550 }
2551 .block-library-query-pattern__selection-modal .block-library-query-pattern__selection-search {
2552 background: #fff;
2553 position: sticky;
2554 top: 0;
2555 padding: 16px 0;
2556 transform: translateY(-4px);
2557 margin-bottom: -4px;
2558 z-index: 2;
2559 }
2560
2561 @media (min-width: 600px) {
2562 .wp-block-query__enhanced-pagination-modal {
2563 max-width: 480px;
2564 }
2565 }
2566
2567 .block-editor-block-settings-menu__popover.is-expanded {
2568 overflow-y: scroll;
2569 }
2570 .block-editor-block-settings-menu__popover .block-library-query-pattern__selection-content {
2571 height: 100%;
2572 }
2573 .block-editor-block-settings-menu__popover .block-editor-block-patterns-list {
2574 display: grid;
2575 grid-template-columns: 1fr;
2576 }
2577 @media (min-width: 600px) {
2578 .block-editor-block-settings-menu__popover .block-editor-block-patterns-list {
2579 grid-template-columns: 1fr 1fr;
2580 }
2581 }
2582 .block-editor-block-settings-menu__popover .block-editor-block-patterns-list {
2583 grid-gap: 12px;
2584 min-width: 280px;
2585 }
2586 @media (min-width: 600px) {
2587 .block-editor-block-settings-menu__popover .block-editor-block-patterns-list {
2588 min-width: 480px;
2589 }
2590 }
2591 .block-editor-block-settings-menu__popover .block-editor-block-patterns-list__list-item {
2592 margin-bottom: 0;
2593 }
2594
2595 .wp-block-query > .block-editor-media-placeholder.is-small {
2596 min-height: 60px;
2597 }
2598
2599 .wp-block[data-align=center] > .wp-block-query-pagination {
2600 justify-content: center;
2601 }
2602
2603 :where(.editor-styles-wrapper) .wp-block-query-pagination {
2604 max-width: 100%;
2605 }
2606 :where(.editor-styles-wrapper) .wp-block-query-pagination.block-editor-block-list__layout {
2607 margin: 0;
2608 }
2609
2610 .wp-block-query-pagination-numbers a {
2611 text-decoration: underline;
2612 }
2613 .wp-block-query-pagination-numbers .page-numbers {
2614 margin-left: 2px;
2615 }
2616 .wp-block-query-pagination-numbers .page-numbers:last-child {
2617 margin-right: 0;
2618 }
2619
2620 .wp-block-post-featured-image .block-editor-media-placeholder {
2621 z-index: 1;
2622 backdrop-filter: none;
2623 }
2624 .wp-block-post-featured-image .wp-block-post-featured-image__placeholder,
2625 .wp-block-post-featured-image .components-placeholder {
2626 justify-content: center;
2627 align-items: center;
2628 padding: 0;
2629 display: flex;
2630 }
2631 .wp-block-post-featured-image .wp-block-post-featured-image__placeholder .components-form-file-upload,
2632 .wp-block-post-featured-image .components-placeholder .components-form-file-upload {
2633 display: none;
2634 }
2635 .wp-block-post-featured-image .wp-block-post-featured-image__placeholder .components-button,
2636 .wp-block-post-featured-image .components-placeholder .components-button {
2637 margin: auto;
2638 padding: 0;
2639 display: flex;
2640 justify-content: center;
2641 align-items: center;
2642 width: 48px;
2643 height: 48px;
2644 border-radius: 50%;
2645 position: relative;
2646 background: var(--wp-admin-theme-color);
2647 border-color: var(--wp-admin-theme-color);
2648 border-style: solid;
2649 color: #fff;
2650 }
2651 .wp-block-post-featured-image .wp-block-post-featured-image__placeholder .components-button > svg,
2652 .wp-block-post-featured-image .components-placeholder .components-button > svg {
2653 color: inherit;
2654 }
2655 .wp-block-post-featured-image .wp-block-post-featured-image__placeholder,
2656 .wp-block-post-featured-image .components-placeholder {
2657 min-height: 200px;
2658 }
2659 .wp-block-post-featured-image .wp-block-post-featured-image__placeholder:where(.has-border-color),
2660 .wp-block-post-featured-image .components-placeholder:where(.has-border-color),
2661 .wp-block-post-featured-image img:where(.has-border-color) {
2662 border-style: solid;
2663 }
2664 .wp-block-post-featured-image .wp-block-post-featured-image__placeholder:where([style*=border-top-color]),
2665 .wp-block-post-featured-image .components-placeholder:where([style*=border-top-color]),
2666 .wp-block-post-featured-image img:where([style*=border-top-color]) {
2667 border-top-style: solid;
2668 }
2669 .wp-block-post-featured-image .wp-block-post-featured-image__placeholder:where([style*=border-right-color]),
2670 .wp-block-post-featured-image .components-placeholder:where([style*=border-right-color]),
2671 .wp-block-post-featured-image img:where([style*=border-right-color]) {
2672 border-left-style: solid;
2673 }
2674 .wp-block-post-featured-image .wp-block-post-featured-image__placeholder:where([style*=border-bottom-color]),
2675 .wp-block-post-featured-image .components-placeholder:where([style*=border-bottom-color]),
2676 .wp-block-post-featured-image img:where([style*=border-bottom-color]) {
2677 border-bottom-style: solid;
2678 }
2679 .wp-block-post-featured-image .wp-block-post-featured-image__placeholder:where([style*=border-left-color]),
2680 .wp-block-post-featured-image .components-placeholder:where([style*=border-left-color]),
2681 .wp-block-post-featured-image img:where([style*=border-left-color]) {
2682 border-right-style: solid;
2683 }
2684 .wp-block-post-featured-image .wp-block-post-featured-image__placeholder:where([style*=border-width]),
2685 .wp-block-post-featured-image .components-placeholder:where([style*=border-width]),
2686 .wp-block-post-featured-image img:where([style*=border-width]) {
2687 border-style: solid;
2688 }
2689 .wp-block-post-featured-image .wp-block-post-featured-image__placeholder:where([style*=border-top-width]),
2690 .wp-block-post-featured-image .components-placeholder:where([style*=border-top-width]),
2691 .wp-block-post-featured-image img:where([style*=border-top-width]) {
2692 border-top-style: solid;
2693 }
2694 .wp-block-post-featured-image .wp-block-post-featured-image__placeholder:where([style*=border-right-width]),
2695 .wp-block-post-featured-image .components-placeholder:where([style*=border-right-width]),
2696 .wp-block-post-featured-image img:where([style*=border-right-width]) {
2697 border-left-style: solid;
2698 }
2699 .wp-block-post-featured-image .wp-block-post-featured-image__placeholder:where([style*=border-bottom-width]),
2700 .wp-block-post-featured-image .components-placeholder:where([style*=border-bottom-width]),
2701 .wp-block-post-featured-image img:where([style*=border-bottom-width]) {
2702 border-bottom-style: solid;
2703 }
2704 .wp-block-post-featured-image .wp-block-post-featured-image__placeholder:where([style*=border-left-width]),
2705 .wp-block-post-featured-image .components-placeholder:where([style*=border-left-width]),
2706 .wp-block-post-featured-image img:where([style*=border-left-width]) {
2707 border-right-style: solid;
2708 }
2709 .wp-block-post-featured-image[style*=height] .components-placeholder {
2710 min-height: 48px;
2711 min-width: 48px;
2712 height: 100%;
2713 width: 100%;
2714 }
2715 .wp-block-post-featured-image > a {
2716 pointer-events: none;
2717 }
2718 .wp-block-post-featured-image.is-selected .components-placeholder.has-illustration .components-button,
2719 .wp-block-post-featured-image.is-selected .components-placeholder.has-illustration .components-placeholder__instructions,
2720 .wp-block-post-featured-image.is-selected .components-placeholder.has-illustration .components-placeholder__label {
2721 opacity: 1;
2722 pointer-events: auto;
2723 }
2724 .wp-block-post-featured-image.is-transient {
2725 position: relative;
2726 }
2727 .wp-block-post-featured-image.is-transient img {
2728 opacity: 0.3;
2729 }
2730 .wp-block-post-featured-image.is-transient .components-spinner {
2731 position: absolute;
2732 top: 50%;
2733 right: 50%;
2734 transform: translate(50%, -50%);
2735 }
2736
2737 div[data-type="core/post-featured-image"] img {
2738 max-width: 100%;
2739 height: auto;
2740 display: block;
2741 }
2742
2743 .wp-block-post-comments-form * {
2744 pointer-events: none;
2745 }
2746 .wp-block-post-comments-form *.block-editor-warning * {
2747 pointer-events: auto;
2748 }
2749
2750 /**
2751 * Element styles for the editor
2752 */
2753 .wp-element-button {
2754 cursor: revert;
2755 }
2756 .wp-element-button[role=textbox] {
2757 cursor: text;
2758 }
2759
2760 .block-library-poster-image__container {
2761 position: relative;
2762 }
2763 .block-library-poster-image__container:hover .block-library-poster-image__actions, .block-library-poster-image__container:focus .block-library-poster-image__actions, .block-library-poster-image__container:focus-within .block-library-poster-image__actions {
2764 opacity: 1;
2765 }
2766 .block-library-poster-image__container .block-library-poster-image__actions.block-library-poster-image__actions-select {
2767 opacity: 1;
2768 margin-top: 16px;
2769 }
2770 .block-library-poster-image__container .components-drop-zone__content {
2771 border-radius: 2px;
2772 }
2773 .block-library-poster-image__container .components-drop-zone .components-drop-zone__content-inner {
2774 display: flex;
2775 align-items: center;
2776 gap: 8px;
2777 }
2778 .block-library-poster-image__container .components-drop-zone .components-drop-zone__content-inner .components-drop-zone__content-icon {
2779 margin: 0;
2780 }
2781 .block-library-poster-image__container .components-spinner {
2782 position: absolute;
2783 top: 50%;
2784 right: 50%;
2785 margin-top: -9px;
2786 margin-right: -9px;
2787 }
2788
2789 .block-library-poster-image__preview {
2790 width: 100%;
2791 padding: 0;
2792 overflow: hidden;
2793 outline-offset: -1px;
2794 min-height: 40px;
2795 display: flex;
2796 justify-content: center;
2797 height: auto !important;
2798 outline: 1px solid rgba(0, 0, 0, 0.1);
2799 }
2800 .block-library-poster-image__preview .block-library-poster-image__preview-image {
2801 -o-object-fit: cover;
2802 object-fit: cover;
2803 width: 100%;
2804 -o-object-position: 50% 50%;
2805 object-position: 50% 50%;
2806 aspect-ratio: 2/1;
2807 }
2808
2809 .block-library-poster-image__actions:not(.block-library-poster-image__actions-select) {
2810 bottom: 0;
2811 opacity: 0;
2812 padding: 8px;
2813 position: absolute;
2814 }
2815 @media not (prefers-reduced-motion) {
2816 .block-library-poster-image__actions:not(.block-library-poster-image__actions-select) {
2817 transition: opacity 50ms ease-out;
2818 }
2819 }
2820 .block-library-poster-image__actions:not(.block-library-poster-image__actions-select) .block-library-poster-image__action {
2821 backdrop-filter: blur(16px) saturate(180%);
2822 background: rgba(255, 255, 255, 0.75);
2823 }
2824 .block-library-poster-image__actions .block-library-poster-image__action {
2825 flex-grow: 1;
2826 justify-content: center;
2827 }
2828
2829 :root .editor-styles-wrapper .has-very-light-gray-background-color {
2830 background-color: #eee;
2831 }
2832 :root .editor-styles-wrapper .has-very-dark-gray-background-color {
2833 background-color: #313131;
2834 }
2835 :root .editor-styles-wrapper .has-very-light-gray-color {
2836 color: #eee;
2837 }
2838 :root .editor-styles-wrapper .has-very-dark-gray-color {
2839 color: #313131;
2840 }
2841 :root .editor-styles-wrapper {
2842 /* stylelint-disable @stylistic/function-comma-space-after -- We can not use spacing because of WP multi site kses rule. */
2843 }
2844 :root .editor-styles-wrapper .has-vivid-green-cyan-to-vivid-cyan-blue-gradient-background {
2845 background: linear-gradient(-135deg, rgb(0, 208, 132) 0%, rgb(6, 147, 227) 100%);
2846 }
2847 :root .editor-styles-wrapper .has-purple-crush-gradient-background {
2848 background: linear-gradient(-135deg, rgb(52, 226, 228) 0%, rgb(71, 33, 251) 50%, rgb(171, 29, 254) 100%);
2849 }
2850 :root .editor-styles-wrapper .has-hazy-dawn-gradient-background {
2851 background: linear-gradient(-135deg, rgb(250, 172, 168) 0%, rgb(218, 208, 236) 100%);
2852 }
2853 :root .editor-styles-wrapper .has-subdued-olive-gradient-background {
2854 background: linear-gradient(-135deg, rgb(250, 250, 225) 0%, rgb(103, 166, 113) 100%);
2855 }
2856 :root .editor-styles-wrapper .has-atomic-cream-gradient-background {
2857 background: linear-gradient(-135deg, rgb(253, 215, 154) 0%, rgb(0, 74, 89) 100%);
2858 }
2859 :root .editor-styles-wrapper .has-nightshade-gradient-background {
2860 background: linear-gradient(-135deg, rgb(51, 9, 104) 0%, rgb(49, 205, 207) 100%);
2861 }
2862 :root .editor-styles-wrapper .has-midnight-gradient-background {
2863 background: linear-gradient(-135deg, rgb(2, 3, 129) 0%, rgb(40, 116, 252) 100%);
2864 }
2865 :root .editor-styles-wrapper {
2866 /* stylelint-enable @stylistic/function-comma-space-after */
2867 }
2868
2869 :where(.editor-styles-wrapper) .has-regular-font-size {
2870 font-size: 16px;
2871 }
2872
2873 :where(.editor-styles-wrapper) .has-larger-font-size {
2874 font-size: 42px;
2875 }
2876
2877 /**
2878 * Editor Normalization Styles
2879 *
2880 * These are only output in the editor, but styles here are NOT prefixed .editor-styles-wrapper.
2881 * This allows us to create normalization styles that are easily overridden by editor styles.
2882 */
2883 :where(.editor-styles-wrapper) iframe:not([frameborder]) {
2884 border: 0;
2885 }