← All changes | build/styles/components/style.css +464 -395 23.6.2 → 22.7.0 View file →

		@@ -68,14 +68,8 @@
68	68	/**
69	69	* Focus styles.
70	70	*/
71	71	/**
72		- * Standard focus rings for the WordPress Design System.
73		- *
74		- * Apply `outset-ring__focus` inside the relevant pseudo-class at the call site,
75		- * e.g. `&:focus { @include outset-ring__focus(); }`.
76		- */
77		-/**
78	72	* Applies editor left position to the selector passed as argument
79	73	*/
80	74	/**
81	75	* Styles that are reused verbatim in a few places
		@@ -166,9 +160,8 @@
166	160	height: auto;
167	161	min-height: 36px;
168	162	text-align: left;
169	163	width: 100%;
170		- font-weight: var(--wpds-typography-font-weight-default, 400);
171	164	}
172	165	.components-autocomplete__result.components-button:focus:not(:disabled) {
173	166	box-shadow: inset 0 0 0 1px #fff, 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
174	167	outline: 2px solid transparent;
		@@ -173,8 +166,188 @@
173	166	box-shadow: inset 0 0 0 1px #fff, 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
174	167	outline: 2px solid transparent;
175	168	}
176	169
	170	+.components-avatar {
	171	+ display: inline-flex;
	172	+ align-items: center;
	173	+ border-radius: 9999px;
	174	+ overflow: clip;
	175	+ flex-shrink: 0;
	176	+ background-color: var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9));
	177	+ box-shadow: 0 0 0 var(--wp-admin-border-width-focus) #fff, 0 1px 1px rgba(0, 0, 0, 0.03), 0 1px 2px rgba(0, 0, 0, 0.02), 0 3px 3px rgba(0, 0, 0, 0.02), 0 4px 4px rgba(0, 0, 0, 0.01);
	178	+}
	179	+
	180	+.components-avatar__image {
	181	+ box-sizing: border-box;
	182	+ position: relative;
	183	+ width: 32px;
	184	+ height: 32px;
	185	+ border-radius: 9999px;
	186	+ border: 0;
	187	+ background-color: var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9));
	188	+ overflow: clip;
	189	+ flex-shrink: 0;
	190	+ font-size: 0;
	191	+ color: #fff;
	192	+}
	193	+.is-small > .components-avatar__image {
	194	+ width: 24px;
	195	+ height: 24px;
	196	+}
	197	+.has-src > .components-avatar__image {
	198	+ background-image: var(--components-avatar-url);
	199	+ background-size: cover;
	200	+ background-position: center;
	201	+}
	202	+.has-avatar-border-color > .components-avatar__image {
	203	+ border: var(--wp-admin-border-width-focus) solid var(--components-avatar-outline-color);
	204	+ box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) #fff;
	205	+ background-clip: padding-box;
	206	+}
	207	+
	208	+.components-avatar:not(.has-src) > .components-avatar__image {
	209	+ display: flex;
	210	+ align-items: center;
	211	+ justify-content: center;
	212	+ font-size: 11px;
	213	+ font-weight: 499;
	214	+ border: 0;
	215	+ box-shadow: none;
	216	+ background-clip: border-box;
	217	+}
	218	+
	219	+.components-avatar:not(.has-src).has-avatar-border-color > .components-avatar__image {
	220	+ background-color: var(--components-avatar-outline-color);
	221	+}
	222	+
	223	+.components-avatar__name {
	224	+ font-size: 13px;
	225	+ line-height: 20px;
	226	+ color: #fff;
	227	+ min-width: 0;
	228	+ padding-bottom: 2px;
	229	+ overflow: hidden;
	230	+ opacity: 0;
	231	+ white-space: nowrap;
	232	+ transition: opacity 0.15s cubic-bezier(0.15, 0, 0.15, 1);
	233	+}
	234	+
	235	+.components-avatar.has-badge {
	236	+ display: inline-grid;
	237	+ grid-template-columns: min-content 0fr;
	238	+ column-gap: 0;
	239	+ padding-inline-end: 0;
	240	+ transition: grid-template-columns 0.3s cubic-bezier(0.15, 0, 0.15, 1), column-gap 0.3s cubic-bezier(0.15, 0, 0.15, 1), padding-inline-end 0.3s cubic-bezier(0.15, 0, 0.15, 1);
	241	+}
	242	+.components-avatar.has-badge:hover {
	243	+ grid-template-columns: min-content 1fr;
	244	+ column-gap: 4px;
	245	+ padding-inline-end: 8px;
	246	+ transition-timing-function: cubic-bezier(0.85, 0, 0.85, 1);
	247	+}
	248	+.components-avatar.has-badge:hover .components-avatar__name {
	249	+ opacity: 1;
	250	+ transition-timing-function: cubic-bezier(0.85, 0, 0.85, 1);
	251	+}
	252	+
	253	+.components-avatar.has-badge.has-avatar-border-color {
	254	+ background-color: var(--components-avatar-outline-color);
	255	+}
	256	+
	257	+.components-avatar.has-status.has-src > .components-avatar__image {
	258	+ background-image: none;
	259	+}
	260	+.components-avatar.has-status.has-src > .components-avatar__image::before {
	261	+ content: "";
	262	+ position: absolute;
	263	+ inset: 0;
	264	+ border-radius: inherit;
	265	+ background-image: var(--components-avatar-url);
	266	+ background-size: cover;
	267	+ background-position: center;
	268	+ mix-blend-mode: luminosity;
	269	+ opacity: 0.3;
	270	+}
	271	+
	272	+.components-avatar.has-status:not(.has-src) > .components-avatar__image {
	273	+ color: rgba(255, 255, 255, 0.3);
	274	+}
	275	+
	276	+.components-avatar.has-status.has-avatar-border-color > .components-avatar__image {
	277	+ background-color: var(--components-avatar-outline-color);
	278	+}
	279	+
	280	+.components-avatar__status-indicator {
	281	+ position: absolute;
	282	+ inset: 0;
	283	+ display: flex;
	284	+ align-items: center;
	285	+ justify-content: center;
	286	+ z-index: 1;
	287	+ color: #fff;
	288	+ fill: #fff;
	289	+}
	290	+.components-avatar__status-indicator svg {
	291	+ width: 75%;
	292	+ height: 75%;
	293	+}
	294	+
	295	+@media (prefers-reduced-motion: reduce) {
	296	+ .components-avatar.has-badge,
	297	+ .components-avatar__name {
	298	+ transition: none;
	299	+ }
	300	+}
	301	+.components-avatar-group {
	302	+ display: flex;
	303	+ align-items: center;
	304	+}
	305	+.components-avatar-group > .components-avatar + .components-avatar {
	306	+ margin-inline-start: -8px;
	307	+}
	308	+.components-avatar-group > .components-avatar {
	309	+ position: relative;
	310	+}
	311	+.components-avatar-group > .components-avatar:nth-child(1) {
	312	+ z-index: 10;
	313	+}
	314	+.components-avatar-group > .components-avatar:nth-child(2) {
	315	+ z-index: 9;
	316	+}
	317	+.components-avatar-group > .components-avatar:nth-child(3) {
	318	+ z-index: 8;
	319	+}
	320	+.components-avatar-group > .components-avatar:nth-child(4) {
	321	+ z-index: 7;
	322	+}
	323	+.components-avatar-group > .components-avatar:nth-child(5) {
	324	+ z-index: 6;
	325	+}
	326	+.components-avatar-group > .components-avatar:nth-child(6) {
	327	+ z-index: 5;
	328	+}
	329	+.components-avatar-group > .components-avatar:nth-child(7) {
	330	+ z-index: 4;
	331	+}
	332	+.components-avatar-group > .components-avatar:nth-child(8) {
	333	+ z-index: 3;
	334	+}
	335	+.components-avatar-group > .components-avatar:nth-child(9) {
	336	+ z-index: 2;
	337	+}
	338	+.components-avatar-group > .components-avatar:nth-child(10) {
	339	+ z-index: 1;
	340	+}
	341	+
	342	+.components-avatar-group__overflow {
	343	+ margin-inline-start: 4px;
	344	+ font-size: 12px;
	345	+ line-height: 20px;
	346	+ color: #1e1e1e;
	347	+ white-space: nowrap;
	348	+}
	349	+
177	350	.components-badge {
178	351	box-sizing: border-box;
179	352	}
180	353	.components-badge *,
		@@ -238,9 +411,9 @@
238	411	.components-button-group .components-button {
239	412	border-radius: 0;
240	413	display: inline-flex;
241	414	color: #1e1e1e;
242		- border-color: #1e1e1e;
	415	+ box-shadow: inset 0 0 0 1px #1e1e1e;
243	416	}
244	417	.components-button-group .components-button + .components-button {
245	418	margin-left: -1px;
246	419	}
		@@ -253,8 +426,11 @@
253	426	.components-button-group .components-button:focus, .components-button-group .components-button.is-primary {
254	427	position: relative;
255	428	z-index: 1;
256	429	}
	430	+.components-button-group .components-button.is-primary {
	431	+ box-shadow: inset 0 0 0 1px #1e1e1e;
	432	+}
257	433
258	434	/**
259	435	* For easier testing of potential regressions, you can use a Button variant matrix
260	436	* available in a special Storybook instance by running `npm run storybook:e2e:dev`.
		@@ -260,34 +436,33 @@
260	436	* available in a special Storybook instance by running `npm run storybook:e2e:dev`.
261	437	*
262	438	* @see https://github.com/WordPress/gutenberg/blob/trunk/test/storybook-playwright/README.md
263	439	*/
264		-.components-button:focus:is(a) {
265		- box-shadow: none;
266		-}
267		-.components-button:focus:not(:active) {
268		- outline: var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)) solid var(--wpds-color-stroke-focus, var(--wp-admin-theme-color, #3858e9));
269		- outline-offset: var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px));
270		-}
271	440	.components-button {
272	441	display: inline-flex;
273	442	text-decoration: none;
	443	+ word-break: break-word;
274	444	font-family: inherit;
275	445	font-size: 13px;
276		- font-weight: var(--wpds-typography-font-weight-emphasis, 600);
	446	+ font-weight: 499;
277	447	margin: 0;
278		- cursor: var(--wpds-cursor-control, pointer);
279		- -webkit-appearance: none;
280		- -moz-appearance: none;
281		- appearance: none;
	448	+ border: 0;
	449	+ cursor: pointer;
	450	+ appearance: none;
282	451	background: none;
	452	+}
	453	+@media not (prefers-reduced-motion) {
	454	+ .components-button {
	455	+ transition: box-shadow 0.1s linear;
	456	+ }
	457	+}
	458	+.components-button {
283	459	height: 36px;
284	460	align-items: center;
285	461	box-sizing: border-box;
286	462	padding: 4px 12px;
287	463	border-radius: 2px;
288		- color: var(--wp-components-color-foreground, var(--wpds-color-foreground-content-neutral, #1e1e1e));
289		- border: 1px solid transparent;
	464	+ color: var(--wp-components-color-foreground, #1e1e1e);
290	465	}
291	466	.components-button.is-next-40px-default-size {
292	467	height: 40px;
293	468	}
		@@ -293,8 +468,14 @@
293	468	}
294	469	.components-button[aria-expanded=true], .components-button:hover:not(:disabled, [aria-disabled=true]) {
295	470	color: var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9));
296	471	}
	472	+.components-button:focus:not(:active) {
	473	+ box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9));
	474	+}
	475	+.components-button:focus {
	476	+ outline: 3px solid transparent;
	477	+}
