gutenberg / build / styles / editor / style.css

style.css in Gutenberg 22.5.3, at build/styles/editor/style.css

6,618 lines 181.6 KB

Raw Download Zip

1	@charset "UTF-8";
2	/**
3	* Typography
4	*/
5	/**
6	* SCSS Variables.
7	*
8	* Please use variables from this sheet to ensure consistency across the UI.
9	* Don't add to this sheet unless you're pretty sure the value will be reused in many places.
10	* For example, don't add rules to this sheet that affect block visuals. It's purely for UI.
11	*/
12	/**
13	* Colors
14	*/
15	/**
16	* Fonts & basic variables.
17	*/
18	/**
19	* Typography
20	*/
21	/**
22	* Grid System.
23	* https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/
24	*/
25	/**
26	* Radius scale.
27	*/
28	/**
29	* Elevation scale.
30	*/
31	/**
32	* Dimensions.
33	*/
34	/**
35	* Mobile specific styles
36	*/
37	/**
38	* Editor styles.
39	*/
40	/**
41	* Block & Editor UI.
42	*/
43	/**
44	* Block paddings.
45	*/
46	/**
47	* React Native specific.
48	* These variables do not appear to be used anywhere else.
49	*/
50	/**
51	* Breakpoints & Media Queries
52	*/
53	/**
54	* Converts a hex value into the rgb equivalent.
55	*
56	* @param {string} hex - the hexadecimal value to convert
57	* @return {string} comma separated rgb values
58	*/
59	/**
60	* Long content fade mixin
61	*
62	* Creates a fading overlay to signify that the content is longer
63	* than the space allows.
64	*/
65	/**
66	* Breakpoint mixins
67	*/
68	/**
69	* Focus styles.
70	*/
71	/**
72	* Applies editor left position to the selector passed as argument
73	*/
74	/**
75	* Styles that are reused verbatim in a few places
76	*/
77	/**
78	* Allows users to opt-out of animations via OS-level preferences.
79	*/
80	/**
81	* Reset default styles for JavaScript UI based pages.
82	* This is a WP-admin agnostic reset
83	*/
84	/**
85	* Reset the WP Admin page styles for Gutenberg-like pages.
86	*/
87	/**
88	* Creates a checkerboard pattern background to indicate transparency.
89	* @param {String} $size - The size of the squares in the checkerboard pattern. Default is 12px.
90	*/
91	:root {
92	--wp-block-synced-color: #7a00df;
93	--wp-block-synced-color--rgb: 122, 0, 223;
94	--wp-bound-block-color: var(--wp-block-synced-color);
95	--wp-editor-canvas-background: #ddd;
96	--wp-admin-theme-color: #007cba;
97	--wp-admin-theme-color--rgb: 0, 124, 186;
98	--wp-admin-theme-color-darker-10: rgb(0, 107, 160.5);
99	--wp-admin-theme-color-darker-10--rgb: 0, 107, 160.5;
100	--wp-admin-theme-color-darker-20: #005a87;
101	--wp-admin-theme-color-darker-20--rgb: 0, 90, 135;
102	--wp-admin-border-width-focus: 2px;
103	}
104	@media (min-resolution: 192dpi) {
105	:root {
106	--wp-admin-border-width-focus: 1.5px;
107	}
108	}
109
110	/**
111	* Colors
112	*/
113	/**
114	* SCSS Variables.
115	*
116	* Please use variables from this sheet to ensure consistency across the UI.
117	* Don't add to this sheet unless you're pretty sure the value will be reused in many places.
118	* For example, don't add rules to this sheet that affect block visuals. It's purely for UI.
119	*/
120	/**
121	* Fonts & basic variables.
122	*/
123	/**
124	* Typography
125	*/
126	/**
127	* Grid System.
128	* https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/
129	*/
130	/**
131	* Radius scale.
132	*/
133	/**
134	* Elevation scale.
135	*/
136	/**
137	* Dimensions.
138	*/
139	/**
140	* Mobile specific styles
141	*/
142	/**
143	* Editor styles.
144	*/
145	/**
146	* Block & Editor UI.
147	*/
148	/**
149	* Block paddings.
150	*/
151	/**
152	* React Native specific.
153	* These variables do not appear to be used anywhere else.
154	*/
155	/**
156	* Typography
157	*/
158	/**
159	* Breakpoints & Media Queries
160	*/
161	/**
162	* Converts a hex value into the rgb equivalent.
163	*
164	* @param {string} hex - the hexadecimal value to convert
165	* @return {string} comma separated rgb values
166	*/
167	/**
168	* Long content fade mixin
169	*
170	* Creates a fading overlay to signify that the content is longer
171	* than the space allows.
172	*/
173	/**
174	* Breakpoint mixins
175	*/
176	/**
177	* Focus styles.
178	*/
179	/**
180	* Applies editor left position to the selector passed as argument
181	*/
182	/**
183	* Styles that are reused verbatim in a few places
184	*/
185	/**
186	* Allows users to opt-out of animations via OS-level preferences.
187	*/
188	/**
189	* Reset default styles for JavaScript UI based pages.
190	* This is a WP-admin agnostic reset
191	*/
192	/**
193	* Reset the WP Admin page styles for Gutenberg-like pages.
194	*/
195	/**
196	* Creates a checkerboard pattern background to indicate transparency.
197	* @param {String} $size - The size of the squares in the checkerboard pattern. Default is 12px.
198	*/
199	.admin-ui-page {
200	display: flex;
201	height: 100%;
202	background-color: #fff;
203	color: #2f2f2f;
204	position: relative;
205	z-index: 1;
206	flex-flow: column;
207	}
208
209	.admin-ui-page__header {
210	padding: 16px 24px;
211	border-bottom: 1px solid #f0f0f0;
212	background: #fff;
213	position: sticky;
214	top: 0;
215	z-index: 1;
216	}
217
218	.admin-ui-page__sidebar-toggle-slot:empty {
219	display: none;
220	}
221
222	.admin-ui-page__header-subtitle {
223	padding-block-end: 8px;
224	color: #757575;
225	font-family: -apple-system, "system-ui", "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
226	font-weight: 400;
227	font-size: 13px;
228	line-height: 20px;
229	margin: 0;
230	}
231
232	.admin-ui-page__content {
233	flex-grow: 1;
234	overflow: auto;
235	display: flex;
236	flex-direction: column;
237	}
238
239	.admin-ui-page__content.has-padding {
240	padding: 16px 24px;
241	}
242
243	.show-icon-labels .admin-ui-page__header-actions .components-button.has-icon {
244	width: auto;
245	padding: 0 8px;
246	}
247
248	.show-icon-labels .admin-ui-page__header-actions .components-button.has-icon svg {
249	display: none;
250	}
251
252	.show-icon-labels .admin-ui-page__header-actions .components-button.has-icon::after {
253	content: attr(aria-label);
254	font-size: 12px;
255	}
256
257	.admin-ui-breadcrumbs__list {
258	list-style: none;
259	padding: 0;
260	margin: 0;
261	gap: 0;
262	font-size: 15px;
263	min-height: 32px;
264	font-weight: 500;
265	}
266
267	.admin-ui-breadcrumbs__list li:not(:last-child)::after {
268	content: "/";
269	margin: 0 8px;
270	}
271
272	.admin-ui-breadcrumbs__list h1 {
273	font-size: inherit;
274	line-height: inherit;
275	}
276
277	/**
278	* Colors
279	*/
280	/**
281	* SCSS Variables.
282	*
283	* Please use variables from this sheet to ensure consistency across the UI.
284	* Don't add to this sheet unless you're pretty sure the value will be reused in many places.
285	* For example, don't add rules to this sheet that affect block visuals. It's purely for UI.
286	*/
287	/**
288	* Fonts & basic variables.
289	*/
290	/**
291	* Typography
292	*/
293	/**
294	* Grid System.
295	* https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/
296	*/
297	/**
298	* Radius scale.
299	*/
300	/**
301	* Elevation scale.
302	*/
303	/**
304	* Dimensions.
305	*/
306	/**
307	* Mobile specific styles
308	*/
309	/**
310	* Editor styles.
311	*/
312	/**
313	* Block & Editor UI.
314	*/
315	/**
316	* Block paddings.
317	*/
318	/**
319	* React Native specific.
320	* These variables do not appear to be used anywhere else.
321	*/
322	.interface-complementary-area-header {
323	background: #fff;
324	padding-right: 8px;
325	gap: 4px;
326	}
327
328	.interface-complementary-area-header .interface-complementary-area-header__title {
329	margin: 0 auto 0 0;
330	}
331
332	/**
333	* Typography
334	*/
335	/**
336	* Breakpoints & Media Queries
337	*/
338	/**
339	* Converts a hex value into the rgb equivalent.
340	*
341	* @param {string} hex - the hexadecimal value to convert
342	* @return {string} comma separated rgb values
343	*/
344	/**
345	* Long content fade mixin
346	*
347	* Creates a fading overlay to signify that the content is longer
348	* than the space allows.
349	*/
350	/**
351	* Breakpoint mixins
352	*/
353	/**
354	* Focus styles.
355	*/
356	/**
357	* Applies editor left position to the selector passed as argument
358	*/
359	/**
360	* Styles that are reused verbatim in a few places
361	*/
362	/**
363	* Allows users to opt-out of animations via OS-level preferences.
364	*/
365	/**
366	* Reset default styles for JavaScript UI based pages.
367	* This is a WP-admin agnostic reset
368	*/
369	/**
370	* Reset the WP Admin page styles for Gutenberg-like pages.
371	*/
372	/**
373	* Creates a checkerboard pattern background to indicate transparency.
374	* @param {String} $size - The size of the squares in the checkerboard pattern. Default is 12px.
375	*/
376	.interface-complementary-area {
377	background: #fff;
378	color: #1e1e1e;
379	height: 100%;
380	overflow: auto;
381	}
382
383	@media (min-width: 782px) {
384	.interface-complementary-area {
385	width: 280px;
386	}
387	}
388	.interface-complementary-area .components-panel {
389	border: none;
390	position: relative;
391	z-index: 0;
392	}
393
394	.interface-complementary-area .components-panel__header {
395	position: sticky;
396	top: 0;
397	z-index: 1;
398	}
399
400	.interface-complementary-area .components-panel__header.editor-sidebar__panel-tabs {
401	top: 0;
402	}
403
404	.interface-complementary-area p:not(.components-base-control__help, .components-form-token-field__help) {
405	margin-top: 0;
406	}
407
408	.interface-complementary-area h2 {
409	font-size: 13px;
410	font-weight: 499;
411	color: #1e1e1e;
412	margin-bottom: 1.5em;
413	}
414
415	.interface-complementary-area h3 {
416	font-size: 11px;
417	text-transform: uppercase;
418	font-weight: 499;
419	color: #1e1e1e;
420	margin-bottom: 1.5em;
421	}
422
423	.interface-complementary-area hr {
424	border-top: none;
425	border-bottom: 1px solid #f0f0f0;
426	margin: 1.5em 0;
427	}
428
429	.interface-complementary-area div.components-toolbar-group,
430	.interface-complementary-area div.components-toolbar {
431	box-shadow: none;
432	margin-bottom: 1.5em;
433	}
434
435	.interface-complementary-area div.components-toolbar-group:last-child,
436	.interface-complementary-area div.components-toolbar:last-child {
437	margin-bottom: 0;
438	}
439
440	.interface-complementary-area .block-editor-skip-to-selected-block:focus {
441	top: auto;
442	right: 10px;
443	bottom: 10px;
444	left: auto;
445	}
446
447	.interface-complementary-area__fill {
448	height: 100%;
449	}
450
451	@media (min-width: 782px) {
452	body.js.is-fullscreen-mode {
453	margin-top: -32px;
454	height: calc(100% + 32px);
455	}
456	body.js.is-fullscreen-mode #adminmenumain,
457	body.js.is-fullscreen-mode #wpadminbar {
458	display: none;
459	}
460	body.js.is-fullscreen-mode #wpcontent,
461	body.js.is-fullscreen-mode #wpfooter {
462	margin-left: 0;
463	}
464	}
465	html.interface-interface-skeleton__html-container {
466	position: fixed;
467	width: 100%;
468	}
469
470	@media (min-width: 782px) {
471	html.interface-interface-skeleton__html-container:not(:has(.is-zoom-out)) {
472	position: initial;
473	width: initial;
474	}
475	}
476	.interface-interface-skeleton {
477	display: flex;
478	flex-direction: row;
479	height: auto;
480	max-height: 100%;
481	position: fixed;
482	top: 46px;
483	left: 0;
484	right: 0;
485	bottom: 0;
486	}
487
488	@media (min-width: 783px) {
489	.interface-interface-skeleton {
490	top: 32px;
491	}
492	.is-fullscreen-mode .interface-interface-skeleton {
493	top: 0;
494	}
495	}
496	.interface-interface-skeleton__editor {
497	display: flex;
498	flex-direction: column;
499	flex: 0 1 100%;
500	overflow: hidden;
501	}
502
503	.interface-interface-skeleton { /* Set left position when auto-fold is not on the body element. */
504	left: 0;
505	}
506
507	@media (min-width: 783px) {
508	.interface-interface-skeleton {
509	left: 160px;
510	}
511	}
512	.auto-fold .interface-interface-skeleton { /* Auto fold is when on smaller breakpoints, nav menu auto collapses. */ }
513
514	@media (min-width: 783px) {
515	.auto-fold .interface-interface-skeleton {
516	left: 36px;
517	}
518	}
519	@media (min-width: 961px) {
520	.auto-fold .interface-interface-skeleton {
521	left: 160px;
522	}
523	}
524	/* Sidebar manually collapsed. */
525	.folded .interface-interface-skeleton {
526	left: 0;
527	}
528
529	@media (min-width: 783px) {
530	.folded .interface-interface-skeleton {
531	left: 36px;
532	}
533	}
534	body.is-fullscreen-mode .interface-interface-skeleton {
535	left: 0 !important;
536	}
537
538	.interface-interface-skeleton__body {
539	position: relative;
540	flex-grow: 1;
541	display: flex;
542	overflow: auto;
543	overscroll-behavior-y: none;
544	}
545
546	@media (min-width: 782px) {
547	.has-footer .interface-interface-skeleton__body {
548	padding-bottom: 25px;
549	}
550	}
551	.interface-interface-skeleton__content {
552	flex-grow: 1;
553	display: flex;
554	flex-direction: column;
555	overflow: auto;
556	z-index: 20;
557	}
558
559	@media (min-width: 782px) {
560	.interface-interface-skeleton__content {
561	z-index: auto;
562	}
563	}
564	.interface-interface-skeleton__secondary-sidebar,
565	.interface-interface-skeleton__sidebar {
566	flex-shrink: 0;
567	position: absolute;
568	z-index: 100000;
569	top: 0;
570	left: 0;
571	bottom: 0;
572	background: #fff;
573	color: #1e1e1e;
574	width: auto;
575	}
576
577	@media (min-width: 782px) {
578	.interface-interface-skeleton__secondary-sidebar,
579	.interface-interface-skeleton__sidebar {
580	position: relative !important;
581	}
582	}
583	.interface-interface-skeleton__sidebar {
584	border-top: 1px solid #e0e0e0;
585	overflow: hidden;
586	}
587
588	@media (min-width: 782px) {
589	.interface-interface-skeleton__sidebar {
590	box-shadow: -1px 0 0 0 rgba(0, 0, 0, 0.133);
591	outline: 1px solid transparent;
592	}
593	}
594	.interface-interface-skeleton__secondary-sidebar {
595	border-top: 1px solid #e0e0e0;
596	right: 0;
597	}
598
599	@media (min-width: 782px) {
600	.interface-interface-skeleton__secondary-sidebar {
601	box-shadow: 1px 0 0 0 rgba(0, 0, 0, 0.133);
602	outline: 1px solid transparent;
603	}
604	}
605	.interface-interface-skeleton__header {
606	flex-shrink: 0;
607	height: auto;
608	box-shadow: 0 1px 0 0 rgba(0, 0, 0, 0.133);
609	z-index: 30;
610	color: #1e1e1e;
611	outline: 1px solid transparent;
612	}
613
614	.interface-interface-skeleton__footer {
615	height: auto;
616	flex-shrink: 0;
617	border-top: 1px solid #e0e0e0;
618	color: #1e1e1e;
619	position: absolute;
620	bottom: 0;
621	left: 0;
622	width: 100%;
623	background-color: #fff;
624	z-index: 90;
625	display: none;
626	}
627
628	@media (min-width: 782px) {
629	.interface-interface-skeleton__footer {
630	display: flex;
631	}
632	}
633	.interface-interface-skeleton__footer .block-editor-block-breadcrumb {
634	z-index: 30;
635	display: flex;
636	background: #fff;
637	height: 24px;
638	align-items: center;
639	font-size: 13px;
640	padding: 0 18px;
641	}
642
643	.interface-interface-skeleton__actions {
644	z-index: 100000;
645	position: fixed !important;
646	top: -9999em;
647	bottom: auto;
648	left: auto;
649	right: 0;
650	color: #1e1e1e;
651	background: #fff;
652	width: 100vw;
653	}
654
655	@media (min-width: 782px) {
656	.interface-interface-skeleton__actions {
657	width: 280px;
658	}
659	}
660	.interface-interface-skeleton__actions:focus, .interface-interface-skeleton__actions:focus-within {
661	top: auto;
662	bottom: 0;
663	}
664
665	.is-entity-save-view-open .interface-interface-skeleton__actions:focus, .is-entity-save-view-open .interface-interface-skeleton__actions:focus-within {
666	top: 46px;
667	}
668
669	@media (min-width: 782px) {
670	.is-entity-save-view-open .interface-interface-skeleton__actions:focus, .is-entity-save-view-open .interface-interface-skeleton__actions:focus-within {
671	border-left: 1px solid #ddd;
672	top: 32px;
673	}
674	.is-fullscreen-mode .is-entity-save-view-open .interface-interface-skeleton__actions:focus, .is-fullscreen-mode .is-entity-save-view-open .interface-interface-skeleton__actions:focus-within {
675	top: 0;
676	}
677	}
678	.interface-pinned-items {
679	display: flex;
680	}
681
682	.interface-pinned-items .components-button {
683	display: none;
684	margin: 0;
685	}
686
687	.interface-pinned-items .components-button[aria-controls="edit-post:document"], .interface-pinned-items .components-button[aria-controls="edit-post:block"], .interface-pinned-items .components-button[aria-controls="edit-site:template"], .interface-pinned-items .components-button[aria-controls="edit-site:block-inspector"] {
688	display: flex;
689	}
690
691	.interface-pinned-items .components-button svg {
692	max-width: 24px;
693	max-height: 24px;
694	}
695
696	@media (min-width: 600px) {
697	.interface-pinned-items .components-button {
698	display: flex;
699	}
700	}
701	.interface-pinned-items {
702	gap: 8px;
703	}
704
705	/**
706	* SCSS Variables.
707	*
708	* Please use variables from this sheet to ensure consistency across the UI.
709	* Don't add to this sheet unless you're pretty sure the value will be reused in many places.
710	* For example, don't add rules to this sheet that affect block visuals. It's purely for UI.
711	*/
712	/**
713	* Colors
714	*/
715	/**
716	* Fonts & basic variables.
717	*/
718	/**
719	* Typography
720	*/
721	/**
722	* Grid System.
723	* https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/
724	*/
725	/**
726	* Radius scale.
727	*/
728	/**
729	* Elevation scale.
730	*/
731	/**
732	* Dimensions.
733	*/
734	/**
735	* Mobile specific styles
736	*/
737	/**
738	* Editor styles.
739	*/
740	/**
741	* Block & Editor UI.
742	*/
743	/**
744	* Block paddings.
745	*/
746	/**
747	* React Native specific.
748	* These variables do not appear to be used anywhere else.
749	*/
750	/**
751	* Typography
752	*/
753	/**
754	* Breakpoints & Media Queries
755	*/
756	/**
757	* Converts a hex value into the rgb equivalent.
758	*
759	* @param {string} hex - the hexadecimal value to convert
760	* @return {string} comma separated rgb values
761	*/
762	/**
763	* Long content fade mixin
764	*
765	* Creates a fading overlay to signify that the content is longer
766	* than the space allows.
767	*/
768	/**
769	* Breakpoint mixins
770	*/
771	/**
772	* Focus styles.
773	*/
774	/**
775	* Applies editor left position to the selector passed as argument
776	*/
777	/**
778	* Styles that are reused verbatim in a few places
779	*/
780	/**
781	* Allows users to opt-out of animations via OS-level preferences.
782	*/
783	/**
784	* Reset default styles for JavaScript UI based pages.
785	* This is a WP-admin agnostic reset
786	*/
787	/**
788	* Reset the WP Admin page styles for Gutenberg-like pages.
789	*/
790	/**
791	* Creates a checkerboard pattern background to indicate transparency.
792	* @param {String} $size - The size of the squares in the checkerboard pattern. Default is 12px.
793	*/
794	@media (min-width: 782px) {
795	.font-library-modal.font-library-modal {
796	width: 65vw;
797	}
798	}
799	.font-library-modal .components-modal__header {
800	border-bottom: none;
801	}
802
803	.font-library-modal .components-modal__content {
804	padding: 0;
805	margin-bottom: 90px;
806	}
807
808	.font-library-modal .font-library__subtitle {
809	text-transform: uppercase;
810	font-weight: 499;
811	font-size: 11px;
812	}
813
814	.font-library-modal__tab-panel {
815	height: calc(100% - 50px);
816	}
817
818	.font-library__tabpanel-layout {
819	height: 100%;
820	display: flex;
821	flex-direction: column;
822	}
823
824	.font-library__tabpanel-layout > div {
825	flex-grow: 1;
826	}
827
828	.font-library__tabpanel-layout .font-library__loading {
829	width: 100%;
830	height: 100%;
831	display: flex;
832	position: absolute;
833	left: 0;
834	top: 0;
835	align-items: center;
836	justify-content: center;
837	padding-top: 124px;
838	box-sizing: border-box;
839	}
840
841	.font-library__tabpanel-layout .components-navigator-screen {
842	padding: 24px;
843	width: 100%;
844	}
845
846	.font-library__footer {
847	position: absolute;
848	width: 100%;
849	bottom: 0;
850	border-top: 1px solid #ddd;
851	padding: 24px;
852	background-color: #fff;
853	box-sizing: border-box;
854	flex-grow: 0 !important;
855	flex-shrink: 0;
856	height: 90px;
857	}
858
859	.font-library__page-selection {
860	font-size: 11px;
861	font-weight: 499;
862	text-transform: uppercase;
863	}
864
865	@media (min-width: 600px) {
866	.font-library__page-selection .font-library__page-selection-trigger {
867	font-size: 11px !important;
868	font-weight: 499;
869	}
870	}
871	.font-library__fonts-title {
872	text-transform: uppercase;
873	font-size: 11px;
874	font-weight: 600;
875	margin-top: 0;
876	margin-bottom: 0;
877	}
878
879	.font-library__fonts-list {
880	list-style: none;
881	padding: 0;
882	margin-top: 0;
883	margin-bottom: 0;
884	}
885
886	.font-library__fonts-list-item {
887	margin-bottom: 0;
888	}
889
890	.font-library__font-card {
891	box-sizing: border-box;
892	border: 1px solid #ddd;
893	width: 100%;
894	height: auto !important;
895	padding: 16px;
896	margin-top: -1px; /* To collapse the margin with the previous element */
897	}
898
899	.font-library__font-card:hover {
900	background-color: #f0f0f0;
901	}
902
903	.font-library__font-card:focus {
904	position: relative;
905	}
906
907	.font-library__font-card .font-library__font-card__name {
908	font-weight: bold;
909	}
910
911	.font-library__font-card .font-library__font-card__count {
912	color: #757575;
913	}
914
915	.font-library__font-card .font-library__font-variant_demo-image {
916	display: block;
917	height: 24px;
918	width: auto;
919	}
920
921	.font-library__font-card .font-library__font-variant_demo-text {
922	white-space: nowrap;
923	flex-shrink: 0;
924	}
925
926	@media not (prefers-reduced-motion) {
927	.font-library__font-card .font-library__font-variant_demo-text {
928	transition: opacity 0.3s ease-in-out;
929	}
930	}
931	.font-library-modal__tablist-container {
932	position: sticky;
933	top: 0;
934	border-bottom: 1px solid #ddd;
935	background: #fff;
936	z-index: 1;
937	}
938
939	.font-library__upload-area {
940	align-items: center;
941	display: flex;
942	justify-content: center;
943	height: 256px !important;
944	width: 100%;
945	}
946
947	button.font-library__upload-area {
948	background-color: #f0f0f0;
949	}
950
951	.font-library__local-fonts {
952	margin: 24px auto;
953	width: 80%;
954	}
955
956	.font-library__local-fonts .font-library__upload-area__text {
957	color: #757575;
958	}
959
960	.font-library__google-fonts-confirm {
961	display: flex;
962	justify-content: center;
963	align-items: center;
964	margin-top: 64px;
965	}
966
967	.font-library__google-fonts-confirm p {
968	line-height: 1.4;
969	}
970
971	.font-library__google-fonts-confirm h2 {
972	font-size: 1.2rem;
973	font-weight: 400;
974	}
975
976	.font-library__google-fonts-confirm .components-card {
977	padding: 16px;
978	width: 400px;
979	}
980
981	.font-library__google-fonts-confirm .components-button {
982	width: 100%;
983	justify-content: center;
984	}
985
986	.font-library__select-all {
987	padding: 16px 16px 16px 17px;
988	}
989
990	.font-library__select-all .components-checkbox-control__label {
991	padding-left: 16px;
992	}
993
994	.global-styles-ui-pagination .components-button.is-tertiary {
995	width: 32px;
996	height: 32px;
997	justify-content: center;
998	}
999
1000	.global-styles-ui-screen-revisions__revisions-list {
1001	list-style: none;
1002	margin: 0 16px 16px 16px;
1003	flex-grow: 1;
1004	}
1005
1006	.global-styles-ui-screen-revisions__revisions-list li {
1007	margin-bottom: 0;
1008	}
1009
1010	.global-styles-ui-screen-revisions__revision-item {
1011	position: relative;
1012	cursor: pointer;
1013	display: flex;
1014	flex-direction: column;
1015	}
1016
1017	.global-styles-ui-screen-revisions__revision-item[role=option]:active, .global-styles-ui-screen-revisions__revision-item[role=option]:focus {
1018	box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
1019	outline: 2px solid transparent;
1020	}
1021
1022	.global-styles-ui-screen-revisions__revision-item:hover {
1023	background: rgba(var(--wp-admin-theme-color--rgb), 0.04);
1024	}
1025
1026	.global-styles-ui-screen-revisions__revision-item:hover .global-styles-ui-screen-revisions__date {
1027	color: var(--wp-admin-theme-color);
1028	}
1029
1030	.global-styles-ui-screen-revisions__revision-item::before, .global-styles-ui-screen-revisions__revision-item::after {
1031	position: absolute;
1032	content: "\a";
1033	display: block;
1034	}
1035
1036	.global-styles-ui-screen-revisions__revision-item::before {
1037	background: #ddd;
1038	border-radius: 50%;
1039	height: 8px;
1040	width: 8px;
1041	top: 18px;
1042	left: 17px;
1043	transform: translate(-50%, -50%);
1044	z-index: 1;
1045	border: 4px solid transparent;
1046	}
1047
1048	.global-styles-ui-screen-revisions__revision-item[aria-selected=true] {
1049	border-radius: 2px;
1050	outline: 3px solid transparent;
1051	outline-offset: -2px;
1052	color: var(--wp-admin-theme-color);
1053	background: rgba(var(--wp-admin-theme-color--rgb), 0.04);
1054	}
1055
1056	.global-styles-ui-screen-revisions__revision-item[aria-selected=true] .global-styles-ui-screen-revisions__date {
1057	color: var(--wp-admin-theme-color);
1058	}
1059
1060	.global-styles-ui-screen-revisions__revision-item[aria-selected=true]::before {
1061	background: var(--wp-admin-theme-color);
1062	}
1063
1064	.global-styles-ui-screen-revisions__revision-item[aria-selected=true] .global-styles-ui-screen-revisions__changes > li,
1065	.global-styles-ui-screen-revisions__revision-item[aria-selected=true] .global-styles-ui-screen-revisions__meta,
1066	.global-styles-ui-screen-revisions__revision-item[aria-selected=true] .global-styles-ui-screen-revisions__applied-text {
1067	color: #1e1e1e;
1068	}
1069
1070	.global-styles-ui-screen-revisions__revision-item::after {
1071	height: 100%;
1072	left: 16px;
1073	top: 0;
1074	width: 0;
1075	border: 0.5px solid #ddd;
1076	}
1077
1078	.global-styles-ui-screen-revisions__revision-item:first-child::after {
1079	top: 18px;
1080	}
1081
1082	.global-styles-ui-screen-revisions__revision-item:last-child::after {
1083	height: 18px;
1084	}
1085
1086	.global-styles-ui-screen-revisions__revision-item-wrapper {
1087	display: block;
1088	padding: 12px 12px 4px 40px;
1089	}
1090
1091	.global-styles-ui-screen-revisions__apply-button.is-primary,
1092	.global-styles-ui-screen-revisions__applied-text {
1093	align-self: flex-start;
1094	margin: 4px 12px 12px 40px;
1095	}
1096
1097	.global-styles-ui-screen-revisions__changes,
1098	.global-styles-ui-screen-revisions__meta,
1099	.global-styles-ui-screen-revisions__applied-text {
1100	color: #757575;
1101	font-size: 12px;
1102	}
1103
1104	.global-styles-ui-screen-revisions__description {
1105	display: flex;
1106	flex-direction: column;
1107	align-items: flex-start;
1108	gap: 8px;
1109	}
1110
1111	.global-styles-ui-screen-revisions__description .global-styles-ui-screen-revisions__date {
1112	text-transform: uppercase;
1113	font-weight: 600;
1114	font-size: 12px;
1115	}
1116
1117	.global-styles-ui-screen-revisions__meta {
1118	display: flex;
1119	justify-content: start;
1120	width: 100%;
1121	align-items: flex-start;
1122	text-align: left;
1123	margin-bottom: 4px;
1124	}
1125
1126	.global-styles-ui-screen-revisions__meta img {
1127	width: 16px;
1128	height: 16px;
1129	border-radius: 100%;
1130	margin-right: 8px;
1131	}
1132
1133	.global-styles-ui-screen-revisions__loading {
1134	margin: 24px auto !important;
1135	}
1136
1137	.global-styles-ui-screen-revisions__changes {
1138	text-align: left;
1139	line-height: 1.4;
1140	margin-left: 12px;
1141	list-style: disc;
1142	}
1143
1144	.global-styles-ui-screen-revisions__changes li {
1145	margin-bottom: 4px;
1146	}
1147
1148	.global-styles-ui-screen-revisions__pagination.global-styles-ui-screen-revisions__pagination {
1149	justify-content: space-between;
1150	gap: 2px;
1151	}
1152
1153	.global-styles-ui-screen-revisions__pagination.global-styles-ui-screen-revisions__pagination .edit-site-pagination__total {
1154	position: absolute;
1155	left: -1000px;
1156	height: 1px;
1157	margin: -1px;
1158	overflow: hidden;
1159	}
1160
1161	.global-styles-ui-screen-revisions__pagination.global-styles-ui-screen-revisions__pagination .components-text {
1162	font-size: 12px;
1163	will-change: opacity;
1164	}
1165
1166	.global-styles-ui-screen-revisions__pagination.global-styles-ui-screen-revisions__pagination .components-button.is-tertiary {
1167	color: #1e1e1e;
1168	}
1169
1170	.global-styles-ui-screen-revisions__pagination.global-styles-ui-screen-revisions__pagination .components-button.is-tertiary:disabled,
1171	.global-styles-ui-screen-revisions__pagination.global-styles-ui-screen-revisions__pagination .components-button.is-tertiary[aria-disabled=true] {
1172	color: #949494;
1173	}
1174
1175	.global-styles-ui-screen-revisions__footer {
1176	height: 56px;
1177	z-index: 1;
1178	position: sticky;
1179	min-width: 100%;
1180	bottom: 0;
1181	background: #fff;
1182	padding: 12px;
1183	border-top: 1px solid #ddd;
1184	}
1185
1186	.global-styles-ui-variations_item {
1187	box-sizing: border-box;
1188	cursor: pointer;
1189	}
1190
1191	.global-styles-ui-variations_item .global-styles-ui-variations_item-preview {
1192	border-radius: 2px;
1193	outline: 1px solid rgba(0, 0, 0, 0.1);
1194	outline-offset: -1px;
1195	overflow: hidden;
1196	position: relative;
1197	}
1198
1199	@media not (prefers-reduced-motion) {
1200	.global-styles-ui-variations_item .global-styles-ui-variations_item-preview {
1201	transition: outline 0.1s linear;
1202	}
1203	}
1204	.global-styles-ui-variations_item .global-styles-ui-variations_item-preview.is-pill {
1205	height: 32px;
1206	}
1207
1208	.global-styles-ui-variations_item .global-styles-ui-variations_item-preview.is-pill .block-editor-iframe__scale-container {
1209	overflow: hidden;
1210	}
1211
1212	.global-styles-ui-variations_item:not(.is-active):hover .global-styles-ui-variations_item-preview {
1213	outline-color: rgba(0, 0, 0, 0.3);
1214	}
1215
1216	.global-styles-ui-variations_item.is-active .global-styles-ui-variations_item-preview, .global-styles-ui-variations_item:focus-visible .global-styles-ui-variations_item-preview {
1217	outline-color: #1e1e1e;
1218	outline-offset: 1px;
1219	outline-width: var(--wp-admin-border-width-focus);
1220	}
1221
1222	.global-styles-ui-variations_item:focus-visible .global-styles-ui-variations_item-preview {
1223	outline-color: var(--wp-admin-theme-color);
1224	}
1225
1226	.global-styles-ui-preview {
1227	display: flex;
1228	align-items: center;
1229	justify-content: center;
1230	line-height: 1;
1231	cursor: pointer;
1232	}
1233
1234	.global-styles-ui-preview__wrapper {
1235	max-width: 100%;
1236	display: block;
1237	width: 100%;
1238	}
1239
1240	.global-styles-ui-typography-preview {
1241	display: flex;
1242	align-items: center;
1243	justify-content: center;
1244	min-height: 100px;
1245	margin-bottom: 20px;
1246	background: #f0f0f0;
1247	border-radius: 2px;
1248	overflow: hidden;
1249	}
1250
1251	.global-styles-ui-font-size__item {
1252	white-space: nowrap;
1253	text-overflow: ellipsis;
1254	overflow: hidden;
1255	line-break: anywhere;
1256	}
1257
1258	.global-styles-ui-font-size__item-value {
1259	color: #757575;
1260	}
1261
1262	.global-styles-ui-screen-typography__indicator {
1263	height: 24px;
1264	width: 24px;
1265	font-size: 14px;
1266	display: flex !important;
1267	align-items: center;
1268	justify-content: center;
1269	border-radius: 2px;
1270	}
1271
1272	.global-styles-ui-block-types-search {
1273	margin-bottom: 10px;
1274	padding: 0 16px;
1275	}
1276
1277	.global-styles-ui-screen-typography__font-variants-count {
1278	color: #757575;
1279	}
1280
1281	.global-styles-ui-font-families__manage-fonts {
1282	justify-content: center;
1283	}
1284
1285	.global-styles-ui-screen .color-block-support-panel {
1286	padding-left: 0;
1287	padding-right: 0;
1288	padding-top: 0;
1289	border-top: none;
1290	row-gap: 12px;
1291	}
1292
1293	.global-styles-ui-header {
1294	margin-bottom: 0 !important;
1295	}
1296
1297	.global-styles-ui-subtitle {
1298	margin-bottom: 0 !important;
1299	text-transform: uppercase;
1300	font-weight: 499 !important;
1301	font-size: 11px !important;
1302	}
1303
1304	.global-styles-ui-section-title {
1305	color: #2f2f2f;
1306	font-weight: 600;
1307	line-height: 1.2;
1308	padding: 16px 16px 0;
1309	margin: 0;
1310	}
1311
1312	.global-styles-ui-icon-with-current-color {
1313	fill: currentColor;
1314	}
1315
1316	.global-styles-ui__color-indicator-wrapper {
1317	height: 24px;
1318	flex-shrink: 0;
1319	}
1320
1321	.global-styles-ui__shadows-panel__options-container,
1322	.global-styles-ui__typography-panel__options-container {
1323	height: 24px;
1324	}
1325
1326	.global-styles-ui__block-preview-panel {
1327	position: relative;
1328	width: 100%;
1329	border: #ddd 1px solid;
1330	border-radius: 2px;
1331	overflow: hidden;
1332	}
1333
1334	.global-styles-ui__shadow-preview-panel {
1335	height: 144px;
1336	border: #ddd 1px solid;
1337	border-radius: 2px;
1338	overflow: auto;
1339	/rtl:begin:ignore/
1340	background-image: repeating-linear-gradient(45deg, #e0e0e0 25%, transparent 25%, transparent 75%, #e0e0e0 75%, #e0e0e0), repeating-linear-gradient(45deg, #e0e0e0 25%, transparent 25%, transparent 75%, #e0e0e0 75%, #e0e0e0);
1341	background-position: 0 0, 8px 8px;
1342	/rtl:end:ignore/
1343	background-size: 16px 16px;
1344	}
1345
1346	.global-styles-ui__shadow-preview-panel .global-styles-ui__shadow-preview-block {
1347	border: #ddd 1px solid;
1348	border-radius: 2px;
1349	background-color: #fff;
1350	width: 60%;
1351	height: 60px;
1352	}
1353
1354	.global-styles-ui__shadow-editor__dropdown-content {
1355	width: 280px;
1356	}
1357
1358	.global-styles-ui__shadow-editor-panel {
1359	margin-bottom: 4px;
1360	}
1361
1362	.global-styles-ui__shadow-editor__dropdown {
1363	width: 100%;
1364	position: relative;
1365	}
1366
1367	.global-styles-ui__shadow-editor__dropdown-toggle {
1368	width: 100%;
1369	height: auto;
1370	padding-top: 8px;
1371	padding-bottom: 8px;
1372	text-align: left;
1373	border-radius: inherit;
1374	}
1375
1376	.global-styles-ui__shadow-editor__dropdown-toggle.is-open {
1377	background: #f0f0f0;
1378	color: var(--wp-admin-theme-color);
1379	}
1380
1381	.global-styles-ui__shadow-editor__remove-button {
1382	position: absolute;
1383	right: 8px;
1384	top: 8px;
1385	opacity: 0;
1386	}
1387
1388	.global-styles-ui__shadow-editor__remove-button.global-styles-ui__shadow-editor__remove-button {
1389	border: none;
1390	}
1391
1392	.global-styles-ui__shadow-editor__dropdown-toggle:hover + .global-styles-ui__shadow-editor__remove-button, .global-styles-ui__shadow-editor__remove-button:focus, .global-styles-ui__shadow-editor__remove-button:hover {
1393	opacity: 1;
1394	}
1395
1396	@media (hover: none) {
1397	.global-styles-ui__shadow-editor__remove-button {
1398	opacity: 1;
1399	}
1400	}
1401	.global-styles-ui-screen-css {
1402	flex: 1 1 auto;
1403	display: flex;
1404	flex-direction: column;
1405	margin: 16px;
1406	}
1407
1408	.global-styles-ui-screen-css .components-v-stack {
1409	flex: 1 1 auto;
1410	}
1411
1412	.global-styles-ui-screen-css .components-v-stack .block-editor-global-styles-advanced-panel__custom-css-input {
1413	flex: 1 1 auto;
1414	display: flex;
1415	flex-direction: column;
1416	}
1417
1418	.global-styles-ui-screen-css .components-v-stack .block-editor-global-styles-advanced-panel__custom-css-input .components-base-control__field {
1419	flex: 1 1 auto;
1420	display: flex;
1421	flex-direction: column;
1422	}
1423
1424	.global-styles-ui-screen-css .components-v-stack .block-editor-global-styles-advanced-panel__custom-css-input .components-base-control__field .components-textarea-control__input {
1425	flex: 1 1 auto;
1426	/rtl:ignore/
1427	direction: ltr;
1428	}
1429
1430	.global-styles-ui-screen-css-help-link {
1431	display: inline-block;
1432	margin-top: 8px;
1433	}
1434
1435	.global-styles-ui-screen-variations {
1436	margin-top: 16px;
1437	border-top: 1px solid #ddd;
1438	}
1439
1440	.global-styles-ui-screen-variations > * {
1441	margin: 24px 16px;
1442	}
1443
1444	.global-styles-ui-sidebar__navigator-provider {
1445	height: 100%;
1446	}
1447
1448	.global-styles-ui-sidebar__navigator-screen {
1449	display: flex;
1450	flex-direction: column;
1451	height: 100%;
1452	}
1453
1454	.global-styles-ui-sidebar__navigator-screen .single-column {
1455	grid-column: span 1;
1456	}
1457
1458	.global-styles-ui-screen-root.global-styles-ui-screen-root,
1459	.global-styles-ui-screen-style-variations.global-styles-ui-screen-style-variations {
1460	background: unset;
1461	color: inherit;
1462	}
1463
1464	.global-styles-ui-sidebar__panel .block-editor-block-icon svg {
1465	fill: currentColor;
1466	}
1467
1468	.global-styles-ui-screen-root__active-style-tile.global-styles-ui-screen-root__active-style-tile, .global-styles-ui-screen-root__active-style-tile.global-styles-ui-screen-root__active-style-tile .global-styles-ui-screen-root__active-style-tile-preview {
1469	border-radius: 2px;
1470	}
1471
1472	.global-styles-ui-screen-root__active-style-tile-preview {
1473	clip-path: border-box;
1474	}
1475
1476	.global-styles-ui-color-palette-panel,
1477	.global-styles-ui-gradient-palette-panel {
1478	padding: 16px;
1479	}
1480
1481	/* -------------------------------------------
1482	* Autogenerated by ⛋ Terrazzo. DO NOT EDIT!
1483	* ------------------------------------------- */
1484	:root {
1485	--wpds-border-radius-lg: 8px; /* Large radius */
1486	--wpds-border-radius-md: 4px; /* Medium radius */
1487	--wpds-border-radius-sm: 2px; /* Small radius */
1488	--wpds-border-radius-xs: 1px; /* Extra small radius */
1489	--wpds-border-width-focus: 2px; /* Border width for focus ring */
1490	--wpds-border-width-lg: 8px; /* Large width */
1491	--wpds-border-width-md: 4px; /* Medium width */
1492	--wpds-border-width-sm: 2px; /* Small width */
1493	--wpds-border-width-xs: 1px; /* Extra small width */
1494	--wpds-color-bg-interactive-brand-strong: #3858e9; /* Background color for interactive elements with brand tone and strong emphasis. */
1495	--wpds-color-bg-interactive-brand-strong-active: #2e49d9; /* Background color for interactive elements with brand tone and strong emphasis that are hovered, focused, or active. */
1496	--wpds-color-bg-interactive-brand-weak: #00000000; /* Background color for interactive elements with brand tone and weak emphasis. */
1497	--wpds-color-bg-interactive-brand-weak-active: #e6eaf4; /* Background color for interactive elements with brand tone and weak emphasis that are hovered, focused, or active. */
1498	--wpds-color-bg-interactive-error: #00000000; /* Background color for interactive elements with error tone and normal emphasis. */
1499	--wpds-color-bg-interactive-error-active: #fff6f4; /* Background color for interactive elements with error tone and normal emphasis that are hovered, focused, or active. */
1500	--wpds-color-bg-interactive-error-strong: #cc1818; /* Background color for interactive elements with error tone and strong emphasis. */
1501	--wpds-color-bg-interactive-error-strong-active: #b90000; /* Background color for interactive elements with error tone and strong emphasis that are hovered, focused, or active. */
1502	--wpds-color-bg-interactive-error-weak: #00000000; /* Background color for interactive elements with error tone and weak emphasis. */
1503	--wpds-color-bg-interactive-error-weak-active: #f6e6e3; /* Background color for interactive elements with error tone and weak emphasis that are hovered, focused, or active. */
1504	--wpds-color-bg-interactive-neutral-strong: #2d2d2d; /* Background color for interactive elements with neutral tone and strong emphasis. */
1505	--wpds-color-bg-interactive-neutral-strong-active: #1e1e1e; /* Background color for interactive elements with neutral tone and strong emphasis that are hovered, focused, or active. */
1506	--wpds-color-bg-interactive-neutral-strong-disabled: #e2e2e2; /* Background color for interactive elements with neutral tone and strong emphasis, in their disabled state. */
1507	--wpds-color-bg-interactive-neutral-weak: #00000000; /* Background color for interactive elements with neutral tone and weak emphasis. */
1508	--wpds-color-bg-interactive-neutral-weak-active: #eaeaea; /* Background color for interactive elements with neutral tone and weak emphasis that are hovered, focused, or active. */
1509	--wpds-color-bg-interactive-neutral-weak-disabled: #00000000; /* Background color for interactive elements with weak emphasis, in their disabled state, regardless of the tone. */
1510	--wpds-color-bg-surface-brand: #ecf0f9; /* Background color for surfaces with brand tone and normal emphasis. */
1511	--wpds-color-bg-surface-caution: #fee994; /* Background color for surfaces with caution tone and normal emphasis. */
1512	--wpds-color-bg-surface-caution-weak: #fff9c9; /* Background color for surfaces with caution tone and weak emphasis. */
1513	--wpds-color-bg-surface-error: #f6e6e3; /* Background color for surfaces with error tone and normal emphasis. */
1514	--wpds-color-bg-surface-error-weak: #fff6f4; /* Background color for surfaces with error tone and weak emphasis. */
1515	--wpds-color-bg-surface-info: #deebfa; /* Background color for surfaces with info tone and normal emphasis. */
1516	--wpds-color-bg-surface-info-weak: #f2f9ff; /* Background color for surfaces with info tone and weak emphasis. */
1517	--wpds-color-bg-surface-neutral: #f8f8f8; /* Background color for surfaces with normal emphasis. */
1518	--wpds-color-bg-surface-neutral-strong: #ffffff; /* Background color for surfaces with strong emphasis. */
1519	--wpds-color-bg-surface-neutral-weak: #f0f0f0; /* Background color for surfaces with weak emphasis. */
1520	--wpds-color-bg-surface-success: #c5f7cc; /* Background color for surfaces with success tone and normal emphasis. */
1521	--wpds-color-bg-surface-success-weak: #eaffed; /* Background color for surfaces with success tone and weak emphasis. */
1522	--wpds-color-bg-surface-warning: #fde6bd; /* Background color for surfaces with warning tone and normal emphasis. */
1523	--wpds-color-bg-surface-warning-weak: #fff7e0; /* Background color for surfaces with warning tone and weak emphasis. */
1524	--wpds-color-bg-thumb-brand: #3858e9; /* Background color for thumbs with a brand tone and normal emphasis (eg. slider thumb and filled track). */
1525	--wpds-color-bg-thumb-brand-active: #3858e9; /* Background color for thumbs with a brand tone and normal emphasis (eg. slider thumb and filled track) that are hovered, focused, or active. */
1526	--wpds-color-bg-thumb-neutral-disabled: #d8d8d8; /* Background color for thumbs with normal emphasis (eg. slider thumb and filled track), in their disabled state, regardless of the tone. */
1527	--wpds-color-bg-thumb-neutral-weak: #8a8a8a; /* Background color for thumbs with a neutral tone and weak emphasis (eg. scrollbar thumb). */
1528	--wpds-color-bg-thumb-neutral-weak-active: #6c6c6c; /* Background color for thumbs with a neutral tone and weak emphasis (eg. scrollbar thumb) that are hovered, focused, or active. */
1529	--wpds-color-bg-track-neutral: #d8d8d8; /* Background color for tracks with a neutral tone and normal emphasis (eg. slider or progressbar track). */
1530	--wpds-color-bg-track-neutral-weak: #e0e0e0; /* Background color for tracks with a neutral tone and weak emphasis (eg. scrollbar track). */
1531	--wpds-color-fg-content-caution: #281d00; /* Foreground color for content like text with caution tone and normal emphasis. */
1532	--wpds-color-fg-content-caution-weak: #826a00; /* Foreground color for content like text with caution tone and weak emphasis. */
1533	--wpds-color-fg-content-error: #470000; /* Foreground color for content like text with error tone and normal emphasis. */
1534	--wpds-color-fg-content-error-weak: #cc1818; /* Foreground color for content like text with error tone and weak emphasis. */
1535	--wpds-color-fg-content-info: #001b4f; /* Foreground color for content like text with info tone and normal emphasis. */
1536	--wpds-color-fg-content-info-weak: #006bd7; /* Foreground color for content like text with info tone and weak emphasis. */
1537	--wpds-color-fg-content-neutral: #1e1e1e; /* Foreground color for content like text with normal emphasis. */
1538	--wpds-color-fg-content-neutral-weak: #6d6d6d; /* Foreground color for content like text with weak emphasis. */
1539	--wpds-color-fg-content-success: #002900; /* Foreground color for content like text with success tone and normal emphasis. */
1540	--wpds-color-fg-content-success-weak: #007f30; /* Foreground color for content like text with success tone and weak emphasis. */
1541	--wpds-color-fg-content-warning: #2e1900; /* Foreground color for content like text with warning tone and normal emphasis. */
1542	--wpds-color-fg-content-warning-weak: #926300; /* Foreground color for content like text with warning tone and weak emphasis. */
1543	--wpds-color-fg-interactive-brand: #3858e9; /* Foreground color for interactive elements with brand tone and normal emphasis. */
1544	--wpds-color-fg-interactive-brand-active: #3858e9; /* Foreground color for interactive elements with brand tone and normal emphasis that are hovered, focused, or active. */
1545	--wpds-color-fg-interactive-brand-strong: #eff0f2; /* Foreground color for interactive elements with brand tone and strong emphasis. */
1546	--wpds-color-fg-interactive-brand-strong-active: #eff0f2; /* Foreground color for interactive elements with brand tone and strong emphasis that are hovered, focused, or active. */
1547	--wpds-color-fg-interactive-error: #cc1818; /* Foreground color for interactive elements with error tone and normal emphasis. */
1548	--wpds-color-fg-interactive-error-active: #cc1818; /* Foreground color for interactive elements with error tone and normal emphasis that are hovered, focused, or active. */
1549	--wpds-color-fg-interactive-error-strong: #f2efef; /* Foreground color for interactive elements with error tone and strong emphasis. */
1550	--wpds-color-fg-interactive-error-strong-active: #f2efef; /* Foreground color for interactive elements with error tone and strong emphasis that are hovered, focused, or active. */
1551	--wpds-color-fg-interactive-neutral: #1e1e1e; /* Foreground color for interactive elements with neutral tone and normal emphasis. */
1552	--wpds-color-fg-interactive-neutral-active: #1e1e1e; /* Foreground color for interactive elements with neutral tone and normal emphasis that are hovered, focused, or active. */
1553	--wpds-color-fg-interactive-neutral-disabled: #8a8a8a; /* Foreground color for interactive elements with normal emphasis, in their disabled state, regardless of the tone. */
1554	--wpds-color-fg-interactive-neutral-strong: #f0f0f0; /* Foreground color for interactive elements with neutral tone and strong emphasis. */
1555	--wpds-color-fg-interactive-neutral-strong-active: #f0f0f0; /* Foreground color for interactive elements with neutral tone and strong emphasis that are hovered, focused, or active. */
1556	--wpds-color-fg-interactive-neutral-strong-disabled: #8a8a8a; /* Foreground color for interactive elements with strong emphasis, in their disabled state, regardless of the tone. */
1557	--wpds-color-fg-interactive-neutral-weak: #6d6d6d; /* Foreground color for interactive elements with neutral tone and weak emphasis. */
1558	--wpds-color-fg-interactive-neutral-weak-disabled: #8a8a8a; /* Foreground color for interactive elements with weak emphasis, in their disabled state, regardless of the tone. */
1559	--wpds-color-stroke-focus-brand: #3858e9; /* Accessible stroke color applied to focus rings. */
1560	--wpds-color-stroke-interactive-brand: #3858e9; /* Accessible stroke color used for interactive brand-toned elements with normal emphasis. */
1561	--wpds-color-stroke-interactive-brand-active: #2337c8; /* Accessible stroke color used for interactive brand-toned elements with normal emphasis that are hovered, focused, or active. */
1562	--wpds-color-stroke-interactive-error: #cc1818; /* Accessible stroke color used for interactive error-toned elements with normal emphasis. */
1563	--wpds-color-stroke-interactive-error-active: #9d0000; /* Accessible stroke color used for interactive error-toned elements with normal emphasis that are hovered, focused, or active. */
1564	--wpds-color-stroke-interactive-error-strong: #cc1818; /* Accessible stroke color used for interactive error-toned elements with strong emphasis. */
1565	--wpds-color-stroke-interactive-neutral: #8a8a8a; /* Accessible stroke color used for interactive neutrally-toned elements with normal emphasis. */
1566	--wpds-color-stroke-interactive-neutral-active: #6c6c6c; /* Accessible stroke color used for interactive neutrally-toned elements with normal emphasis that are hovered, focused, or active. */
1567	--wpds-color-stroke-interactive-neutral-disabled: #d8d8d8; /* Accessible stroke color used for interactive elements with normal emphasis, in their disabled state, regardless of the tone. */
1568	--wpds-color-stroke-interactive-neutral-strong: #6c6c6c; /* Accessible stroke color used for interactive neutrally-toned elements with strong emphasis. */
1569	--wpds-color-stroke-surface-brand: #a3b1d4; /* Decorative stroke color used to define brand-toned surface boundaries with normal emphasis. */
1570	--wpds-color-stroke-surface-brand-strong: #3858e9; /* Decorative stroke color used to define brand-toned surface boundaries with strong emphasis. */
1571	--wpds-color-stroke-surface-error: #daa39b; /* Decorative stroke color used to define error-toned surface boundaries with normal emphasis. */
1572	--wpds-color-stroke-surface-error-strong: #cc1818; /* Decorative stroke color used to define error-toned surface boundaries with strong emphasis. */
1573	--wpds-color-stroke-surface-info: #9fbcdc; /* Decorative stroke color used to define info-toned surface boundaries with normal emphasis. */
1574	--wpds-color-stroke-surface-info-strong: #006bd7; /* Decorative stroke color used to define info-toned surface boundaries with strong emphasis. */
1575	--wpds-color-stroke-surface-neutral: #d8d8d8; /* Decorative stroke color used to define neutrally-toned surface boundaries with normal emphasis. */
1576	--wpds-color-stroke-surface-neutral-strong: #8a8a8a; /* Decorative stroke color used to define neutrally-toned surface boundaries with strong emphasis. */
1577	--wpds-color-stroke-surface-neutral-weak: #e0e0e0; /* Decorative stroke color used to define neutrally-toned surface boundaries with weak emphasis. */
1578	--wpds-color-stroke-surface-success: #8ac894; /* Decorative stroke color used to define success-toned surface boundaries with normal emphasis. */
1579	--wpds-color-stroke-surface-success-strong: #007f30; /* Decorative stroke color used to define success-toned surface boundaries with strong emphasis. */
1580	--wpds-color-stroke-surface-warning: #d0b381; /* Decorative stroke color used to define warning-toned surface boundaries with normal emphasis. */
1581	--wpds-color-stroke-surface-warning-strong: #926300; /* Decorative stroke color used to define warning-toned surface boundaries with strong emphasis. */
1582	--wpds-dimension-base: 4px; /* Base dimension unit */
1583	--wpds-dimension-gap-2xs: 4px; /* 2x extra small gap */
1584	--wpds-dimension-gap-lg: 24px; /* Large gap */
1585	--wpds-dimension-gap-md: 16px; /* Medium gap */
1586	--wpds-dimension-gap-sm: 12px; /* Small gap */
1587	--wpds-dimension-gap-xl: 40px; /* Extra large gap */
1588	--wpds-dimension-gap-xs: 8px; /* Extra small gap */
1589	--wpds-dimension-padding-surface-2xs: 4px; /* 2x extra small spacing for surfaces */
1590	--wpds-dimension-padding-surface-lg: 32px; /* Large spacing for surfaces */
1591	--wpds-dimension-padding-surface-md: 24px; /* Medium spacing for surfaces */
1592	--wpds-dimension-padding-surface-sm: 16px; /* Small spacing for surfaces */
1593	--wpds-dimension-padding-surface-xs: 8px; /* Extra small spacing for surfaces */
1594	--wpds-elevation-large: 0 5px 15px 0 #00000014, 0 15px 27px 0 #00000012,
1595	0 30px 36px 0 #0000000a, 0 50px 43px 0 #00000005; /* For components that confirm decisions or handle necessary interruptions. Example: Modals. */
1596	--wpds-elevation-medium: 0 2px 3px 0 #0000000d, 0 4px 5px 0 #0000000a,
1597	0 12px 12px 0 #00000008, 0 16px 16px 0 #00000005; /* For components that offer additional actions. Example: Menus, Command Palette */
1598	--wpds-elevation-small: 0 1px 2px 0 #0000000d, 0 2px 3px 0 #0000000a,
1599	0 6px 6px 0 #00000008, 0 8px 8px 0 #00000005; /* For components that provide contextual feedback without being intrusive. Generally non-interruptive. Example: Tooltips, Snackbar. */
1600	--wpds-elevation-x-small: 0 1px 1px 0 #00000008, 0 1px 2px 0 #00000005,
1601	0 3px 3px 0 #00000005, 0 4px 4px 0 #00000003; /* For sections and containers that group related content and controls, which may overlap other content. Example: Preview Frame. */
1602	--wpds-font-family-body: -apple-system, system-ui, 'Segoe UI', 'Roboto',
1603	'Oxygen-Sans', 'Ubuntu', 'Cantarell', 'Helvetica Neue', sans-serif; /* Body font family */
1604	--wpds-font-family-heading: -apple-system, system-ui, 'Segoe UI', 'Roboto',
1605	'Oxygen-Sans', 'Ubuntu', 'Cantarell', 'Helvetica Neue', sans-serif; /* Headings font family */
1606	--wpds-font-family-mono: 'Menlo', 'Consolas', monaco, monospace; /* Monospace font family */
1607	--wpds-font-line-height-2xl: 40px; /* 2X large line height */
1608	--wpds-font-line-height-lg: 28px; /* Large line height */
1609	--wpds-font-line-height-md: 24px; /* Medium line height */
1610	--wpds-font-line-height-sm: 20px; /* Small line height */
1611	--wpds-font-line-height-xl: 32px; /* Extra large line height */
1612	--wpds-font-line-height-xs: 16px; /* Extra small line height */
1613	--wpds-font-size-2xl: 32px; /* 2X large font size */
1614	--wpds-font-size-lg: 15px; /* Large font size */
1615	--wpds-font-size-md: 13px; /* Medium font size */
1616	--wpds-font-size-sm: 12px; /* Small font size */
1617	--wpds-font-size-xl: 20px; /* Extra large font size */
1618	--wpds-font-size-xs: 11px; /* Extra small font size */
1619	--wpds-font-weight-medium: 499; /* Medium font weight for emphasis and headings */
1620	--wpds-font-weight-regular: 400; /* Regular font weight for body text */
1621	}
1622
1623	[data-wpds-theme-provider-id][data-wpds-density=default] {
1624	--wpds-dimension-base: 4px; /* Base dimension unit */
1625	--wpds-dimension-gap-2xs: 4px; /* 2x extra small gap */
1626	--wpds-dimension-gap-lg: 24px; /* Large gap */
1627	--wpds-dimension-gap-md: 16px; /* Medium gap */
1628	--wpds-dimension-gap-sm: 12px; /* Small gap */
1629	--wpds-dimension-gap-xl: 40px; /* Extra large gap */
1630	--wpds-dimension-gap-xs: 8px; /* Extra small gap */
1631	--wpds-dimension-padding-surface-2xs: 4px; /* 2x extra small spacing for surfaces */
1632	--wpds-dimension-padding-surface-lg: 32px; /* Large spacing for surfaces */
1633	--wpds-dimension-padding-surface-md: 24px; /* Medium spacing for surfaces */
1634	--wpds-dimension-padding-surface-sm: 16px; /* Small spacing for surfaces */
1635	--wpds-dimension-padding-surface-xs: 8px; /* Extra small spacing for surfaces */
1636	}
1637
1638	[data-wpds-theme-provider-id][data-wpds-density=compact] {
1639	--wpds-dimension-gap-2xs: 4px; /* 2x extra small gap */
1640	--wpds-dimension-gap-lg: 20px; /* Large gap */
1641	--wpds-dimension-gap-md: 12px; /* Medium gap */
1642	--wpds-dimension-gap-sm: 8px; /* Small gap */
1643	--wpds-dimension-gap-xl: 32px; /* Extra large gap */
1644	--wpds-dimension-gap-xs: 4px; /* Extra small gap */
1645	--wpds-dimension-padding-surface-2xs: 4px; /* 2x extra small spacing for surfaces */
1646	--wpds-dimension-padding-surface-lg: 24px; /* Large spacing for surfaces */
1647	--wpds-dimension-padding-surface-md: 20px; /* Medium spacing for surfaces */
1648	--wpds-dimension-padding-surface-sm: 12px; /* Small spacing for surfaces */
1649	--wpds-dimension-padding-surface-xs: 4px; /* Extra small spacing for surfaces */
1650	}
1651
1652	[data-wpds-theme-provider-id][data-wpds-density=comfortable] {
1653	--wpds-dimension-gap-2xs: 8px; /* 2x extra small gap */
1654	--wpds-dimension-gap-lg: 32px; /* Large gap */
1655	--wpds-dimension-gap-md: 20px; /* Medium gap */
1656	--wpds-dimension-gap-sm: 16px; /* Small gap */
1657	--wpds-dimension-gap-xl: 48px; /* Extra large gap */
1658	--wpds-dimension-gap-xs: 12px; /* Extra small gap */
1659	--wpds-dimension-padding-surface-2xs: 8px; /* 2x extra small spacing for surfaces */
1660	--wpds-dimension-padding-surface-lg: 40px; /* Large spacing for surfaces */
1661	--wpds-dimension-padding-surface-md: 32px; /* Medium spacing for surfaces */
1662	--wpds-dimension-padding-surface-sm: 20px; /* Small spacing for surfaces */
1663	--wpds-dimension-padding-surface-xs: 12px; /* Extra small spacing for surfaces */
1664	}
1665
1666	@media (min-resolution: 192dpi) {
1667	:root {
1668	--wpds-border-width-focus: 1.5px; /* Border width for focus ring */
1669	}
1670	}
1671	/**
1672	* Colors
1673	*/
1674	/**
1675	* SCSS Variables.
1676	*
1677	* Please use variables from this sheet to ensure consistency across the UI.
1678	* Don't add to this sheet unless you're pretty sure the value will be reused in many places.
1679	* For example, don't add rules to this sheet that affect block visuals. It's purely for UI.
1680	*/
1681	/**
1682	* Fonts & basic variables.
1683	*/
1684	/**
1685	* Typography
1686	*/
1687	/**
1688	* Grid System.
1689	* https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/
1690	*/
1691	/**
1692	* Radius scale.
1693	*/
1694	/**
1695	* Elevation scale.
1696	*/
1697	/**
1698	* Dimensions.
1699	*/
1700	/**
1701	* Mobile specific styles
1702	*/
1703	/**
1704	* Editor styles.
1705	*/
1706	/**
1707	* Block & Editor UI.
1708	*/
1709	/**
1710	* Block paddings.
1711	*/
1712	/**
1713	* React Native specific.
1714	* These variables do not appear to be used anywhere else.
1715	*/
1716	/**
1717	* Typography
1718	*/
1719	/**
1720	* Breakpoints & Media Queries
1721	*/
1722	/**
1723	* Converts a hex value into the rgb equivalent.
1724	*
1725	* @param {string} hex - the hexadecimal value to convert
1726	* @return {string} comma separated rgb values
1727	*/
1728	/**
1729	* Long content fade mixin
1730	*
1731	* Creates a fading overlay to signify that the content is longer
1732	* than the space allows.
1733	*/
1734	/**
1735	* Breakpoint mixins
1736	*/
1737	/**
1738	* Focus styles.
1739	*/
1740	/**
1741	* Applies editor left position to the selector passed as argument
1742	*/
1743	/**
1744	* Styles that are reused verbatim in a few places
1745	*/
1746	/**
1747	* Allows users to opt-out of animations via OS-level preferences.
1748	*/
1749	/**
1750	* Reset default styles for JavaScript UI based pages.
1751	* This is a WP-admin agnostic reset
1752	*/
1753	/**
1754	* Reset the WP Admin page styles for Gutenberg-like pages.
1755	*/
1756	/**
1757	* Creates a checkerboard pattern background to indicate transparency.
1758	* @param {String} $size - The size of the squares in the checkerboard pattern. Default is 12px.
1759	*/
1760	.dataviews-wrapper,
1761	.dataviews-picker-wrapper {
1762	height: 100%;
1763	overflow: auto;
1764	box-sizing: border-box;
1765	scroll-padding-bottom: 64px;
1766	/* stylelint-disable-next-line property-no-unknown -- '@container' not globally permitted */
1767	container: dataviews-wrapper/inline-size;
1768	display: flex;
1769	flex-direction: column;
1770	font-size: 13px;
1771	line-height: 1.4;
1772	background-color: var(--wp-dataviews-color-background, #fff);
1773	}
1774
1775	.dataviews__view-actions,
1776	.dataviews-filters__container {
1777	box-sizing: border-box;
1778	padding: 16px 24px;
1779	flex-shrink: 0;
1780	position: sticky;
1781	left: 0;
1782	background-color: inherit;
1783	}
1784
1785	@media not (prefers-reduced-motion) {
1786	.dataviews__view-actions,
1787	.dataviews-filters__container {
1788	transition: padding ease-out 0.1s;
1789	}
1790	}
1791	.dataviews-no-results,
1792	.dataviews-loading {
1793	padding: 0 24px;
1794	flex-grow: 1;
1795	display: flex;
1796	align-items: center;
1797	justify-content: center;
1798	}
1799
1800	@media not (prefers-reduced-motion) {
1801	.dataviews-no-results,
1802	.dataviews-loading {
1803	transition: padding ease-out 0.1s;
1804	}
1805	}
1806	.dataviews-loading-more {
1807	text-align: center;
1808	}
1809
1810	@container (max-width: 430px) {
1811	.dataviews__view-actions,
1812	.dataviews-filters__container {
1813	padding: 12px 24px;
1814	}
1815	}
1816	.dataviews-title-field {
1817	font-size: 13px;
1818	font-weight: 499;
1819	color: #2f2f2f;
1820	text-overflow: ellipsis;
1821	white-space: nowrap;
1822	width: 100%;
1823	}
1824
1825	.dataviews-title-field a {
1826	text-decoration: none;
1827	text-overflow: ellipsis;
1828	white-space: nowrap;
1829	overflow: hidden;
1830	display: block;
1831	flex-grow: 0;
1832	color: #2f2f2f;
1833	}
1834
1835	.dataviews-title-field a:hover {
1836	color: var(--wp-admin-theme-color);
1837	}
1838
1839	.dataviews-title-field a:focus {
1840	color: var(--wp-admin-theme-color--rgb);
1841	box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color, #007cba);
1842	border-radius: 2px;
1843	}
1844
1845	.dataviews-title-field button.components-button.is-link {
1846	text-decoration: none;
1847	font-weight: inherit;
1848	text-overflow: ellipsis;
1849	white-space: nowrap;
1850	overflow: hidden;
1851	display: block;
1852	width: 100%;
1853	color: #1e1e1e;
1854	}
1855
1856	.dataviews-title-field button.components-button.is-link:hover {
1857	color: var(--wp-admin-theme-color);
1858	}
1859
1860	.dataviews-title-field--clickable {
1861	cursor: pointer;
1862	color: #2f2f2f;
1863	}
1864
1865	.dataviews-title-field--clickable:hover {
1866	color: var(--wp-admin-theme-color);
1867	}
1868
1869	.dataviews-title-field--clickable:focus {
1870	color: var(--wp-admin-theme-color--rgb);
1871	box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color, #007cba);
1872	border-radius: 2px;
1873	}
1874
1875	/**
1876	* When DataViews are placed within cards, apply a consistent top padding.
1877	*/
1878	.components-card__body:has(> .dataviews-wrapper),
1879	.components-card__body:has(> .dataviews-picker-wrapper) {
1880	padding: 8px 0 0;
1881	overflow: hidden;
1882	}
1883
1884	.dataviews-bulk-actions-footer__item-count {
1885	color: #1e1e1e;
1886	}
1887
1888	.dataviews-bulk-actions-footer__container {
1889	margin-right: auto;
1890	min-height: 32px;
1891	}
1892
1893	.dataviews-filters__button {
1894	position: relative;
1895	}
1896
1897	.dataviews-filters__container {
1898	padding-top: 0;
1899	}
1900
1901	.dataviews-filters__reset-button.dataviews-filters__reset-button[aria-disabled=true], .dataviews-filters__reset-button.dataviews-filters__reset-button[aria-disabled=true]:hover {
1902	opacity: 0;
1903	}
1904
1905	.dataviews-filters__reset-button.dataviews-filters__reset-button[aria-disabled=true]:focus {
1906	opacity: 1;
1907	}
1908
1909	.dataviews-filters__summary-popover {
1910	font-size: 13px;
1911	line-height: 1.4;
1912	}
1913
1914	.dataviews-filters__summary-popover .components-popover__content {
1915	width: 100%;
1916	min-width: 230px;
1917	max-width: 250px;
1918	border-radius: 4px;
1919	}
1920
1921	.dataviews-filters__summary-popover.components-dropdown__content .components-popover__content {
1922	padding: 0;
1923	}
1924
1925	.dataviews-filters__summary-operators-container {
1926	padding: 8px 16px;
1927	}
1928
1929	.dataviews-filters__summary-operators-container:has(+ .dataviews-filters__search-widget-listbox), .dataviews-filters__summary-operators-container:has(+ .dataviews-filters__search-widget-no-elements), .dataviews-filters__summary-operators-container:has(+ .dataviews-filters__user-input-widget) {
1930	border-bottom: 1px solid #e0e0e0;
1931	}
1932
1933	.dataviews-filters__summary-operators-container:empty {
1934	display: none;
1935	}
1936
1937	.dataviews-filters__summary-operators-container .dataviews-filters__summary-operators-filter-name {
1938	color: #757575;
1939	white-space: nowrap;
1940	overflow: hidden;
1941	text-overflow: ellipsis;
1942	flex-shrink: 0; /* Prevents this element from shrinking */
1943	max-width: calc(100% - 55px);
1944	}
1945
1946	.dataviews-filters__summary-operators-container .dataviews-filters__summary-operators-filter-select {
1947	width: 100%;
1948	white-space: nowrap;
1949	overflow: hidden;
1950	}
1951
1952	.dataviews-filters__summary-chip-container {
1953	position: relative;
1954	white-space: pre-wrap;
1955	}
1956
1957	.dataviews-filters__summary-chip-container .dataviews-filters__summary-chip {
1958	border-radius: 16px;
1959	border: 1px solid transparent;
1960	cursor: pointer;
1961	padding: 4px 12px;
1962	min-height: 32px;
1963	background: #f0f0f0;
1964	color: #2f2f2f;
1965	position: relative;
1966	display: flex;
1967	align-items: center;
1968	box-sizing: border-box;
1969	}
1970
1971	.dataviews-filters__summary-chip-container .dataviews-filters__summary-chip.is-not-clickable {
1972	cursor: default;
1973	}
1974
1975	.dataviews-filters__summary-chip-container .dataviews-filters__summary-chip.has-reset {
1976	padding-inline-end: 28px;
1977	}
1978
1979	.dataviews-filters__summary-chip-container .dataviews-filters__summary-chip:hover:not(.dataviews-filters__summary-chip-container .dataviews-filters__summary-chip.is-not-clickable), .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip:focus-visible, .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip[aria-expanded=true] {
1980	background: #e0e0e0;
1981	color: #1e1e1e;
1982	}
1983
1984	.dataviews-filters__summary-chip-container .dataviews-filters__summary-chip.has-values {
1985	color: var(--wp-admin-theme-color);
1986	background: rgba(var(--wp-admin-theme-color--rgb), 0.04);
1987	}
1988
1989	.dataviews-filters__summary-chip-container .dataviews-filters__summary-chip.has-values:hover, .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip.has-values[aria-expanded=true] {
1990	background: rgba(var(--wp-admin-theme-color--rgb), 0.12);
1991	}
1992
1993	.dataviews-filters__summary-chip-container .dataviews-filters__summary-chip:focus-visible {
1994	outline: none;
1995	box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
1996	}
1997
1998	.dataviews-filters__summary-chip-container .dataviews-filters__summary-chip .dataviews-filters-__summary-filter-text-name {
1999	font-weight: 499;
2000	}
2001
2002	.dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove {
2003	width: 24px;
2004	height: 24px;
2005	border-radius: 50%;
2006	border: 0;
2007	padding: 0;
2008	position: absolute;
2009	right: 4px;
2010	top: 50%;
2011	transform: translateY(-50%);
2012	display: flex;
2013	align-items: center;
2014	justify-content: center;
2015	background: transparent;
2016	cursor: pointer;
2017	}
2018
2019	.dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove svg {
2020	fill: #757575;
2021	}
2022
2023	.dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove:hover, .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove:focus {
2024	background: #e0e0e0;
2025	}
2026
2027	.dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove:hover svg, .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove:focus svg {
2028	fill: #1e1e1e;
2029	}
2030
2031	.dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove.has-values svg {
2032	fill: var(--wp-admin-theme-color);
2033	}
2034
2035	.dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove.has-values:hover {
2036	background: rgba(var(--wp-admin-theme-color--rgb), 0.08);
2037	}
2038
2039	.dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove:focus-visible {
2040	outline: none;
2041	box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
2042	}
2043
2044	.dataviews-filters__search-widget-filter-combobox-list {
2045	max-height: 184px;
2046	padding: 4px;
2047	overflow: auto;
2048	border-top: 1px solid #e0e0e0;
2049	}
2050
2051	.dataviews-filters__search-widget-filter-combobox-list .dataviews-filters__search-widget-filter-combobox-item-value [data-user-value] {
2052	font-weight: 600;
2053	}
2054
2055	.dataviews-filters__search-widget-listbox {
2056	padding: 4px;
2057	overflow: auto;
2058	}
2059
2060	.dataviews-filters__search-widget-listitem {
2061	display: flex;
2062	align-items: center;
2063	gap: 8px;
2064	border-radius: 2px;
2065	box-sizing: border-box;
2066	padding: 4px 12px;
2067	cursor: default;
2068	min-height: 32px;
2069	font-family: -apple-system, "system-ui", "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
2070	font-weight: 400;
2071	font-size: 13px;
2072	line-height: 20px;
2073	}
2074
2075	.dataviews-filters__search-widget-listitem:last-child {
2076	margin-block-end: 0;
2077	}
2078
2079	.dataviews-filters__search-widget-listitem:hover, .dataviews-filters__search-widget-listitem[data-active-item], .dataviews-filters__search-widget-listitem:focus {
2080	background-color: var(--wp-admin-theme-color);
2081	color: #fff;
2082	}
2083
2084	.dataviews-filters__search-widget-listitem:hover .dataviews-filters__search-widget-listitem-description, .dataviews-filters__search-widget-listitem[data-active-item] .dataviews-filters__search-widget-listitem-description, .dataviews-filters__search-widget-listitem:focus .dataviews-filters__search-widget-listitem-description {
2085	color: #fff;
2086	}
2087
2088	.dataviews-filters__search-widget-listitem:hover .dataviews-filters__search-widget-listitem-single-selection, .dataviews-filters__search-widget-listitem[data-active-item] .dataviews-filters__search-widget-listitem-single-selection, .dataviews-filters__search-widget-listitem:focus .dataviews-filters__search-widget-listitem-single-selection {
2089	border-color: var(--wp-admin-theme-color-darker-20, #183ad6);
2090	background: #fff;
2091	}
2092
2093	.dataviews-filters__search-widget-listitem:hover .dataviews-filters__search-widget-listitem-single-selection.is-selected, .dataviews-filters__search-widget-listitem[data-active-item] .dataviews-filters__search-widget-listitem-single-selection.is-selected, .dataviews-filters__search-widget-listitem:focus .dataviews-filters__search-widget-listitem-single-selection.is-selected {
2094	border-color: var(--wp-admin-theme-color-darker-20, #183ad6);
2095	background: var(--wp-admin-theme-color-darker-20, #183ad6);
2096	}
2097
2098	.dataviews-filters__search-widget-listitem:hover .dataviews-filters__search-widget-listitem-multi-selection, .dataviews-filters__search-widget-listitem[data-active-item] .dataviews-filters__search-widget-listitem-multi-selection, .dataviews-filters__search-widget-listitem:focus .dataviews-filters__search-widget-listitem-multi-selection {
2099	border-color: var(--wp-admin-theme-color-darker-20, #183ad6);
2100	}
2101
2102	.dataviews-filters__search-widget-listitem:hover .dataviews-filters__search-widget-listitem-multi-selection.is-selected, .dataviews-filters__search-widget-listitem[data-active-item] .dataviews-filters__search-widget-listitem-multi-selection.is-selected, .dataviews-filters__search-widget-listitem:focus .dataviews-filters__search-widget-listitem-multi-selection.is-selected {
2103	border-color: var(--wp-admin-theme-color-darker-20, #183ad6);
2104	background: var(--wp-admin-theme-color-darker-20, #183ad6);
2105	}
2106
2107	.dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-description {
2108	display: block;
2109	overflow: hidden;
2110	text-overflow: ellipsis;
2111	font-size: 12px;
2112	line-height: 16px;
2113	color: #757575;
2114	}
2115
2116	.dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-single-selection {
2117	border: 1px solid #1e1e1e;
2118	margin-right: 12px;
2119	transition: none;
2120	border-radius: 50%;
2121	width: 24px;
2122	height: 24px;
2123	min-width: 24px;
2124	max-width: 24px;
2125	position: relative;
2126	}
2127
2128	@media not (prefers-reduced-motion) {
2129	.dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-single-selection {
2130	transition: box-shadow 0.1s linear;
2131	}
2132	}
2133	@media (min-width: 600px) {
2134	.dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-single-selection {
2135	height: 16px;
2136	width: 16px;
2137	min-width: 16px;
2138	max-width: 16px;
2139	}
2140	}
2141	.dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-single-selection:checked::before {
2142	box-sizing: inherit;
2143	width: 12px;
2144	height: 12px;
2145	position: absolute;
2146	top: 50%;
2147	left: 50%;
2148	transform: translate(-50%, -50%);
2149	margin: 0;
2150	background-color: #fff;
2151	border: 4px solid #fff;
2152	}
2153
2154	@media (min-width: 600px) {
2155	.dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-single-selection:checked::before {
2156	width: 8px;
2157	height: 8px;
2158	}
2159	}
2160	.dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-single-selection:focus {
2161	box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--wp-admin-theme-color);
2162	outline: 2px solid transparent;
2163	}
2164
2165	.dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-single-selection:checked {
2166	background: var(--wp-admin-theme-color);
2167	border: none;
2168	}
2169
2170	.dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-single-selection {
2171	margin: 0;
2172	padding: 0;
2173	}
2174
2175	.dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-single-selection.is-selected {
2176	background: var(--wp-admin-theme-color, #3858e9);
2177	border-color: var(--wp-admin-theme-color, #3858e9);
2178	}
2179
2180	.dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-single-selection.is-selected::before {
2181	content: "";
2182	border-radius: 50%;
2183	box-sizing: inherit;
2184	width: 12px;
2185	height: 12px;
2186	position: absolute;
2187	top: 50%;
2188	left: 50%;
2189	transform: translate(-50%, -50%);
2190	margin: 0;
2191	background-color: #fff;
2192	border: 4px solid #fff;
2193	}
2194
2195	@media (min-width: 600px) {
2196	.dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-single-selection.is-selected::before {
2197	width: 8px;
2198	height: 8px;
2199	}
2200	}
2201	.dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection {
2202	--checkbox-size: 24px;
2203	border: 1px solid #1e1e1e;
2204	margin-right: 12px;
2205	transition: none;
2206	border-radius: 2px;
2207	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
2208	padding: 6px 8px;
2209	/* Fonts smaller than 16px causes mobile safari to zoom. */
2210	font-size: 16px;
2211	/* Override core line-height. To be reviewed. */
2212	line-height: normal;
2213	box-shadow: 0 0 0 transparent;
2214	border-radius: 2px;
2215	border: 1px solid #949494;
2216	}
2217
2218	@media not (prefers-reduced-motion) {
2219	.dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection {
2220	transition: box-shadow 0.1s linear;
2221	}
2222	}
2223	@media (min-width: 600px) {
2224	.dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection {
2225	font-size: 13px;
2226	/* Override core line-height. To be reviewed. */
2227	line-height: normal;
2228	}
2229	}
2230	.dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection:focus {
2231	border-color: var(--wp-admin-theme-color);
2232	box-shadow: 0 0 0 0.5px var(--wp-admin-theme-color);
2233	outline: 2px solid transparent;
2234	}
2235
2236	.dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection::placeholder {
2237	color: rgba(30, 30, 30, 0.62);
2238	}
2239
2240	.dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection:focus {
2241	box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--wp-admin-theme-color);
2242	outline: 2px solid transparent;
2243	}
2244
2245	.dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection:checked {
2246	background: var(--wp-admin-theme-color);
2247	border-color: var(--wp-admin-theme-color);
2248	}
2249
2250	.dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection:checked::before, .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection[aria-checked=mixed]::before {
2251	margin: -3px -5px;
2252	color: #fff;
2253	}
2254
2255	@media (min-width: 782px) {
2256	.dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection:checked::before, .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection[aria-checked=mixed]::before {
2257	margin: -4px 0 0 -5px;
2258	}
2259	}
2260	.dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection[aria-checked=mixed] {
2261	background: var(--wp-admin-theme-color);
2262	border-color: var(--wp-admin-theme-color);
2263	}
2264
2265	.dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection[aria-checked=mixed]::before {
2266	content: "\f460";
2267	float: left;
2268	display: inline-block;
2269	vertical-align: middle;
2270	width: 16px;
2271	/* stylelint-disable-next-line font-family-no-missing-generic-family-keyword -- dashicons don't need a generic family keyword. */
2272	font: normal 30px/1 dashicons;
2273	speak: none;
2274	-webkit-font-smoothing: antialiased;
2275	-moz-osx-font-smoothing: grayscale;
2276	}
2277
2278	@media (min-width: 782px) {
2279	.dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection[aria-checked=mixed]::before {
2280	float: none;
2281	font-size: 21px;
2282	}
2283	}
2284	.dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection[aria-disabled=true], .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection:disabled {
2285	background: #f0f0f0;
2286	border-color: #ddd;
2287	cursor: default;
2288	opacity: 1;
2289	}
2290
2291	.dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection {
2292	position: relative;
2293	background: #fff;
2294	color: #1e1e1e;
2295	margin: 0;
2296	padding: 0;
2297	width: var(--checkbox-size);
2298	height: var(--checkbox-size);
2299	}
2300
2301	@media (min-width: 600px) {
2302	.dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection {
2303	--checkbox-size: 16px;
2304	}
2305	}
2306	@media not (prefers-reduced-motion) {
2307	.dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection {
2308	transition: 0.1s border-color ease-in-out;
2309	}
2310	}
2311	.dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection.is-selected {
2312	background: var(--wp-admin-theme-color, #3858e9);
2313	border-color: var(--wp-admin-theme-color, #3858e9);
2314	}
2315
2316	.dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection.is-selected svg {
2317	--checkmark-size: var(--checkbox-size);
2318	fill: #fff;
2319	position: absolute;
2320	left: 50%;
2321	top: 50%;
2322	transform: translate(-50%, -50%);
2323	width: var(--checkmark-size);
2324	height: var(--checkmark-size);
2325	}
2326
2327	@media (min-width: 600px) {
2328	.dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection.is-selected svg {
2329	--checkmark-size: calc(var(--checkbox-size) + 4px);
2330	}
2331	}
2332	.dataviews-filters__search-widget-filter-combobox__wrapper {
2333	position: relative;
2334	padding: 8px;
2335	}
2336
2337	.dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input {
2338	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
2339	padding: 6px 8px;
2340	/* Fonts smaller than 16px causes mobile safari to zoom. */
2341	font-size: 16px;
2342	/* Override core line-height. To be reviewed. */
2343	line-height: normal;
2344	box-shadow: 0 0 0 transparent;
2345	border-radius: 2px;
2346	border: 1px solid #949494;
2347	}
2348
2349	@media not (prefers-reduced-motion) {
2350	.dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input {
2351	transition: box-shadow 0.1s linear;
2352	}
2353	}
2354	@media (min-width: 600px) {
2355	.dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input {
2356	font-size: 13px;
2357	/* Override core line-height. To be reviewed. */
2358	line-height: normal;
2359	}
2360	}
2361	.dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input:focus {
2362	border-color: var(--wp-admin-theme-color);
2363	box-shadow: 0 0 0 0.5px var(--wp-admin-theme-color);
2364	outline: 2px solid transparent;
2365	}
2366
2367	.dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::placeholder {
2368	color: rgba(30, 30, 30, 0.62);
2369	}
2370
2371	.dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input {
2372	display: block;
2373	padding: 0 8px 0 32px;
2374	width: 100%;
2375	height: 32px;
2376	margin-left: 0;
2377	margin-right: 0;
2378	/* Fonts smaller than 16px causes mobile safari to zoom. */
2379	font-size: 16px;
2380	}
2381
2382	@media (min-width: 600px) {
2383	.dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input {
2384	font-size: 13px;
2385	}
2386	}
2387	.dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input:focus {
2388	background: #fff;
2389	box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
2390	}
2391
2392	.dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::placeholder {
2393	color: #757575;
2394	}
2395
2396	.dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::-webkit-search-decoration, .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::-webkit-search-cancel-button, .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::-webkit-search-results-button, .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::-webkit-search-results-decoration {
2397	-webkit-appearance: none;
2398	}
2399
2400	.dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__icon {
2401	position: absolute;
2402	inset-inline-start: 12px;
2403	top: 0;
2404	bottom: 0;
2405	display: flex;
2406	align-items: center;
2407	justify-content: center;
2408	width: 24px;
2409	}
2410
2411	.dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__icon:dir(ltr) {
2412	transform: scaleX(-1);
2413	}
2414
2415	.dataviews-filters__container-visibility-toggle {
2416	position: relative;
2417	flex-shrink: 0;
2418	}
2419
2420	.dataviews-filters-toggle__count {
2421	position: absolute;
2422	top: 0;
2423	right: 0;
2424	transform: translate(50%, -50%);
2425	background: var(--wp-admin-theme-color, #3858e9);
2426	height: 16px;
2427	min-width: 16px;
2428	line-height: 16px;
2429	padding: 0 4px;
2430	text-align: center;
2431	border-radius: 8px;
2432	font-size: 11px;
2433	outline: var(--wp-admin-border-width-focus) solid #fff;
2434	color: #fff;
2435	box-sizing: border-box;
2436	}
2437
2438	.dataviews-search {
2439	width: fit-content;
2440	}
2441
2442	.dataviews-filters__user-input-widget {
2443	padding: 16px;
2444	}
2445
2446	.dataviews-filters__user-input-widget .components-input-control__prefix {
2447	padding-left: 8px;
2448	}
2449
2450	.dataviews-filters__search-widget-no-elements {
2451	display: flex;
2452	align-items: center;
2453	justify-content: center;
2454	padding: 16px;
2455	}
2456
2457	.dataviews-footer {
2458	position: sticky;
2459	bottom: 0;
2460	left: 0;
2461	background-color: inherit;
2462	padding: 12px 24px;
2463	border-top: 1px solid #f0f0f0;
2464	flex-shrink: 0;
2465	}
2466
2467	@media not (prefers-reduced-motion) {
2468	.dataviews-footer {
2469	transition: padding ease-out 0.1s;
2470	}
2471	}
2472	.dataviews-footer {
2473	z-index: 2;
2474	}
2475
2476	@container (max-width: 560px) {
2477	.dataviews-footer {
2478	flex-direction: column !important;
2479	}
2480	.dataviews-footer .dataviews-bulk-actions-footer__container {
2481	width: 100%;
2482	}
2483	.dataviews-footer .dataviews-bulk-actions-footer__item-count {
2484	flex-grow: 1;
2485	}
2486	.dataviews-footer .dataviews-pagination {
2487	width: 100%;
2488	justify-content: space-between;
2489	}
2490	}
2491	.dataviews-pagination__page-select {
2492	font-size: 11px;
2493	font-weight: 499;
2494	text-transform: uppercase;
2495	}
2496
2497	@media (min-width: 600px) {
2498	.dataviews-pagination__page-select .components-select-control__input {
2499	font-size: 11px !important;
2500	font-weight: 499;
2501	}
2502	}
2503	.dataviews-action-modal {
2504	z-index: 1000001;
2505	}
2506
2507	.dataviews-selection-checkbox {
2508	--checkbox-input-size: 24px;
2509	}
2510
2511	@media (min-width: 600px) {
2512	.dataviews-selection-checkbox {
2513	--checkbox-input-size: 16px;
2514	}
2515	}
2516	.dataviews-selection-checkbox {
2517	line-height: 0;
2518	flex-shrink: 0;
2519	}
2520
2521	.dataviews-selection-checkbox .components-checkbox-control__input-container {
2522	margin: 0;
2523	}
2524
2525	.dataviews-view-config {
2526	width: 320px;
2527	/* stylelint-disable-next-line property-no-unknown -- the linter needs to be updated to accepted the container-type property */
2528	container-type: inline-size;
2529	font-size: 13px;
2530	line-height: 1.4;
2531	}
2532
2533	.dataviews-config__popover.is-expanded .dataviews-config__popover-content-wrapper {
2534	overflow-y: scroll;
2535	height: 100%;
2536	}
2537
2538	.dataviews-config__popover.is-expanded .dataviews-config__popover-content-wrapper .dataviews-view-config {
2539	width: auto;
2540	}
2541
2542	.dataviews-view-config__sort-direction .components-toggle-group-control-option-base {
2543	text-transform: uppercase;
2544	}
2545
2546	.dataviews-settings-section__title.dataviews-settings-section__title {
2547	line-height: 24px;
2548	font-size: 15px;
2549	}
2550
2551	.dataviews-settings-section__sidebar {
2552	grid-column: span 4;
2553	}
2554
2555	.dataviews-settings-section__content,
2556	.dataviews-settings-section__content > * {
2557	grid-column: span 8;
2558	}
2559
2560	.dataviews-settings-section__content .is-divided-in-two {
2561	display: contents;
2562	}
2563
2564	.dataviews-settings-section__content .is-divided-in-two > * {
2565	grid-column: span 4;
2566	}
2567
2568	.dataviews-settings-section:has(.dataviews-settings-section__content:empty) {
2569	display: none;
2570	}
2571
2572	@container (max-width: 500px) {
2573	.dataviews-settings-section.dataviews-settings-section {
2574	grid-template-columns: repeat(2, 1fr);
2575	}
2576	.dataviews-settings-section.dataviews-settings-section .dataviews-settings-section__sidebar {
2577	grid-column: span 2;
2578	}
2579	.dataviews-settings-section.dataviews-settings-section .dataviews-settings-section__content {
2580	grid-column: span 2;
2581	}
2582	}
2583	.dataviews-view-config__label {
2584	text-wrap: nowrap;
2585	}
2586
2587	.dataviews-view-grid-items {
2588	margin-bottom: auto;
2589	display: grid;
2590	gap: 32px;
2591	grid-template-rows: max-content;
2592	grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
2593	padding: 0 24px 24px;
2594	container-type: inline-size;
2595	}
2596
2597	@media not (prefers-reduced-motion) {
2598	.dataviews-view-grid-items {
2599	transition: padding ease-out 0.1s;
2600	}
2601	}
2602	.dataviews-view-grid {
2603	padding: 0 24px 24px;
2604	display: flex;
2605	flex-direction: column;
2606	gap: 32px;
2607	container-type: inline-size;
2608	margin-bottom: auto;
2609	}
2610
2611	@media not (prefers-reduced-motion) {
2612	.dataviews-view-grid {
2613	transition: padding ease-out 0.1s;
2614	}
2615	}
2616	.dataviews-view-grid .dataviews-view-grid__row {
2617	display: grid;
2618	gap: 32px;
2619	}
2620
2621	.dataviews-view-grid .dataviews-view-grid__row .dataviews-view-grid__row__gridcell {
2622	border-radius: 4px;
2623	position: relative;
2624	}
2625
2626	.dataviews-view-grid .dataviews-view-grid__row .dataviews-view-grid__row__gridcell[data-focus-visible]::after {
2627	content: "";
2628	position: absolute;
2629	top: 0;
2630	left: 0;
2631	width: 100%;
2632	height: 100%;
2633	box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
2634	border-radius: 4px;
2635	pointer-events: none;
2636	outline: 2px solid transparent;
2637	}
2638
2639	.dataviews-view-grid .dataviews-view-grid__card {
2640	height: 100%;
2641	justify-content: flex-start;
2642	position: relative;
2643	}
2644
2645	.dataviews-view-grid .dataviews-view-grid__card .dataviews-view-grid__title-actions {
2646	padding: 8px 0 4px;
2647	}
2648
2649	.dataviews-view-grid .dataviews-view-grid__card .dataviews-view-grid__title-field {
2650	min-height: 24px;
2651	overflow: hidden;
2652	align-content: center;
2653	text-align: start;
2654	}
2655
2656	.dataviews-view-grid .dataviews-view-grid__card .dataviews-view-grid__title-field--clickable {
2657	width: fit-content;
2658	}
2659
2660	.dataviews-view-grid .dataviews-view-grid__card.is-selected .dataviews-view-grid__fields .dataviews-view-grid__field .dataviews-view-grid__field-value {
2661	color: #1e1e1e;
2662	}
2663
2664	.dataviews-view-grid .dataviews-view-grid__card.is-selected .dataviews-view-grid__media::after,
2665	.dataviews-view-grid .dataviews-view-grid__card .dataviews-view-grid__media:focus::after {
2666	background-color: rgba(var(--wp-admin-theme-color--rgb), 0.08);
2667	}
2668
2669	.dataviews-view-grid .dataviews-view-grid__card.is-selected .dataviews-view-grid__media::after {
2670	box-shadow: inset 0 0 0 1px var(--wp-admin-theme-color);
2671	}
2672
2673	.dataviews-view-grid .dataviews-view-grid__card .dataviews-view-grid__media:focus::after {
2674	box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
2675	}
2676
2677	.dataviews-view-grid .dataviews-view-grid__media {
2678	width: 100%;
2679	aspect-ratio: 1/1;
2680	background-color: #fff;
2681	border-radius: 4px;
2682	overflow: hidden;
2683	position: relative;
2684	}
2685
2686	.dataviews-view-grid .dataviews-view-grid__media img {
2687	object-fit: cover;
2688	width: 100%;
2689	height: 100%;
2690	}
2691
2692	.dataviews-view-grid .dataviews-view-grid__media::after {
2693	content: "";
2694	position: absolute;
2695	top: 0;
2696	left: 0;
2697	width: 100%;
2698	height: 100%;
2699	box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.1);
2700	border-radius: 4px;
2701	pointer-events: none;
2702	}
2703
2704	.dataviews-view-grid .dataviews-view-grid__fields {
2705	position: relative;
2706	font-size: 12px;
2707	line-height: 16px;
2708	}
2709
2710	.dataviews-view-grid .dataviews-view-grid__fields:not(:empty) {
2711	padding: 0 0 12px;
2712	}
2713
2714	.dataviews-view-grid .dataviews-view-grid__fields .dataviews-view-grid__field-value:not(:empty) {
2715	min-height: 24px;
2716	line-height: 20px;
2717	padding-top: 2px;
2718	}
2719
2720	.dataviews-view-grid .dataviews-view-grid__fields .dataviews-view-grid__field {
2721	min-height: 24px;
2722	align-items: center;
2723	}
2724
2725	.dataviews-view-grid .dataviews-view-grid__fields .dataviews-view-grid__field .dataviews-view-grid__field-name {
2726	width: 35%;
2727	color: #757575;
2728	overflow: hidden;
2729	text-overflow: ellipsis;
2730	white-space: nowrap;
2731	}
2732
2733	.dataviews-view-grid .dataviews-view-grid__fields .dataviews-view-grid__field .dataviews-view-grid__field-value {
2734	width: 65%;
2735	overflow: hidden;
2736	text-overflow: ellipsis;
2737	white-space: nowrap;
2738	}
2739
2740	.dataviews-view-grid .dataviews-view-grid__fields .dataviews-view-grid__field:not(:has(.dataviews-view-grid__field-value:not(:empty))) {
2741	display: none;
2742	}
2743
2744	.dataviews-view-grid .dataviews-view-grid__badge-fields:not(:empty) {
2745	padding-bottom: 12px;
2746	}
2747
2748	.dataviews-view-grid__field-value:empty,
2749	.dataviews-view-grid__field:empty {
2750	display: none;
2751	}
2752
2753	.dataviews-view-grid__card .dataviews-selection-checkbox {
2754	position: absolute;
2755	top: -9999em;
2756	left: 8px;
2757	z-index: 1;
2758	opacity: 0;
2759	}
2760
2761	@media not (prefers-reduced-motion) {
2762	.dataviews-view-grid__card .dataviews-selection-checkbox {
2763	transition: opacity 0.1s linear;
2764	}
2765	}
2766	@media (hover: none) {
2767	.dataviews-view-grid__card .dataviews-selection-checkbox {
2768	opacity: 1;
2769	top: 8px;
2770	}
2771	}
2772	.dataviews-view-grid__card:hover .dataviews-selection-checkbox,
2773	.dataviews-view-grid__card:focus-within .dataviews-selection-checkbox,
2774	.dataviews-view-grid__card.is-selected .dataviews-selection-checkbox {
2775	opacity: 1;
2776	top: 8px;
2777	}
2778
2779	.dataviews-view-grid__card .dataviews-view-grid__media-actions {
2780	position: absolute;
2781	top: 4px;
2782	opacity: 0;
2783	right: 4px;
2784	}
2785
2786	.dataviews-view-grid__card .dataviews-view-grid__media-actions .dataviews-all-actions-button {
2787	background-color: #fff;
2788	}
2789
2790	@media not (prefers-reduced-motion) {
2791	.dataviews-view-grid__card .dataviews-view-grid__media-actions {
2792	transition: opacity 0.1s linear;
2793	}
2794	}
2795	@media (hover: none) {
2796	.dataviews-view-grid__card .dataviews-view-grid__media-actions {
2797	opacity: 1;
2798	top: 4px;
2799	}
2800	}
2801	.dataviews-view-grid__card:hover .dataviews-view-grid__media-actions,
2802	.dataviews-view-grid__card:focus-within .dataviews-view-grid__media-actions,
2803	.dataviews-view-grid__card .dataviews-view-grid__media-actions:has(.dataviews-all-actions-button[aria-expanded=true]) {
2804	opacity: 1;
2805	}
2806
2807	.dataviews-view-grid__media--clickable {
2808	cursor: pointer;
2809	}
2810
2811	.dataviews-view-grid__group-header {
2812	font-size: 15px;
2813	font-weight: 499;
2814	color: #1e1e1e;
2815	margin: 0 0 8px 0;
2816	padding: 0 24px;
2817	container-type: inline-size;
2818	}
2819
2820	div.dataviews-view-list {
2821	list-style-type: none;
2822	}
2823
2824	.dataviews-view-list {
2825	margin: 0 0 auto;
2826	}
2827
2828	.dataviews-view-list div[role=row],
2829	.dataviews-view-list div[role=article] {
2830	margin: 0;
2831	border-top: 1px solid #f0f0f0;
2832	}
2833
2834	.dataviews-view-list div[role=row] .dataviews-view-list__item-wrapper,
2835	.dataviews-view-list div[role=article] .dataviews-view-list__item-wrapper {
2836	position: relative;
2837	padding: 16px 24px;
2838	box-sizing: border-box;
2839	}
2840
2841	.dataviews-view-list div[role=row] .dataviews-view-list__item-actions,
2842	.dataviews-view-list div[role=article] .dataviews-view-list__item-actions {
2843	display: flex;
2844	width: max-content;
2845	flex: 0 0 auto;
2846	gap: 4px;
2847	white-space: nowrap;
2848	}
2849
2850	.dataviews-view-list div[role=row] .dataviews-view-list__item-actions .components-button,
2851	.dataviews-view-list div[role=article] .dataviews-view-list__item-actions .components-button {
2852	position: relative;
2853	z-index: 1;
2854	}
2855
2856	.dataviews-view-list div[role=row] .dataviews-view-list__item-actions > div,
2857	.dataviews-view-list div[role=article] .dataviews-view-list__item-actions > div {
2858	height: 24px;
2859	}
2860
2861	.dataviews-view-list div[role=row] .dataviews-view-list__item-actions > :not(:last-child),
2862	.dataviews-view-list div[role=article] .dataviews-view-list__item-actions > :not(:last-child) {
2863	flex: 0;
2864	overflow: hidden;
2865	width: 0;
2866	}
2867
2868	.dataviews-view-list div[role=row]:where(.is-selected, .is-hovered, :focus-within) .dataviews-view-list__item-actions > :not(:last-child),
2869	.dataviews-view-list div[role=article]:where(.is-selected, .is-hovered, :focus-within) .dataviews-view-list__item-actions > :not(:last-child) {
2870	flex-basis: min-content;
2871	width: auto;
2872	overflow: unset;
2873	}
2874
2875	@media (hover: none) {
2876	.dataviews-view-list div[role=row] .dataviews-view-list__item-actions > :not(:last-child),
2877	.dataviews-view-list div[role=article] .dataviews-view-list__item-actions > :not(:last-child) {
2878	flex-basis: min-content;
2879	width: auto;
2880	overflow: unset;
2881	}
2882	}
2883	.dataviews-view-list div[role=row].is-selected.is-selected,
2884	.dataviews-view-list div[role=article].is-selected.is-selected {
2885	border-top: 1px solid rgba(var(--wp-admin-theme-color--rgb), 0.12);
2886	}
2887
2888	.dataviews-view-list div[role=row].is-selected.is-selected + div[role=row], .dataviews-view-list div[role=row].is-selected.is-selected + div[role=article],
2889	.dataviews-view-list div[role=article].is-selected.is-selected + div[role=row],
2890	.dataviews-view-list div[role=article].is-selected.is-selected + div[role=article] {
2891	border-top: 1px solid rgba(var(--wp-admin-theme-color--rgb), 0.12);
2892	}
2893
2894	.dataviews-view-list div[role=row]:not(.is-selected):hover, .dataviews-view-list div[role=row]:not(.is-selected).is-hovered, .dataviews-view-list div[role=row]:not(.is-selected):focus-within,
2895	.dataviews-view-list div[role=article]:not(.is-selected):hover,
2896	.dataviews-view-list div[role=article]:not(.is-selected).is-hovered,
2897	.dataviews-view-list div[role=article]:not(.is-selected):focus-within {
2898	color: var(--wp-admin-theme-color);
2899	background-color: rgba(var(--wp-admin-theme-color--rgb), 0.04);
2900	border-top: 1px solid rgba(var(--wp-admin-theme-color--rgb), 0.12);
2901	}
2902
2903	.dataviews-view-list div[role=row]:not(.is-selected):hover + div[role=row], .dataviews-view-list div[role=row]:not(.is-selected):hover + div[role=article], .dataviews-view-list div[role=row]:not(.is-selected).is-hovered + div[role=row], .dataviews-view-list div[role=row]:not(.is-selected).is-hovered + div[role=article], .dataviews-view-list div[role=row]:not(.is-selected):focus-within + div[role=row], .dataviews-view-list div[role=row]:not(.is-selected):focus-within + div[role=article],
2904	.dataviews-view-list div[role=article]:not(.is-selected):hover + div[role=row],
2905	.dataviews-view-list div[role=article]:not(.is-selected):hover + div[role=article],
2906	.dataviews-view-list div[role=article]:not(.is-selected).is-hovered + div[role=row],
2907	.dataviews-view-list div[role=article]:not(.is-selected).is-hovered + div[role=article],
2908	.dataviews-view-list div[role=article]:not(.is-selected):focus-within + div[role=row],
2909	.dataviews-view-list div[role=article]:not(.is-selected):focus-within + div[role=article] {
2910	border-top: 1px solid rgba(var(--wp-admin-theme-color--rgb), 0.12);
2911	}
2912
2913	.dataviews-view-list div[role=row]:not(.is-selected):hover .dataviews-title-field,
2914	.dataviews-view-list div[role=row]:not(.is-selected):hover .dataviews-view-list__field, .dataviews-view-list div[role=row]:not(.is-selected).is-hovered .dataviews-title-field,
2915	.dataviews-view-list div[role=row]:not(.is-selected).is-hovered .dataviews-view-list__field, .dataviews-view-list div[role=row]:not(.is-selected):focus-within .dataviews-title-field,
2916	.dataviews-view-list div[role=row]:not(.is-selected):focus-within .dataviews-view-list__field,
2917	.dataviews-view-list div[role=article]:not(.is-selected):hover .dataviews-title-field,
2918	.dataviews-view-list div[role=article]:not(.is-selected):hover .dataviews-view-list__field,
2919	.dataviews-view-list div[role=article]:not(.is-selected).is-hovered .dataviews-title-field,
2920	.dataviews-view-list div[role=article]:not(.is-selected).is-hovered .dataviews-view-list__field,
2921	.dataviews-view-list div[role=article]:not(.is-selected):focus-within .dataviews-title-field,
2922	.dataviews-view-list div[role=article]:not(.is-selected):focus-within .dataviews-view-list__field {
2923	color: var(--wp-admin-theme-color);
2924	}
2925
2926	.dataviews-view-list div[role=row].is-selected .dataviews-view-list__item-wrapper,
2927	.dataviews-view-list div[role=row].is-selected:focus-within .dataviews-view-list__item-wrapper,
2928	.dataviews-view-list div[role=article].is-selected .dataviews-view-list__item-wrapper,
2929	.dataviews-view-list div[role=article].is-selected:focus-within .dataviews-view-list__item-wrapper {
2930	background-color: rgba(var(--wp-admin-theme-color--rgb), 0.08);
2931	color: #1e1e1e;
2932	}
2933
2934	.dataviews-view-list div[role=row].is-selected .dataviews-view-list__item-wrapper .dataviews-title-field,
2935	.dataviews-view-list div[role=row].is-selected .dataviews-view-list__item-wrapper .dataviews-view-list__field,
2936	.dataviews-view-list div[role=row].is-selected:focus-within .dataviews-view-list__item-wrapper .dataviews-title-field,
2937	.dataviews-view-list div[role=row].is-selected:focus-within .dataviews-view-list__item-wrapper .dataviews-view-list__field,
2938	.dataviews-view-list div[role=article].is-selected .dataviews-view-list__item-wrapper .dataviews-title-field,
2939	.dataviews-view-list div[role=article].is-selected .dataviews-view-list__item-wrapper .dataviews-view-list__field,
2940	.dataviews-view-list div[role=article].is-selected:focus-within .dataviews-view-list__item-wrapper .dataviews-title-field,
2941	.dataviews-view-list div[role=article].is-selected:focus-within .dataviews-view-list__item-wrapper .dataviews-view-list__field {
2942	color: #1e1e1e;
2943	}
2944
2945	.dataviews-view-list .dataviews-view-list__item {
2946	position: absolute;
2947	z-index: 1;
2948	inset: 0;
2949	scroll-margin: 8px 0;
2950	appearance: none;
2951	border: none;
2952	background: none;
2953	padding: 0;
2954	cursor: pointer;
2955	}
2956
2957	.dataviews-view-list .dataviews-view-list__item:focus-visible {
2958	outline: none;
2959	}
2960
2961	.dataviews-view-list .dataviews-view-list__item:focus-visible::before {
2962	position: absolute;
2963	content: "";
2964	inset: var(--wp-admin-border-width-focus);
2965	box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
2966	border-radius: 2px;
2967	outline: 2px solid transparent;
2968	}
2969
2970	.dataviews-view-list .dataviews-view-list__title-field {
2971	flex: 1;
2972	min-height: 24px;
2973	line-height: 24px;
2974	overflow: hidden;
2975	}
2976
2977	.dataviews-view-list .dataviews-view-list__title-field:has(a, button) {
2978	z-index: 1;
2979	}
2980
2981	.dataviews-view-list .dataviews-view-list__media-wrapper {
2982	width: 52px;
2983	height: 52px;
2984	overflow: hidden;
2985	position: relative;
2986	flex-shrink: 0;
2987	background-color: #fff;
2988	border-radius: 4px;
2989	}
2990
2991	.dataviews-view-list .dataviews-view-list__media-wrapper img {
2992	width: 100%;
2993	height: 100%;
2994	object-fit: cover;
2995	}
2996
2997	.dataviews-view-list .dataviews-view-list__media-wrapper::after {
2998	content: "";
2999	position: absolute;
3000	top: 0;
3001	left: 0;
3002	width: 100%;
3003	height: 100%;
3004	box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.1);
3005	border-radius: 4px;
3006	}
3007
3008	.dataviews-view-list .dataviews-view-list__field-wrapper {
3009	min-height: 52px;
3010	flex-grow: 1;
3011	}
3012
3013	.dataviews-view-list .dataviews-view-list__field {
3014	color: #757575;
3015	}
3016
3017	.dataviews-view-list .dataviews-view-list__fields {
3018	display: flex;
3019	gap: 12px;
3020	row-gap: 4px;
3021	flex-wrap: wrap;
3022	font-size: 12px;
3023	}
3024
3025	.dataviews-view-list .dataviews-view-list__fields:empty {
3026	display: none;
3027	}
3028
3029	.dataviews-view-list .dataviews-view-list__fields .dataviews-view-list__field:has(.dataviews-view-list__field-value:empty) {
3030	display: none;
3031	}
3032
3033	.dataviews-view-list .dataviews-view-list__fields .dataviews-view-list__field-value {
3034	min-height: 24px;
3035	line-height: 20px;
3036	display: flex;
3037	align-items: center;
3038	}
3039
3040	.dataviews-view-list + .dataviews-pagination {
3041	justify-content: space-between;
3042	}
3043
3044	.dataviews-view-list.has-compact-density div[role=row] .dataviews-view-list__item-wrapper {
3045	padding: 8px 24px;
3046	}
3047
3048	.dataviews-view-list.has-compact-density div[role=row] .dataviews-view-list__title-field {
3049	min-height: 16px;
3050	line-height: 16px;
3051	}
3052
3053	.dataviews-view-list.has-compact-density div[role=row] .dataviews-view-list__media-wrapper {
3054	width: 32px;
3055	height: 32px;
3056	}
3057
3058	.dataviews-view-list.has-compact-density div[role=row] .dataviews-view-list__field-wrapper {
3059	min-height: 32px;
3060	}
3061
3062	.dataviews-view-list.has-compact-density div[role=row] .dataviews-view-list__fields {
3063	gap: 8px;
3064	row-gap: 4px;
3065	}
3066
3067	.dataviews-view-list.has-compact-density div[role=row] .dataviews-view-list__fields .dataviews-view-list__field-value {
3068	min-height: 16px;
3069	line-height: 16px;
3070	}
3071
3072	.dataviews-view-list.has-comfortable-density div[role=row] .dataviews-view-list__item-wrapper {
3073	padding: 24px 24px;
3074	}
3075
3076	.dataviews-view-list.has-comfortable-density div[role=row] .dataviews-view-list__title-field {
3077	min-height: 32px;
3078	line-height: 32px;
3079	}
3080
3081	.dataviews-view-list.has-comfortable-density div[role=row] .dataviews-view-list__media-wrapper {
3082	width: 64px;
3083	height: 64px;
3084	}
3085
3086	.dataviews-view-list.has-comfortable-density div[role=row] .dataviews-view-list__field-wrapper {
3087	min-height: 64px;
3088	}
3089
3090	.dataviews-view-list.has-comfortable-density div[role=row] .dataviews-view-list__fields {
3091	gap: 16px;
3092	row-gap: 8px;
3093	}
3094
3095	.dataviews-view-list.has-comfortable-density div[role=row] .dataviews-view-list__fields .dataviews-view-list__field-value {
3096	min-height: 32px;
3097	line-height: 24px;
3098	}
3099
3100	.dataviews-view-list__group-header {
3101	font-size: 15px;
3102	font-weight: 499;
3103	color: #1e1e1e;
3104	margin: 0 0 8px 0;
3105	padding: 0 24px;
3106	}
3107
3108	.dataviews-view-table {
3109	width: 100%;
3110	text-indent: 0;
3111	border-color: inherit;
3112	border-collapse: collapse;
3113	position: relative;
3114	color: #757575;
3115	margin-bottom: auto;
3116	background-color: inherit;
3117	}
3118
3119	.dataviews-view-table th {
3120	text-align: left;
3121	color: #1e1e1e;
3122	font-weight: normal;
3123	font-size: 13px;
3124	}
3125
3126	.dataviews-view-table td,
3127	.dataviews-view-table th {
3128	padding: 12px;
3129	}
3130
3131	.dataviews-view-table td.dataviews-view-table__actions-column,
3132	.dataviews-view-table th.dataviews-view-table__actions-column {
3133	text-align: right;
3134	}
3135
3136	.dataviews-view-table td.dataviews-view-table__actions-column--sticky,
3137	.dataviews-view-table th.dataviews-view-table__actions-column--sticky {
3138	position: sticky;
3139	right: 0;
3140	background-color: var(--wp-dataviews-color-background, #fff);
3141	}
3142
3143	.dataviews-view-table td.dataviews-view-table__actions-column--stuck::after,
3144	.dataviews-view-table th.dataviews-view-table__actions-column--stuck::after {
3145	display: block;
3146	content: "";
3147	position: absolute;
3148	top: 0;
3149	bottom: 0;
3150	left: 0;
3151	width: 1px;
3152	background-color: #f0f0f0;
3153	}
3154
3155	.dataviews-view-table td.dataviews-view-table__checkbox-column,
3156	.dataviews-view-table th.dataviews-view-table__checkbox-column {
3157	padding-right: 0;
3158	}
3159
3160	.dataviews-view-table td.dataviews-view-table__checkbox-column .dataviews-view-table__cell-content-wrapper,
3161	.dataviews-view-table th.dataviews-view-table__checkbox-column .dataviews-view-table__cell-content-wrapper {
3162	max-width: auto;
3163	min-width: auto;
3164	}
3165
3166	.dataviews-view-table tr {
3167	border-top: 1px solid #f0f0f0;
3168	background-color: inherit;
3169	}
3170
3171	.dataviews-view-table tr td:first-child,
3172	.dataviews-view-table tr th:first-child {
3173	padding-left: 24px;
3174	}
3175
3176	.dataviews-view-table tr td:last-child,
3177	.dataviews-view-table tr th:last-child {
3178	padding-right: 24px;
3179	}
3180
3181	.dataviews-view-table tr:last-child {
3182	border-bottom: 0;
3183	}
3184
3185	.dataviews-view-table tr .dataviews-item-actions .components-button:not(.dataviews-all-actions-button) {
3186	opacity: 0;
3187	}
3188
3189	@media (hover: none) {
3190	.dataviews-view-table tr .dataviews-item-actions .components-button:not(.dataviews-all-actions-button) {
3191	opacity: 1;
3192	}
3193	}
3194	.dataviews-view-table tr.is-selected {
3195	background-color: color-mix(in srgb, rgb(var(--wp-admin-theme-color--rgb)) 4%, #fff);
3196	color: #757575;
3197	}
3198
3199	.dataviews-view-table tr.is-selected, .dataviews-view-table tr.is-selected + tr {
3200	border-top: 1px solid rgba(var(--wp-admin-theme-color--rgb), 0.12);
3201	}
3202
3203	.dataviews-view-table tr.is-selected .dataviews-view-table__actions-column--sticky {
3204	background-color: color-mix(in srgb, rgb(var(--wp-admin-theme-color--rgb)) 4%, #fff);
3205	}
3206
3207	.dataviews-view-table tr:focus-within .dataviews-item-actions .components-button:not(.dataviews-all-actions-button), .dataviews-view-table tr.is-hovered .dataviews-item-actions .components-button:not(.dataviews-all-actions-button), .dataviews-view-table tr:hover .dataviews-item-actions .components-button:not(.dataviews-all-actions-button) {
3208	opacity: 1;
3209	}
3210
3211	.dataviews-view-table.has-bulk-actions tr:focus-within .dataviews-view-table__actions-column--sticky, .dataviews-view-table.has-bulk-actions tr:hover .dataviews-view-table__actions-column--sticky {
3212	background-color: var(--wp-dataviews-color-background, #fff);
3213	}
3214
3215	.dataviews-view-table.has-bulk-actions tr.is-selected .dataviews-view-table__actions-column--sticky, .dataviews-view-table.has-bulk-actions tr.is-selected:hover .dataviews-view-table__actions-column--sticky {
3216	background-color: color-mix(in srgb, rgb(var(--wp-admin-theme-color--rgb)) 4%, #fff);
3217	}
3218
3219	.dataviews-view-table thead {
3220	position: sticky;
3221	inset-block-start: 0;
3222	z-index: 1;
3223	background-color: inherit;
3224	}
3225
3226	.dataviews-view-table thead tr {
3227	border: 0;
3228	}
3229
3230	.dataviews-view-table thead th {
3231	background-color: inherit;
3232	padding-top: 8px;
3233	padding-bottom: 8px;
3234	font-size: 11px;
3235	text-transform: uppercase;
3236	font-weight: 499;
3237	}
3238
3239	.dataviews-view-table thead th:has(.dataviews-view-table-header-button) {
3240	padding-left: 4px;
3241	padding-right: 4px;
3242	}
3243
3244	.dataviews-view-table thead th:has(.dataviews-view-table-header-button) .dataviews-view-table-header-button {
3245	gap: 4px;
3246	}
3247
3248	.dataviews-view-table thead th:has(.dataviews-view-table-header-button):first-child {
3249	padding-left: 40px;
3250	}
3251
3252	.dataviews-view-table thead th:has(.dataviews-view-table-header-button):last-child {
3253	padding-right: 40px;
3254	}
3255
3256	.dataviews-view-table tbody td {
3257	vertical-align: top;
3258	}
3259
3260	.dataviews-view-table tbody .dataviews-view-table__cell-content-wrapper {
3261	min-height: 32px;
3262	display: flex;
3263	align-items: center;
3264	white-space: nowrap;
3265	}
3266
3267	.dataviews-view-table tbody .dataviews-view-table__cell-content-wrapper.dataviews-view-table__cell-align-end {
3268	justify-content: flex-end;
3269	}
3270
3271	.dataviews-view-table tbody .dataviews-view-table__cell-content-wrapper.dataviews-view-table__cell-align-center {
3272	justify-content: center;
3273	}
3274
3275	.dataviews-view-table tbody .components-v-stack > .dataviews-view-table__cell-content-wrapper:not(:first-child) {
3276	min-height: 0;
3277	}
3278
3279	.dataviews-view-table .dataviews-view-table-header-button {
3280	padding: 4px 8px;
3281	font-size: 11px;
3282	text-transform: uppercase;
3283	font-weight: 499;
3284	}
3285
3286	.dataviews-view-table .dataviews-view-table-header-button:not(:hover) {
3287	color: #1e1e1e;
3288	}
3289
3290	.dataviews-view-table .dataviews-view-table-header-button span {
3291	speak: none;
3292	}
3293
3294	.dataviews-view-table .dataviews-view-table-header-button span:empty {
3295	display: none;
3296	}
3297
3298	.dataviews-view-table .dataviews-view-table-header {
3299	padding-left: 4px;
3300	}
3301
3302	.dataviews-view-table .dataviews-view-table__actions-column {
3303	width: auto;
3304	white-space: nowrap;
3305	}
3306
3307	.dataviews-view-table.has-compact-density thead th:has(.dataviews-view-table-header-button):not(:first-child) {
3308	padding-left: 0;
3309	}
3310
3311	.dataviews-view-table.has-compact-density thead th:has(.dataviews-view-table-header-button):not(:last-child) {
3312	padding-right: 0;
3313	}
3314
3315	.dataviews-view-table.has-compact-density td,
3316	.dataviews-view-table.has-compact-density th {
3317	padding: 4px 8px;
3318	}
3319
3320	.dataviews-view-table.has-comfortable-density td,
3321	.dataviews-view-table.has-comfortable-density th {
3322	padding: 16px 12px;
3323	}
3324
3325	.dataviews-view-table.has-compact-density td.dataviews-view-table__checkbox-column,
3326	.dataviews-view-table.has-compact-density th.dataviews-view-table__checkbox-column, .dataviews-view-table.has-comfortable-density td.dataviews-view-table__checkbox-column,
3327	.dataviews-view-table.has-comfortable-density th.dataviews-view-table__checkbox-column {
3328	padding-right: 0;
3329	}
3330
3331	.dataviews-view-table-selection-checkbox {
3332	--checkbox-input-size: 24px;
3333	}
3334
3335	@media (min-width: 600px) {
3336	.dataviews-view-table-selection-checkbox {
3337	--checkbox-input-size: 16px;
3338	}
3339	}
3340	.dataviews-column-primary__media {
3341	max-width: 60px;
3342	min-width: 32px;
3343	min-height: 32px;
3344	overflow: hidden;
3345	position: relative;
3346	flex-shrink: 0;
3347	background-color: #fff;
3348	border-radius: 4px;
3349	}
3350
3351	.dataviews-column-primary__media img {
3352	width: 32px;
3353	height: 32px;
3354	object-fit: cover;
3355	}
3356
3357	.dataviews-column-primary__media::after {
3358	content: "";
3359	position: absolute;
3360	top: 0;
3361	left: 0;
3362	width: 100%;
3363	height: 100%;
3364	box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.1);
3365	border-radius: 4px;
3366	}
3367
3368	.dataviews-view-table__cell-content-wrapper:not(.dataviews-column-primary__media),
3369	.dataviews-view-table__primary-column-content:not(.dataviews-column-primary__media) {
3370	min-width: 15ch;
3371	max-width: 80ch;
3372	}
3373
3374	.dataviews-view-table__group-header-row .dataviews-view-table__group-header-cell {
3375	font-weight: 499;
3376	padding: 12px 24px;
3377	color: #1e1e1e;
3378	}
3379
3380	/* Column width intents via colgroup: make non-primary columns shrink-to-fit */
3381	.dataviews-view-table col[class^=dataviews-view-table__col-]:not(.dataviews-view-table__col-first-data) {
3382	width: 1%;
3383	}
3384
3385	.dataviews-view-picker-grid .dataviews-view-picker-grid__card {
3386	height: 100%;
3387	justify-content: flex-start;
3388	position: relative;
3389	}
3390
3391	.dataviews-view-picker-grid .dataviews-view-picker-grid__card .dataviews-view-picker-grid__title-actions {
3392	padding: 8px 0 4px;
3393	}
3394
3395	.dataviews-view-picker-grid .dataviews-view-picker-grid__card .dataviews-view-picker-grid__title-field {
3396	min-height: 24px;
3397	overflow: hidden;
3398	align-content: center;
3399	text-align: start;
3400	}
3401
3402	.dataviews-view-picker-grid .dataviews-view-picker-grid__card .dataviews-view-picker-grid__title-field--clickable {
3403	width: fit-content;
3404	}
3405
3406	.dataviews-view-picker-grid .dataviews-view-picker-grid__card.is-selected .dataviews-view-picker-grid__fields .dataviews-view-picker-grid__field .dataviews-view-picker-grid__field-value {
3407	color: #1e1e1e;
3408	}
3409
3410	.dataviews-view-picker-grid .dataviews-view-picker-grid__card.is-selected .dataviews-view-picker-grid__media::after,
3411	.dataviews-view-picker-grid .dataviews-view-picker-grid__card .dataviews-view-picker-grid__media:focus::after {
3412	background-color: rgba(var(--wp-admin-theme-color--rgb), 0.08);
3413	}
3414
3415	.dataviews-view-picker-grid .dataviews-view-picker-grid__card.is-selected .dataviews-view-picker-grid__media::after {
3416	box-shadow: inset 0 0 0 1px var(--wp-admin-theme-color);
3417	}
3418
3419	.dataviews-view-picker-grid .dataviews-view-picker-grid__card .dataviews-view-picker-grid__media:focus::after {
3420	box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
3421	}
3422
3423	.dataviews-view-picker-grid:focus-visible[aria-activedescendant] {
3424	outline: none;
3425	}
3426
3427	.dataviews-view-picker-grid:focus-visible [data-active-item=true] {
3428	outline: 2px solid var(--wp-admin-theme-color);
3429	}
3430
3431	.dataviews-view-picker-grid .dataviews-selection-checkbox {
3432	top: 8px !important;
3433	}
3434
3435	.dataviews-view-picker-grid .dataviews-selection-checkbox input {
3436	pointer-events: none;
3437	}
3438
3439	.dataviews-view-picker-grid .dataviews-view-picker-grid__media {
3440	width: 100%;
3441	aspect-ratio: 1/1;
3442	min-height: 0;
3443	background-color: #fff;
3444	border-radius: 4px;
3445	position: relative;
3446	}
3447
3448	.dataviews-view-picker-grid .dataviews-view-picker-grid__media img {
3449	object-fit: cover;
3450	width: 100%;
3451	height: 100%;
3452	}
3453
3454	.dataviews-view-picker-grid .dataviews-view-picker-grid__media::after {
3455	content: "";
3456	position: absolute;
3457	top: 0;
3458	left: 0;
3459	width: 100%;
3460	height: 100%;
3461	box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.1);
3462	border-radius: 4px;
3463	pointer-events: none;
3464	}
3465
3466	.dataviews-view-picker-grid .dataviews-view-picker-grid__fields {
3467	position: relative;
3468	font-size: 12px;
3469	line-height: 16px;
3470	}
3471
3472	.dataviews-view-picker-grid .dataviews-view-picker-grid__fields:not(:empty) {
3473	padding: 0 0 12px;
3474	}
3475
3476	.dataviews-view-picker-grid .dataviews-view-picker-grid__fields .dataviews-view-picker-grid__field-value:not(:empty) {
3477	min-height: 24px;
3478	line-height: 20px;
3479	padding-top: 2px;
3480	}
3481
3482	.dataviews-view-picker-grid .dataviews-view-picker-grid__fields .dataviews-view-picker-grid__field {
3483	min-height: 24px;
3484	align-items: center;
3485	}
3486
3487	.dataviews-view-picker-grid .dataviews-view-picker-grid__fields .dataviews-view-picker-grid__field .dataviews-view-picker-grid__field-name {
3488	width: 35%;
3489	color: #757575;
3490	overflow: hidden;
3491	text-overflow: ellipsis;
3492	white-space: nowrap;
3493	}
3494
3495	.dataviews-view-picker-grid .dataviews-view-picker-grid__fields .dataviews-view-picker-grid__field .dataviews-view-picker-grid__field-value {
3496	width: 65%;
3497	overflow: hidden;
3498	text-overflow: ellipsis;
3499	white-space: nowrap;
3500	}
3501
3502	.dataviews-view-picker-grid .dataviews-view-picker-grid__fields .dataviews-view-picker-grid__field:not(:has(.dataviews-view-picker-grid__field-value:not(:empty))) {
3503	display: none;
3504	}
3505
3506	.dataviews-view-picker-grid .dataviews-view-picker-grid__badge-fields:not(:empty) {
3507	padding-bottom: 12px;
3508	}
3509
3510	.dataviews-view-picker-grid__field-value:empty,
3511	.dataviews-view-picker-grid__field:empty {
3512	display: none;
3513	}
3514
3515	.dataviews-view-picker-grid__card .dataviews-selection-checkbox {
3516	position: absolute;
3517	top: -9999em;
3518	left: 8px;
3519	z-index: 1;
3520	}
3521
3522	@media (hover: none) {
3523	.dataviews-view-picker-grid__card .dataviews-selection-checkbox {
3524	top: 8px;
3525	}
3526	}
3527	.dataviews-view-picker-grid__card:hover .dataviews-selection-checkbox,
3528	.dataviews-view-picker-grid__card:focus-within .dataviews-selection-checkbox,
3529	.dataviews-view-picker-grid__card.is-selected .dataviews-selection-checkbox {
3530	top: 8px;
3531	}
3532
3533	.dataviews-view-picker-grid__media--clickable {
3534	cursor: pointer;
3535	}
3536
3537	.dataviews-view-picker-grid-group__header {
3538	font-size: 15px;
3539	font-weight: 499;
3540	color: #1e1e1e;
3541	margin: 0 0 8px 0;
3542	padding: 0 48px;
3543	}
3544
3545	.dataviews-view-picker-table {
3546	background-color: inherit;
3547	}
3548
3549	.dataviews-view-picker-table .dataviews-view-table__checkbox-column {
3550	width: 48px;
3551	}
3552
3553	.dataviews-view-picker-table tbody:focus-visible[aria-activedescendant] {
3554	outline: none;
3555	}
3556
3557	.dataviews-view-picker-table tbody:focus-visible [data-active-item=true] {
3558	outline: 2px solid var(--wp-admin-theme-color);
3559	}
3560
3561	.dataviews-view-picker-table .dataviews-selection-checkbox .components-checkbox-control__input.components-checkbox-control__input {
3562	pointer-events: none;
3563	opacity: 1;
3564	}
3565
3566	.dataviews-view-picker-table .dataviews-view-table__row {
3567	cursor: pointer;
3568	}
3569
3570	.dataviews-view-picker-table .dataviews-view-table__row.is-selected {
3571	background-color: rgba(var(--wp-admin-theme-color--rgb), 0.04);
3572	}
3573
3574	.dataviews-view-picker-table .dataviews-view-table__row.is-hovered {
3575	background-color: rgba(var(--wp-admin-theme-color--rgb), 0.08);
3576	}
3577
3578	.dataviews-view-picker-table .dataviews-view-table__row.is-selected.is-hovered {
3579	background-color: rgba(var(--wp-admin-theme-color--rgb), 0.12);
3580	}
3581
3582	.dataviews-view-activity {
3583	margin: 0 0 auto;
3584	padding: 8px 24px;
3585	}
3586
3587	.dataviews-view-activity .dataviews-view-activity__group-header {
3588	font-size: 15px;
3589	font-weight: 499;
3590	color: #949494;
3591	margin: 0 0 8px 0;
3592	padding: 0;
3593	}
3594
3595	.dataviews-view-activity .dataviews-view-activity__item-actions {
3596	min-width: 24px;
3597	}
3598
3599	.dataviews-view-activity .dataviews-view-activity__item-content {
3600	flex-grow: 1;
3601	}
3602
3603	.dataviews-view-activity .dataviews-view-activity__item-content .dataviews-view-activity__item-title,
3604	.dataviews-view-activity .dataviews-view-activity__item-content .dataviews-view-activity__item-description,
3605	.dataviews-view-activity .dataviews-view-activity__item-content .dataviews-view-activity__item-fields {
3606	min-height: 16px;
3607	}
3608
3609	.dataviews-view-activity .dataviews-view-activity__item-content .dataviews-view-activity__item-title {
3610	position: relative;
3611	display: flex;
3612	align-items: center;
3613	flex: 1;
3614	overflow: hidden;
3615	}
3616
3617	.dataviews-view-activity .dataviews-view-activity__item-content .dataviews-view-activity__item-title--clickable {
3618	cursor: pointer;
3619	}
3620
3621	.dataviews-view-activity .dataviews-view-activity__item-content .dataviews-view-activity__item-title--clickable:focus-visible {
3622	outline: var(--wp-admin-border-width-focus) solid var(--wp-admin-theme-color);
3623	outline-offset: var(--wp-admin-border-width-focus);
3624	border-radius: 2px;
3625	}
3626
3627	.dataviews-view-activity .dataviews-view-activity__item-content .dataviews-view-activity__primary-actions {
3628	display: flex;
3629	width: max-content;
3630	flex: 0 0 auto;
3631	}
3632
3633	.dataviews-view-activity .dataviews-view-activity__item-content .dataviews-view-activity__primary-actions .components-button {
3634	position: relative;
3635	z-index: 1;
3636	}
3637
3638	.dataviews-view-activity .dataviews-view-activity__item-content .dataviews-view-activity__item-fields {
3639	color: #757575;
3640	display: flex;
3641	gap: 12px;
3642	row-gap: 4px;
3643	flex-wrap: wrap;
3644	}
3645
3646	.dataviews-view-activity .dataviews-view-activity__item-content .dataviews-view-activity__item-fields:empty {
3647	display: none;
3648	}
3649
3650	.dataviews-view-activity .dataviews-view-activity__item-content .dataviews-view-activity__item-fields .dataviews-view-activity__item-field:has(.dataviews-view-activity__item-field-value:empty) {
3651	display: none;
3652	}
3653
3654	.dataviews-view-activity .dataviews-view-activity__item-content .dataviews-view-activity__item-fields .dataviews-view-activity__item-field-value {
3655	display: flex;
3656	align-items: center;
3657	}
3658
3659	.dataviews-view-activity .dataviews-view-activity__item-type {
3660	align-self: stretch;
3661	flex-shrink: 0;
3662	}
3663
3664	.dataviews-view-activity .dataviews-view-activity__item-type::after {
3665	content: "";
3666	flex: 1 1 auto;
3667	width: 1px;
3668	margin: 0 auto;
3669	background-color: #ddd;
3670	}
3671
3672	.dataviews-view-activity .dataviews-view-activity__item-type::before {
3673	content: "";
3674	flex: 0 0 auto;
3675	width: 1px;
3676	margin: 0 auto;
3677	background-color: #ddd;
3678	}
3679
3680	.dataviews-view-activity .dataviews-view-activity__item.is-compact .dataviews-view-activity__item-type {
3681	width: 8px;
3682	}
3683
3684	.dataviews-view-activity .dataviews-view-activity__item.is-compact .dataviews-view-activity__item-type::before {
3685	height: 12px;
3686	}
3687
3688	.dataviews-view-activity .dataviews-view-activity__item.is-compact .dataviews-view-activity__item-type-icon {
3689	width: 11px;
3690	height: 11px;
3691	}
3692
3693	.dataviews-view-activity .dataviews-view-activity__item.is-compact .dataviews-view-activity__item-content {
3694	margin: 12px 0;
3695	}
3696
3697	.dataviews-view-activity .dataviews-view-activity__item.is-balanced .dataviews-view-activity__item-type {
3698	width: 24px;
3699	}
3700
3701	.dataviews-view-activity .dataviews-view-activity__item.is-balanced .dataviews-view-activity__item-type::before {
3702	height: 12px;
3703	}
3704
3705	.dataviews-view-activity .dataviews-view-activity__item.is-balanced .dataviews-view-activity__item-type-icon {
3706	width: 25px;
3707	height: 25px;
3708	}
3709
3710	.dataviews-view-activity .dataviews-view-activity__item.is-balanced .dataviews-view-activity__item-content {
3711	margin: 12px 0;
3712	padding-top: 8px;
3713	}
3714
3715	.dataviews-view-activity .dataviews-view-activity__item.is-comfortable .dataviews-view-activity__item-type {
3716	width: 32px;
3717	}
3718
3719	.dataviews-view-activity .dataviews-view-activity__item.is-comfortable .dataviews-view-activity__item-type::before {
3720	height: 8px;
3721	}
3722
3723	.dataviews-view-activity .dataviews-view-activity__item.is-comfortable .dataviews-view-activity__item-type-icon {
3724	width: 33px;
3725	height: 33px;
3726	}
3727
3728	.dataviews-view-activity .dataviews-view-activity__item.is-comfortable .dataviews-view-activity__item-content {
3729	margin: 8px 0 16px;
3730	padding-top: 12px;
3731	}
3732
3733	.dataviews-view-activity .dataviews-view-activity__item.is-comfortable .dataviews-view-activity__item-bullet, .dataviews-view-activity .dataviews-view-activity__item.is-balanced .dataviews-view-activity__item-bullet {
3734	width: 9px;
3735	height: 9px;
3736	position: relative;
3737	top: 50%;
3738	transform: translateY(-50%);
3739	}
3740
3741	.dataviews-view-activity .dataviews-view-activity__item:first-child .dataviews-view-activity__item-type::before {
3742	visibility: hidden;
3743	}
3744
3745	.dataviews-view-activity .dataviews-view-activity__group:last-of-type > .dataviews-view-activity__item:last-of-type .dataviews-view-activity__item-type::after, .dataviews-view-activity > .dataviews-view-activity__item:last-child .dataviews-view-activity__item-type::after {
3746	background: linear-gradient(to bottom, #ddd 0%, rgba(221, 221, 221, 0.2) 60%, rgba(221, 221, 221, 0) 100%);
3747	}
3748
3749	.dataviews-view-activity .dataviews-view-activity__item-type-icon {
3750	overflow: hidden;
3751	flex-shrink: 0;
3752	background-color: #fff;
3753	}
3754
3755	.dataviews-view-activity .dataviews-view-activity__item-type-icon img,
3756	.dataviews-view-activity .dataviews-view-activity__item-type-icon svg,
3757	.dataviews-view-activity .dataviews-view-activity__item-type-icon .dataviews-view-activity__item-bullet {
3758	display: block;
3759	width: 100%;
3760	height: 100%;
3761	margin: 0 auto;
3762	object-fit: cover;
3763	border-radius: 50%;
3764	box-sizing: border-box;
3765	box-shadow: inset 0 0 0 1px #ddd;
3766	}
3767
3768	.dataviews-view-activity .dataviews-view-activity__item-type-icon svg {
3769	padding: 4px;
3770	}
3771
3772	.dataviews-view-activity .dataviews-view-activity__item-type-icon .dataviews-view-activity__item-bullet {
3773	content: "";
3774	background-color: #ddd;
3775	}
3776
3777	.dataviews-view-activity + .dataviews-pagination {
3778	justify-content: space-between;
3779	}
3780
3781	.dataviews-picker-footer__bulk-selection {
3782	align-self: flex-start;
3783	height: 32px;
3784	}
3785
3786	.dataviews-picker-footer__actions {
3787	align-self: flex-end;
3788	}
3789
3790	.dataviews-controls__datetime {
3791	border: none;
3792	padding: 0;
3793	}
3794
3795	.dataviews-controls__relative-date-number,
3796	.dataviews-controls__relative-date-unit {
3797	flex: 1 1 50%;
3798	}
3799
3800	.dataviews-controls__date input[type=date]::-webkit-inner-spin-button,
3801	.dataviews-controls__date input[type=date]::-webkit-calendar-picker-indicator {
3802	display: none;
3803	-webkit-appearance: none;
3804	}
3805
3806	.dataviews-controls__date-range-inputs > * {
3807	min-width: 0;
3808	}
3809
3810	.dataviews-controls__date-preset {
3811	border: 1px solid #ddd;
3812	}
3813
3814	.dataviews-controls__date-preset:active {
3815	background-color: #000;
3816	}
3817
3818	.dataforms-layouts-panel__field {
3819	width: 100%;
3820	min-height: 32px;
3821	justify-content: flex-start !important;
3822	align-items: flex-start !important;
3823	}
3824
3825	.dataforms-layouts-panel__field--label-position-none {
3826	align-items: center !important;
3827	}
3828
3829	.dataforms-layouts-panel__field-label {
3830	width: 38%;
3831	flex-shrink: 0;
3832	min-height: 32px;
3833	display: flex;
3834	align-items: center;
3835	line-height: 20px;
3836	hyphens: auto;
3837	}
3838
3839	.dataforms-layouts-panel__field-label--label-position-side {
3840	align-self: center;
3841	}
3842
3843	.dataforms-layouts-panel__field-label.has-error {
3844	color: #cc1818;
3845	}
3846
3847	.dataforms-layouts-panel__field-label-error-content {
3848	cursor: help;
3849	fill: #cc1818;
3850	}
3851
3852	.dataforms-layouts-panel__field-label-error-content svg {
3853	fill: currentColor;
3854	}
3855
3856	.dataforms-layouts-panel__field-control {
3857	flex-grow: 1;
3858	min-height: 32px;
3859	display: flex;
3860	align-items: center;
3861	}
3862
3863	.dataforms-layouts-panel__field-control .components-button {
3864	max-width: 100%;
3865	text-align: left;
3866	white-space: normal;
3867	text-wrap: balance;
3868	text-wrap: pretty;
3869	min-height: 32px;
3870	}
3871
3872	.dataforms-layouts-panel__field-control.components-button.is-link[aria-disabled=true] {
3873	text-decoration: none;
3874	}
3875
3876	.dataforms-layouts-panel__field-control .components-dropdown {
3877	max-width: 100%;
3878	}
3879
3880	.dataforms-layouts-panel__field-dropdown .components-popover__content {
3881	min-width: 320px;
3882	padding: 16px;
3883	}
3884
3885	.dataforms-layouts-panel__dropdown-header {
3886	margin-bottom: 16px;
3887	}
3888
3889	.dataforms-layouts-panel__modal-footer {
3890	margin-top: 16px;
3891	}
3892
3893	.components-popover.components-dropdown__content.dataforms-layouts-panel__field-dropdown {
3894	z-index: 159990;
3895	}
3896
3897	.dataforms-layouts-panel__summary-button:empty {
3898	min-width: 160px;
3899	}
3900
3901	.dataforms-layouts-regular__field {
3902	width: 100%;
3903	min-height: 32px;
3904	justify-content: flex-start !important;
3905	align-items: flex-start !important;
3906	}
3907
3908	.dataforms-layouts-regular__field-label {
3909	width: 38%;
3910	flex-shrink: 0;
3911	min-height: 32px;
3912	display: flex;
3913	align-items: center;
3914	line-height: 20px;
3915	hyphens: auto;
3916	}
3917
3918	.dataforms-layouts-regular__field-label--label-position-side {
3919	align-self: center;
3920	}
3921
3922	.dataforms-layouts-regular__field-control {
3923	flex-grow: 1;
3924	min-height: 32px;
3925	display: flex;
3926	align-items: center;
3927	}
3928
3929	.dataforms-layouts-card__field-header-label {
3930	font-family: -apple-system, "system-ui", "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
3931	font-weight: 499;
3932	font-size: 15px;
3933	line-height: 20px;
3934	}
3935
3936	.dataforms-layouts-card__field {
3937	width: 100%;
3938	}
3939
3940	.dataforms-layouts-card__field-description {
3941	color: #757575;
3942	display: block;
3943	font-size: 13px;
3944	margin-bottom: 16px;
3945	}
3946
3947	.dataforms-layouts-card__field-summary {
3948	display: flex;
3949	flex-direction: row;
3950	gap: 16px;
3951	}
3952
3953	.dataforms-layouts-details__content {
3954	padding-top: 12px;
3955	}
3956
3957	.dataforms-layouts-row__field-control {
3958	width: 100%;
3959	}
3960
3961	.dataforms-layouts__wrapper {
3962	font-family: -apple-system, "system-ui", "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
3963	font-weight: 400;
3964	font-size: 13px;
3965	line-height: 20px;
3966	}
3967
3968	/**
3969	* Colors
3970	*/
3971	/**
3972	* SCSS Variables.
3973	*
3974	* Please use variables from this sheet to ensure consistency across the UI.
3975	* Don't add to this sheet unless you're pretty sure the value will be reused in many places.
3976	* For example, don't add rules to this sheet that affect block visuals. It's purely for UI.
3977	*/
3978	/**
3979	* Fonts & basic variables.
3980	*/
3981	/**
3982	* Typography
3983	*/
3984	/**
3985	* Grid System.
3986	* https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/
3987	*/
3988	/**
3989	* Radius scale.
3990	*/
3991	/**
3992	* Elevation scale.
3993	*/
3994	/**
3995	* Dimensions.
3996	*/
3997	/**
3998	* Mobile specific styles
3999	*/
4000	/**
4001	* Editor styles.
4002	*/
4003	/**
4004	* Block & Editor UI.
4005	*/
4006	/**
4007	* Block paddings.
4008	*/
4009	/**
4010	* React Native specific.
4011	* These variables do not appear to be used anywhere else.
4012	*/
4013	.media-editor-preview {
4014	box-sizing: border-box;
4015	display: flex;
4016	justify-content: center;
4017	align-items: center;
4018	min-height: 100%;
4019	padding: 32px;
4020	position: relative;
4021	}
4022
4023	.media-editor-preview__spinner {
4024	position: absolute;
4025	top: 50%;
4026	left: 50%;
4027	transform: translate(-50%, -50%);
4028	}
4029
4030	.media-editor-preview--loading {
4031	width: 100%;
4032	height: 100%;
4033	}
4034
4035	.media-editor-preview--image img {
4036	max-width: 100%;
4037	max-height: 100%;
4038	object-fit: contain;
4039	width: auto;
4040	height: auto;
4041	opacity: 0;
4042	}
4043
4044	@keyframes __wp-base-styles-fade-in {
4045	from {
4046	opacity: 0;
4047	}
4048	to {
4049	opacity: 1;
4050	}
4051	}
4052	@media not (prefers-reduced-motion) {
4053	.media-editor-preview--image img.loaded {
4054	animation: __wp-base-styles-fade-in 0.08s linear 0s;
4055	animation-fill-mode: forwards;
4056	}
4057	}
4058	.media-editor-preview--video video {
4059	max-width: 100%;
4060	max-height: 100%;
4061	object-fit: contain;
4062	width: auto;
4063	height: auto;
4064	}
4065
4066	.media-editor-preview--audio audio {
4067	max-width: 100%;
4068	}
4069
4070	.media-editor-preview--file {
4071	text-align: center;
4072	}
4073
4074	.media-editor-preview__file-info {
4075	background: #f0f0f0;
4076	padding: 24px;
4077	border-radius: 2px;
4078	}
4079
4080	.media-editor-preview__file-name {
4081	font-weight: 600;
4082	margin-bottom: 8px;
4083	}
4084
4085	.media-editor-preview__mime-type {
4086	color: #757575;
4087	font-size: 0.9em;
4088	margin-bottom: 16px;
4089	}
4090
4091	.media-editor-preview__download-link {
4092	display: inline-block;
4093	margin-top: 8px;
4094	}
4095
4096	.media-editor-preview--error, .media-editor-preview--empty {
4097	color: #757575;
4098	text-align: center;
4099	}
4100
4101	.media-editor-preview__url {
4102	font-size: 0.9em;
4103	color: #949494;
4104	word-break: break-all;
4105	margin-top: 8px;
4106	}
4107
4108	.editor-autocompleters__user .editor-autocompleters__no-avatar::before {
4109	/* stylelint-disable-next-line font-family-no-missing-generic-family-keyword -- dashicons don't need a generic family keyword. */
4110	font: normal 20px/1 dashicons;
4111	content: "\f110";
4112	margin-right: 5px;
4113	vertical-align: middle;
4114	}
4115	.editor-autocompleters__user .editor-autocompleters__user-avatar {
4116	margin-right: 8px;
4117	flex-grow: 0;
4118	flex-shrink: 0;
4119	max-width: none;
4120	width: 24px;
4121	height: 24px;
4122	}
4123	.editor-autocompleters__user .editor-autocompleters__user-name {
4124	white-space: nowrap;
4125	text-overflow: ellipsis;
4126	overflow: hidden;
4127	max-width: 200px;
4128	flex-shrink: 0;
4129	flex-grow: 1;
4130	}
4131	.editor-autocompleters__user .editor-autocompleters__user-slug {
4132	margin-left: 8px;
4133	white-space: nowrap;
4134	text-overflow: ellipsis;
4135	overflow: none;
4136	max-width: 100px;
4137	flex-grow: 0;
4138	flex-shrink: 0;
4139	}
4140	.editor-autocompleters__user:not(.is-primary) .editor-autocompleters__user-slug {
4141	color: #757575;
4142	}
4143
4144	.interface-interface-skeleton__sidebar:has(.editor-collab-sidebar) {
4145	box-shadow: none;
4146	}
4147	.interface-interface-skeleton__sidebar:has(.editor-collab-sidebar) .interface-complementary-area-header {
4148	display: none;
4149	}
4150
4151	.editor-collab-sidebar {
4152	height: 100%;
4153	overflow: hidden;
4154	}
4155
4156	.editor-collab-sidebar-panel {
4157	padding: 16px 16px 24px;
4158	height: 100%;
4159	overflow: hidden;
4160	}
4161
4162	.editor-collab-sidebar-panel__thread {
4163	position: relative;
4164	padding: 16px;
4165	border-radius: 8px;
4166	border: 1px solid #ddd;
4167	background-color: #f0f0f0;
4168	overflow: hidden;
4169	width: auto;
4170	}
4171	.editor-collab-sidebar-panel__thread.is-selected {
4172	background-color: #fff;
4173	box-shadow: 0 2px 3px rgba(0, 0, 0, 0.05), 0 4px 5px rgba(0, 0, 0, 0.04), 0 12px 12px rgba(0, 0, 0, 0.03), 0 16px 16px rgba(0, 0, 0, 0.02);
4174	z-index: 1;
4175	}
4176	.editor-collab-sidebar-panel__thread:focus {
4177	outline: var(--wp-admin-border-width-focus) solid var(--wp-admin-theme-color);
4178	outline-offset: calc(-1 * var(--wp-admin-border-width-focus));
4179	}
4180	.editor-collab-sidebar-panel__thread.is-floating {
4181	left: 16px;
4182	right: 16px;
4183	position: absolute;
4184	margin-top: 16px;
4185	}
4186
4187	.editor-collab-sidebar-panel__user-name {
4188	font-size: 12px;
4189	font-weight: 400;
4190	line-height: 16px;
4191	text-align: left;
4192	color: #757575;
4193	text-transform: capitalize;
4194	}
4195
4196	.editor-collab-sidebar-panel__user-time {
4197	font-size: 12px;
4198	font-weight: 400;
4199	line-height: 16px;
4200	text-align: left;
4201	color: #757575;
4202	}
4203
4204	.editor-collab-sidebar-panel__user-comment p:last-child {
4205	margin-bottom: 0;
4206	}
4207
4208	.editor-collab-sidebar-panel__user-avatar {
4209	border-radius: 50%;
4210	flex-shrink: 0;
4211	border-width: var(--wp-admin-border-width-focus);
4212	border-style: solid;
4213	padding: var(--wp-admin-border-width-focus);
4214	background: #fff;
4215	}
4216
4217	.editor-collab-sidebar-panel__comment-status {
4218	margin-left: auto;
4219	}
4220	.editor-collab-sidebar-panel__comment-status button.has-icon:not(.has-text) {
4221	min-width: 24px;
4222	padding: 0;
4223	width: 24px;
4224	height: 24px;
4225	flex-shrink: 0;
4226	}
4227
4228	.editor-collab-sidebar-panel__comment-dropdown-menu {
4229	flex-shrink: 0;
4230	}
4231
4232	.editor-collab-sidebar-panel__more-reply-separator::before, .editor-collab-sidebar-panel__more-reply-separator::after {
4233	content: "";
4234	display: block;
4235	width: 100%;
4236	height: 1px;
4237	background-color: #ddd;
4238	flex: 1;
4239	}
4240
4241	.editor-collab-sidebar-panel__more-reply-button {
4242	font-weight: 499;
4243	}
4244
4245	.editor-collab-sidebar-panel__resolution-text {
4246	font-style: italic;
4247	}
4248
4249	.editor-collab-sidebar-panel__comment-form textarea {
4250	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
4251	padding: 6px 8px;
4252	/* Fonts smaller than 16px causes mobile safari to zoom. */
4253	font-size: 16px;
4254	/* Override core line-height. To be reviewed. */
4255	line-height: normal;
4256	box-shadow: 0 0 0 transparent;
4257	border-radius: 2px;
4258	border: 1px solid #949494;
4259	}
4260	@media not (prefers-reduced-motion) {
4261	.editor-collab-sidebar-panel__comment-form textarea {
4262	transition: box-shadow 0.1s linear;
4263	}
4264	}
4265	@media (min-width: 600px) {
4266	.editor-collab-sidebar-panel__comment-form textarea {
4267	font-size: 13px;
4268	/* Override core line-height. To be reviewed. */
4269	line-height: normal;
4270	}
4271	}
4272	.editor-collab-sidebar-panel__comment-form textarea:focus {
4273	border-color: var(--wp-admin-theme-color);
4274	box-shadow: 0 0 0 0.5px var(--wp-admin-theme-color);
4275	outline: 2px solid transparent;
4276	}
4277	.editor-collab-sidebar-panel__comment-form textarea::placeholder {
4278	color: rgba(30, 30, 30, 0.62);
4279	}
4280	.editor-collab-sidebar-panel__comment-form textarea {
4281	padding: 9px 11px;
4282	line-height: 20px !important;
4283	display: block;
4284	}
4285
4286	.editor-collab-sidebar-panel__skip-to-comment,
4287	.editor-collab-sidebar-panel__skip-to-block {
4288	position: absolute;
4289	top: -9999px;
4290	right: -9999px;
4291	overflow: hidden;
4292	clip-path: inset(50%);
4293	background: #fff !important;
4294	z-index: -1;
4295	}
4296	.editor-collab-sidebar-panel__skip-to-comment:focus,
4297	.editor-collab-sidebar-panel__skip-to-block:focus {
4298	overflow: visible;
4299	clip-path: none;
4300	z-index: 1;
4301	right: 8px;
4302	}
4303
4304	.editor-collab-sidebar-panel__skip-to-comment:focus {
4305	top: 8px;
4306	}
4307
4308	.editor-collab-sidebar-panel__skip-to-block:focus {
4309	top: auto;
4310	bottom: 8px;
4311	}
4312
4313	.comment-avatar {
4314	width: 24px;
4315	border-radius: 50%;
4316	margin-left: -12px;
4317	border-width: var(--wp-admin-border-width-focus);
4318	border-style: solid;
4319	padding: var(--wp-admin-border-width-focus);
4320	background: #fff;
4321	box-sizing: border-box;
4322	}
4323	.comment-avatar:first-child {
4324	margin-left: 0;
4325	}
4326
4327	.show-icon-labels .comment-avatar-indicator {
4328	width: auto;
4329	}
4330	.show-icon-labels .comment-avatar-indicator div {
4331	display: none;
4332	}
4333	.show-icon-labels .comment-avatar-indicator::after {
4334	content: attr(aria-label);
4335	font-size: 12px;
4336	}
4337
4338	.editor-collapsible-block-toolbar {
4339	overflow: hidden;
4340	display: flex;
4341	align-items: center;
4342	height: 64px;
4343	}
4344	.editor-collapsible-block-toolbar .block-editor-block-contextual-toolbar {
4345	border-bottom: 0;
4346	height: 100%;
4347	background: transparent;
4348	}
4349	.editor-collapsible-block-toolbar .block-editor-block-toolbar {
4350	height: 100%;
4351	padding-top: 17px;
4352	}
4353	.editor-collapsible-block-toolbar .block-editor-block-toolbar .components-button:not(.block-editor-block-mover-button) {
4354	height: 32px;
4355	}
4356	.editor-collapsible-block-toolbar::after {
4357	content: "";
4358	width: 1px;
4359	height: 24px;
4360	background-color: #ddd;
4361	margin-right: 7px;
4362	}
4363	.editor-collapsible-block-toolbar .components-toolbar-group,
4364	.editor-collapsible-block-toolbar .components-toolbar {
4365	border-right: none;
4366	position: relative;
4367	}
4368	.editor-collapsible-block-toolbar .components-toolbar-group::after,
4369	.editor-collapsible-block-toolbar .components-toolbar::after {
4370	content: "";
4371	width: 1px;
4372	height: 24px;
4373	background-color: #ddd;
4374	top: 4px;
4375	position: absolute;
4376	right: -1px;
4377	}
4378	.editor-collapsible-block-toolbar .components-toolbar-group .components-toolbar-group.components-toolbar-group::after,
4379	.editor-collapsible-block-toolbar .components-toolbar .components-toolbar-group.components-toolbar-group::after {
4380	display: none;
4381	}
4382	.editor-collapsible-block-toolbar .block-editor-block-mover.is-horizontal .block-editor-block-mover-button {
4383	height: 32px;
4384	overflow: visible;
4385	}
4386	@media (min-width: 600px) {
4387	.editor-collapsible-block-toolbar .block-editor-block-mover:not(.is-horizontal) .block-editor-block-mover__move-button-container {
4388	height: 40px;
4389	position: relative;
4390	top: -4px;
4391	}
4392	}
4393	.editor-collapsible-block-toolbar.is-collapsed {
4394	display: none;
4395	}
4396
4397	.editor-block-visibility__disabled-blocks-count {
4398	border: 1px solid #ddd;
4399	border-width: 1px 0;
4400	box-shadow: -32px 0 0 0 #fff, 32px 0 0 0 #fff;
4401	padding: 8px;
4402	background-color: #fff;
4403	text-align: center;
4404	position: sticky;
4405	top: -5px;
4406	z-index: 2;
4407	}
4408	.editor-block-visibility__disabled-blocks-count ~ .block-editor-block-manager__content .block-editor-block-manager__category-title {
4409	top: 31px;
4410	}
4411	.editor-block-visibility__disabled-blocks-count .is-link {
4412	margin-left: 12px;
4413	}
4414
4415	.editor-blog-title-dropdown__content .components-popover__content {
4416	min-width: 320px;
4417	padding: 16px;
4418	}
4419
4420	.editor-document-bar {
4421	display: flex;
4422	align-items: center;
4423	height: 32px;
4424	justify-content: space-between;
4425	min-width: 0;
4426	background: #f0f0f0;
4427	border-radius: 4px;
4428	width: min(100%, 450px);
4429	}
4430	.editor-document-bar:hover {
4431	background-color: #e0e0e0;
4432	}
4433	.editor-document-bar .components-button {
4434	border-radius: 4px;
4435	}
4436	@media not (prefers-reduced-motion) {
4437	.editor-document-bar .components-button {
4438	transition: all 0.1s ease-out;
4439	}
4440	}
4441	.editor-document-bar .components-button:hover {
4442	background: #e0e0e0;
4443	}
4444	@media screen and (min-width: 782px) and (max-width: 960px) {
4445	.editor-document-bar.has-back-button .editor-document-bar__post-type-label {
4446	display: none;
4447	}
4448	}
4449
4450	.editor-document-bar__command {
4451	flex-grow: 1;
4452	color: var(--wp-block-synced-color);
4453	overflow: hidden;
4454	}
4455
4456	.editor-document-bar__title {
4457	overflow: hidden;
4458	color: #1e1e1e;
4459	margin: 0 auto;
4460	max-width: 70%;
4461	}
4462	@media (min-width: 782px) {
4463	.editor-document-bar__title {
4464	padding-left: 24px;
4465	}
4466	}
4467	.editor-document-bar__title h1 {
4468	display: flex;
4469	align-items: center;
4470	justify-content: center;
4471	font-weight: 400;
4472	white-space: nowrap;
4473	overflow: hidden;
4474	}
4475
4476	.editor-document-bar__post-title {
4477	color: currentColor;
4478	flex: 1;
4479	overflow: hidden;
4480	text-overflow: ellipsis;
4481	}
4482
4483	.editor-document-bar__post-type-label {
4484	flex: 0;
4485	color: #2f2f2f;
4486	padding-left: 4px;
4487	}
4488	@media screen and (max-width: 600px) {
4489	.editor-document-bar__post-type-label {
4490	display: none;
4491	}
4492	}
4493
4494	.editor-document-bar__shortcut {
4495	color: #2f2f2f;
4496	min-width: 24px;
4497	display: none;
4498	}
4499	@media (min-width: 782px) {
4500	.editor-document-bar__shortcut {
4501	display: initial;
4502	}
4503	}
4504
4505	.editor-document-bar__back.components-button.has-icon.has-text {
4506	min-width: 36px;
4507	flex-shrink: 0;
4508	color: #757575;
4509	gap: 0;
4510	z-index: 1;
4511	position: absolute;
4512	}
4513	.editor-document-bar__back.components-button.has-icon.has-text:hover {
4514	color: #1e1e1e;
4515	background-color: transparent;
4516	}
4517
4518	.editor-document-bar__icon-layout.editor-document-bar__icon-layout {
4519	position: absolute;
4520	margin-left: 12px;
4521	display: none;
4522	pointer-events: none;
4523	}
4524	.editor-document-bar__icon-layout.editor-document-bar__icon-layout svg {
4525	fill: #949494;
4526	}
4527	@media (min-width: 600px) {
4528	.editor-document-bar__icon-layout.editor-document-bar__icon-layout {
4529	display: flex;
4530	}
4531	}
4532
4533	.document-outline ul {
4534	margin: 0;
4535	padding: 0;
4536	}
4537
4538	.document-outline__item {
4539	display: flex;
4540	margin: 4px 0;
4541	}
4542	.document-outline__item a {
4543	text-decoration: none;
4544	}
4545	.document-outline__item .document-outline__emdash::before {
4546	color: #ddd;
4547	margin-right: 4px;
4548	}
4549	.document-outline__item.is-h2 .document-outline__emdash::before {
4550	content: "—";
4551	}
4552	.document-outline__item.is-h3 .document-outline__emdash::before {
4553	content: "——";
4554	}
4555	.document-outline__item.is-h4 .document-outline__emdash::before {
4556	content: "———";
4557	}
4558	.document-outline__item.is-h5 .document-outline__emdash::before {
4559	content: "————";
4560	}
4561	.document-outline__item.is-h6 .document-outline__emdash::before {
4562	content: "—————";
4563	}
4564
4565	.document-outline__button {
4566	cursor: pointer;
4567	background: none;
4568	border: none;
4569	display: flex;
4570	align-items: flex-start;
4571	margin: 0 0 0 -1px;
4572	padding: 2px 5px 2px 1px;
4573	color: #1e1e1e;
4574	text-align: left;
4575	border-radius: 2px;
4576	}
4577	.document-outline__button[aria-disabled=true], .document-outline__button:disabled {
4578	cursor: default;
4579	color: #757575;
4580	}
4581	.document-outline__button:focus {
4582	box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
4583	outline: 2px solid transparent;
4584	}
4585
4586	.document-outline__level {
4587	background: #ddd;
4588	color: #1e1e1e;
4589	border-radius: 3px;
4590	font-size: 13px;
4591	padding: 1px 6px;
4592	margin-right: 4px;
4593	}
4594	.is-invalid .document-outline__level {
4595	background: #f0b849;
4596	}
4597
4598	.document-outline__item-content {
4599	padding: 1px 0;
4600	}
4601
4602	.editor-document-outline.has-no-headings > svg {
4603	margin-top: 28px;
4604	}
4605	.editor-document-outline.has-no-headings > p {
4606	padding-left: 32px;
4607	padding-right: 32px;
4608	}
4609	.editor-document-outline.has-no-headings {
4610	text-align: center;
4611	color: #757575;
4612	}
4613
4614	.editor-document-tools {
4615	display: inline-flex;
4616	align-items: center;
4617	}
4618	.editor-document-tools .editor-document-tools__left > .editor-history__redo,
4619	.editor-document-tools .editor-document-tools__left > .editor-history__undo {
4620	display: none;
4621	}
4622	@media (min-width: 782px) {
4623	.editor-document-tools .editor-document-tools__left > .editor-history__redo,
4624	.editor-document-tools .editor-document-tools__left > .editor-history__undo {
4625	display: inline-flex;
4626	}
4627	}
4628	.editor-document-tools .editor-document-tools__left > .editor-document-tools__inserter-toggle {
4629	display: inline-flex;
4630	}
4631	@media not (prefers-reduced-motion) {
4632	.editor-document-tools .editor-document-tools__left > .editor-document-tools__inserter-toggle svg {
4633	transition: transform cubic-bezier(0.165, 0.84, 0.44, 1) 0.2s;
4634	}
4635	}
4636	.editor-document-tools .editor-document-tools__left > .editor-document-tools__inserter-toggle.is-pressed svg {
4637	transform: rotate(45deg);
4638	}
4639	.editor-document-tools .block-editor-list-view {
4640	display: none;
4641	}
4642	@media (min-width: 600px) {
4643	.editor-document-tools .block-editor-list-view {
4644	display: flex;
4645	}
4646	}
4647	.editor-document-tools .editor-document-tools__left > .components-button.has-icon,
4648	.editor-document-tools .editor-document-tools__left > .components-dropdown > .components-button.has-icon {
4649	height: 32px;
4650	min-width: 32px;
4651	padding: 4px;
4652	}
4653	.editor-document-tools .editor-document-tools__left > .components-button.has-icon.is-pressed,
4654	.editor-document-tools .editor-document-tools__left > .components-dropdown > .components-button.has-icon.is-pressed {
4655	background: #1e1e1e;
4656	}
4657	.editor-document-tools .editor-document-tools__left > .components-button.has-icon:focus:not(:disabled),
4658	.editor-document-tools .editor-document-tools__left > .components-dropdown > .components-button.has-icon:focus:not(:disabled) {
4659	box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color), inset 0 0 0 1px #fff;
4660	outline: 1px solid transparent;
4661	}
4662	.editor-document-tools .editor-document-tools__left > .components-button.has-icon::before,
4663	.editor-document-tools .editor-document-tools__left > .components-dropdown > .components-button.has-icon::before {
4664	display: none;
4665	}
4666
4667	.editor-document-tools__left {
4668	display: inline-flex;
4669	align-items: center;
4670	gap: 8px;
4671	}
4672	.editor-document-tools__left:not(:last-child) {
4673	margin-inline-end: 8px;
4674	}
4675
4676	.show-icon-labels .editor-document-tools .editor-document-tools__left > .editor-document-tools__inserter-toggle.has-icon {
4677	width: auto;
4678	padding: 0 8px;
4679	}
4680
4681	.show-icon-labels .editor-document-tools__left > * + * {
4682	margin-left: 8px;
4683	}
4684
4685	.editor-editor-interface .entities-saved-states__panel-header {
4686	height: 65px;
4687	}
4688
4689	.editor-editor-interface .interface-interface-skeleton__content {
4690	isolation: isolate;
4691	}
4692
4693	.editor-visual-editor {
4694	flex: 1 0 auto;
4695	}
4696
4697	.components-editor-notices__dismissible,
4698	.components-editor-notices__pinned {
4699	position: relative;
4700	left: 0;
4701	top: 0;
4702	right: 0;
4703	color: #1e1e1e;
4704	}
4705	.components-editor-notices__dismissible .components-notice,
4706	.components-editor-notices__pinned .components-notice {
4707	box-sizing: border-box;
4708	border-bottom: 1px solid rgba(0, 0, 0, 0.2);
4709	padding: 0 12px;
4710	min-height: 64px;
4711	}
4712	.components-editor-notices__dismissible .components-notice .components-notice__dismiss,
4713	.components-editor-notices__pinned .components-notice .components-notice__dismiss {
4714	margin-top: 12px;
4715	}
4716
4717	.entities-saved-states__panel-header {
4718	box-sizing: border-box;
4719	background: #fff;
4720	padding-left: 16px;
4721	padding-right: 16px;
4722	height: 64px;
4723	border-bottom: 1px solid #ddd;
4724	}
4725
4726	.entities-saved-states__text-prompt {
4727	padding: 16px;
4728	padding-bottom: 4px;
4729	}
4730	.entities-saved-states__text-prompt .entities-saved-states__text-prompt--header {
4731	display: block;
4732	margin-bottom: 12px;
4733	}
4734
4735	.entities-saved-states__panel.is-inline .entities-saved-states__text-prompt {
4736	padding: 0;
4737	}
4738	.entities-saved-states__panel.is-inline .entities-saved-states__panel-body {
4739	padding-left: 0;
4740	padding-right: 0;
4741	border: 0;
4742	}
4743	.entities-saved-states__panel.is-inline .entities-saved-states__panel-body > h2 {
4744	margin-left: -16px;
4745	margin-right: -16px;
4746	margin-bottom: 0;
4747	}
4748	.entities-saved-states__panel.is-inline .entities-saved-states__panel-body > h2 button {
4749	font-size: 11px;
4750	text-transform: uppercase;
4751	}
4752	.entities-saved-states__panel.is-inline .entities-saved-states__text-prompt--header-wrapper {
4753	display: none;
4754	}
4755	.entities-saved-states__panel.is-inline .entities-saved-states__text-prompt--changes-count {
4756	margin-top: 0;
4757	margin-bottom: 8px;
4758	}
4759	.entities-saved-states__panel.is-inline .entities-saved-states__panel-footer {
4760	margin-top: 16px;
4761	}
4762
4763	.entities-saved-states__change-control {
4764	flex: 1;
4765	}
4766
4767	.entities-saved-states__changes {
4768	font-size: 13px;
4769	margin: 4px 16px 0 24px;
4770	list-style: disc;
4771	}
4772	.entities-saved-states__changes li {
4773	margin-bottom: 4px;
4774	}
4775
4776	.editor-error-boundary {
4777	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
4778	margin: auto;
4779	max-width: 780px;
4780	padding: 1em;
4781	margin-top: 64px;
4782	box-shadow: 0 5px 15px rgba(0, 0, 0, 0.08), 0 15px 27px rgba(0, 0, 0, 0.07), 0 30px 36px rgba(0, 0, 0, 0.04), 0 50px 43px rgba(0, 0, 0, 0.02);
4783	border: 1px solid #1e1e1e;
4784	border-radius: 2px;
4785	background-color: #fff;
4786	}
4787
4788	.editor-global-styles-header__description {
4789	padding: 0 16px;
4790	}
4791
4792	.editor-global-styles-header {
4793	margin-bottom: 0 !important;
4794	}
4795
4796	.editor-global-styles-sidebar {
4797	display: flex;
4798	flex-direction: column;
4799	min-height: 100%;
4800	}
4801	.editor-global-styles-sidebar__panel {
4802	flex: 1;
4803	}
4804
4805	.editor-global-styles-sidebar .editor-global-styles-sidebar__header-title {
4806	margin: 0;
4807	}
4808
4809	.editor-global-styles-sidebar .editor-global-styles-sidebar__header-actions {
4810	flex: 1;
4811	}
4812
4813	.editor-global-styles-sidebar .components-navigation__menu-title-heading {
4814	font-size: 15.6px;
4815	font-weight: 499;
4816	}
4817
4818	.editor-global-styles-sidebar .components-navigation__item > button span {
4819	font-weight: 499;
4820	}
4821
4822	.editor-global-styles-sidebar .block-editor-panel-color-gradient-settings {
4823	border: 0;
4824	}
4825
4826	.editor-global-styles-sidebar .single-column {
4827	grid-column: span 1;
4828	}
4829
4830	.editor-global-styles-sidebar .components-tools-panel .span-columns {
4831	grid-column: 1/-1;
4832	}
4833
4834	.editor-global-styles-sidebar__blocks-group {
4835	padding-top: 24px;
4836	border-top: 1px solid #e0e0e0;
4837	}
4838
4839	.editor-global-styles-sidebar__blocks-group-help {
4840	padding: 0 16px;
4841	}
4842
4843	.global-styles-ui-color-palette-panel,
4844	.global-styles-ui-gradient-palette-panel {
4845	padding: 16px;
4846	}
4847
4848	.editor-global-styles-sidebar hr {
4849	margin: 0;
4850	}
4851
4852	.show-icon-labels .editor-global-styles-sidebar__header .components-button.has-icon {
4853	width: auto;
4854	}
4855	.show-icon-labels .editor-global-styles-sidebar__header .components-button.has-icon svg {
4856	display: none;
4857	}
4858	.show-icon-labels .editor-global-styles-sidebar__header .components-button.has-icon::after {
4859	content: attr(aria-label);
4860	font-size: 12px;
4861	}
4862
4863	.editor-welcome-guide {
4864	width: 312px;
4865	}
4866	.editor-welcome-guide.guide-styles .editor-welcome-guide__image {
4867	background: #00a0d2;
4868	}
4869	.editor-welcome-guide__image {
4870	margin: 0 0 16px;
4871	}
4872	.editor-welcome-guide__image > img {
4873	display: block;
4874	max-width: 100%;
4875	object-fit: cover;
4876	}
4877	.editor-welcome-guide__heading {
4878	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
4879	font-size: 24px;
4880	line-height: 1.4;
4881	margin: 16px 0 16px 0;
4882	padding: 0 32px;
4883	}
4884	.editor-welcome-guide__text {
4885	font-size: 13px;
4886	line-height: 1.4;
4887	margin: 0 0 16px 0;
4888	padding: 0 32px;
4889	}
4890	.editor-welcome-guide__text img {
4891	vertical-align: bottom;
4892	}
4893	.editor-welcome-guide .components-button:hover svg {
4894	fill: #fff;
4895	}
4896
4897	.editor-header {
4898	box-sizing: border-box;
4899	}
4900	.editor-header *,
4901	.editor-header *::before,
4902	.editor-header *::after {
4903	box-sizing: inherit;
4904	}
4905	.editor-header {
4906	height: 64px;
4907	background: #fff;
4908	display: grid;
4909	grid-auto-flow: row;
4910	grid-template: auto/64px minmax(0, max-content) minmax(min-content, 1fr) 64px;
4911	}
4912	.editor-header:has(> .editor-header__center) {
4913	grid-template: auto/64px min-content 1fr min-content 64px;
4914	}
4915	@media (min-width: 782px) {
4916	.editor-header:has(> .editor-header__center) {
4917	grid-template: auto/64px minmax(min-content, 2fr) 2.5fr minmax(min-content, 2fr) 64px;
4918	}
4919	}
4920	@media (min-width: 480px) {
4921	.editor-header {
4922	gap: 16px;
4923	}
4924	}
4925	.editor-header {
4926	align-items: center;
4927	max-width: 100vw;
4928	justify-content: space-between;
4929	}
4930	@media (min-width: 280px) {
4931	.editor-header {
4932	flex-wrap: nowrap;
4933	}
4934	}
4935
4936	.editor-header__toolbar {
4937	grid-column: 1/3;
4938	}
4939	.editor-header__toolbar > :first-child {
4940	margin-inline: 16px 0;
4941	}
4942	.editor-header__back-button + .editor-header__toolbar {
4943	grid-column: 2/3;
4944	}
4945	@media (min-width: 480px) {
4946	.editor-header__back-button + .editor-header__toolbar > :first-child {
4947	margin-inline: 0;
4948	}
4949	}
4950	.editor-header__toolbar {
4951	display: flex;
4952	min-width: 0;
4953	align-items: center;
4954	clip-path: inset(-2px);
4955	}
4956	@media (min-width: 480px) {
4957	.editor-header__toolbar {
4958	clip-path: none;
4959	}
4960	}
4961	.editor-header__toolbar .table-of-contents {
4962	display: none;
4963	}
4964	@media (min-width: 600px) {
4965	.editor-header__toolbar .table-of-contents {
4966	display: block;
4967	}
4968	}
4969	.editor-header__toolbar .editor-collapsible-block-toolbar {
4970	margin-inline: 8px 0;
4971	}
4972	.editor-header__toolbar .editor-collapsible-block-toolbar.is-collapsed ~ .editor-collapsible-block-toolbar__toggle {
4973	margin-inline: 8px 0;
4974	}
4975
4976	.editor-header__center {
4977	grid-column: 3/4;
4978	display: flex;
4979	justify-content: center;
4980	align-items: center;
4981	min-width: 0;
4982	clip-path: inset(-2px);
4983	}
4984	@media (max-width: 479px) {
4985	.editor-header__center > :first-child {
4986	margin-inline-start: 8px;
4987	}
4988	.editor-header__center > :last-child {
4989	margin-inline-end: 8px;
4990	}
4991	}
4992	.editor-revisions-header .editor-header__center {
4993	clip-path: none;
4994	}
4995
4996	/**
4997	* Buttons on the right side
4998	*/
4999	.editor-header__settings {
5000	grid-column: 3/-1;
5001	}
5002	.editor-header:has(> .editor-header__center) .editor-header__settings {
5003	grid-column: 4/-1;
5004	}
5005	.editor-header__settings {
5006	justify-self: end;
5007	display: inline-flex;
5008	align-items: center;
5009	flex-wrap: nowrap;
5010	padding-right: 4px;
5011	}
5012	@media (min-width: 600px) {
5013	.editor-header__settings {
5014	padding-right: 8px;
5015	}
5016	}
5017	.editor-header__settings {
5018	gap: 8px;
5019	}
5020
5021	/**
5022	* Show icon labels.
5023	*/
5024	.show-icon-labels.interface-pinned-items .components-button.has-icon,
5025	.show-icon-labels .editor-header .components-button.has-icon {
5026	width: auto;
5027	}
5028	.show-icon-labels.interface-pinned-items .components-button.has-icon svg,
5029	.show-icon-labels .editor-header .components-button.has-icon svg {
5030	display: none;
5031	}
5032	.show-icon-labels.interface-pinned-items .components-button.has-icon::after,
5033	.show-icon-labels .editor-header .components-button.has-icon::after {
5034	content: attr(aria-label);
5035	white-space: nowrap;
5036	}
5037	.show-icon-labels.interface-pinned-items .components-button.has-icon[aria-disabled=true],
5038	.show-icon-labels .editor-header .components-button.has-icon[aria-disabled=true] {
5039	background-color: transparent;
5040	}
5041	.show-icon-labels.interface-pinned-items .is-tertiary:active,
5042	.show-icon-labels .editor-header .is-tertiary:active {
5043	box-shadow: 0 0 0 1.5px var(--wp-admin-theme-color);
5044	background-color: transparent;
5045	}
5046	.show-icon-labels.interface-pinned-items .components-button.has-icon.button-toggle svg,
5047	.show-icon-labels .editor-header .components-button.has-icon.button-toggle svg {
5048	display: block;
5049	}
5050	.show-icon-labels.interface-pinned-items .components-button.has-icon.button-toggle::after,
5051	.show-icon-labels .editor-header .components-button.has-icon.button-toggle::after {
5052	content: none;
5053	}
5054	.show-icon-labels.interface-pinned-items .components-menu-items-choice .components-menu-items__item-icon.components-menu-items__item-icon,
5055	.show-icon-labels .editor-header .components-menu-items-choice .components-menu-items__item-icon.components-menu-items__item-icon {
5056	display: block;
5057	}
5058	.show-icon-labels.interface-pinned-items .editor-document-tools__inserter-toggle.editor-document-tools__inserter-toggle,
5059	.show-icon-labels.interface-pinned-items .interface-pinned-items .components-button,
5060	.show-icon-labels .editor-header .editor-document-tools__inserter-toggle.editor-document-tools__inserter-toggle,
5061	.show-icon-labels .editor-header .interface-pinned-items .components-button {
5062	padding-left: 8px;
5063	padding-right: 8px;
5064	}
5065	@media (min-width: 600px) {
5066	.show-icon-labels.interface-pinned-items .editor-document-tools__inserter-toggle.editor-document-tools__inserter-toggle,
5067	.show-icon-labels.interface-pinned-items .interface-pinned-items .components-button,
5068	.show-icon-labels .editor-header .editor-document-tools__inserter-toggle.editor-document-tools__inserter-toggle,
5069	.show-icon-labels .editor-header .interface-pinned-items .components-button {
5070	padding-left: 12px;
5071	padding-right: 12px;
5072	}
5073	}
5074	.show-icon-labels.interface-pinned-items .editor-post-save-draft.editor-post-save-draft::after,
5075	.show-icon-labels.interface-pinned-items .editor-post-saved-state.editor-post-saved-state::after,
5076	.show-icon-labels .editor-header .editor-post-save-draft.editor-post-save-draft::after,
5077	.show-icon-labels .editor-header .editor-post-saved-state.editor-post-saved-state::after {
5078	content: none;
5079	}
5080
5081	.show-icon-labels .editor-header__toolbar .block-editor-block-mover {
5082	border-left: none;
5083	}
5084	.show-icon-labels .editor-header__toolbar .block-editor-block-mover::before {
5085	content: "";
5086	width: 1px;
5087	height: 24px;
5088	background-color: #ddd;
5089	margin-top: 4px;
5090	margin-left: 8px;
5091	}
5092	.show-icon-labels .editor-header__toolbar .block-editor-block-mover .block-editor-block-mover__move-button-container::before {
5093	width: calc(100% - 24px);
5094	background: #ddd;
5095	left: calc(50% + 1px);
5096	}
5097
5098	.show-icon-labels.interface-pinned-items {
5099	padding: 6px 12px 12px;
5100	margin-top: 0;
5101	margin-bottom: 0;
5102	margin-left: -12px;
5103	margin-right: -12px;
5104	border-bottom: 1px solid #ccc;
5105	display: block;
5106	}
5107	.show-icon-labels.interface-pinned-items > .components-button.has-icon {
5108	margin: 0;
5109	padding: 6px 6px 6px 8px;
5110	width: 14.625rem;
5111	justify-content: flex-start;
5112	}
5113	.show-icon-labels.interface-pinned-items > .components-button.has-icon[aria-expanded=true] svg {
5114	display: block;
5115	max-width: 24px;
5116	}
5117	.show-icon-labels.interface-pinned-items > .components-button.has-icon[aria-expanded=false] {
5118	padding-left: 40px;
5119	}
5120	.show-icon-labels.interface-pinned-items > .components-button.has-icon svg {
5121	margin-right: 8px;
5122	}
5123
5124	@media (min-width: 480px) {
5125	.editor-header__post-preview-button {
5126	display: none;
5127	}
5128	}
5129
5130	.editor-editor-interface.is-distraction-free .interface-interface-skeleton__header {
5131	border-bottom: none;
5132	}
5133	.editor-editor-interface.is-distraction-free .editor-header {
5134	background-color: #fff;
5135	width: 100%;
5136	}
5137	@media (min-width: 782px) {
5138	.editor-editor-interface.is-distraction-free .editor-header {
5139	box-shadow: 0 1px 0 0 rgba(0, 0, 0, 0.133);
5140	position: absolute;
5141	}
5142	}
5143	.editor-editor-interface.is-distraction-free .editor-header > .edit-post-header__settings > .edit-post-header__post-preview-button {
5144	visibility: hidden;
5145	}
5146	.editor-editor-interface.is-distraction-free .editor-header > .editor-header__toolbar .editor-document-tools__document-overview-toggle, .editor-editor-interface.is-distraction-free .editor-header > .editor-header__settings > .editor-preview-dropdown, .editor-editor-interface.is-distraction-free .editor-header > .editor-header__settings > .interface-pinned-items, .editor-editor-interface.is-distraction-free .editor-header > .editor-header__settings > .editor-zoom-out-toggle {
5147	display: none;
5148	}
5149	.editor-editor-interface.is-distraction-free .interface-interface-skeleton__header:focus-within {
5150	opacity: 1 !important;
5151	}
5152	.editor-editor-interface.is-distraction-free .interface-interface-skeleton__header:focus-within div {
5153	transform: translateX(0) translateZ(0) !important;
5154	}
5155	.editor-editor-interface.is-distraction-free .components-editor-notices__dismissible {
5156	position: absolute;
5157	z-index: 35;
5158	}
5159
5160	.components-popover.more-menu-dropdown__content {
5161	z-index: 99998;
5162	}
5163
5164	.editor-inserter-sidebar {
5165	box-sizing: border-box;
5166	}
5167	.editor-inserter-sidebar *,
5168	.editor-inserter-sidebar *::before,
5169	.editor-inserter-sidebar *::after {
5170	box-sizing: inherit;
5171	}
5172	.editor-inserter-sidebar {
5173	height: 100%;
5174	display: flex;
5175	flex-direction: column;
5176	}
5177
5178	.editor-inserter-sidebar__content {
5179	height: 100%;
5180	}
5181
5182	.editor-keyboard-shortcut-help-modal__section {
5183	margin: 0 0 2rem 0;
5184	}
5185	.editor-keyboard-shortcut-help-modal__section-title {
5186	font-size: 0.9rem;
5187	font-weight: 600;
5188	}
5189	.editor-keyboard-shortcut-help-modal__shortcut {
5190	display: flex;
5191	align-items: baseline;
5192	padding: 0.6rem 0;
5193	border-top: 1px solid #ddd;
5194	margin-bottom: 0;
5195	}
5196	.editor-keyboard-shortcut-help-modal__shortcut:last-child {
5197	border-bottom: 1px solid #ddd;
5198	}
5199	.editor-keyboard-shortcut-help-modal__shortcut:empty {
5200	display: none;
5201	}
5202	.editor-keyboard-shortcut-help-modal__shortcut-term {
5203	font-weight: 600;
5204	margin: 0 0 0 1rem;
5205	text-align: right;
5206	}
5207	.editor-keyboard-shortcut-help-modal__shortcut-description {
5208	flex: 1;
5209	margin: 0;
5210	}
5211	.editor-keyboard-shortcut-help-modal__shortcut-key-combination {
5212	display: block;
5213	background: none;
5214	margin: 0;
5215	padding: 0;
5216	}
5217	.editor-keyboard-shortcut-help-modal__shortcut-key-combination + .editor-keyboard-shortcut-help-modal__shortcut-key-combination {
5218	margin-top: 10px;
5219	}
5220	.editor-keyboard-shortcut-help-modal__shortcut-key {
5221	padding: 0.25rem 0.5rem;
5222	border-radius: 8%;
5223	margin: 0 0.2rem 0 0.2rem;
5224	}
5225	.editor-keyboard-shortcut-help-modal__shortcut-key:last-child {
5226	margin: 0 0 0 0.2rem;
5227	}
5228
5229	.editor-list-view-sidebar {
5230	height: 100%;
5231	}
5232	@media (min-width: 782px) {
5233	.editor-list-view-sidebar {
5234	width: 350px;
5235	}
5236	}
5237
5238	.editor-list-view-sidebar__list-view-panel-content,
5239	.editor-list-view-sidebar__list-view-container > .document-outline {
5240	height: 100%;
5241	}
5242	.editor-list-view-sidebar__list-view-panel-content::-webkit-scrollbar,
5243	.editor-list-view-sidebar__list-view-container > .document-outline::-webkit-scrollbar {
5244	width: 12px;
5245	height: 12px;
5246	}
5247	.editor-list-view-sidebar__list-view-panel-content::-webkit-scrollbar-track,
5248	.editor-list-view-sidebar__list-view-container > .document-outline::-webkit-scrollbar-track {
5249	background-color: transparent;
5250	}
5251	.editor-list-view-sidebar__list-view-panel-content::-webkit-scrollbar-thumb,
5252	.editor-list-view-sidebar__list-view-container > .document-outline::-webkit-scrollbar-thumb {
5253	background-color: transparent;
5254	border-radius: 8px;
5255	border: 3px solid transparent;
5256	background-clip: padding-box;
5257	}
5258	.editor-list-view-sidebar__list-view-panel-content:hover::-webkit-scrollbar-thumb, .editor-list-view-sidebar__list-view-panel-content:focus::-webkit-scrollbar-thumb, .editor-list-view-sidebar__list-view-panel-content:focus-within::-webkit-scrollbar-thumb,
5259	.editor-list-view-sidebar__list-view-container > .document-outline:hover::-webkit-scrollbar-thumb,
5260	.editor-list-view-sidebar__list-view-container > .document-outline:focus::-webkit-scrollbar-thumb,
5261	.editor-list-view-sidebar__list-view-container > .document-outline:focus-within::-webkit-scrollbar-thumb {
5262	background-color: #949494;
5263	}
5264	.editor-list-view-sidebar__list-view-panel-content,
5265	.editor-list-view-sidebar__list-view-container > .document-outline {
5266	scrollbar-width: thin;
5267	scrollbar-gutter: stable both-edges;
5268	scrollbar-color: transparent transparent;
5269	}
5270	.editor-list-view-sidebar__list-view-panel-content:hover, .editor-list-view-sidebar__list-view-panel-content:focus, .editor-list-view-sidebar__list-view-panel-content:focus-within,
5271	.editor-list-view-sidebar__list-view-container > .document-outline:hover,
5272	.editor-list-view-sidebar__list-view-container > .document-outline:focus,
5273	.editor-list-view-sidebar__list-view-container > .document-outline:focus-within {
5274	scrollbar-color: #949494 transparent;
5275	}
5276	.editor-list-view-sidebar__list-view-panel-content,
5277	.editor-list-view-sidebar__list-view-container > .document-outline {
5278	will-change: transform;
5279	}
5280	@media (hover: none) {
5281	.editor-list-view-sidebar__list-view-panel-content,
5282	.editor-list-view-sidebar__list-view-container > .document-outline {
5283	scrollbar-color: #949494 transparent;
5284	}
5285	}
5286	.editor-list-view-sidebar__list-view-panel-content,
5287	.editor-list-view-sidebar__list-view-container > .document-outline {
5288	overflow: auto;
5289	scrollbar-gutter: auto;
5290	}
5291
5292	.editor-list-view-sidebar__list-view-panel-content {
5293	padding: 4px;
5294	}
5295
5296	.editor-list-view-sidebar__list-view-container {
5297	display: flex;
5298	flex-direction: column;
5299	height: 100%;
5300	}
5301	.editor-list-view-sidebar__list-view-container > .document-outline {
5302	padding: 16px;
5303	}
5304
5305	.editor-list-view-sidebar__tab-panel {
5306	height: 100%;
5307	}
5308
5309	.editor-list-view-sidebar__outline {
5310	display: flex;
5311	flex-direction: column;
5312	gap: 8px;
5313	border-bottom: 1px solid #ddd;
5314	padding: 16px;
5315	}
5316	.editor-list-view-sidebar__outline > div > span:first-child {
5317	width: 90px;
5318	display: inline-block;
5319	}
5320	.editor-list-view-sidebar__outline > div > span {
5321	font-size: 12px;
5322	line-height: 1.4;
5323	color: #757575;
5324	}
5325
5326	.editor-post-parent__panel,
5327	.editor-post-order__panel {
5328	padding-top: 8px;
5329	}
5330	.editor-post-parent__panel .editor-post-panel__row-control > div,
5331	.editor-post-order__panel .editor-post-panel__row-control > div {
5332	width: 100%;
5333	}
5334
5335	.editor-post-parent__panel-dialog .editor-post-parent,
5336	.editor-post-parent__panel-dialog .editor-post-order,
5337	.editor-post-order__panel-dialog .editor-post-parent,
5338	.editor-post-order__panel-dialog .editor-post-order {
5339	margin: 8px;
5340	}
5341	.editor-post-parent__panel-dialog .components-popover__content,
5342	.editor-post-order__panel-dialog .components-popover__content {
5343	min-width: 320px;
5344	}
5345
5346	.editor-post-author__panel {
5347	padding-top: 8px;
5348	}
5349
5350	.editor-post-author__panel .editor-post-panel__row-control > div {
5351	width: 100%;
5352	}
5353
5354	.editor-post-author__panel-dialog .editor-post-author {
5355	min-width: 248px;
5356	margin: 8px;
5357	}
5358
5359	.editor-action-modal {
5360	z-index: 1000001;
5361	}
5362
5363	.editor-post-card-panel__content {
5364	flex-grow: 1;
5365	}
5366	.editor-post-card-panel__title {
5367	width: 100%;
5368	}
5369	.editor-post-card-panel__title.editor-post-card-panel__title {
5370	font-family: -apple-system, "system-ui", "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
5371	font-weight: 499;
5372	font-size: 13px;
5373	line-height: 20px;
5374	margin: 0;
5375	display: flex;
5376	align-items: center;
5377	flex-wrap: wrap;
5378	column-gap: 8px;
5379	row-gap: 4px;
5380	word-break: break-word;
5381	}
5382	.editor-post-card-panel__icon {
5383	flex: 0 0 24px;
5384	width: 24px;
5385	height: 24px;
5386	}
5387	.editor-post-card-panel__header {
5388	display: flex;
5389	justify-content: space-between;
5390	}
5391	.editor-post-card-panel.has-description .editor-post-card-panel__header {
5392	margin-bottom: 8px;
5393	}
5394	.editor-post-card-panel .editor-post-card-panel__title-name {
5395	padding: 2px 0;
5396	}
5397	.editor-post-card-panel .editor-post-card-panel__description {
5398	color: #757575;
5399	}
5400
5401	.editor-post-content-information {
5402	color: #757575;
5403	}
5404	.editor-post-content-information .components-text {
5405	color: inherit;
5406	}
5407
5408	.editor-post-discussion__panel-dialog .editor-post-discussion {
5409	min-width: 248px;
5410	margin: 8px;
5411	}
5412
5413	.editor-post-discussion__panel-toggle .components-text {
5414	color: inherit;
5415	}
5416
5417	.editor-post-discussion__panel-dialog .components-popover__content {
5418	min-width: 320px;
5419	}
5420
5421	.editor-post-excerpt__textarea {
5422	width: 100%;
5423	margin-bottom: 10px;
5424	}
5425
5426	.editor-post-excerpt__dropdown__content .components-popover__content {
5427	min-width: 320px;
5428	padding: 16px;
5429	}
5430
5431	.editor-post-featured-image {
5432	padding: 0;
5433	}
5434	.editor-post-featured-image .hidden {
5435	display: none;
5436	}
5437	.editor-post-featured-image .components-spinner {
5438	position: absolute;
5439	top: 50%;
5440	left: 50%;
5441	margin-top: -9px;
5442	margin-left: -9px;
5443	}
5444
5445	.editor-post-featured-image__container {
5446	position: relative;
5447	}
5448	.editor-post-featured-image__container:hover .editor-post-featured-image__actions:not(.editor-post-featured-image__actions-is-requesting-image), .editor-post-featured-image__container:focus .editor-post-featured-image__actions:not(.editor-post-featured-image__actions-is-requesting-image), .editor-post-featured-image__container:focus-within .editor-post-featured-image__actions:not(.editor-post-featured-image__actions-is-requesting-image) {
5449	opacity: 1;
5450	}
5451	.editor-post-featured-image__container .editor-post-featured-image__actions.editor-post-featured-image__actions-missing-image {
5452	opacity: 1;
5453	margin-top: 16px;
5454	}
5455	.editor-post-featured-image__container .components-drop-zone__content {
5456	border-radius: 2px;
5457	}
5458	.editor-post-featured-image__container:has(.editor-post-featured-image__toggle) .components-drop-zone .components-drop-zone__content-inner {
5459	display: flex;
5460	align-items: center;
5461	gap: 8px;
5462	}
5463	.editor-post-featured-image__container:has(.editor-post-featured-image__toggle) .components-drop-zone .components-drop-zone__content-inner .components-drop-zone__content-icon {
5464	margin: 0;
5465	}
5466
5467	.editor-post-featured-image__toggle,
5468	.editor-post-featured-image__preview {
5469	width: 100%;
5470	padding: 0;
5471	box-shadow: 0 0 0 0 var(--wp-admin-theme-color);
5472	overflow: hidden;
5473	outline-offset: -1px;
5474	min-height: 40px;
5475	display: flex;
5476	justify-content: center;
5477	}
5478
5479	.editor-post-featured-image__preview {
5480	height: auto !important;
5481	outline: 1px solid rgba(0, 0, 0, 0.1);
5482	/rtl:begin:ignore/
5483	background-image: repeating-linear-gradient(45deg, #e0e0e0 25%, transparent 25%, transparent 75%, #e0e0e0 75%, #e0e0e0), repeating-linear-gradient(45deg, #e0e0e0 25%, transparent 25%, transparent 75%, #e0e0e0 75%, #e0e0e0);
5484	background-position: 0 0, 12px 12px;
5485	/rtl:end:ignore/
5486	background-size: 24px 24px;
5487	}
5488	.editor-post-featured-image__preview .editor-post-featured-image__preview-image {
5489	object-fit: cover;
5490	width: 100%;
5491	object-position: 50% 50%;
5492	aspect-ratio: 2/1;
5493	}
5494
5495	.editor-post-featured-image__toggle {
5496	box-shadow: inset 0 0 0 1px #ccc;
5497	}
5498	.editor-post-featured-image__toggle:focus:not(:disabled) {
5499	box-shadow: 0 0 0 currentColor inset, 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
5500	}
5501
5502	.editor-post-featured-image__actions:not(.editor-post-featured-image__actions-missing-image) {
5503	bottom: 0;
5504	opacity: 0;
5505	padding: 8px;
5506	position: absolute;
5507	}
5508	@media not (prefers-reduced-motion) {
5509	.editor-post-featured-image__actions:not(.editor-post-featured-image__actions-missing-image) {
5510	transition: opacity 50ms ease-out;
5511	}
5512	}
5513	.editor-post-featured-image__actions:not(.editor-post-featured-image__actions-missing-image) .editor-post-featured-image__action {
5514	backdrop-filter: blur(16px) saturate(180%);
5515	background: rgba(255, 255, 255, 0.75);
5516	}
5517	.editor-post-featured-image__actions .editor-post-featured-image__action {
5518	flex-grow: 1;
5519	justify-content: center;
5520	}
5521
5522	[class].editor-post-format__suggestion {
5523	margin: 4px 0 0 0;
5524	}
5525
5526	.editor-post-format__dialog .editor-post-format__dialog-content {
5527	min-width: 248px;
5528	margin: 8px;
5529	}
5530
5531	.editor-post-last-edited-panel {
5532	color: #757575;
5533	}
5534	.editor-post-last-edited-panel .components-text {
5535	color: inherit;
5536	}
5537
5538	.editor-post-last-revision__title {
5539	width: 100%;
5540	font-weight: 499;
5541	}
5542
5543	.editor-post-last-revision__title.components-button.has-icon {
5544	height: 100%;
5545	justify-content: space-between;
5546	}
5547	.editor-post-last-revision__title.components-button.has-icon:hover, .editor-post-last-revision__title.components-button.has-icon:active {
5548	background: #f0f0f0;
5549	}
5550	.editor-post-last-revision__title.components-button.has-icon:focus {
5551	box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
5552	border-radius: 0;
5553	}
5554
5555	.components-panel__body.is-opened.editor-post-last-revision__panel {
5556	padding: 0;
5557	height: 48px;
5558	}
5559	.components-panel__body.is-opened.editor-post-last-revision__panel .editor-post-last-revision__title.components-button.components-button {
5560	padding: 16px;
5561	}
5562
5563	.editor-private-post-last-revision__button {
5564	display: inline-block;
5565	}
5566
5567	.editor-post-locked-modal__buttons {
5568	margin-top: 24px;
5569	}
5570
5571	.editor-post-locked-modal__avatar {
5572	border-radius: 50%;
5573	margin-top: 16px;
5574	min-width: initial !important;
5575	}
5576
5577	.editor-post-panel__row {
5578	width: 100%;
5579	min-height: 32px;
5580	justify-content: flex-start !important;
5581	align-items: flex-start !important;
5582	}
5583
5584	.editor-post-panel__row-label {
5585	width: 38%;
5586	flex-shrink: 0;
5587	min-height: 32px;
5588	display: flex;
5589	align-items: center;
5590	padding: 6px 0;
5591	line-height: 20px;
5592	hyphens: auto;
5593	}
5594
5595	.editor-post-panel__row-control {
5596	flex-grow: 1;
5597	min-height: 32px;
5598	display: flex;
5599	align-items: center;
5600	}
5601	.editor-post-panel__row-control .components-button {
5602	max-width: 100%;
5603	text-align: left;
5604	white-space: normal;
5605	text-wrap: balance;
5606	text-wrap: pretty;
5607	height: auto;
5608	min-height: 32px;
5609	font-weight: 400;
5610	}
5611	.editor-post-panel__row-control .components-dropdown {
5612	max-width: 100%;
5613	}
5614
5615	.editor-post-panel__section {
5616	padding: 16px;
5617	}
5618
5619	.editor-post-publish-panel__content {
5620	min-height: calc(100% - 148px);
5621	}
5622	.editor-post-publish-panel__content > .components-spinner {
5623	display: block;
5624	margin: 100px auto 0;
5625	}
5626
5627	.editor-post-publish-panel__header {
5628	background: #fff;
5629	padding-left: 16px;
5630	padding-right: 16px;
5631	height: 65px;
5632	border-bottom: 1px solid #ddd;
5633	display: flex;
5634	align-items: center;
5635	align-content: space-between;
5636	}
5637	.editor-post-publish-panel__header .components-button {
5638	width: 100%;
5639	justify-content: center;
5640	}
5641	.editor-post-publish-panel__header .has-icon {
5642	margin-left: auto;
5643	width: auto;
5644	}
5645
5646	.components-site-card {
5647	display: flex;
5648	align-items: center;
5649	margin: 16px 0;
5650	}
5651
5652	.components-site-icon {
5653	border: none;
5654	border-radius: 2px;
5655	margin-right: 12px;
5656	flex-shrink: 0;
5657	height: 36px;
5658	width: 36px;
5659	}
5660
5661	.components-site-name {
5662	display: block;
5663	font-size: 14px;
5664	}
5665
5666	.components-site-home {
5667	display: block;
5668	color: #757575;
5669	font-size: 12px;
5670	word-break: break-word;
5671	}
5672
5673	.editor-post-publish-panel__header-publish-button,
5674	.editor-post-publish-panel__header-cancel-button {
5675	flex: 1;
5676	}
5677	@media (min-width: 480px) {
5678	.editor-post-publish-panel__header-publish-button,
5679	.editor-post-publish-panel__header-cancel-button {
5680	max-width: 160px;
5681	}
5682	}
5683
5684	.editor-post-publish-panel__header-publish-button {
5685	padding-left: 4px;
5686	justify-content: center;
5687	}
5688
5689	.editor-post-publish-panel__header-cancel-button {
5690	padding-right: 4px;
5691	}
5692
5693	.editor-post-publish-panel__header-published {
5694	flex-grow: 1;
5695	}
5696
5697	.editor-post-publish-panel__footer {
5698	padding: 16px;
5699	}
5700
5701	.components-button.editor-post-publish-panel__toggle.is-primary {
5702	display: inline-flex;
5703	align-items: center;
5704	}
5705	.components-button.editor-post-publish-panel__toggle.is-primary.is-busy .dashicon {
5706	display: none;
5707	}
5708	.components-button.editor-post-publish-panel__toggle.is-primary .dashicon {
5709	margin-right: -4px;
5710	}
5711
5712	.editor-post-publish-panel__link {
5713	font-weight: 400;
5714	padding-left: 4px;
5715	}
5716
5717	.editor-post-publish-panel__prepublish {
5718	padding: 16px;
5719	}
5720	.editor-post-publish-panel__prepublish strong {
5721	color: #1e1e1e;
5722	}
5723	.editor-post-publish-panel__prepublish .components-panel__body {
5724	background: #fff;
5725	margin-left: -16px;
5726	margin-right: -16px;
5727	}
5728	.editor-post-publish-panel__prepublish .editor-post-visibility__dialog-legend {
5729	display: none;
5730	}
5731	.editor-post-publish-panel__prepublish .components-panel__body-title .components-button {
5732	align-items: flex-start;
5733	text-wrap: balance;
5734	text-wrap: pretty;
5735	}
5736
5737	.post-publish-panel__postpublish .components-panel__body {
5738	border-bottom: 1px solid #e0e0e0;
5739	border-top: none;
5740	word-break: break-word;
5741	}
5742
5743	.post-publish-panel__postpublish-buttons {
5744	display: flex;
5745	align-content: space-between;
5746	flex-wrap: wrap;
5747	gap: 16px;
5748	}
5749	.post-publish-panel__postpublish-buttons .components-button,
5750	.post-publish-panel__postpublish-buttons .components-button.has-icon {
5751	justify-content: center;
5752	flex: 1;
5753	min-width: unset;
5754	}
5755	.post-publish-panel__postpublish-buttons .components-clipboard-button {
5756	width: 100%;
5757	}
5758
5759	.post-publish-panel__postpublish-post-address-container {
5760	display: flex;
5761	align-items: flex-end;
5762	margin-bottom: 16px;
5763	}
5764	.post-publish-panel__postpublish-post-address-container .post-publish-panel__postpublish-post-address {
5765	flex: 1;
5766	}
5767	.post-publish-panel__postpublish-post-address-container input[readonly] {
5768	padding: 12px;
5769	background: #f0f0f0;
5770	border-color: #ccc;
5771	overflow: hidden;
5772	text-overflow: ellipsis;
5773	height: 36px;
5774	}
5775
5776	.post-publish-panel__postpublish-post-address__copy-button-wrap {
5777	flex-shrink: 0;
5778	margin-left: 16px;
5779	}
5780
5781	.post-publish-panel__postpublish-header {
5782	font-weight: 499;
5783	}
5784
5785	.post-publish-panel__postpublish-subheader {
5786	margin: 0 0 8px;
5787	}
5788
5789	.post-publish-panel__tip {
5790	color: #f0b849;
5791	}
5792
5793	@media screen and (max-width: 782px) {
5794	.post-publish-panel__postpublish-post-address__button-wrap .components-button {
5795	height: 40px;
5796	}
5797	}
5798	.editor-post-publish-panel {
5799	box-sizing: border-box;
5800	}
5801	.editor-post-publish-panel *,
5802	.editor-post-publish-panel *::before,
5803	.editor-post-publish-panel *::after {
5804	box-sizing: inherit;
5805	}
5806	.editor-post-publish-panel {
5807	position: fixed;
5808	z-index: 100001;
5809	background: #fff;
5810	top: 46px;
5811	bottom: 0;
5812	right: 0;
5813	left: 0;
5814	overflow: auto;
5815	}
5816	@media (min-width: 782px) {
5817	.editor-post-publish-panel {
5818	z-index: 99998;
5819	top: 32px;
5820	left: auto;
5821	width: 281px;
5822	border-left: 1px solid #ddd;
5823	}
5824	}
5825	@media (min-width: 782px) and (not (prefers-reduced-motion)) {
5826	.editor-post-publish-panel {
5827	transform: translateX(100%);
5828	animation: editor-post-publish-panel__slide-in-animation 0.1s forwards;
5829	}
5830	}
5831	@media (min-width: 782px) {
5832	body.is-fullscreen-mode .editor-post-publish-panel {
5833	top: 0;
5834	}
5835	[role=region]:focus .editor-post-publish-panel {
5836	transform: translateX(0%);
5837	}
5838	}
5839
5840	@keyframes editor-post-publish-panel__slide-in-animation {
5841	100% {
5842	transform: translateX(0%);
5843	}
5844	}
5845	.editor-revisions-header__slider {
5846	width: 100%;
5847	}
5848	.editor-revisions-header__slider .components-range-control__tooltip {
5849	white-space: nowrap;
5850	}
5851
5852	.editor-revisions-header__no-revisions {
5853	color: #757575;
5854	font-size: 13px;
5855	}
5856
5857	.editor-revisions-canvas__loading {
5858	display: flex;
5859	align-items: center;
5860	justify-content: center;
5861	height: 100%;
5862	}
5863
5864	.editor-post-saved-state {
5865	display: flex;
5866	align-items: center;
5867	width: 28px;
5868	padding: 12px 4px;
5869	color: #757575;
5870	overflow: hidden;
5871	white-space: nowrap;
5872	}
5873	.editor-post-saved-state.is-saving[aria-disabled=true], .editor-post-saved-state.is-saving[aria-disabled=true]:hover, .editor-post-saved-state.is-saved[aria-disabled=true], .editor-post-saved-state.is-saved[aria-disabled=true]:hover {
5874	background: transparent;
5875	color: #757575;
5876	}
5877	.editor-post-saved-state svg {
5878	display: inline-block;
5879	flex: 0 0 auto;
5880	fill: currentColor;
5881	margin-right: 8px;
5882	}
5883	@media (min-width: 600px) {
5884	.editor-post-saved-state {
5885	width: auto;
5886	padding: 8px 12px;
5887	text-indent: inherit;
5888	}
5889	.editor-post-saved-state svg {
5890	margin-right: 0;
5891	}
5892	}
5893
5894	.editor-post-save-draft.has-text.has-icon svg {
5895	margin-right: 0;
5896	}
5897
5898	.editor-post-schedule__panel-dropdown {
5899	width: 100%;
5900	}
5901
5902	.editor-post-schedule__dialog .components-popover__content {
5903	min-width: 320px;
5904	padding: 16px;
5905	}
5906
5907	.editor-post-status {
5908	max-width: 100%;
5909	}
5910	.editor-post-status.is-read-only {
5911	padding: 6px 12px;
5912	}
5913	.editor-post-status .editor-post-status__toggle.editor-post-status__toggle {
5914	padding-top: 4px;
5915	padding-bottom: 4px;
5916	}
5917
5918	.editor-change-status__password-fieldset,
5919	.editor-change-status__publish-date-wrapper {
5920	border-top: 1px solid #e0e0e0;
5921	padding-top: 16px;
5922	}
5923
5924	.editor-change-status__content .components-popover__content {
5925	min-width: 320px;
5926	padding: 16px;
5927	}
5928	.editor-change-status__content .editor-change-status__password-legend {
5929	padding: 0;
5930	margin-bottom: 8px;
5931	}
5932	.editor-change-status__content p.components-base-control__help:has(.components-checkbox-control__help) {
5933	margin-top: 4px;
5934	}
5935
5936	.editor-post-sticky__checkbox-control {
5937	border-top: 1px solid #e0e0e0;
5938	padding-top: 16px;
5939	}
5940
5941	.editor-post-sync-status__value {
5942	padding: 6px 0 6px 12px;
5943	}
5944
5945	.editor-post-taxonomies__hierarchical-terms-list {
5946	max-height: 14em;
5947	overflow: auto;
5948	margin-left: -6px;
5949	padding-left: 6px;
5950	margin-top: -6px;
5951	padding-top: 6px;
5952	}
5953
5954	.editor-post-taxonomies__hierarchical-terms-choice {
5955	margin-bottom: 8px;
5956	}
5957	.editor-post-taxonomies__hierarchical-terms-choice:last-child {
5958	margin-bottom: 4px;
5959	}
5960
5961	.editor-post-taxonomies__hierarchical-terms-subchoices {
5962	margin-top: 8px;
5963	margin-left: 16px;
5964	}
5965
5966	.editor-post-taxonomies__flat-term-most-used .editor-post-taxonomies__flat-term-most-used-label {
5967	margin-bottom: 4px;
5968	}
5969
5970	.editor-post-taxonomies__flat-term-most-used-list {
5971	margin: 0;
5972	}
5973	.editor-post-taxonomies__flat-term-most-used-list li {
5974	display: inline-block;
5975	margin-right: 8px;
5976	}
5977
5978	.editor-post-template__swap-template-modal {
5979	z-index: 1000001;
5980	}
5981	.editor-post-template__swap-template-modal .editor-post-template__swap-template-search {
5982	background: #fff;
5983	position: sticky;
5984	top: 0;
5985	padding: 16px 0;
5986	transform: translateY(-4px);
5987	margin-bottom: -4px;
5988	z-index: 2;
5989	}
5990
5991	.editor-post-template__create-template-modal {
5992	z-index: 1000001;
5993	}
5994
5995	.editor-post-template__swap-template-modal-content .block-editor-block-patterns-list {
5996	column-count: 2;
5997	column-gap: 24px;
5998	padding-top: 2px;
5999	}
6000	@media (min-width: 782px) {
6001	.editor-post-template__swap-template-modal-content .block-editor-block-patterns-list {
6002	column-count: 3;
6003	}
6004	}
6005	@media (min-width: 1280px) {
6006	.editor-post-template__swap-template-modal-content .block-editor-block-patterns-list {
6007	column-count: 4;
6008	}
6009	}
6010	.editor-post-template__swap-template-modal-content .block-editor-block-patterns-list .block-editor-block-patterns-list__list-item {
6011	break-inside: avoid-column;
6012	}
6013
6014	.editor-post-template__dropdown .components-popover__content {
6015	min-width: 240px;
6016	}
6017	.editor-post-template__dropdown .components-button.is-pressed,
6018	.editor-post-template__dropdown .components-button.is-pressed:hover {
6019	background: inherit;
6020	color: inherit;
6021	}
6022
6023	@media (min-width: 782px) {
6024	.editor-post-template__create-form {
6025	width: 320px;
6026	}
6027	}
6028
6029	.editor-post-template__classic-theme-dropdown {
6030	padding: 8px;
6031	}
6032
6033	textarea.editor-post-text-editor {
6034	border: 1px solid #949494;
6035	border-radius: 0;
6036	display: block;
6037	margin: 0;
6038	width: 100%;
6039	box-shadow: none;
6040	resize: none;
6041	overflow: hidden;
6042	font-family: Menlo, Consolas, monaco, monospace;
6043	line-height: 2.4;
6044	min-height: 200px;
6045	}
6046	@media not (prefers-reduced-motion) {
6047	textarea.editor-post-text-editor {
6048	transition: border 0.1s ease-out, box-shadow 0.1s linear;
6049	}
6050	}
6051	textarea.editor-post-text-editor {
6052	padding: 16px;
6053	}
6054	@media (min-width: 600px) {
6055	textarea.editor-post-text-editor {
6056	padding: 24px;
6057	}
6058	}
6059	textarea.editor-post-text-editor {
6060	/* Fonts smaller than 16px causes mobile safari to zoom. */
6061	font-size: 16px !important;
6062	}
6063	@media (min-width: 600px) {
6064	textarea.editor-post-text-editor {
6065	font-size: 15px !important;
6066	}
6067	}
6068	textarea.editor-post-text-editor:focus {
6069	border-color: var(--wp-admin-theme-color);
6070	box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
6071	position: relative;
6072	}
6073	textarea.editor-post-text-editor::placeholder {
6074	color: rgba(30, 30, 30, 0.62);
6075	}
6076
6077	.editor-post-title.is-raw-text {
6078	margin-bottom: 24px;
6079	margin-top: 2px;
6080	max-width: none;
6081	}
6082
6083	.editor-post-url__panel-dropdown {
6084	width: 100%;
6085	}
6086
6087	.editor-post-url__panel-dialog .editor-post-url {
6088	min-width: 248px;
6089	margin: 8px;
6090	}
6091
6092	/* rtl:begin:ignore */
6093	.editor-post-url__link,
6094	.editor-post-url__front-page-link {
6095	direction: ltr;
6096	word-break: break-word;
6097	}
6098
6099	/* rtl:end:ignore */
6100	.editor-post-url__front-page-link {
6101	padding: 6px 12px;
6102	border-radius: 2px;
6103	color: var(--wp-admin-theme-color);
6104	}
6105	.editor-post-url__front-page-link:hover {
6106	background: color-mix(in srgb, var(--wp-admin-theme-color) 4%, transparent);
6107	color: var(--wp-admin-theme-color-darker-20, #183ad6);
6108	}
6109	.editor-post-url__front-page-link:focus {
6110	box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
6111	color: var(--wp-admin-theme-color);
6112	outline: 3px solid rgba(0, 0, 0, 0);
6113	}
6114
6115	.editor-post-url__link-slug {
6116	font-weight: 600;
6117	}
6118
6119	.editor-post-url__input input.components-input-control__input {
6120	padding-inline-start: 0 !important;
6121	}
6122
6123	.editor-post-url__panel-toggle,
6124	.editor-post-parent__panel-toggle {
6125	word-break: break-word;
6126	}
6127
6128	.editor-post-url__intro {
6129	margin: 0;
6130	}
6131
6132	.editor-post-url__permalink {
6133	margin-top: 8px;
6134	margin-bottom: 0;
6135	}
6136	.editor-post-url__permalink-visual-label {
6137	display: block;
6138	}
6139
6140	.editor-posts-per-page-dropdown__content .components-popover__content {
6141	min-width: 320px;
6142	padding: 16px;
6143	}
6144
6145	.editor-post-trash.components-button {
6146	flex-grow: 1;
6147	justify-content: center;
6148	}
6149
6150	.editor-preview-dropdown .editor-preview-dropdown__toggle.has-icon.has-text {
6151	padding-right: 4px;
6152	padding-left: 6px;
6153	}
6154
6155	.editor-preview-dropdown__button-external {
6156	width: 100%;
6157	display: flex;
6158	justify-content: space-between;
6159	}
6160
6161	.editor-resizable-editor.is-resizable {
6162	overflow: visible;
6163	margin: 0 auto;
6164	}
6165
6166	.editor-resizable-editor__resize-handle {
6167	position: absolute;
6168	top: 0;
6169	bottom: 0;
6170	padding: 0;
6171	margin: auto 0;
6172	width: 12px;
6173	appearance: none;
6174	cursor: ew-resize;
6175	outline: none;
6176	background: none;
6177	border-radius: 9999px;
6178	border: 0;
6179	height: 100px;
6180	}
6181	.editor-resizable-editor__resize-handle::after {
6182	position: absolute;
6183	top: 16px;
6184	left: 4px;
6185	right: 0;
6186	bottom: 16px;
6187	content: "";
6188	width: 4px;
6189	background-color: rgba(117, 117, 117, 0.4);
6190	border-radius: 9999px;
6191	}
6192	.editor-resizable-editor__resize-handle.is-left {
6193	left: -18px;
6194	}
6195	.editor-resizable-editor__resize-handle.is-right {
6196	right: -18px;
6197	}
6198	.editor-resizable-editor__resize-handle:hover, .editor-resizable-editor__resize-handle:focus, .editor-resizable-editor__resize-handle:active {
6199	opacity: 1;
6200	}
6201	.editor-resizable-editor__resize-handle:hover::after, .editor-resizable-editor__resize-handle:focus::after, .editor-resizable-editor__resize-handle:active::after {
6202	background-color: var(--wp-admin-theme-color);
6203	}
6204
6205	.editor-layout__toggle-publish-panel,
6206	.editor-layout__toggle-sidebar-panel,
6207	.editor-layout__toggle-entities-saved-states-panel {
6208	z-index: 100000;
6209	position: fixed !important;
6210	top: -9999em;
6211	bottom: auto;
6212	left: auto;
6213	right: 0;
6214	box-sizing: border-box;
6215	width: 280px;
6216	background-color: #fff;
6217	border: 1px dotted #ddd;
6218	height: auto !important;
6219	padding: 24px;
6220	display: flex;
6221	justify-content: center;
6222	}
6223
6224	.interface-interface-skeleton__actions:focus .editor-layout__toggle-entities-saved-states-panel, .interface-interface-skeleton__actions:focus-within .editor-layout__toggle-entities-saved-states-panel,
6225	.interface-interface-skeleton__actions:focus .editor-layout__toggle-publish-panel,
6226	.interface-interface-skeleton__actions:focus-within .editor-layout__toggle-publish-panel {
6227	top: auto;
6228	bottom: 0;
6229	}
6230
6231	.editor-start-page-options__modal .editor-start-page-options__modal__actions {
6232	position: absolute;
6233	bottom: 0;
6234	width: 100%;
6235	height: 72px;
6236	background-color: #fff;
6237	margin-left: -32px;
6238	margin-right: -32px;
6239	padding-left: 32px;
6240	padding-right: 32px;
6241	border-top: 1px solid #ddd;
6242	z-index: 1;
6243	}
6244	.editor-start-page-options__modal .block-editor-block-patterns-list {
6245	padding-bottom: 72px;
6246	}
6247
6248	.editor-start-page-options__modal-content .block-editor-block-patterns-list {
6249	column-count: 2;
6250	column-gap: 24px;
6251	}
6252	@media (min-width: 782px) {
6253	.editor-start-page-options__modal-content .block-editor-block-patterns-list {
6254	column-count: 3;
6255	}
6256	}
6257	@media (min-width: 1280px) {
6258	.editor-start-page-options__modal-content .block-editor-block-patterns-list {
6259	column-count: 4;
6260	}
6261	}
6262	.editor-start-page-options__modal-content .block-editor-block-patterns-list .block-editor-block-patterns-list__list-item {
6263	break-inside: avoid-column;
6264	margin-bottom: 24px;
6265	}
6266	.editor-start-page-options__modal-content .block-editor-block-patterns-list .block-editor-block-patterns-list__list-item .block-editor-block-preview__container {
6267	min-height: 100px;
6268	}
6269	.editor-start-page-options__modal-content .block-editor-block-patterns-list .block-editor-block-patterns-list__list-item .block-editor-block-preview__content {
6270	width: 100%;
6271	}
6272
6273	.editor-start-template-options__modal .editor-start-template-options__modal__actions {
6274	position: absolute;
6275	bottom: 0;
6276	width: 100%;
6277	height: 92px;
6278	background-color: #fff;
6279	margin-left: -32px;
6280	margin-right: -32px;
6281	padding-left: 32px;
6282	padding-right: 32px;
6283	border-top: 1px solid #ddd;
6284	z-index: 1;
6285	}
6286	.editor-start-template-options__modal .block-editor-block-patterns-list {
6287	padding-bottom: 92px;
6288	}
6289
6290	.editor-start-template-options__modal-content .block-editor-block-patterns-list {
6291	column-count: 2;
6292	column-gap: 24px;
6293	}
6294	@media (min-width: 782px) {
6295	.editor-start-template-options__modal-content .block-editor-block-patterns-list {
6296	column-count: 3;
6297	}
6298	}
6299	@media (min-width: 1280px) {
6300	.editor-start-template-options__modal-content .block-editor-block-patterns-list {
6301	column-count: 4;
6302	}
6303	}
6304	.editor-start-template-options__modal-content .block-editor-block-patterns-list .block-editor-block-patterns-list__list-item {
6305	break-inside: avoid-column;
6306	}
6307	.editor-start-template-options__modal-content .block-editor-block-patterns-list .block-editor-block-patterns-list__list-item .block-editor-block-patterns-list__item-title {
6308	display: none;
6309	}
6310
6311	.components-panel__header.editor-sidebar__panel-tabs {
6312	padding-left: 0;
6313	padding-right: 8px;
6314	}
6315	.components-panel__header.editor-sidebar__panel-tabs .components-button.has-icon {
6316	padding: 0;
6317	}
6318	@media (min-width: 782px) {
6319	.components-panel__header.editor-sidebar__panel-tabs .components-button.has-icon {
6320	display: flex;
6321	}
6322	}
6323
6324	.editor-post-summary .components-v-stack:empty {
6325	display: none;
6326	}
6327
6328	.editor-sidebar {
6329	box-sizing: border-box;
6330	}
6331	.editor-sidebar *,
6332	.editor-sidebar *::before,
6333	.editor-sidebar *::after {
6334	box-sizing: inherit;
6335	}
6336	.editor-sidebar__revisions-block-message {
6337	padding: 16px;
6338	color: #757575;
6339	font-size: 13px;
6340	}
6341
6342	.editor-site-discussion-dropdown__content .components-popover__content {
6343	min-width: 320px;
6344	padding: 16px;
6345	}
6346
6347	.editor-style-book {
6348	height: 100%;
6349	}
6350	.editor-style-book.is-button {
6351	border-radius: 8px;
6352	}
6353	.editor-style-book {
6354	display: flex;
6355	flex-direction: column;
6356	align-items: stretch;
6357	}
6358
6359	.editor-style-book__iframe {
6360	display: block;
6361	height: 100%;
6362	width: 100%;
6363	}
6364	.editor-style-book__iframe.is-button {
6365	border-radius: 8px;
6366	}
6367	.editor-style-book__iframe.is-focused {
6368	outline: calc(2 * var(--wp-admin-border-width-focus)) solid var(--wp-admin-theme-color);
6369	outline-offset: calc(-2 * var(--wp-admin-border-width-focus));
6370	}
6371
6372	.editor-style-book__tablist-container {
6373	flex: none;
6374	display: flex;
6375	width: 100%;
6376	padding-right: 56px;
6377	background: #fff;
6378	}
6379
6380	.editor-style-book__tabpanel {
6381	flex: 1 0 auto;
6382	overflow: auto;
6383	}
6384
6385	.editor-styles-canvas {
6386	height: 100%;
6387	padding: 16px;
6388	background-color: var(--wp-editor-canvas-background);
6389	}
6390	.editor-styles-canvas iframe {
6391	display: block;
6392	width: 100%;
6393	height: 100%;
6394	}
6395
6396	.editor-styles-canvas__section {
6397	background: #fff;
6398	border-radius: 8px;
6399	bottom: 0;
6400	left: 0;
6401	overflow: hidden;
6402	position: absolute;
6403	right: 0;
6404	top: 0;
6405	}
6406	@media not (prefers-reduced-motion) {
6407	.editor-styles-canvas__section {
6408	transition: all 0.3s;
6409	}
6410	}
6411
6412	.editor-styles-canvas__close-button {
6413	position: absolute;
6414	right: 8px;
6415	top: 8px;
6416	z-index: 2;
6417	background: #fff;
6418	}
6419
6420	.table-of-contents__popover.components-popover .components-popover__content {
6421	min-width: 380px;
6422	}
6423
6424	.components-popover.table-of-contents__popover {
6425	z-index: 99998;
6426	}
6427
6428	.table-of-contents__popover .components-popover__content {
6429	padding: 16px;
6430	}
6431	@media (min-width: 600px) {
6432	.table-of-contents__popover .components-popover__content {
6433	max-height: calc(100vh - 120px);
6434	overflow-y: auto;
6435	}
6436	}
6437	.table-of-contents__popover hr {
6438	margin: 10px -16px 0;
6439	}
6440
6441	.table-of-contents__wrapper:focus::before {
6442	content: "";
6443	display: block;
6444	position: absolute;
6445	top: 0;
6446	right: 0;
6447	bottom: 0;
6448	left: 0;
6449	box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
6450	pointer-events: none;
6451	}
6452
6453	.table-of-contents__counts {
6454	display: flex;
6455	flex-wrap: wrap;
6456	margin: 0;
6457	margin-top: -8px;
6458	}
6459
6460	.table-of-contents__count {
6461	flex-basis: 33%;
6462	display: flex;
6463	flex-direction: column;
6464	font-size: 13px;
6465	color: #1e1e1e;
6466	padding-right: 8px;
6467	margin-bottom: 0;
6468	margin-top: 8px;
6469	}
6470	.table-of-contents__count:nth-child(4n) {
6471	padding-right: 0;
6472	}
6473
6474	.table-of-contents__number,
6475	.table-of-contents__popover .word-count {
6476	font-size: 21px;
6477	font-weight: 400;
6478	line-height: 30px;
6479	color: #1e1e1e;
6480	}
6481
6482	.table-of-contents__title {
6483	display: block;
6484	margin-top: 20px;
6485	font-size: 15px;
6486	font-weight: 600;
6487	}
6488
6489	.editor-text-editor {
6490	box-sizing: border-box;
6491	}
6492	.editor-text-editor *,
6493	.editor-text-editor *::before,
6494	.editor-text-editor *::after {
6495	box-sizing: inherit;
6496	}
6497	.editor-text-editor {
6498	position: relative;
6499	width: 100%;
6500	background-color: #fff;
6501	flex-grow: 1;
6502	}
6503	.editor-text-editor .editor-post-title:not(.is-raw-text),
6504	.editor-text-editor .editor-post-title.is-raw-text textarea {
6505	max-width: none;
6506	line-height: 1.4;
6507	font-family: Menlo, Consolas, monaco, monospace;
6508	font-size: 2.5em;
6509	font-weight: normal;
6510	border: 1px solid #949494;
6511	border-radius: 0;
6512	padding: 16px;
6513	}
6514	@media (min-width: 600px) {
6515	.editor-text-editor .editor-post-title:not(.is-raw-text),
6516	.editor-text-editor .editor-post-title.is-raw-text textarea {
6517	padding: 24px;
6518	}
6519	}
6520	.editor-text-editor .editor-post-title:not(.is-raw-text):focus,
6521	.editor-text-editor .editor-post-title.is-raw-text textarea:focus {
6522	border-color: var(--wp-admin-theme-color);
6523	box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
6524	}
6525
6526	.editor-text-editor__body {
6527	width: 100%;
6528	padding: 0 12px 12px 12px;
6529	max-width: 1080px;
6530	margin-left: auto;
6531	margin-right: auto;
6532	}
6533	@media (min-width: 960px) {
6534	.editor-text-editor__body {
6535	padding: 0 24px 24px 24px;
6536	}
6537	}
6538
6539	.editor-text-editor__toolbar {
6540	position: sticky;
6541	z-index: 1;
6542	top: 0;
6543	left: 0;
6544	right: 0;
6545	display: flex;
6546	background: rgba(255, 255, 255, 0.8);
6547	padding: 4px 12px;
6548	}
6549	@media (min-width: 600px) {
6550	.editor-text-editor__toolbar {
6551	padding: 12px;
6552	}
6553	}
6554	@media (min-width: 960px) {
6555	.editor-text-editor__toolbar {
6556	padding: 12px 24px;
6557	}
6558	}
6559	.editor-text-editor__toolbar h2 {
6560	line-height: 40px;
6561	margin: 0 auto 0 0;
6562	font-size: 13px;
6563	color: #1e1e1e;
6564	}
6565
6566	.editor-visual-editor {
6567	position: relative;
6568	display: flex;
6569	background-color: var(--wp-editor-canvas-background);
6570	}
6571	.editor-visual-editor iframe[name=editor-canvas] {
6572	background-color: transparent;
6573	}
6574	.editor-visual-editor {
6575	align-items: center;
6576	}
6577	.editor-visual-editor.is-resizable {
6578	max-height: 100%;
6579	}
6580	.editor-visual-editor.has-padding {
6581	padding: 24px 24px 0;
6582	}
6583	.editor-visual-editor.is-iframed {
6584	overflow: hidden;
6585	}
6586	.editor-visual-editor .components-button {
6587	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
6588	font-size: 13px;
6589	padding: 6px 12px;
6590	}
6591	.editor-visual-editor .components-button.is-tertiary, .editor-visual-editor .components-button.has-icon {
6592	padding: 6px;
6593	}
6594
6595	.editor-fields-content-preview {
6596	display: flex;
6597	flex-direction: column;
6598	height: 100%;
6599	border-radius: 4px;
6600	}
6601	.dataviews-view-table .editor-fields-content-preview {
6602	width: 96px;
6603	flex-grow: 0;
6604	}
6605	.editor-fields-content-preview .block-editor-block-preview__container,
6606	.editor-fields-content-preview .editor-fields-content-preview__empty {
6607	margin-top: auto;
6608	margin-bottom: auto;
6609	}
6610
6611	.editor-fields-content-preview__empty {
6612	text-align: center;
6613	}
6614
6615	.editor-push-changes-to-global-styles-control .components-button {
6616	justify-content: center;
6617	width: 100%;
6618	}