297	478	.components-button {
298	479	/**
299	480	* Primary button style.
300	481	*/
		@@ -301,30 +482,41 @@
301	482	}
302	483	.components-button.is-primary {
303	484	white-space: nowrap;
304	485	background: var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9));
305		- color: var(--wp-components-color-accent-inverted, var(--wpds-color-foreground-interactive-brand-strong, #fff));
	486	+ color: var(--wp-components-color-accent-inverted, #fff);
306	487	text-decoration: none;
307	488	text-shadow: none;
	489	+ outline: 1px solid transparent;
308	490	}
309	491	.components-button.is-primary:hover:not(:disabled) {
310	492	background: var(--wp-components-color-accent-darker-10, var(--wp-admin-theme-color-darker-10, #2145e6));
311		- color: var(--wp-components-color-accent-inverted, var(--wpds-color-foreground-interactive-brand-strong, #fff));
	493	+ color: var(--wp-components-color-accent-inverted, #fff);
312	494	}
313	495	.components-button.is-primary:active:not(:disabled) {
314	496	background: var(--wp-components-color-accent-darker-20, var(--wp-admin-theme-color-darker-20, #183ad6));
315		- color: var(--wp-components-color-accent-inverted, var(--wpds-color-foreground-interactive-brand-strong, #fff));
	497	+ border-color: var(--wp-components-color-accent-darker-20, var(--wp-admin-theme-color-darker-20, #183ad6));
	498	+ color: var(--wp-components-color-accent-inverted, #fff);
316	499	}
	500	+.components-button.is-primary:focus:not(:active) {
	501	+ box-shadow: inset 0 0 0 1px var(--wp-components-color-background, #fff), 0 0 0 var(--wp-admin-border-width-focus) var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9));
	502	+}
317	503	.components-button.is-primary:disabled, .components-button.is-primary:disabled:active:enabled, .components-button.is-primary[aria-disabled=true], .components-button.is-primary[aria-disabled=true]:enabled, .components-button.is-primary[aria-disabled=true]:active:enabled {
318	504	color: rgba(255, 255, 255, 0.4);
319	505	background: var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9));
	506	+ border-color: var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9));
	507	+ outline: none;
320	508	}
	509	+.components-button.is-primary:disabled:focus:enabled, .components-button.is-primary:disabled:active:enabled:focus:enabled, .components-button.is-primary[aria-disabled=true]:focus:enabled, .components-button.is-primary[aria-disabled=true]:enabled:focus:enabled, .components-button.is-primary[aria-disabled=true]:active:enabled:focus:enabled {
	510	+ box-shadow: inset 0 0 0 1px var(--wp-components-color-background, #fff), 0 0 0 var(--wp-admin-border-width-focus) var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9));
	511	+}
321	512	.components-button.is-primary.is-busy, .components-button.is-primary.is-busy:disabled, .components-button.is-primary.is-busy[aria-disabled=true] {
322		- color: var(--wp-components-color-accent-inverted, var(--wpds-color-foreground-interactive-brand-strong, #fff));
	513	+ color: var(--wp-components-color-accent-inverted, #fff);
323	514	background-size: 100px 100%;
324	515	/* stylelint-disable -- Disable reason: This function call looks nicer when each argument is on its own line. */
325	516	background-image: linear-gradient(-45deg, var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9)) 33%, var(--wp-components-color-accent-darker-20, var(--wp-admin-theme-color-darker-20, #183ad6)) 33%, var(--wp-components-color-accent-darker-20, var(--wp-admin-theme-color-darker-20, #183ad6)) 70%, var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9)) 70%);
326	517	/* stylelint-enable */
	518	+ border-color: var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9));
327	519	}
328	520	.components-button {
329	521	/**
330	522	* Secondary and tertiary buttons.
		@@ -329,8 +521,14 @@
329	521	/**
330	522	* Secondary and tertiary buttons.
331	523	*/
332	524	}
	525	+.components-button.is-secondary, .components-button.is-tertiary {
	526	+ outline: 1px solid transparent;
	527	+}
	528	+.components-button.is-secondary:active:not(:disabled), .components-button.is-tertiary:active:not(:disabled) {
	529	+ box-shadow: none;
	530	+}
333	531	.components-button.is-secondary:disabled, .components-button.is-secondary[aria-disabled=true], .components-button.is-secondary[aria-disabled=true]:hover, .components-button.is-tertiary:disabled, .components-button.is-tertiary[aria-disabled=true], .components-button.is-tertiary[aria-disabled=true]:hover {
334	532	color: #949494;
335	533	background: transparent;
336	534	transform: none;
		@@ -339,33 +537,26 @@
339	537	/**
340	538	* Secondary button style.
341	539	*/
342	540	}
343		-@media not (prefers-reduced-motion) {
344		- .components-button.is-secondary {
345		- transition: border-color 0.1s linear;
346		- }
347		-}
348	541	.components-button.is-secondary {
349		- border-color: var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9));
	542	+ box-shadow: inset 0 0 0 1px var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9)), 0 0 0 currentColor;
	543	+ outline: 1px solid transparent;
350	544	white-space: nowrap;
351	545	color: var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9));
352	546	background: transparent;
353	547	}
354		-.components-button.is-secondary:active:not(:disabled) {
355		- border-color: transparent;
356		-}
357	548	.components-button.is-secondary:hover:not(:disabled, [aria-disabled=true], .is-pressed) {
358		- border-color: var(--wp-components-color-accent-darker-20, var(--wp-admin-theme-color-darker-20, #183ad6));
	549	+ box-shadow: inset 0 0 0 1px var(--wp-components-color-accent-darker-20, var(--wp-admin-theme-color-darker-20, #183ad6));
359	550	color: var(--wp-components-color-accent-darker-20, var(--wp-admin-theme-color-darker-20, #183ad6));
360	551	background: color-mix(in srgb, var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9)) 4%, transparent);
361	552	}
	553	+.components-button.is-secondary:disabled:not(:focus), .components-button.is-secondary[aria-disabled=true]:not(:focus), .components-button.is-secondary[aria-disabled=true]:hover:not(:focus) {
	554	+ box-shadow: inset 0 0 0 1px #ddd;
	555	+}
362	556	.components-button.is-secondary:focus:not(:active) {
363		- border-color: var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9));
	557	+ box-shadow: 0 0 0 currentColor inset, 0 0 0 var(--wp-admin-border-width-focus) var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9));
364	558	}
365		-.components-button.is-secondary:disabled:not(:focus), .components-button.is-secondary[aria-disabled=true]:not(:focus), .components-button.is-secondary[aria-disabled=true]:hover:not(:focus) {
366		- border-color: var(--wpds-color-stroke-interactive-neutral-disabled, #dbdbdb);
367		-}
368	559	.components-button {
369	560	/**
370	561	* Tertiary buttons.
371	562	*/
		@@ -384,8 +575,12 @@
384	575	}
385	576	p + .components-button.is-tertiary {
386	577	margin-left: -6px;
387	578	}
	579	+.components-button.is-tertiary:disabled:not(:focus), .components-button.is-tertiary[aria-disabled=true]:not(:focus), .components-button.is-tertiary[aria-disabled=true]:hover:not(:focus) {
	580	+ box-shadow: none;
	581	+ outline: none;
	582	+}
388	583	.components-button {
389	584	/**
390	585	* Destructive buttons.
391	586	*/
		@@ -400,8 +595,11 @@
400	595	}
401	596	.components-button.is-destructive:not(.is-primary):not(.is-secondary):not(.is-tertiary):not(.is-link):hover:not(:disabled, [aria-disabled=true]) {
402	597	color: rgb(112.7368421053, 13.2631578947, 13.2631578947);
403	598	}
	599	+.components-button.is-destructive:not(.is-primary):not(.is-secondary):not(.is-tertiary):not(.is-link):focus:not(:active) {
	600	+ box-shadow: 0 0 0 var(--wp-admin-border-width-focus) #cc1818;
	601	+}
404	602	.components-button.is-destructive:not(.is-primary):not(.is-secondary):not(.is-tertiary):not(.is-link):active:not(:disabled, [aria-disabled=true]) {
405	603	background: #ccc;
406	604	}
407	605	.components-button.is-destructive:not(.is-primary):not(.is-secondary):not(.is-tertiary):not(.is-link):disabled, .components-button.is-destructive:not(.is-primary):not(.is-secondary):not(.is-tertiary):not(.is-link)[aria-disabled=true] {
		@@ -420,18 +618,17 @@
420	618	}
421	619	.components-button.is-link {
422	620	margin: 0;
423	621	padding: 0;
	622	+ box-shadow: none;
424	623	border: 0;
425	624	border-radius: 0;
426	625	background: none;
427	626	outline: none;
428	627	text-align: left;
429		- font-weight: var(--wpds-typography-font-weight-default, 400);
	628	+ font-weight: 400;
430	629	color: var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9));
431	630	text-decoration: underline;
432		- text-underline-offset: 0.2em;
433		- text-decoration-thickness: from-font;
434	631	}
435	632	@media not (prefers-reduced-motion) {
436	633	.components-button.is-link {
437	634	transition-property: border, background, color;
		@@ -441,17 +638,16 @@
441	638	}
442	639	.components-button.is-link {
443	640	height: auto;
444	641	}
445		-.components-button.is-link:focus:not(:active) {
	642	+.components-button.is-link:focus {
446	643	border-radius: 2px;
447		- text-decoration: none;
448	644	}
449	645	.components-button.is-link:disabled, .components-button.is-link[aria-disabled=true] {
450	646	color: #949494;
451	647	}
452	648	.components-button:not(:disabled, [aria-disabled=true]):active {
453		- color: var(--wp-components-color-foreground, var(--wpds-color-foreground-content-neutral, #1e1e1e));
	649	+ color: var(--wp-components-color-foreground, #1e1e1e);
454	650	}
455	651	.components-button:disabled, .components-button[aria-disabled=true] {
456	652	cursor: default;
457	653	color: #949494;
		@@ -474,9 +670,9 @@
474	670	padding: 0;
475	671	min-width: 32px;
476	672	}
477	673	.components-button.is-small {
478		- height: var(--wpds-dimension-size-sm, 24px);
	674	+ height: 24px;
479	675	line-height: 22px;
480	676	padding: 0 8px;
481	677	font-size: 11px;
482	678	}
		@@ -481,9 +677,9 @@
481	677	font-size: 11px;
482	678	}
483	679	.components-button.is-small.has-icon:not(.has-text) {
484	680	padding: 0;
485		- min-width: var(--wpds-dimension-size-sm, 24px);
	681	+ min-width: 24px;
486	682	}
487	683	.components-button.has-icon {
488	684	padding: 6px;
489	685	min-width: 36px;
		@@ -508,25 +704,27 @@
508	704	.components-button.has-icon.has-text.has-icon-right {
509	705	padding-right: 8px;
510	706	padding-left: 12px;
511	707	}
512		-.components-button.has-icon:not(.has-text) svg,
513		-.components-button.has-icon:not(.has-text) .dashicon {
514		- margin-inline: -1px;
515		-}
516	708	.components-button.is-pressed, .components-button.is-pressed:hover {
517		- color: var(--wp-components-color-foreground-inverted, var(--wpds-color-background-surface-neutral, #fcfcfc));
	709	+ color: var(--wp-components-color-foreground-inverted, #fff);
518	710	}
519	711	.components-button.is-pressed:not(:disabled, [aria-disabled=true]), .components-button.is-pressed:hover:not(:disabled, [aria-disabled=true]) {
520		- background: var(--wp-components-color-foreground, var(--wpds-color-foreground-content-neutral, #1e1e1e));
	712	+ background: var(--wp-components-color-foreground, #1e1e1e);
521	713	}
522	714	.components-button.is-pressed:disabled, .components-button.is-pressed[aria-disabled=true] {
523	715	color: #949494;
524	716	}
525	717	.components-button.is-pressed:disabled:not(.is-primary):not(.is-secondary):not(.is-tertiary), .components-button.is-pressed[aria-disabled=true]:not(.is-primary):not(.is-secondary):not(.is-tertiary) {
526		- color: var(--wp-components-color-foreground-inverted, var(--wpds-color-background-surface-neutral, #fcfcfc));
	718	+ color: var(--wp-components-color-foreground-inverted, #fff);
527	719	background: #949494;
528	720	}
	721	+.components-button.is-pressed:focus:not(:active) {
	722	+ box-shadow: inset 0 0 0 1px var(--wp-components-color-background, #fff), 0 0 0 var(--wp-admin-border-width-focus) var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9));
	723	+}
	724	+.components-button.is-pressed:focus {
	725	+ outline: 2px solid transparent;
	726	+}
529	727	.components-button svg {
530	728	fill: currentColor;
531	729	outline: none;
532	730	flex-shrink: 0;
		@@ -535,8 +733,11 @@
535	733	.components-button svg {
536	734	fill: CanvasText;
537	735	}
538	736	}
	737	+.components-button .components-visually-hidden {
	738	+ height: auto;
	739	+}
539	740
540	741	@keyframes components-button__busy-animation {
541	742	0% {
542	743	background-position: 200px 0;
		@@ -546,12 +747,12 @@
546	747	.components-calendar {
547	748	position: relative; /* Required to position the navigation toolbar. */
548	749	box-sizing: border-box;
549	750	display: inline flow-root;
550		- color: var(--wp-components-color-foreground, var(--wpds-color-foreground-content-neutral, #1e1e1e));
551		- background-color: var(--wp-components-color-background, var(--wpds-color-background-surface-neutral-strong, #fff));
	751	+ color: var(--wp-components-color-foreground, #1e1e1e);
	752	+ background-color: var(--wp-components-color-background, #fff);
552	753	font-size: 13px;
553		- font-weight: var(--wpds-typography-font-weight-default, 400);
	754	+ font-weight: 400;
554	755	z-index: 0;
555	756	}
556	757	.components-calendar *,
557	758	.components-calendar *::before,
		@@ -563,9 +764,9 @@
563	764	padding: 0;
564	765	position: relative;
565	766	}
566	767	.components-calendar__day:has(.components-calendar__day-button:disabled) {
567		- color: var(--wp-components-color-gray-400, var(--wpds-color-stroke-interactive-neutral, #8d8d8d));
	768	+ color: var(--wp-components-color-gray-400, #ccc);
568	769	}
569	770	.components-calendar__day:has(.components-calendar__day-button:hover:not(:disabled)), .components-calendar__day:has(.components-calendar__day-button:focus-visible) {
570	771	color: var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9));
571	772	}
		@@ -573,9 +774,9 @@
573	774	.components-calendar__day-button {
574	775	background: none;
575	776	padding: 0;
576	777	margin: 0;
577		- cursor: var(--wpds-cursor-control, pointer);
	778	+ cursor: pointer;
578	779	justify-content: center;
579	780	align-items: center;
580	781	display: flex;
581	782	position: relative;
		@@ -631,12 +832,10 @@
631	832	border-radius: 2px;
632	833	background: none;
633	834	padding: 0;
634	835	margin: 0;
635		- cursor: var(--wpds-cursor-control, pointer);
636		- -webkit-appearance: none;
637		- -moz-appearance: none;
638		- appearance: none;
	836	+ cursor: pointer;
	837	+ appearance: none;
639	838	display: inline-flex;
640	839	align-items: center;
641	840	justify-content: center;
642	841	position: relative;
		@@ -647,9 +846,9 @@
647	846	.components-calendar__button-next:disabled, .components-calendar__button-next[aria-disabled=true],
648	847	.components-calendar__button-previous:disabled,
649	848	.components-calendar__button-previous[aria-disabled=true] {
650	849	cursor: revert;
651		- color: var(--wp-components-color-gray-600, var(--wpds-color-stroke-interactive-neutral, #8d8d8d));
	850	+ color: var(--wp-components-color-gray-600, #949494);
652	851	}
653	852	.components-calendar__button-next:focus-visible,
654	853	.components-calendar__button-previous:focus-visible {
655	854	outline: var(--wp-admin-border-width-focus) solid var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9));
		@@ -680,9 +879,8 @@
680	879	display: flex;
681	880	justify-content: center;
682	881	flex-wrap: wrap;
683	882	gap: 16px;
684		- max-width: -moz-fit-content;
685	883	max-width: fit-content;
686	884	}
687	885
688	886	.components-calendar__month-grid {
		@@ -704,9 +902,9 @@
704	902	.components-calendar__weekday {
705	903	width: 32px;
706	904	height: 32px;
707	905	padding: 0;
708		- color: var(--wp-components-color-gray-700, var(--wpds-color-foreground-content-neutral-weak, #707070));
	906	+ color: var(--wp-components-color-gray-700, #757575);
709	907	text-align: center;
710	908	text-transform: uppercase;
711	909	}
712	910
		@@ -724,25 +922,21 @@
724	922	}
725	923
726	924	.components-calendar__day--selected:not(.components-calendar__range-middle):has(.components-calendar__day-button,
727	925	.components-calendar__day-button:hover:not(:disabled)) {
728		- color: var(--wp-components-color-foreground-inverted, var(--wpds-color-background-surface-neutral, #fcfcfc));
	926	+ color: var(--wp-components-color-foreground-inverted, #fff);
729	927	}
730	928	.components-calendar__day--selected:not(.components-calendar__range-middle) .components-calendar__day-button::before {
731		- background-color: var(--wp-components-color-foreground, var(--wpds-color-foreground-content-neutral, #1e1e1e));
	929	+ background-color: var(--wp-components-color-foreground, #1e1e1e);
732	930	border: 1px solid transparent;
733	931	}
734	932	.components-calendar__day--selected:not(.components-calendar__range-middle) .components-calendar__day-button:disabled::before {
735		- background-color: var(--wp-components-color-gray-400, var(--wpds-color-stroke-interactive-neutral, #8d8d8d));
	933	+ background-color: var(--wp-components-color-gray-600, #949494);
736	934	}
737	935	.components-calendar__day--selected:not(.components-calendar__range-middle) .components-calendar__day-button:hover:not(:disabled)::before {
738		- background-color: var(--wp-components-color-gray-800, var(--wpds-color-foreground-content-neutral, #1e1e1e));
	936	+ background-color: var(--wp-components-color-gray-800, #2f2f2f);
739	937	}
740	938
741		-.components-calendar__day--outside {
742		- color: var(--wp-components-color-gray-600, var(--wpds-color-stroke-interactive-neutral, #8d8d8d));
743		-}
744		-
745	939	.components-calendar__day--hidden {
746	940	visibility: hidden;
747	941	}
748	942
		@@ -918,12 +1112,10 @@
918	1112	}
919	1113
920	1114	.components-checkbox-control__label {
921	1115	line-height: var(--checkbox-input-size);
	1116	+ cursor: pointer;
922	1117	}
923		-.components-checkbox-control:not(:has(:disabled)) .components-checkbox-control__label {
924		- cursor: var(--wpds-cursor-control, pointer);
925		-}
926	1118
927	1119	.components-checkbox-control__input[type=checkbox] {
928	1120	border: 1px solid #1e1e1e;
929	1121	margin-right: 12px;
		@@ -928,9 +1120,9 @@
928	1120	border: 1px solid #1e1e1e;
929	1121	margin-right: 12px;
930	1122	transition: none;
931	1123	border-radius: 2px;
932		- font-family: -apple-system, system-ui, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
	1124	+ font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
933	1125	padding: 6px 8px;
934	1126	/* Fonts smaller than 16px causes mobile safari to zoom. */
935	1127	font-size: 16px;
936	1128	/* Override core line-height. To be reviewed. */
		@@ -955,11 +1147,8 @@
955	1147	border-color: var(--wp-admin-theme-color);
956	1148	box-shadow: 0 0 0 0.5px var(--wp-admin-theme-color);
957	1149	outline: 2px solid transparent;
958	1150	}
959		-.components-checkbox-control__input[type=checkbox]::-moz-placeholder {
960		- color: rgba(30, 30, 30, 0.62);
961		-}
962	1151	.components-checkbox-control__input[type=checkbox]::placeholder {
963	1152	color: rgba(30, 30, 30, 0.62);
964	1153	}
965	1154	.components-checkbox-control__input[type=checkbox]:focus {
		@@ -1010,8 +1199,9 @@
1010	1199	.components-checkbox-control__input[type=checkbox] {
1011	1200	background: #fff;
1012	1201	color: #1e1e1e;
1013	1202	clear: none;
	1203	+ cursor: pointer;
1014	1204	display: inline-block;
1015	1205	line-height: 0;
1016	1206	margin: 0 4px 0 0;
1017	1207	outline: 0;
		@@ -1019,11 +1209,9 @@
1019	1209	text-align: center;
1020	1210	vertical-align: top;
1021	1211	width: var(--checkbox-input-size);
1022	1212	height: var(--checkbox-input-size);
1023		- -webkit-appearance: none;
1024		- -moz-appearance: none;
1025		- appearance: none;
	1213	+ appearance: none;
1026	1214	}
1027	1215	@media not (prefers-reduced-motion) {
1028	1216	.components-checkbox-control__input[type=checkbox] {
1029	1217	transition: 0.1s border-color ease-in-out;
		@@ -1033,15 +1221,12 @@
1033	1221	box-shadow: 0 0 0 var(--wp-admin-border-width-focus) #fff, 0 0 0 calc(2 * var(--wp-admin-border-width-focus)) var(--wp-admin-theme-color);
1034	1222	outline: 2px solid transparent;
1035	1223	outline-offset: 2px;
1036	1224	}
1037		-.components-checkbox-control__input[type=checkbox]:not(:disabled):is(:checked, :indeterminate) {
	1225	+.components-checkbox-control__input[type=checkbox]:checked, .components-checkbox-control__input[type=checkbox]:indeterminate {
1038	1226	background: var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9));
1039	1227	border-color: var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9));
1040	1228	}
1041		-.components-checkbox-control__input[type=checkbox]:not(:disabled) {
1042		- cursor: var(--wpds-cursor-control, pointer);
1043		-}
1044	1229	.components-checkbox-control__input[type=checkbox]:checked::before {
1045	1230	content: none;
1046	1231	}
1047	1232
		@@ -1059,9 +1244,9 @@
1059	1244	svg.components-checkbox-control__checked,
1060	1245	svg.components-checkbox-control__indeterminate {
1061	1246	--checkmark-size: var(--checkbox-input-size);
1062	1247	fill: #fff;
1063		- cursor: var(--wpds-cursor-control, pointer);
	1248	+ cursor: pointer;
1064	1249	position: absolute;
1065	1250	left: 50%;
1066	1251	top: 50%;
1067	1252	transform: translate(-50%, -50%);
		@@ -1067,9 +1252,8 @@
1067	1252	transform: translate(-50%, -50%);
1068	1253	width: var(--checkmark-size);
1069	1254	height: var(--checkmark-size);
1070	1255	-webkit-user-select: none;
1071		- -moz-user-select: none;
1072	1256	user-select: none;
1073	1257	pointer-events: none;
1074	1258	}
1075	1259	@media (min-width: 600px) {
		@@ -1078,13 +1262,8 @@
1078	1262	--checkmark-size: calc(var(--checkbox-input-size) + 4px);
1079	1263	}
1080	1264	}
1081	1265
1082		-.components-checkbox-control:has(:disabled) svg.components-checkbox-control__checked,
1083		-.components-checkbox-control:has(:disabled) svg.components-checkbox-control__indeterminate {
1084		- fill: var(--wp-components-color-gray-400, var(--wpds-color-stroke-interactive-neutral, #8d8d8d));
1085		-}
1086		-
1087	1266	.components-checkbox-control__help {
1088	1267	display: inline-block;
1089	1268	margin-inline-start: calc(var(--checkbox-input-size) + var(--checkbox-input-margin));
1090	1269	}
		@@ -1092,9 +1271,8 @@
1092	1271	.components-circular-option-picker {
1093	1272	display: inline-block;
1094	1273	width: 100%;
1095	1274	min-width: 188px;
1096		- isolation: isolate;
1097	1275	}
1098	1276	.components-circular-option-picker .components-circular-option-picker__custom-clear-wrapper {
1099	1277	display: flex;
1100	1278	justify-content: flex-end;
		@@ -1141,8 +1319,9 @@
1141	1319	bottom: 1px;
1142	1320	right: 1px;
1143	1321	border-radius: 50%;
1144	1322	z-index: -1;
	1323	+ /* stylelint-disable-next-line function-url-quotes -- We need quotes for the data URL to use the SVG inline. */
1145	1324	background: url('data:image/svg+xml,%3Csvg width="28" height="28" fill="none" xmlns="http://www.w3.org/2000/svg"%3E%3Cpath d="M6 8V6H4v2h2zM8 8V6h2v2H8zM10 16H8v-2h2v2zM12 16v-2h2v2h-2zM12 18v-2h-2v2H8v2h2v-2h2zM14 18v2h-2v-2h2zM16 18h-2v-2h2v2z" fill="%23555D65"/%3E%3Cpath fill-rule="evenodd" clip-rule="evenodd" d="M18 18h2v-2h-2v-2h2v-2h-2v-2h2V8h-2v2h-2V8h-2v2h2v2h-2v2h2v2h2v2zm-2-4v-2h2v2h-2z" fill="%23555D65"/%3E%3Cpath d="M18 18v2h-2v-2h2z" fill="%23555D65"/%3E%3Cpath fill-rule="evenodd" clip-rule="evenodd" d="M8 10V8H6v2H4v2h2v2H4v2h2v2H4v2h2v2H4v2h2v-2h2v2h2v-2h2v2h2v-2h2v2h2v-2h2v2h2v-2h2v-2h-2v-2h2v-2h-2v-2h2v-2h-2v-2h2V8h-2V6h2V4h-2v2h-2V4h-2v2h-2V4h-2v2h-2V4h-2v2h2v2h-2v2H8zm0 2v-2H6v2h2zm2 0v-2h2v2h-2zm0 2v-2H8v2H6v2h2v2H6v2h2v2h2v-2h2v2h2v-2h2v2h2v-2h2v2h2v-2h-2v-2h2v-2h-2v-2h2v-2h-2v-2h2V8h-2V6h-2v2h-2V6h-2v2h-2v2h2v2h-2v2h-2z" fill="%23555D65"/%3E%3Cpath fill-rule="evenodd" clip-rule="evenodd" d="M4 0H2v2H0v2h2v2H0v2h2v2H0v2h2v2H0v2h2v2H0v2h2v2H0v2h2v2H0v2h2v-2h2v2h2v-2h2v2h2v-2h2v2h2v-2h2v2h2v-2h2v2h2v-2h2v2h2v-2h2v-2h-2v-2h2v-2h-2v-2h2v-2h-2v-2h2v-2h-2v-2h2V8h-2V6h2V4h-2V2h2V0h-2v2h-2V0h-2v2h-2V0h-2v2h-2V0h-2v2h-2V0h-2v2H8V0H6v2H4V0zm0 4V2H2v2h2zm2 0V2h2v2H6zm0 2V4H4v2H2v2h2v2H2v2h2v2H2v2h2v2H2v2h2v2H2v2h2v2h2v-2h2v2h2v-2h2v2h2v-2h2v2h2v-2h2v2h2v-2h2v2h2v-2h-2v-2h2v-2h-2v-2h2v-2h-2v-2h2v-2h-2v-2h2V8h-2V6h2V4h-2V2h-2v2h-2V2h-2v2h-2V2h-2v2h-2V2h-2v2H8v2H6z" fill="%23555D65"/%3E%3C/svg%3E');
1146	1325	}
1147	1326
1148	1327	.components-circular-option-picker__option {
		@@ -1160,9 +1339,9 @@
1160	1339	transition: 100ms box-shadow ease;
1161	1340	}
1162	1341	}
1163	1342	.components-circular-option-picker__option {
1164		- cursor: var(--wpds-cursor-control, pointer);
	1343	+ cursor: pointer;
1165	1344	}
1166	1345	.components-circular-option-picker__option:hover {
1167	1346	box-shadow: inset 0 0 0 14px !important;
1168	1347	}
		@@ -1254,10 +1433,10 @@
1254	1433	padding: 2px;
1255	1434	margin: 0;
1256	1435	line-height: inherit;
1257	1436	min-height: auto;
1258		- background: var(--wp-components-color-background, var(--wpds-color-background-surface-neutral-strong, #fff));
1259		- color: var(--wp-components-color-foreground, var(--wpds-color-foreground-content-neutral, #1e1e1e));
	1437	+ background: var(--wp-components-color-background, #fff);
	1438	+ color: var(--wp-components-color-foreground, #1e1e1e);
1260	1439	}
1261	1440	@media (min-width: 600px) {
1262	1441	input.components-combobox-control__input[type=text] {
1263	1442	font-size: 13px;
		@@ -1268,9 +1447,9 @@
1268	1447	box-shadow: none;
1269	1448	}
1270	1449
1271	1450	.components-combobox-control__suggestions-container {
1272		- font-family: -apple-system, system-ui, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
	1451	+ font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
1273	1452	padding: 6px 8px;
1274	1453	/* Fonts smaller than 16px causes mobile safari to zoom. */
1275	1454	font-size: 16px;
1276	1455	/* Override core line-height. To be reviewed. */
		@@ -1295,11 +1474,8 @@
1295	1474	border-color: var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9));
1296	1475	box-shadow: 0 0 0 0.5px var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9));
1297	1476	outline: 2px solid transparent;
1298	1477	}
1299		-.components-combobox-control__suggestions-container::-moz-placeholder {
1300		- color: rgba(30, 30, 30, 0.62);
1301		-}
1302	1478	.components-combobox-control__suggestions-container::placeholder {
1303	1479	color: rgba(30, 30, 30, 0.62);
1304	1480	}
1305	1481	.components-combobox-control__suggestions-container {
		@@ -1329,9 +1505,9 @@
1329	1505	background: none;
1330	1506	height: 64px;
1331	1507	width: 100%;
1332	1508	box-sizing: border-box;
1333		- cursor: var(--wpds-cursor-control, pointer);
	1509	+ cursor: pointer;
1334	1510	outline: 1px solid transparent;
1335	1511	border-radius: 4px 4px 0 0;
1336	1512	box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.2);
1337	1513	}
		@@ -1360,9 +1536,9 @@
1360	1536	box-shadow: inset 0 -1px 0 0 rgba(0, 0, 0, 0.2), inset 1px 0 0 0 rgba(0, 0, 0, 0.2), inset -1px 0 0 0 rgba(0, 0, 0, 0.2);
1361	1537	}
1362	1538
1363	1539	.components-color-palette__custom-color-name {
1364		- color: var(--wp-components-color-foreground, var(--wpds-color-foreground-content-neutral, #1e1e1e));
	1540	+ color: var(--wp-components-color-foreground, #1e1e1e);
1365	1541	margin: 0 1px;
1366	1542	}
1367	1543
1368	1544	.components-color-palette__custom-color-value {
		@@ -1454,8 +1630,28 @@
1454	1630	position: relative;
1455	1631	z-index: 0;
1456	1632	}
1457	1633
	1634	+body.is-dragging-components-draggable {
	1635	+ cursor: move; /* Fallback for IE/Edge < 14 */
	1636	+ cursor: grabbing !important;
	1637	+}
	1638	+
	1639	+.components-draggable__invisible-drag-image {
	1640	+ position: fixed;
	1641	+ left: -1000px;
	1642	+ height: 50px;
	1643	+ width: 50px;
	1644	+}
	1645	+
	1646	+.components-draggable__clone {
	1647	+ position: fixed;
	1648	+ padding: 0;
	1649	+ background: transparent;
	1650	+ pointer-events: none;
	1651	+ z-index: 1000000000;
	1652	+}
	1653	+
1458	1654	.components-drop-zone {
1459	1655	position: absolute;
1460	1656	top: 0;
1461	1657	right: 0;
		@@ -1522,9 +1718,9 @@
1522	1718	pointer-events: none;
1523	1719	}
1524	1720
1525	1721	.components-drop-zone__content-text {
1526		- font-family: -apple-system, system-ui, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
	1722	+ font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
1527	1723	font-size: 13px;
1528	1724	}
1529	1725
1530	1726	.components-dropdown {
		@@ -1561,9 +1757,9 @@
1561	1757	}
1562	1758
1563	1759	.components-dropdown-menu__menu {
1564	1760	width: 100%;
1565		- font-family: -apple-system, system-ui, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
	1761	+ font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
1566	1762	font-size: 13px;
1567	1763	line-height: 1.4;
1568	1764	}
1569	1765	.components-dropdown-menu__menu .components-dropdown-menu__menu-item,
		@@ -1570,11 +1766,11 @@
1570	1766	.components-dropdown-menu__menu .components-menu-item {
1571	1767	width: 100%;
1572	1768	padding: 6px;
1573	1769	outline: none;
1574		- cursor: var(--wpds-cursor-control, pointer);
	1770	+ cursor: pointer;
1575	1771	white-space: nowrap;
1576		- font-weight: var(--wpds-typography-font-weight-default, 400);
	1772	+ font-weight: 400;
1577	1773	}
1578	1774	.components-dropdown-menu__menu .components-dropdown-menu__menu-item.has-separator,
1579	1775	.components-dropdown-menu__menu .components-menu-item.has-separator {
1580	1776	margin-top: 6px;
		@@ -1585,9 +1781,9 @@
1585	1781	.components-dropdown-menu__menu .components-menu-item.has-separator::before {
1586	1782	display: block;
1587	1783	content: "";
1588	1784	box-sizing: content-box;
1589		- background-color: var(--wpds-color-stroke-surface-neutral, #dbdbdb);
	1785	+ background-color: #ddd;
1590	1786	position: absolute;
1591	1787	top: -3px;
1592	1788	left: 0;
1593	1789	right: 0;
		@@ -1647,48 +1843,22 @@
1647	1843	margin: 2px;
1648	1844	}
1649	1845
1650	1846	.components-external-link {
1651		- color: var(--wpds-color-foreground-interactive-brand, var(--wp-admin-theme-color, #3858e9));
1652	1847	text-decoration: none;
1653	1848	}
1654		-@media not (prefers-reduced-motion) {
1655		- .components-external-link {
1656		- transition: outline 0.1s ease-out;
1657		- }
1658		-}
1659		-.components-external-link {
1660		- outline: 0 solid transparent;
1661		- outline-offset: 1px;
1662		-}
1663		-.components-external-link:visited {
1664		- color: var(--wpds-color-foreground-interactive-brand, var(--wp-admin-theme-color, #3858e9));
1665		-}
1666		-.components-external-link:hover, .components-external-link:active {
1667		- color: var(--wpds-color-foreground-interactive-brand-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 52%, black));
1668		-}
1669		-.components-external-link:focus {
1670		- outline: var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)) solid var(--wpds-color-stroke-focus, var(--wp-admin-theme-color, #3858e9));
1671		- box-shadow: none;
1672		- border-radius: 0;
1673		-}
1674	1849
1675	1850	.components-external-link__contents {
1676	1851	text-decoration: underline;
1677		- text-underline-offset: 0.2em;
1678		- text-decoration-thickness: from-font;
1679	1852	}
1680	1853
1681	1854	.components-external-link__icon {
1682		- line-height: 1;
1683		- display: inline-block;
1684		- margin-inline-start: var(--wpds-dimension-padding-xs, 4px);
1685		- font-weight: var(--wpds-typography-font-weight-default, 400);
	1855	+ margin-left: 0.5ch;
	1856	+ font-weight: 400;
1686	1857	}
1687	1858
1688	1859	.components-form-toggle {
1689	1860	position: relative;
1690		- isolation: isolate;
1691	1861	display: inline-block;
1692	1862	height: 16px;
1693	1863	}
1694	1864	.components-form-toggle .components-form-toggle__track {
		@@ -1762,41 +1932,11 @@
1762	1932	background-color: #fff;
1763	1933	border-width: 0;
1764	1934	transform: translateX(16px);
1765	1935	}
1766		-.components-form-toggle.is-disabled .components-form-toggle__track, .components-disabled .components-form-toggle .components-form-toggle__track {
1767		- background-color: var(--wp-components-color-gray-100, var(--wpds-color-background-surface-neutral, #fcfcfc));
1768		- border-color: var(--wpds-color-stroke-interactive-neutral-disabled, #dbdbdb);
	1936	+.components-form-toggle.is-disabled, .components-disabled .components-form-toggle {
	1937	+ opacity: 0.3;
1769	1938	}
1770		-@media (forced-colors: active) {
1771		- .components-form-toggle.is-disabled .components-form-toggle__track, .components-disabled .components-form-toggle .components-form-toggle__track {
1772		- border-color: GrayText;
1773		- }
1774		-}
1775		-.components-form-toggle.is-disabled .components-form-toggle__thumb, .components-disabled .components-form-toggle .components-form-toggle__thumb {
1776		- background-color: var(--wp-components-color-gray-400, var(--wpds-color-stroke-interactive-neutral, #8d8d8d));
1777		- box-shadow: none;
1778		-}
1779		-@media (forced-colors: active) {
1780		- .components-form-toggle.is-disabled .components-form-toggle__thumb, .components-disabled .components-form-toggle .components-form-toggle__thumb {
1781		- border-color: GrayText;
1782		- }
1783		-}
1784		-.components-form-toggle.is-disabled.is-checked .components-form-toggle__track, .components-disabled .components-form-toggle.is-checked .components-form-toggle__track {
1785		- background-color: var(--wp-components-color-gray-400, var(--wpds-color-stroke-interactive-neutral, #8d8d8d));
1786		- border-color: var(--wp-components-color-gray-400, var(--wpds-color-stroke-interactive-neutral, #8d8d8d));
1787		-}
1788		-@media (forced-colors: active) {
1789		- .components-form-toggle.is-disabled.is-checked .components-form-toggle__track, .components-disabled .components-form-toggle.is-checked .components-form-toggle__track {
1790		- border-color: GrayText;
1791		- }
1792		- .components-form-toggle.is-disabled.is-checked .components-form-toggle__track::after, .components-disabled .components-form-toggle.is-checked .components-form-toggle__track::after {
1793		- border-top-color: GrayText;
1794		- }
1795		-}
1796		-.components-form-toggle.is-disabled.is-checked .components-form-toggle__thumb, .components-disabled .components-form-toggle.is-checked .components-form-toggle__thumb {
1797		- background-color: #fff;
1798		-}
1799	1939
1800	1940	.components-form-toggle input.components-form-toggle__input[type=checkbox] {
1801	1941	position: absolute;
1802	1942	top: 0;
		@@ -1815,13 +1955,13 @@
1815	1955	.components-form-toggle input.components-form-toggle__input[type=checkbox]::before {
1816	1956	content: "";
1817	1957	}
1818	1958	.components-form-toggle input.components-form-toggle__input[type=checkbox]:not(:disabled, [aria-disabled=true]) {
1819		- cursor: var(--wpds-cursor-control, pointer);
	1959	+ cursor: pointer;
1820	1960	}
1821	1961
1822	1962	.components-form-token-field__input-container {
1823		- font-family: -apple-system, system-ui, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
	1963	+ font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
1824	1964	padding: 6px 8px;
1825	1965	/* Fonts smaller than 16px causes mobile safari to zoom. */
1826	1966	font-size: 16px;
1827	1967	/* Override core line-height. To be reviewed. */
		@@ -1846,11 +1986,8 @@
1846	1986	border-color: var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9));
1847	1987	box-shadow: 0 0 0 0.5px var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9));
1848	1988	outline: 2px solid transparent;
1849	1989	}
1850		-.components-form-token-field__input-container::-moz-placeholder {
1851		- color: rgba(30, 30, 30, 0.62);
1852		-}
1853	1990	.components-form-token-field__input-container::placeholder {
1854	1991	color: rgba(30, 30, 30, 0.62);
1855	1992	}
1856	1993	.components-form-token-field__input-container {
		@@ -1858,11 +1995,10 @@
1858	1995	padding: 0;
1859	1996	cursor: text;
1860	1997	}
1861	1998	.components-form-token-field__input-container.is-disabled {
1862		- background: var(--wp-components-color-gray-100, var(--wpds-color-background-surface-neutral, #fcfcfc));
1863		- border-color: var(--wp-components-color-gray-400, var(--wpds-color-stroke-interactive-neutral, #8d8d8d));
1864		- cursor: default;
	1999	+ background: #ddd;
	2000	+ border-color: #ddd;
1865	2001	}
1866	2002	.components-form-token-field__input-container.is-active {
1867	2003	border-color: var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9));
1868	2004	box-shadow: 0 0 0 0.5px var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9));
		@@ -1881,9 +2017,9 @@
1881	2017	min-height: 24px;
1882	2018	min-width: 50px;
1883	2019	background: inherit;
1884	2020	border: 0;
1885		- color: var(--wp-components-color-foreground, var(--wpds-color-foreground-content-neutral, #1e1e1e));
	2021	+ color: var(--wp-components-color-foreground, #1e1e1e);
1886	2022	box-shadow: none;
1887	2023	}
1888	2024	@media (min-width: 600px) {
1889	2025	.components-form-token-field__input-container input[type=text].components-form-token-field__input {
		@@ -1915,13 +2051,8 @@
1915	2051	.components-form-token-field__token.is-validating .components-form-token-field__token-text,
1916	2052	.components-form-token-field__token.is-validating .components-form-token-field__remove-token {
1917	2053	color: #757575;
1918	2054	}
1919		-.components-form-token-field__token.is-disabled .components-form-token-field__token-text,
1920		-.components-form-token-field__token.is-disabled .components-form-token-field__remove-token.components-button {
1921		- background: var(--wp-components-color-gray-100, var(--wpds-color-background-surface-neutral, #fcfcfc));
1922		- color: var(--wp-components-color-gray-600, var(--wpds-color-stroke-interactive-neutral, #8d8d8d));
1923		-}
1924	2055	.components-form-token-field__token.is-borderless {
1925	2056	position: relative;
1926	2057	padding: 0 24px 0 0;
1927	2058	}
		@@ -2000,9 +2131,9 @@
2000	2131	padding: 0;
2001	2132	}
2002	2133
2003	2134	.components-form-token-field__suggestion {
2004		- color: var(--wp-components-color-foreground, var(--wpds-color-foreground-content-neutral, #1e1e1e));
	2135	+ color: var(--wp-components-color-foreground, #1e1e1e);
2005	2136	display: block;
2006	2137	font-size: 13px;
2007	2138	padding: 8px 12px;
2008	2139	min-height: 32px;
		@@ -2010,9 +2141,9 @@
2010	2141	box-sizing: border-box;
2011	2142	}
2012	2143	.components-form-token-field__suggestion.is-selected {
2013	2144	background: var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9));
2014		- color: var(--wp-components-color-foreground-inverted, var(--wpds-color-background-surface-neutral, #fcfcfc));
	2145	+ color: var(--wp-components-color-foreground-inverted, #fff);
2015	2146	}
2016	2147	.components-form-token-field__suggestion[aria-disabled=true] {
2017	2148	pointer-events: none;
2018	2149	color: #949494;
		@@ -2020,9 +2151,9 @@
2020	2151	.components-form-token-field__suggestion[aria-disabled=true].is-selected {
2021	2152	background: color-mix(in srgb, var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9)) 4%, transparent);
2022	2153	}
2023	2154	.components-form-token-field__suggestion:not(.is-empty) {
2024		- cursor: var(--wpds-cursor-control, pointer);
	2155	+ cursor: pointer;
2025	2156	}
2026	2157
2027	2158	@media (min-width: 600px) {
2028	2159	.components-guide {
		@@ -2127,9 +2258,8 @@
2127	2258	outline-color: var(--wp-admin-theme-color);
2128	2259	outline-style: solid;
2129	2260	outline-width: calc(2 * var(--wp-admin-border-width-focus) / var(--wp-block-editor-iframe-zoom-out-scale, 1));
2130	2261	outline-offset: calc(2 * -1 * var(--wp-admin-border-width-focus) / var(--wp-block-editor-iframe-zoom-out-scale, 1));
2131		- box-shadow: inset 0 0 0 calc(2 * var(--wp-admin-border-width-focus) / var(--wp-block-editor-iframe-zoom-out-scale, 1) + 0.5px) rgba(255, 255, 255, 0.7);
2132	2262	z-index: 1000000;
2133	2263	}
2134	2264
2135	2265	.is-focusing-regions [role=region]:focus::after {
		@@ -2143,9 +2273,8 @@
2143	2273	outline-color: var(--wp-admin-theme-color);
2144	2274	outline-style: solid;
2145	2275	outline-width: calc(2 * var(--wp-admin-border-width-focus) / var(--wp-block-editor-iframe-zoom-out-scale, 1));
2146	2276	outline-offset: calc(2 * -1 * var(--wp-admin-border-width-focus) / var(--wp-block-editor-iframe-zoom-out-scale, 1));
2147		- box-shadow: inset 0 0 0 calc(2 * var(--wp-admin-border-width-focus) / var(--wp-block-editor-iframe-zoom-out-scale, 1) + 0.5px) rgba(255, 255, 255, 0.7);
2148	2277	z-index: 1000000;
2149	2278	}
2150	2279	.is-focusing-regions.is-distraction-free .interface-interface-skeleton__header .edit-post-header,
2151	2280	.is-focusing-regions .interface-interface-skeleton__sidebar .editor-layout__toggle-sidebar-panel,
		@@ -2155,9 +2284,8 @@
2155	2284	outline-color: var(--wp-admin-theme-color);
2156	2285	outline-style: solid;
2157	2286	outline-width: calc(2 * var(--wp-admin-border-width-focus) / var(--wp-block-editor-iframe-zoom-out-scale, 1));
2158	2287	outline-offset: calc(2 * -1 * var(--wp-admin-border-width-focus) / var(--wp-block-editor-iframe-zoom-out-scale, 1));
2159		- box-shadow: inset 0 0 0 calc(2 * var(--wp-admin-border-width-focus) / var(--wp-block-editor-iframe-zoom-out-scale, 1) + 0.5px) rgba(255, 255, 255, 0.7);
2160	2288	}
2161	2289
2162	2290	.components-menu-group + .components-menu-group {
2163	2291	padding-top: 8px;
		@@ -2179,9 +2307,9 @@
2179	2307	margin-bottom: 12px;
2180	2308	color: #757575;
2181	2309	text-transform: uppercase;
2182	2310	font-size: 11px;
2183		- font-weight: var(--wpds-typography-font-weight-emphasis, 600);
	2311	+ font-weight: 499;
2184	2312	white-space: nowrap;
2185	2313	}
2186	2314
2187	2315	.components-menu-item__button,
		@@ -2186,9 +2314,9 @@
2186	2314
2187	2315	.components-menu-item__button,
2188	2316	.components-menu-item__button.components-button {
2189	2317	width: 100%;
2190		- font-weight: var(--wpds-typography-font-weight-default, 400);
	2318	+ font-weight: 400;
2191	2319	}
2192	2320	.components-menu-item__button[role=menuitemradio] .components-menu-item__item:only-child, .components-menu-item__button[role=menuitemcheckbox] .components-menu-item__item:only-child,
2193	2321	.components-menu-item__button.components-button[role=menuitemradio] .components-menu-item__item:only-child,
2194	2322	.components-menu-item__button.components-button[role=menuitemcheckbox] .components-menu-item__item:only-child {
		@@ -2298,9 +2426,9 @@
2298	2426	}
2299	2427	}
2300	2428	@media not (prefers-reduced-motion) {
2301	2429	.components-modal__screen-overlay {
2302		- animation: __wp-base-styles-fade-in var(--wpds-motion-duration-sm, 100ms) var(--wpds-motion-easing-subtle, cubic-bezier(0.15, 0, 0.15, 1)) 0s;
	2430	+ animation: __wp-base-styles-fade-in 0.08s linear 0s;
2303	2431	animation-fill-mode: forwards;
2304	2432	}
2305	2433	}
2306	2434	@keyframes __wp-base-styles-fade-out {
		@@ -2312,9 +2440,9 @@
2312	2440	}
2313	2441	}
2314	2442	@media not (prefers-reduced-motion) {
2315	2443	.components-modal__screen-overlay.is-animating-out {
2316		- animation: __wp-base-styles-fade-out var(--wpds-motion-duration-sm, 100ms) var(--wpds-motion-easing-subtle, cubic-bezier(0.15, 0, 0.15, 1)) var(--wpds-motion-duration-xs, 50ms);
	2444	+ animation: __wp-base-styles-fade-out 0.08s linear 80ms;
2317	2445	animation-fill-mode: forwards;
2318	2446	}
2319	2447	}
2320	2448
		@@ -2326,12 +2454,10 @@
2326	2454	.components-modal__frame *::after {
2327	2455	box-sizing: inherit;
2328	2456	}
2329	2457	.components-modal__frame {
2330		- align-self: flex-end;
2331		- margin: 0;
	2458	+ margin: 40px 0 0 0;
2332	2459	width: 100%;
2333		- max-height: calc(100% - 40px);
2334	2460	background: #fff;
2335	2461	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);
2336	2462	border-radius: 8px 8px 0 0;
2337	2463	overflow: hidden;
		@@ -2338,9 +2464,9 @@
2338	2464	display: flex;
2339	2465	color: #1e1e1e;
2340	2466	animation-name: components-modal__appear-animation;
2341	2467	animation-fill-mode: forwards;
2342		- animation-timing-function: var(--wpds-motion-easing-expressive, cubic-bezier(0.25, 0, 0, 1));
	2468	+ animation-timing-function: cubic-bezier(0.29, 0, 0, 1);
2343	2469	}
2344	2470	.components-modal__frame h1,
2345	2471	.components-modal__frame h2,
2346	2472	.components-modal__frame h3 {
		@@ -2347,36 +2473,51 @@
2347	2473	color: #1e1e1e;
2348	2474	}
2349	2475	@media not (prefers-reduced-motion) {
2350	2476	.components-modal__frame {
2351		- animation-duration: var(--wpds-motion-duration-md, 200ms);
	2477	+ animation-duration: var(--modal-frame-animation-duration);
2352	2478	}
2353	2479	}
2354	2480	.components-modal__screen-overlay.is-animating-out .components-modal__frame {
2355	2481	animation-name: components-modal__disappear-animation;
2356		- animation-timing-function: var(--wpds-motion-easing-expressive, cubic-bezier(0.25, 0, 0, 1));
	2482	+ animation-timing-function: cubic-bezier(1, 0, 0.2, 1);
2357	2483	}
2358	2484	@media (min-width: 600px) {
2359	2485	.components-modal__frame {
2360		- align-self: auto;
2361	2486	border-radius: 8px;
2362	2487	margin: auto;
2363	2488	width: auto;
2364		- min-width: var(--wpds-dimension-surface-width-sm, 320px);
	2489	+ min-width: 350px;
2365	2490	max-width: calc(100% - 32px);
2366	2491	max-height: calc(100% - 128px);
2367	2492	}
	2493	+}
	2494	+@media (min-width: 600px) and (min-width: 600px) {
	2495	+ .components-modal__frame.is-full-screen {
	2496	+ width: calc(100% - 32px);
	2497	+ height: calc(100% - 32px);
	2498	+ max-height: none;
	2499	+ }
	2500	+}
	2501	+@media (min-width: 600px) and (min-width: 782px) {
	2502	+ .components-modal__frame.is-full-screen {
	2503	+ width: calc(100% - 80px);
	2504	+ height: calc(100% - 80px);
	2505	+ max-width: none;
	2506	+ }
	2507	+}
	2508	+@media (min-width: 600px) {
2368	2509	.components-modal__frame.has-size-small, .components-modal__frame.has-size-medium, .components-modal__frame.has-size-large {
2369	2510	width: 100%;
2370	2511	}
2371	2512	.components-modal__frame.has-size-small {
2372		- max-width: var(--wpds-dimension-surface-width-md, 400px);
	2513	+ max-width: 384px;
2373	2514	}
2374	2515	.components-modal__frame.has-size-medium {
2375		- max-width: var(--wpds-dimension-surface-width-lg, 560px);
	2516	+ max-width: 512px;
2376	2517	}
2377	2518	.components-modal__frame.has-size-large {
2378		- max-width: var(--wpds-dimension-surface-width-2xl, 960px);
	2519	+ max-width: 840px;
2379	2520	}
2380	2521	}
2381	2522	@media (min-width: 960px) {
2382	2523	.components-modal__frame {
		@@ -2382,15 +2523,8 @@
2382	2523	.components-modal__frame {
2383	2524	max-height: 70%;
2384	2525	}
2385	2526	}
2386		-.components-modal__frame.is-full-screen {
2387		- margin: 0;
2388		- width: 100%;
2389		- height: 100%;
2390		- max-height: none;
2391		- border-radius: 0;
2392		-}
2393	2527	.components-modal__frame.is-full-screen :where(.components-modal__content) {
2394	2528	display: flex;
2395	2529	margin-bottom: 24px;
2396	2530	padding-bottom: 0;
		@@ -2397,66 +2531,29 @@
2397	2531	}
2398	2532	.components-modal__frame.is-full-screen :where(.components-modal__content) > :last-child {
2399	2533	flex: 1;
2400	2534	}
2401		-@media (min-width: 600px) {
2402		- .components-modal__frame.is-full-screen {
2403		- margin: auto;
2404		- border-radius: 8px;
2405		- width: calc(100% - 32px);
2406		- height: calc(100% - 32px);
2407		- }
2408		-}
2409		-@media (min-width: 782px) {
2410		- .components-modal__frame.is-full-screen {
2411		- width: calc(100% - 80px);
2412		- height: calc(100% - 80px);
2413		- max-width: none;
2414		- }
2415		-}
2416	2535
2417	2536	@keyframes components-modal__appear-animation {
2418	2537	from {
2419	2538	opacity: 0;
2420		- transform: translateY(100%);
	2539	+ transform: scale(0.9);
2421	2540	}
2422	2541	to {
2423	2542	opacity: 1;
2424		- transform: translateY(0);
	2543	+ transform: scale(1);
2425	2544	}
2426	2545	}
2427	2546	@keyframes components-modal__disappear-animation {
2428	2547	from {
2429	2548	opacity: 1;
2430		- transform: translateY(0);
	2549	+ transform: scale(1);
2431	2550	}
2432	2551	to {
2433	2552	opacity: 0;
2434		- transform: translateY(100%);
	2553	+ transform: scale(0.9);
2435	2554	}
2436	2555	}
2437		-@media (min-width: 600px) {
2438		- @keyframes components-modal__appear-animation {
2439		- from {
2440		- opacity: 0;
2441		- transform: scale(0.9);
2442		- }
2443		- to {
2444		- opacity: 1;
2445		- transform: scale(1);
2446		- }
2447		- }
2448		- @keyframes components-modal__disappear-animation {
2449		- from {
2450		- opacity: 1;
2451		- transform: scale(1);
2452		- }
2453		- to {
2454		- opacity: 0;
2455		- transform: scale(0.9);
2456		- }
2457		- }
2458		-}
2459	2556	.components-modal__header {
2460	2557	box-sizing: border-box;
2461	2558	border-bottom: 1px solid transparent;
2462	2559	padding: 24px;
		@@ -2472,9 +2569,9 @@
2472	2569	left: 0;
2473	2570	}
2474	2571	.components-modal__header .components-modal__header-heading {
2475	2572	font-size: 20px;
2476		- font-weight: var(--wpds-typography-font-weight-emphasis, 600);
	2573	+ font-weight: 600;
2477	2574	}
2478	2575	.components-modal__header h1 {
2479	2576	line-height: 1;
2480	2577	margin: 0;
		@@ -2479,9 +2576,9 @@
2479	2576	line-height: 1;
2480	2577	margin: 0;
2481	2578	}
2482	2579	.components-modal__content.has-scrolled-content:not(.hide-header) .components-modal__header {
2483		- border-bottom-color: var(--wpds-color-stroke-surface-neutral, #dbdbdb);
	2580	+ border-bottom-color: #ddd;
2484	2581	}
2485	2582	.components-modal__header + p {
2486	2583	margin-top: 0;
2487	2584	}
		@@ -2519,64 +2616,57 @@
2519	2616	outline-offset: -2px;
2520	2617	}
2521	2618
2522	2619	.components-notice {
2523		- --wp-components-notice-background-color: var(--wpds-color-background-surface-info-weak, #f3f9ff);
2524		- --wp-components-notice-border-color: var(--wpds-color-stroke-surface-info, #a9c6e7);
2525		- --wp-components-notice-text-color: var(--wpds-color-foreground-content-info, #001b4f);
2526		- box-sizing: border-box;
2527		- display: grid;
2528		- grid-template-columns: 1fr auto;
2529		- align-items: start;
2530		- padding: var(--wpds-dimension-padding-md, 12px);
2531		- border: var(--wpds-border-width-xs, 1px) solid var(--wp-components-notice-border-color);
2532		- border-radius: var(--wpds-border-radius-lg, 8px);
2533		- background-color: var(--wp-components-notice-background-color);
2534		- color: var(--wp-components-notice-text-color);
2535		- font-family: var(--wpds-typography-font-family-body, -apple-system, system-ui, "Segoe UI", "Roboto", "Oxygen-Sans", "Ubuntu", "Cantarell", "Helvetica Neue", sans-serif);
2536		- font-size: var(--wpds-typography-font-size-md, 13px);
2537		- line-height: var(--wpds-typography-line-height-sm, 20px);
	2620	+ display: flex;
	2621	+ font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
	2622	+ font-size: 13px;
	2623	+ background-color: #fff;
	2624	+ border-left: 4px solid var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9));
	2625	+ padding: 8px 12px;
	2626	+ align-items: center;
	2627	+ color: #1e1e1e;
2538	2628	}
	2629	+.components-notice.is-dismissible {
	2630	+ position: relative;
	2631	+}
	2632	+.components-notice.is-dismissible .components-notice__content {
	2633	+ margin-right: 25px;
	2634	+}
2539	2635	.components-notice.is-success {
2540		- --wp-components-notice-background-color: var(--wpds-color-background-surface-success-weak, #ebffed);
2541		- --wp-components-notice-border-color: var(--wpds-color-stroke-surface-success, #94d29e);
2542		- --wp-components-notice-text-color: var(--wpds-color-foreground-content-success, #002900);
	2636	+ border-left-color: #4ab866;
	2637	+ background-color: rgb(238.8392857143, 248.6607142857, 241.3392857143);
2543	2638	}
2544	2639	.components-notice.is-warning {
2545		- --wp-components-notice-background-color: var(--wpds-color-background-surface-warning-weak, #fff7e1);
2546		- --wp-components-notice-border-color: var(--wpds-color-stroke-surface-warning, #e1bc7c);
2547		- --wp-components-notice-text-color: var(--wpds-color-foreground-content-warning, #2e1900);
	2640	+ border-left-color: #f0b849;
	2641	+ background-color: rgb(253.5913705584, 248.3324873096, 237.9086294416);
2548	2642	}
2549	2643	.components-notice.is-error {
2550		- --wp-components-notice-background-color: var(--wpds-color-background-surface-error-weak, #fff6f5);
2551		- --wp-components-notice-border-color: var(--wpds-color-stroke-surface-error, #dab1aa);
2552		- --wp-components-notice-text-color: var(--wpds-color-foreground-content-error, #470000);
	2644	+ border-left-color: #cc1818;
	2645	+ background-color: rgb(244.1052631579, 162.3947368421, 162.3947368421);
2553	2646	}
2554	2647
2555	2648	.components-notice__content {
2556		- grid-column: 1;
2557		- grid-row: 1;
2558		- padding-block: calc((var(--wpds-dimension-size-sm, 24px) - 1lh) / 2);
	2649	+ flex-grow: 1;
	2650	+ margin-top: 4px;
	2651	+ margin-bottom: 4px;
2559	2652	}
2560	2653
2561	2654	.components-notice__actions {
2562		- grid-column: 1;
2563		- grid-row: 2;
2564	2655	display: flex;
2565	2656	flex-wrap: wrap;
2566	2657	align-items: center;
2567		- gap: var(--wpds-dimension-gap-md, 12px);
2568		- margin-top: var(--wpds-dimension-gap-sm, 8px);
	2658	+ gap: 12px;
	2659	+ margin-top: 12px;
2569	2660	}
2570	2661
2571	2662	.components-notice__dismiss {
2572		- grid-column: 2;
2573		- grid-row: 1;
2574		- color: var(--wpds-color-foreground-interactive-neutral, #1e1e1e);
2575		- margin-inline-start: var(--wpds-dimension-gap-xs, 4px);
	2663	+ color: #757575;
	2664	+ align-self: flex-start;
	2665	+ flex-shrink: 0;
2576	2666	}
2577	2667	.components-notice__dismiss:not(:disabled):not([aria-disabled=true]):not(.is-secondary):hover, .components-notice__dismiss:not(:disabled):not([aria-disabled=true]):not(.is-secondary):active, .components-notice__dismiss:not(:disabled):not([aria-disabled=true]):focus {
2578		- color: var(--wpds-color-foreground-interactive-neutral-active, #1e1e1e);
	2668	+ color: #1e1e1e;
2579	2669	background-color: transparent;
2580	2670	}
2581	2671	.components-notice__dismiss:not(:disabled):not([aria-disabled=true]):not(.is-secondary):hover {
2582	2672	box-shadow: none;
		@@ -2582,14 +2672,16 @@
2582	2672	box-shadow: none;
2583	2673	}
2584	2674
2585	2675	.components-notice-list {
2586		- display: flex;
2587		- flex-direction: column;
2588		- gap: var(--wpds-dimension-gap-md, 12px);
2589	2676	max-width: 100vw;
2590	2677	box-sizing: border-box;
2591	2678	}
	2679	+.components-notice-list .components-notice__content {
	2680	+ margin-top: 12px;
	2681	+ margin-bottom: 12px;
	2682	+ line-height: 2;
	2683	+}
2592	2684
2593	2685	.components-panel {
2594	2686	background: #fff;
2595	2687	border: 1px solid #e0e0e0;
		@@ -2623,9 +2715,9 @@
2623	2715	flex-shrink: 0;
2624	2716	justify-content: space-between;
2625	2717	align-items: center;
2626	2718	padding: 0 16px;
2627		- border-bottom: 1px solid var(--wpds-color-stroke-surface-neutral, #dbdbdb);
	2719	+ border-bottom: 1px solid #ddd;
2628	2720	box-sizing: content-box;
2629	2721	height: 47px;
2630	2722	}
2631	2723	.components-panel__header h2 {
		@@ -2666,12 +2758,15 @@
2666	2758
2667	2759	.components-panel__body-toggle.components-button {
2668	2760	position: relative;
2669	2761	padding: 16px 48px 16px 16px;
	2762	+ outline: none;
2670	2763	width: 100%;
2671		- font-weight: var(--wpds-typography-font-weight-emphasis, 600);
	2764	+ font-weight: 499;
2672	2765	text-align: left;
2673	2766	color: #1e1e1e;
	2767	+ border: none;
	2768	+ box-shadow: none;
2674	2769	}
2675	2770	@media not (prefers-reduced-motion) {
2676	2771	.components-panel__body-toggle.components-button {
2677	2772	transition: 0.1s background ease-in-out;
		@@ -2680,9 +2775,9 @@
2680	2775	.components-panel__body-toggle.components-button {
2681	2776	height: auto;
2682	2777	}
2683	2778	.components-panel__body-toggle.components-button:focus {
2684		- outline-offset: calc(var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)) * -1);
	2779	+ box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9));
2685	2780	border-radius: 0;
2686	2781	}
2687	2782	.components-panel__body-toggle.components-button .components-panel__arrow {
2688	2783	position: absolute;
		@@ -2768,9 +2863,9 @@
2768	2863	.components-placeholder__error,
2769	2864	.components-placeholder__instructions,
2770	2865	.components-placeholder__label,
2771	2866	.components-placeholder__fieldset {
2772		- font-family: -apple-system, system-ui, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
	2867	+ font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
2773	2868	font-size: 13px;
2774	2869	letter-spacing: initial;
2775	2870	line-height: initial;
2776	2871	text-transform: none;
		@@ -2777,9 +2872,9 @@
2777	2872	font-weight: normal;
2778	2873	}
2779	2874
2780	2875	.components-placeholder__label {
2781		- font-weight: var(--wpds-typography-font-weight-emphasis, 600);
	2876	+ font-weight: 600;
2782	2877	align-items: center;
2783	2878	display: flex;
2784	2879	}
2785	2880	.components-placeholder__label > svg,
		@@ -2809,9 +2904,9 @@
2809	2904	justify-content: flex-start;
2810	2905	}
2811	2906	.components-placeholder__fieldset p,
2812	2907	.components-placeholder__fieldset form p {
2813		- font-family: -apple-system, system-ui, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
	2908	+ font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
2814	2909	font-size: 13px;
2815	2910	}
2816	2911
2817	2912	.components-placeholder__fieldset.is-column-layout,
		@@ -2819,9 +2914,9 @@
2819	2914	flex-direction: column;
2820	2915	}
2821	2916
2822	2917	.components-placeholder__input[type=url] {
2823		- font-family: -apple-system, system-ui, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
	2918	+ font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
2824	2919	padding: 6px 8px;
2825	2920	/* Fonts smaller than 16px causes mobile safari to zoom. */
2826	2921	font-size: 16px;
2827	2922	/* Override core line-height. To be reviewed. */
		@@ -2846,11 +2941,8 @@
2846	2941	border-color: var(--wp-admin-theme-color);
2847	2942	box-shadow: 0 0 0 0.5px var(--wp-admin-theme-color);
2848	2943	outline: 2px solid transparent;
2849	2944	}
2850		-.components-placeholder__input[type=url]::-moz-placeholder {
2851		- color: rgba(30, 30, 30, 0.62);
2852		-}
2853	2945	.components-placeholder__input[type=url]::placeholder {
2854	2946	color: rgba(30, 30, 30, 0.62);
2855	2947	}
2856	2948	.components-placeholder__input[type=url] {
		@@ -2986,9 +3078,8 @@
2986	3078	background: #fff;
2987	3079	box-shadow: 0 0 0 1px #ccc, 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);
2988	3080	border-radius: 4px;
2989	3081	box-sizing: border-box;
2990		- width: -moz-min-content;
2991	3082	width: min-content;
2992	3083	}
2993	3084	.is-alternate .components-popover__content {
2994	3085	box-shadow: 0 0 0 1px #1e1e1e;
		@@ -3025,8 +3116,12 @@
3025	3116	white-space: nowrap;
3026	3117	width: 100%;
3027	3118	}
3028	3119
	3120	+.components-popover__close.components-button {
	3121	+ z-index: 5;
	3122	+}
	3123	+
3029	3124	.components-popover__arrow {
3030	3125	position: absolute;
3031	3126	width: 14px;
3032	3127	height: 14px;
		@@ -3083,9 +3178,9 @@
3083	3178	.components-radio-control {
3084	3179	border: 0;
3085	3180	margin: 0;
3086	3181	padding: 0;
3087		- font-family: -apple-system, system-ui, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
	3182	+ font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
3088	3183	font-size: 13px;
3089	3184	}
3090	3185
3091	3186	.components-radio-control__group-wrapper.has-help {
		@@ -3095,10 +3190,9 @@
3095	3190	.components-radio-control__option {
3096	3191	display: grid;
3097	3192	grid-template-columns: auto 1fr;
3098	3193	grid-template-rows: auto minmax(0, max-content);
3099		- -moz-column-gap: 8px;
3100		- column-gap: 8px;
	3194	+ column-gap: 8px;
3101	3195	align-items: center;
3102	3196	}
3103	3197
3104	3198	.components-radio-control__input[type=radio] {
		@@ -3156,15 +3250,11 @@
3156	3250	.components-radio-control__input[type=radio] {
3157	3251	display: inline-flex;
3158	3252	margin: 0;
3159	3253	padding: 0;
3160		- -webkit-appearance: none;
3161		- -moz-appearance: none;
3162		- appearance: none;
	3254	+ appearance: none;
	3255	+ cursor: pointer;
3163	3256	}
3164		-.components-radio-control__input[type=radio]:not(:disabled) {
3165		- cursor: var(--wpds-cursor-control, pointer);
3166		-}
3167	3257	.components-radio-control__input[type=radio]:focus {
3168	3258	box-shadow: 0 0 0 var(--wp-admin-border-width-focus) #fff, 0 0 0 calc(2 * var(--wp-admin-border-width-focus)) var(--wp-admin-theme-color);
3169	3259	outline: 2px solid transparent;
3170	3260	outline-offset: 2px;
		@@ -3176,26 +3266,13 @@
3176	3266	.components-radio-control__input[type=radio]:checked::before {
3177	3267	content: "";
3178	3268	border-radius: 50%;
3179	3269	}
3180		-.components-radio-control__input[type=radio]:disabled {
3181		- background: var(--wp-components-color-gray-100, var(--wpds-color-background-surface-neutral, #fcfcfc));
3182		- border: 1px solid var(--wpds-color-stroke-interactive-neutral-disabled, #dbdbdb);
3183		- opacity: 1;
3184		-}
3185		-.components-radio-control__input[type=radio]:disabled:checked::before {
3186		- border-color: var(--wp-components-color-gray-400, var(--wpds-color-stroke-interactive-neutral, #8d8d8d));
3187		- opacity: 1;
3188		-}
3189	3270
3190	3271	.components-radio-control__label {
3191	3272	grid-column: 2;
3192	3273	grid-row: 1;
3193		-}
3194		-.components-radio-control:not(:disabled) .components-radio-control__label {
3195		- cursor: var(--wpds-cursor-control, pointer);
3196		-}
3197		-.components-radio-control__label {
	3274	+ cursor: pointer;
3198	3275	line-height: 24px;
3199	3276	}
3200	3277	@media (min-width: 600px) {
3201	3278	.components-radio-control__label {
		@@ -3406,9 +3483,9 @@
3406	3483	-webkit-tap-highlight-color: rgba(0, 0, 0, 0) !important;
3407	3484	}
3408	3485
3409	3486	.components-snackbar {
3410		- font-family: -apple-system, system-ui, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
	3487	+ font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
3411	3488	font-size: 13px;
3412	3489	background: rgba(0, 0, 0, 0.85);
3413	3490	backdrop-filter: blur(16px) saturate(180%);
3414	3491	border-radius: 4px;
		@@ -3415,16 +3492,15 @@
3415	3492	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 2px 3px rgba(0, 0, 0, 0.04), 0 6px 6px rgba(0, 0, 0, 0.03), 0 8px 8px rgba(0, 0, 0, 0.02);
3416	3493	color: #fff;
3417	3494	padding: 12px 20px;
3418	3495	width: 100%;
3419		- max-width: var(--wpds-dimension-surface-width-lg, 560px);
	3496	+ max-width: 600px;
3420	3497	box-sizing: border-box;
3421		- cursor: var(--wpds-cursor-control, pointer);
	3498	+ cursor: pointer;
3422	3499	pointer-events: auto;
3423	3500	}
3424	3501	@media (min-width: 600px) {
3425	3502	.components-snackbar {
3426		- width: -moz-fit-content;
3427	3503	width: fit-content;
3428	3504	}
3429	3505	}
3430	3506	.components-snackbar:focus {
		@@ -3443,9 +3519,9 @@
3443	3519	top: calc((5.8px) / -2);
3444	3520	}
3445	3521	.components-snackbar .components-snackbar__dismiss-button {
3446	3522	margin-left: 24px;
3447		- cursor: var(--wpds-cursor-control, pointer);
	3523	+ cursor: pointer;
3448	3524	}
3449	3525
3450	3526	.components-snackbar__action.components-button,
3451	3527	.components-snackbar__action.components-external-link {
		@@ -3499,20 +3575,13 @@
3499	3575	height: 48px !important;
3500	3576	background: transparent;
3501	3577	border: none;
3502	3578	box-shadow: none;
3503		- cursor: var(--wpds-cursor-control, pointer);
3504		- padding: 3px var(--wpds-dimension-padding-lg, 16px);
	3579	+ cursor: pointer;
	3580	+ padding: 3px 16px;
3505	3581	margin-left: 0;
3506		- font-weight: var(--wpds-typography-font-weight-default, 400);
3507		- color: var(--wpds-color-foreground-interactive-neutral, #1e1e1e);
	3582	+ font-weight: 400;
3508	3583	}
3509		-.components-tab-panel__tabs-item:disabled, .components-tab-panel__tabs-item[aria-disabled=true] {
3510		- color: var(--wpds-color-foreground-interactive-neutral-disabled, #8d8d8d);
3511		-}
3512		-.components-tab-panel__tabs-item:not(:disabled, [aria-disabled=true]):is(:hover, :focus-visible) {
3513		- color: var(--wpds-color-foreground-interactive-neutral-active, #1e1e1e);
3514		-}
3515	3584	.components-tab-panel__tabs-item:focus:not(:disabled) {
3516	3585	position: relative;
3517	3586	box-shadow: none;
3518	3587	outline: none;
		@@ -3523,19 +3592,19 @@
3523	3592	right: 0;
3524	3593	bottom: 0;
3525	3594	left: 0;
3526	3595	pointer-events: none;
3527		- background: var(--wpds-color-stroke-interactive-neutral-strong, #6e6e6e);
3528		- height: calc(0 * var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)));
	3596	+ background: var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9));
	3597	+ height: calc(0 * var(--wp-admin-border-width-focus));
3529	3598	border-radius: 0;
3530	3599	}
3531	3600	@media not (prefers-reduced-motion) {
3532	3601	.components-tab-panel__tabs-item::after {
3533		- transition: height 0.1s linear;
	3602	+ transition: all 0.1s linear;
3534	3603	}
3535	3604	}
3536	3605	.components-tab-panel__tabs-item.is-active::after {
3537		- height: calc(1 * var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)));
	3606	+ height: calc(1 * var(--wp-admin-border-width-focus));
3538	3607	outline: 2px solid transparent;
3539	3608	outline-offset: -1px;
3540	3609	}
3541	3610	.components-tab-panel__tabs-item::before {
		@@ -3540,31 +3609,25 @@
3540	3609	}
3541	3610	.components-tab-panel__tabs-item::before {
3542	3611	content: "";
3543	3612	position: absolute;
3544		- inset: var(--wpds-dimension-padding-md, 12px);
	3613	+ top: 12px;
	3614	+ right: 12px;
	3615	+ bottom: 12px;
	3616	+ left: 12px;
3545	3617	pointer-events: none;
3546	3618	box-shadow: 0 0 0 0 transparent;
3547		- border-radius: var(--wpds-border-radius-sm, 2px);
	3619	+ border-radius: 2px;
3548	3620	}
3549	3621	@media not (prefers-reduced-motion) {
3550	3622	.components-tab-panel__tabs-item::before {
3551		- transition: box-shadow 0.1s linear;
	3623	+ transition: all 0.1s linear;
3552	3624	}
3553	3625	}
3554	3626	.components-tab-panel__tabs-item:focus-visible::before {
3555		- box-shadow: 0 0 0 var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)) var(--wpds-color-stroke-focus, var(--wp-admin-theme-color, #3858e9));
	3627	+ box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9));
3556	3628	outline: 2px solid transparent;
3557	3629	}
3558		-.components-tab-panel__tabs[aria-orientation=vertical] .components-tab-panel__tabs-item {
3559		- border-radius: var(--wpds-border-radius-sm, 2px);
3560		-}
3561		-.components-tab-panel__tabs[aria-orientation=vertical] .components-tab-panel__tabs-item::after {
3562		- display: none;
3563		-}
3564		-.components-tab-panel__tabs[aria-orientation=vertical] .components-tab-panel__tabs-item.is-active {
3565		- background: var(--wpds-color-background-interactive-neutral-weak-active, #ededed);
3566		-}
3567	3630
3568	3631	.components-tab-panel__tab-content:focus {
3569	3632	box-shadow: none;
3570	3633	outline: none;
		@@ -3569,9 +3632,9 @@
3569	3632	box-shadow: none;
3570	3633	outline: none;
3571	3634	}
3572	3635	.components-tab-panel__tab-content:focus-visible {
3573		- box-shadow: 0 0 0 var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)) var(--wpds-color-stroke-focus, var(--wp-admin-theme-color, #3858e9));
	3636	+ box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9));
3574	3637	outline: 2px solid transparent;
3575	3638	outline-offset: 0;
3576	3639	}
3577	3640
		@@ -3589,13 +3652,13 @@
3589	3652	.components-text-control__input[type=email],
3590	3653	.components-text-control__input[type=month],
3591	3654	.components-text-control__input[type=number] {
3592	3655	width: 100%;
3593		- height: 40px;
	3656	+ height: 32px;
3594	3657	margin: 0;
3595		- background: var(--wp-components-color-background, var(--wpds-color-background-surface-neutral-strong, #fff));
3596		- color: var(--wp-components-color-foreground, var(--wpds-color-foreground-content-neutral, #1e1e1e));
3597		- font-family: -apple-system, system-ui, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
	3658	+ background: var(--wp-components-color-background, #fff);
	3659	+ color: var(--wp-components-color-foreground, #1e1e1e);
	3660	+ font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
3598	3661	padding: 6px 8px;
3599	3662	/* Fonts smaller than 16px causes mobile safari to zoom. */
3600	3663	font-size: 16px;
3601	3664	/* Override core line-height. To be reviewed. */
		@@ -3659,11 +3722,8 @@
3659	3722	border-color: var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9));
3660	3723	box-shadow: 0 0 0 0.5px var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9));
3661	3724	outline: 2px solid transparent;
3662	3725	}
3663		-.components-text-control__input::-moz-placeholder, .components-text-control__input[type=text]::-moz-placeholder, .components-text-control__input[type=tel]::-moz-placeholder, .components-text-control__input[type=time]::-moz-placeholder, .components-text-control__input[type=url]::-moz-placeholder, .components-text-control__input[type=week]::-moz-placeholder, .components-text-control__input[type=password]::-moz-placeholder, .components-text-control__input[type=color]::-moz-placeholder, .components-text-control__input[type=date]::-moz-placeholder, .components-text-control__input[type=datetime]::-moz-placeholder, .components-text-control__input[type=datetime-local]::-moz-placeholder, .components-text-control__input[type=email]::-moz-placeholder, .components-text-control__input[type=month]::-moz-placeholder, .components-text-control__input[type=number]::-moz-placeholder {
3664		- color: rgba(30, 30, 30, 0.62);
3665		-}
3666	3726	.components-text-control__input::placeholder,
3667	3727	.components-text-control__input[type=text]::placeholder,
3668	3728	.components-text-control__input[type=tel]::placeholder,
3669	3729	.components-text-control__input[type=time]::placeholder,
		@@ -3692,15 +3752,10 @@
3692	3752	.components-text-control__input[type=datetime-local],
3693	3753	.components-text-control__input[type=email],
3694	3754	.components-text-control__input[type=month],
3695	3755	.components-text-control__input[type=number] {
3696		- border-color: var(--wp-components-color-gray-600, var(--wpds-color-stroke-interactive-neutral, #8d8d8d));
3697		- padding-left: 12px;
3698		- padding-right: 12px;
	3756	+ border-color: var(--wp-components-color-gray-600, #949494);
3699	3757	}
3700		-.components-text-control__input::-moz-placeholder, .components-text-control__input[type=text]::-moz-placeholder, .components-text-control__input[type=tel]::-moz-placeholder, .components-text-control__input[type=time]::-moz-placeholder, .components-text-control__input[type=url]::-moz-placeholder, .components-text-control__input[type=week]::-moz-placeholder, .components-text-control__input[type=password]::-moz-placeholder, .components-text-control__input[type=color]::-moz-placeholder, .components-text-control__input[type=date]::-moz-placeholder, .components-text-control__input[type=datetime]::-moz-placeholder, .components-text-control__input[type=datetime-local]::-moz-placeholder, .components-text-control__input[type=email]::-moz-placeholder, .components-text-control__input[type=month]::-moz-placeholder, .components-text-control__input[type=number]::-moz-placeholder {
3701		- color: color-mix(in srgb, var(--wp-components-color-foreground, var(--wpds-color-foreground-content-neutral, #1e1e1e)), transparent 38%);
3702		-}
3703	3758	.components-text-control__input::placeholder,
3704	3759	.components-text-control__input[type=text]::placeholder,
3705	3760	.components-text-control__input[type=tel]::placeholder,
3706	3761	.components-text-control__input[type=time]::placeholder,
		@@ -3713,10 +3768,28 @@
3713	3768	.components-text-control__input[type=datetime-local]::placeholder,
3714	3769	.components-text-control__input[type=email]::placeholder,
3715	3770	.components-text-control__input[type=month]::placeholder,
3716	3771	.components-text-control__input[type=number]::placeholder {
3717		- color: color-mix(in srgb, var(--wp-components-color-foreground, var(--wpds-color-foreground-content-neutral, #1e1e1e)), transparent 38%);
	3772	+ color: color-mix(in srgb, var(--wp-components-color-foreground, #1e1e1e), transparent 38%);
3718	3773	}
	3774	+.components-text-control__input.is-next-40px-default-size,
	3775	+.components-text-control__input[type=text].is-next-40px-default-size,
	3776	+.components-text-control__input[type=tel].is-next-40px-default-size,
	3777	+.components-text-control__input[type=time].is-next-40px-default-size,
	3778	+.components-text-control__input[type=url].is-next-40px-default-size,
	3779	+.components-text-control__input[type=week].is-next-40px-default-size,
	3780	+.components-text-control__input[type=password].is-next-40px-default-size,
	3781	+.components-text-control__input[type=color].is-next-40px-default-size,
	3782	+.components-text-control__input[type=date].is-next-40px-default-size,
	3783	+.components-text-control__input[type=datetime].is-next-40px-default-size,
	3784	+.components-text-control__input[type=datetime-local].is-next-40px-default-size,
	3785	+.components-text-control__input[type=email].is-next-40px-default-size,
	3786	+.components-text-control__input[type=month].is-next-40px-default-size,
	3787	+.components-text-control__input[type=number].is-next-40px-default-size {
	3788	+ height: 40px;
	3789	+ padding-left: 12px;
	3790	+ padding-right: 12px;
	3791	+}
3719	3792
3720	3793	.components-text-control__input[type=email],
3721	3794	.components-text-control__input[type=url] {
3722	3795	/* rtl:ignore */
		@@ -3740,9 +3813,9 @@
3740	3813	.components-toggle-control__label {
3741	3814	line-height: 16px;
3742	3815	}
3743	3816	.components-toggle-control__label:not(.is-disabled) {
3744		- cursor: var(--wpds-cursor-control, pointer);
	3817	+ cursor: pointer;
3745	3818	}
3746	3819
3747	3820	.components-toggle-control__help {
3748	3821	display: inline-block;
		@@ -3750,9 +3823,9 @@
3750	3823	}
3751	3824
3752	3825	.components-accessible-toolbar {
3753	3826	display: inline-flex;
3754		- border: 1px solid var(--wp-components-color-foreground, var(--wpds-color-foreground-content-neutral, #1e1e1e));
	3827	+ border: 1px solid var(--wp-components-color-foreground, #1e1e1e);
3755	3828	border-radius: 2px;
3756	3829	flex-shrink: 0;
3757	3830	}
3758	3831	.components-accessible-toolbar > .components-toolbar-group:last-child {
		@@ -3817,9 +3890,9 @@
3817	3890	background: transparent;
3818	3891	}
3819	3892	.components-accessible-toolbar .components-button.is-pressed::before,
3820	3893	.components-toolbar .components-button.is-pressed::before {
3821		- background: var(--wp-components-color-foreground, var(--wpds-color-foreground-content-neutral, #1e1e1e));
	3894	+ background: var(--wp-components-color-foreground, #1e1e1e);
3822	3895	}
3823	3896	.components-accessible-toolbar .components-button:focus::before,
3824	3897	.components-toolbar .components-button:focus::before {
3825	3898	box-shadow: inset 0 0 0 1px #fff, 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
		@@ -3847,11 +3920,11 @@
3847	3920	padding: 5px 10px 5px 0;
3848	3921	}
3849	3922	.components-toolbar__control.components-button[data-subscript]::after {
3850	3923	content: attr(data-subscript);
3851		- font-family: -apple-system, system-ui, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
	3924	+ font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
3852	3925	font-size: 13px;
3853		- font-weight: var(--wpds-typography-font-weight-emphasis, 600);
	3926	+ font-weight: 600;
3854	3927	line-height: 12px;
3855	3928	position: absolute;
3856	3929	right: 8px;
3857	3930	bottom: 10px;
		@@ -3861,10 +3934,10 @@
3861	3934	}
3862	3935
3863	3936	.components-toolbar-group {
3864	3937	min-height: 48px;
3865		- border-right: 1px solid var(--wp-components-color-foreground, var(--wpds-color-foreground-content-neutral, #1e1e1e));
3866		- background-color: var(--wp-components-color-background, var(--wpds-color-background-surface-neutral-strong, #fff));
	3938	+ border-right: 1px solid var(--wp-components-color-foreground, #1e1e1e);
	3939	+ background-color: var(--wp-components-color-background, #fff);
3867	3940	display: inline-flex;
3868	3941	flex-shrink: 0;
3869	3942	flex-wrap: wrap;
3870	3943	padding-left: 6px;
		@@ -3885,9 +3958,9 @@
3885	3958	padding-right: 6px;
3886	3959	}
3887	3960	.components-toolbar-group .components-button.components-button svg,
3888	3961	.components-toolbar-group .components-button.has-icon.has-icon svg {
3889		- min-width: var(--wpds-dimension-size-sm, 24px);
	3962	+ min-width: 24px;
3890	3963	}
3891	3964	.components-toolbar-group .components-button.components-button::before,
3892	3965	.components-toolbar-group .components-button.has-icon.has-icon::before {
3893	3966	left: 2px;
		@@ -3896,10 +3969,10 @@
3896	3969
3897	3970	.components-toolbar {
3898	3971	min-height: 48px;
3899	3972	margin: 0;
3900		- border: 1px solid var(--wp-components-color-foreground, var(--wpds-color-foreground-content-neutral, #1e1e1e));
3901		- background-color: var(--wp-components-color-background, var(--wpds-color-background-surface-neutral-strong, #fff));
	3973	+ border: 1px solid var(--wp-components-color-foreground, #1e1e1e);
	3974	+ background-color: var(--wp-components-color-background, #fff);
3902	3975	display: inline-flex;
3903	3976	flex-shrink: 0;
3904	3977	flex-wrap: wrap;
3905	3978	}
		@@ -3920,9 +3993,9 @@
3920	3993	div.components-toolbar > div + div.has-left-divider::before {
3921	3994	display: inline-block;
3922	3995	content: "";
3923	3996	box-sizing: content-box;
3924		- background-color: var(--wpds-color-stroke-surface-neutral, #dbdbdb);
	3997	+ background-color: #ddd;
3925	3998	position: absolute;
3926	3999	top: 8px;
3927	4000	left: -3px;
3928	4001	width: 1px;
		@@ -3930,10 +4003,10 @@
3930	4003	}
3931	4004
3932	4005	.components-tooltip {
3933	4006	background: #000;
3934		- font-family: -apple-system, system-ui, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
3935		- border-radius: var(--wpds-border-radius-md, 4px);
	4007	+ font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
	4008	+ border-radius: 2px;
3936	4009	color: #f0f0f0;
3937	4010	text-align: center;
3938	4011	line-height: 1.4;
3939	4012	font-size: 12px;
		@@ -3972,12 +4045,8 @@
3972	4045	.components-validated-control__wrapper-with-error-delegate:has(input:invalid[data-validity-visible]) .components-form-token-field__input-container:not(:has([aria-expanded=true])) {
3973	4046	--wp-components-color-accent: #cc1818;
3974	4047	border-color: #cc1818;
3975	4048	}
3976		-.components-validated-control__wrapper-with-error-delegate:has(input:invalid[data-validity-visible]) .components-validated-control__content-editable [role=textbox] {
3977		- --wp-components-color-accent: #cc1818;
3978		- border-color: #cc1818;
3979		-}
3980	4049
3981	4050	.components-validated-control__error-delegate {
3982	4051	position: absolute;
3983	4052	top: 0;
		@@ -3991,12 +4060,12 @@
3991	4060	display: flex;
3992	4061	align-items: flex-start;
3993	4062	gap: 4px;
3994	4063	margin: 8px 0 0;
3995		- font-family: -apple-system, system-ui, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
	4064	+ font-family: -apple-system, "system-ui", "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
3996	4065	font-size: 12px;
3997	4066	line-height: 16px;
3998		- color: var(--wp-components-color-gray-700, var(--wpds-color-foreground-content-neutral-weak, #707070));
	4067	+ color: var(--wp-components-color-gray-700, #757575);
3999	4068	animation: components-validated-control__indicator-jump 0.2s cubic-bezier(0.68, -0.55, 0.27, 1.55);
4000	4069	}
4001	4070	.components-validated-control__indicator.is-invalid {
4002	4071	color: #cc1818;