.components-autocomplete__result.components-button:focus:not(:disabled) { box-shadow: inset 0 0 0 1px var(--design-surface-2), 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color); } .components-badge { background-color: color-mix(in srgb,var(--design-surface-2) 90%,var(--base-color)); color: color-mix(in srgb,var(--design-text) 50%,var(--base-color)); } .components-badge:where(.is-default) { background-color: var(--design-surface-3); color: var(--design-text); } .components-badge.is-info { --base-color: var(--design-link); } .components-badge.is-warning { --base-color: var(--design-warning); } .components-badge.is-error { --base-color: var(--design-danger); } .components-badge.is-success { --base-color: var(--design-success); } .components-button-group .components-button { border-color: var(--design-border); color: var(--design-text); } .components-button:focus:not(:active), .components-calendar__day-button:focus-visible, .components-calendar__button-next:focus-visible, .components-calendar__button-previous:focus-visible { outline-color: var(--design-link); } .components-button { background-color: transparent; background-image: none; color: var(--wp-components-color-foreground,var(--wpds-color-foreground-content-neutral,var(--design-text))); } .components-button:hover:not(:disabled,[aria-disabled=true]), .components-button[aria-expanded=true] { color: var(--wp-components-color-accent,var(--wp-admin-theme-color,var(--design-link))); } .components-button.is-primary, .components-button.is-primary:hover:not(:disabled) { background-color: var(--design-link); } .components-button.is-primary, .components-button.is-primary:hover:not(:disabled) { color: var(--wp-components-color-accent-inverted,var(--wpds-color-foreground-interactive-brand-strong,var(--design-surface-2))); } .components-button.is-primary:active:not(:disabled) { background-color: var(--design-link); color: var(--wp-components-color-accent-inverted,var(--wpds-color-foreground-interactive-brand-strong,var(--design-surface-2))); } .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]:active:enabled, .components-button.is-primary[aria-disabled=true]:enabled { background-color: var(--design-link); color: rgba(var(--design-surface-2-rgb), 0.4); } .components-button.is-primary.is-busy, .components-button.is-primary.is-busy:disabled, .components-button.is-primary.is-busy[aria-disabled=true] { background-image: linear-gradient(-45deg,var(--wp-components-color-accent,var(--wp-admin-theme-color,var(--design-link))) 33%,var(--wp-components-color-accent-darker-20,var(--wp-admin-theme-color-darker-20,var(--design-link))) 33%,var(--wp-components-color-accent-darker-20,var(--wp-admin-theme-color-darker-20,var(--design-link))) 70%,var(--wp-components-color-accent,var(--wp-admin-theme-color,var(--design-link))) 70%); color: var(--wp-components-color-accent-inverted,var(--wpds-color-foreground-interactive-brand-strong,var(--design-surface-2))); } .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 { background-color: transparent; background-image: none; color: var(--design-text-muted); } .components-button.is-secondary { background-color: transparent; background-image: none; border-color: var(--wp-components-color-accent,var(--wp-admin-theme-color,var(--design-link))); color: var(--wp-components-color-accent,var(--wp-admin-theme-color,var(--design-link))); } .components-button.is-secondary:hover:not(:disabled,[aria-disabled=true],.is-pressed) { background-color: var(--design-link); border-color: var(--wp-components-color-accent-darker-20,var(--wp-admin-theme-color-darker-20,var(--design-link))); color: var(--wp-components-color-accent-darker-20,var(--wp-admin-theme-color-darker-20,var(--design-link))); } .components-button.is-secondary:focus:not(:active) { border-color: var(--wp-components-color-accent,var(--wp-admin-theme-color,var(--design-link))); } .components-button.is-secondary:disabled:not(:focus), .components-button.is-secondary[aria-disabled=true]:hover:not(:focus), .components-button.is-secondary[aria-disabled=true]:not(:focus) { border-color: var(--wpds-color-stroke-interactive-neutral-disabled,var(--design-border)); } .components-button.is-tertiary { background-color: transparent; background-image: none; color: var(--wp-components-color-accent,var(--wp-admin-theme-color,var(--design-link))); } .components-button.is-tertiary:hover:not(:disabled,[aria-disabled=true],.is-pressed) { background-color: var(--design-link); color: var(--wp-components-color-accent-darker-20,var(--wp-admin-theme-color-darker-20,var(--design-link))); } .components-button.is-tertiary:active:not(:disabled,[aria-disabled=true]) { background-color: var(--design-link); } .components-button.is-destructive { --wp-components-color-accent: var(--design-danger); --wp-components-color-accent-darker-10: var(--design-danger); --wp-components-color-accent-darker-20: var(--design-danger); } .components-button.is-destructive:not(.is-primary):not(.is-secondary):not(.is-tertiary):not(.is-link), .components-button.is-destructive:not(.is-primary):not(.is-secondary):not(.is-tertiary):not(.is-link):hover:not(:disabled,[aria-disabled=true]) { color: var(--design-danger); } .components-button.is-destructive:not(.is-primary):not(.is-secondary):not(.is-tertiary):not(.is-link):active:not(:disabled,[aria-disabled=true]) { background-color: var(--design-border); } .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] { color: var(--design-text-muted); } .components-button.is-destructive.is-secondary:hover:not(:disabled,[aria-disabled=true]), .components-button.is-destructive.is-tertiary:hover:not(:disabled,[aria-disabled=true]) { background-color: rgba(var(--design-danger-hover-rgb), 0.04); } .components-button.is-destructive.is-secondary:active:not(:disabled,[aria-disabled=true]), .components-button.is-destructive.is-tertiary:active:not(:disabled,[aria-disabled=true]) { background-color: rgba(var(--design-danger-active-rgb), 0.08); } .components-button.is-link { background-color: transparent; background-image: none; color: var(--wp-components-color-accent,var(--wp-admin-theme-color,var(--design-link))); } .components-button.is-link:disabled, .components-button.is-link[aria-disabled=true] { color: var(--design-text-muted); } .components-button:not(:disabled,[aria-disabled=true]):active { color: var(--wp-components-color-foreground,var(--wpds-color-foreground-content-neutral,var(--design-text))); } .components-button:disabled, .components-button[aria-disabled=true] { color: var(--design-text-muted); } .components-button.is-busy, .components-button.is-secondary.is-busy, .components-button.is-secondary.is-busy:disabled, .components-button.is-secondary.is-busy[aria-disabled=true] { background-image: linear-gradient(-45deg,var(--design-surface-3) 33%,var(--design-surface-active) 0,var(--design-surface-active) 70%,var(--design-surface-3) 0); } .components-button.is-pressed, .components-button.is-pressed:hover { color: var(--wp-components-color-foreground-inverted,var(--wpds-color-background-surface-neutral,var(--design-surface-2))); } .components-button.is-pressed:hover:not(:disabled,[aria-disabled=true]), .components-button.is-pressed:not(:disabled,[aria-disabled=true]) { background-color: var(--design-text); } .components-button.is-pressed:disabled, .components-button.is-pressed[aria-disabled=true] { color: var(--design-text-muted); } .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) { background-color: var(--design-text-muted); color: var(--wp-components-color-foreground-inverted,var(--wpds-color-background-surface-neutral,var(--design-surface-1))); } .components-calendar { background-color: var(--wp-components-color-background,var(--wpds-color-background-surface-neutral-strong,var(--design-surface-2))); color: var(--wp-components-color-foreground,var(--wpds-color-foreground-content-neutral,var(--design-text))); } .components-calendar__day:has(.components-calendar__day-button:disabled) { color: var(--wp-components-color-gray-400,var(--wpds-color-stroke-interactive-neutral,var(--design-text-muted))); } .components-calendar__day:has(.components-calendar__day-button:focus-visible), .components-calendar__day:has(.components-calendar__day-button:hover:not(:disabled)) { color: var(--wp-components-color-accent,var(--wp-admin-theme-color,var(--design-link))); } .components-calendar__day-button, .components-calendar__button-next, .components-calendar__button-previous { background-color: transparent; background-image: none; color: inherit; } .components-calendar__button-next:disabled, .components-calendar__button-next[aria-disabled=true], .components-calendar__button-previous:disabled, .components-calendar__button-previous[aria-disabled=true] { color: var(--wp-components-color-gray-600,var(--wpds-color-stroke-interactive-neutral,var(--design-text-muted))); } .components-calendar__weekday { color: var(--wp-components-color-gray-700,var(--wpds-color-foreground-content-neutral-weak,var(--design-text-muted))); } .components-calendar__day--selected:not(.components-calendar__range-middle):has(.components-calendar__day-button,.components-calendar__day-button:hover:not(:disabled)) { color: var(--wp-components-color-foreground-inverted,var(--wpds-color-background-surface-neutral,var(--design-surface-2))); } .components-calendar__day--selected:not(.components-calendar__range-middle) .components-calendar__day-button:before { background-color: var(--wp-components-color-foreground,var(--wpds-color-foreground-content-neutral,var(--design-text))); } .components-calendar__day--selected:not(.components-calendar__range-middle) .components-calendar__day-button:disabled:before { background-color: var(--wp-components-color-gray-400,var(--wpds-color-stroke-interactive-neutral,var(--design-text-muted))); } .components-calendar__day--selected:not(.components-calendar__range-middle) .components-calendar__day-button:hover:not(:disabled):before { background-color: var(--wp-components-color-gray-800,var(--wpds-color-foreground-content-neutral,var(--design-text))); } .components-calendar__day--outside { color: var(--wp-components-color-gray-600,var(--wpds-color-stroke-interactive-neutral,var(--design-text-muted))); } .components-calendar__range-middle .components-calendar__day-button:before { background-color: color-mix(in srgb,var(--wp-components-color-accent,var(--wp-admin-theme-color,var(--design-link))) 4%,transparent); } .components-calendar__day--preview svg { color: color-mix(in srgb,var(--wp-components-color-accent,var(--wp-admin-theme-color,var(--design-link))) 16%,transparent); } @media (forced-colors:active) { .components-calendar__day--preview svg { color: inherit; } } .components-checkbox-control__input[type=checkbox] { border-color: var(--design-border-strong); } .components-checkbox-control__input[type=checkbox]::-moz-placeholder { color: rgba(var(--design-text-rgb), 0.62); } .components-checkbox-control__input[type=checkbox]::placeholder { color: rgba(var(--design-text-rgb), 0.62); } .components-checkbox-control__input[type=checkbox]:focus { box-shadow: 0 0 0 2px var(--design-surface-2), 0 0 0 4px var(--wp-admin-theme-color); } .components-checkbox-control__input[type=checkbox]:checked:before, .components-checkbox-control__input[type=checkbox][aria-checked=mixed]:before { color: var(--design-surface-2); } .components-checkbox-control__input[type=checkbox]:disabled, .components-checkbox-control__input[type=checkbox][aria-disabled=true] { background-color: var(--design-surface-3); border-color: var(--design-border-strong); } .components-checkbox-control__input[type=checkbox] { background-color: var(--design-surface-2); color: var(--design-text); } .components-checkbox-control__input[type=checkbox]:focus { box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--design-surface-2), 0 0 0 calc(var(--wp-admin-border-width-focus)*2) var(--wp-admin-theme-color); } .components-checkbox-control__input[type=checkbox]:not(:disabled):is(:checked,:indeterminate) { background-color: var(--design-link); border-color: var(--wp-components-color-accent,var(--wp-admin-theme-color,var(--design-link))); } svg.components-checkbox-control__checked, svg.components-checkbox-control__indeterminate { fill: var(--design-surface-2); } .components-checkbox-control:has(:disabled) svg.components-checkbox-control__checked, .components-checkbox-control:has(:disabled) svg.components-checkbox-control__indeterminate { fill: var(--wp-components-color-gray-400,var(--wpds-color-stroke-interactive-neutral,var(--design-text-muted))); } .components-circular-option-picker__option { background-color: transparent; background-image: none; } .components-circular-option-picker__option:after { box-shadow: inset 0 0 0 1px var(--design-border); } .components-circular-option-picker__option:focus:after { border-color: var(--design-border-strong); box-shadow: inset 0 0 0 2px var(--design-surface-2); } .components-circular-option-picker__option.components-button:focus { background-color: transparent; } .components-circular-option-picker__button-action .components-circular-option-picker__option { background-color: var(--design-surface-2); color: var(--design-surface-2); } .component-color-indicator { background: var(--design-surface-2) linear-gradient(-45deg,transparent 48%,var(--design-surface-active) 0,var(--design-surface-active) 52%,transparent 0); box-shadow: inset 0 0 0 1px var(--design-border); } input.components-combobox-control__input[type=text] { background-color: var(--design-surface-2); color: var(--wp-components-color-foreground,var(--wpds-color-foreground-content-neutral,var(--design-text))); } .components-combobox-control__suggestions-container { border-color: var(--design-border); box-shadow: 0 0 0 transparent; } .components-combobox-control__suggestions-container:focus, .components-combobox-control__suggestions-container:focus-within { border-color: var(--wp-components-color-accent,var(--wp-admin-theme-color,var(--design-link))); box-shadow: 0 0 0 .5px var(--wp-components-color-accent, var(--wp-admin-theme-color, var(--design-link)) ); } .components-combobox-control__suggestions-container::-moz-placeholder { color: rgba(var(--design-text-rgb), 0.62); } .components-combobox-control__suggestions-container::placeholder { color: rgba(var(--design-text-rgb), 0.62); } .components-color-palette__custom-color-button { background-color: transparent; background-image: none; box-shadow: inset 0 0 0 1px var(--design-border); } .components-color-palette__custom-color-button:focus { box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-components-color-accent, var(--wp-admin-theme-color, var(--design-link)) ); } .components-color-palette__custom-color-button:after, .components-custom-gradient-picker__gradient-bar.has-gradient { background-image: repeating-linear-gradient(45deg,var(--design-surface-active) 25%,transparent 0,transparent 75%,var(--design-surface-active) 0,var(--design-surface-active)),repeating-linear-gradient(45deg,var(--design-surface-active) 25%,transparent 0,transparent 75%,var(--design-surface-active) 0,var(--design-surface-active)); } .components-color-palette__custom-color-text-wrapper { box-shadow: inset 0 -1px 0 0 var(--design-border), inset 1px 0 0 0 var(--design-border), inset -1px 0 0 0 var(--design-border); } .components-color-palette__custom-color-name { color: var(--wp-components-color-foreground,var(--wpds-color-foreground-content-neutral,var(--design-text))); } .components-color-palette__custom-color-value { color: var(--design-text-muted); } .components-custom-gradient-picker__gradient-bar .components-custom-gradient-picker__insert-point-dropdown { background-color: var(--design-surface-2); color: var(--design-text); } .components-custom-gradient-picker__gradient-bar .components-custom-gradient-picker__control-point-button { box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--design-surface-2), var(--design-shadow-1); } .components-custom-gradient-picker__gradient-bar .components-custom-gradient-picker__control-point-button.is-active, .components-custom-gradient-picker__gradient-bar .components-custom-gradient-picker__control-point-button:focus { box-shadow: inset 0 0 0 calc(var(--wp-admin-border-width-focus)*2) var(--design-surface-2), var(--design-shadow-1); } .components-drop-zone .components-drop-zone__content { background-color: var(--wp-components-color-accent,var(--wp-admin-theme-color,var(--design-link))); color: var(--design-surface-2); } .components-dropdown__content .components-menu-group+.components-menu-group { border-top-color: var(--design-border); } .components-dropdown__content.is-alternate .components-menu-group+.components-menu-group { border-color: var(--design-border); } .components-dropdown-menu__menu .components-dropdown-menu__menu-item.has-separator:before, .components-dropdown-menu__menu .components-menu-item.has-separator:before { background-color: var(--wpds-color-stroke-surface-neutral,var(--design-border-strong)); } .components-dropdown-menu__menu .components-dropdown-menu__menu-item.is-active .dashicon, .components-dropdown-menu__menu .components-dropdown-menu__menu-item.is-active svg, .components-dropdown-menu__menu .components-menu-item.is-active .dashicon, .components-dropdown-menu__menu .components-menu-item.is-active svg { background-color: var(--design-text); box-shadow: 0 0 0 1px var(--design-border-strong); color: var(--design-surface-1); } .components-duotone-picker__color-indicator>.components-button { background: linear-gradient(-45deg,transparent 48%,var(--design-surface-active) 0,var(--design-surface-active) 52%,transparent 0); color: transparent; } .components-duotone-picker__color-indicator>.components-button.is-pressed:hover:not(:disabled) { background: linear-gradient(-45deg,transparent 48%,var(--design-surface-hover) 0,var(--design-surface-hover) 52%,transparent 0); color: transparent; } .components-duotone-picker__color-indicator>.components-button:hover:not(:disabled):not([aria-disabled=true]), .components-duotone-picker__color-indicator>.components-button:not([aria-disabled=true]):active { color: transparent; } .components-external-link, .components-external-link:visited { color: var(--wpds-color-foreground-interactive-brand,var(--wp-admin-theme-color,var(--design-link))); } .components-external-link:active, .components-external-link:hover { color: var(--wpds-color-foreground-interactive-brand-active,color-mix(in oklch,var(--wp-admin-theme-color,var(--design-link)) 52%,var(--design-text))); } .components-external-link:focus { outline-color: var(--design-link); } .components-form-toggle .components-form-toggle__track { background-color: var(--design-surface-2); border-color: var(--design-border); } .components-form-toggle .components-form-toggle__thumb { background-color: var(--design-text); border-color: transparent; box-shadow: var(--design-shadow-2); } .components-form-toggle.is-checked .components-form-toggle__track { background-color: var(--wp-components-color-accent,var(--wp-admin-theme-color,var(--design-link))); border-color: var(--wp-components-color-accent,var(--wp-admin-theme-color,var(--design-link))); } .components-form-toggle .components-form-toggle__input:focus+.components-form-toggle__track { box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--design-surface-2), 0 0 0 calc(var(--wp-admin-border-width-focus)*2) var(--wp-components-color-accent, var(--wp-admin-theme-color, var(--design-link)) ); } .components-form-toggle.is-checked .components-form-toggle__thumb { background-color: var(--design-surface-2); } .components-disabled .components-form-toggle .components-form-toggle__track, .components-form-toggle.is-disabled .components-form-toggle__track { background-color: var(--wp-components-color-gray-100,var(--wpds-color-background-surface-neutral,var(--design-surface-2))); border-color: var(--wpds-color-stroke-interactive-neutral-disabled,var(--design-border)); } @media (forced-colors:active) { .components-disabled .components-form-toggle .components-form-toggle__track, .components-form-toggle.is-disabled .components-form-toggle__track { border-color: GrayText; } } .components-disabled .components-form-toggle .components-form-toggle__thumb, .components-form-toggle.is-disabled .components-form-toggle__thumb { background-color: var(--wp-components-color-gray-400,var(--wpds-color-stroke-interactive-neutral,var(--design-text-muted))); } @media (forced-colors:active) { .components-disabled .components-form-toggle .components-form-toggle__thumb, .components-form-toggle.is-disabled .components-form-toggle__thumb { border-color: GrayText; } } .components-disabled .components-form-toggle.is-checked .components-form-toggle__track, .components-form-toggle.is-disabled.is-checked .components-form-toggle__track { background-color: var(--wp-components-color-gray-400,var(--wpds-color-stroke-interactive-neutral,var(--design-text-muted))); border-color: var(--wp-components-color-gray-400,var(--wpds-color-stroke-interactive-neutral,var(--design-text-muted))); } @media (forced-colors:active) { .components-disabled .components-form-toggle.is-checked .components-form-toggle__track, .components-form-toggle.is-disabled.is-checked .components-form-toggle__track { border-color: GrayText; } } .components-disabled .components-form-toggle.is-checked .components-form-toggle__thumb, .components-form-toggle.is-disabled.is-checked .components-form-toggle__thumb { background-color: var(--design-surface-2); } .components-form-token-field__input-container { border-color: var(--design-border-strong); box-shadow: 0 0 0 transparent; } .components-form-token-field__input-container:focus { border-color: var(--wp-components-color-accent,var(--wp-admin-theme-color,var(--design-link))); box-shadow: 0 0 0 .5px var(--wp-components-color-accent, var(--wp-admin-theme-color, var(--design-link)) ); } .components-form-token-field__input-container::-moz-placeholder { color: rgba(var(--design-text-rgb), 0.62); } .components-form-token-field__input-container::placeholder { color: rgba(var(--design-text-rgb), 0.62); } .components-form-token-field__input-container.is-disabled { background-color: var(--design-surface-2); border-color: var(--wp-components-color-gray-400,var(--wpds-color-stroke-interactive-neutral,var(--design-border-strong))); } .components-form-token-field__input-container.is-active { border-color: var(--wp-components-color-accent,var(--wp-admin-theme-color,var(--design-link))); box-shadow: 0 0 0 .5px var(--wp-components-color-accent, var(--wp-admin-theme-color, var(--design-link)) ); } .components-form-token-field__input-container input[type=text].components-form-token-field__input { color: var(--wp-components-color-foreground,var(--wpds-color-foreground-content-neutral,var(--design-text))); } .components-form-token-field__token { color: var(--design-text); } .components-form-token-field__token.is-success .components-form-token-field__remove-token, .components-form-token-field__token.is-success .components-form-token-field__token-text { background-color: var(--design-success); } .components-form-token-field__token.is-error .components-form-token-field__remove-token, .components-form-token-field__token.is-error .components-form-token-field__token-text { background-color: var(--design-danger); } .components-form-token-field__token.is-validating .components-form-token-field__remove-token, .components-form-token-field__token.is-validating .components-form-token-field__token-text { color: var(--design-text-muted); } .components-form-token-field__token.is-disabled .components-form-token-field__remove-token.components-button, .components-form-token-field__token.is-disabled .components-form-token-field__token-text { background-color: var(--design-surface-2); color: var(--wp-components-color-gray-600,var(--wpds-color-stroke-interactive-neutral,var(--design-text-muted))); } .components-form-token-field__token.is-borderless .components-form-token-field__token-text { background-color: transparent; background-image: none; } .components-form-token-field__token.is-borderless:not(.is-disabled) .components-form-token-field__token-text { color: var(--wp-components-color-accent,var(--wp-admin-theme-color,var(--design-link))); } .components-form-token-field__token.is-borderless .components-form-token-field__remove-token { background-color: transparent; background-image: none; color: var(--design-text-muted); } .components-form-token-field__token.is-borderless.is-success .components-form-token-field__token-text { color: var(--design-success); } .components-form-token-field__token.is-borderless.is-error .components-form-token-field__token-text { color: var(--design-danger); } .components-form-token-field__token.is-borderless.is-validating .components-form-token-field__token-text, .components-form-token-field__remove-token.components-button, .components-form-token-field__remove-token.components-button:hover:not(:disabled) { color: var(--design-text); } .components-form-token-field__remove-token.components-button, .components-form-token-field__token-text { background-color: var(--design-surface-active); } .components-form-token-field__suggestions-list { box-shadow: inset 0 1px 0 0 var(--design-border); } .components-form-token-field__suggestion { color: var(--wp-components-color-foreground,var(--wpds-color-foreground-content-neutral,var(--design-text))); } .components-form-token-field__suggestion.is-selected { background-color: var(--design-link); color: var(--wp-components-color-foreground-inverted,var(--wpds-color-background-surface-neutral,var(--design-surface-2))); } .components-form-token-field__suggestion[aria-disabled=true] { color: var(--design-text-muted); } .components-form-token-field__suggestion[aria-disabled=true].is-selected { background-color: var(--design-link); } .components-guide .components-guide__page-control .components-button { color: var(--design-surface-2); } .components-guide .components-guide__page-control li[aria-current=step] .components-button { color: var(--wp-components-color-accent,var(--wp-admin-theme-color,var(--design-link))); } [role=region].interface-interface-skeleton__content:focus-visible:after, .is-focusing-regions .editor-post-publish-panel, .is-focusing-regions .interface-interface-skeleton__actions .editor-layout__toggle-entities-saved-states-panel, .is-focusing-regions .interface-interface-skeleton__actions .editor-layout__toggle-publish-panel, .is-focusing-regions .interface-interface-skeleton__sidebar .editor-layout__toggle-sidebar-panel, .is-focusing-regions [role=region]:focus:after, .is-focusing-regions.is-distraction-free .interface-interface-skeleton__header .edit-post-header { box-shadow: inset 0 0 0 calc(var(--wp-admin-border-width-focus)*2/var(--wp-block-editor-iframe-zoom-out-scale, 1) + .5px) var(--design-surface-2); } .components-menu-group+.components-menu-group { border-top-color: var(--design-border); } .components-menu-group__label { color: var(--design-text-muted); } .components-menu-item__button.components-button:disabled.is-tertiary, .components-menu-item__button.components-button[aria-disabled=true].is-tertiary { background-color: transparent; background-image: none; color: var(--wp-components-color-accent-darker-10,var(--wp-admin-theme-color-darker-10,var(--design-link))); } .components-menu-item__button:disabled.is-tertiary, .components-menu-item__button[aria-disabled=true].is-tertiary { color: var(--wp-components-color-accent-darker-10,var(--wp-admin-theme-color-darker-10,var(--design-link))); } .components-menu-item__info { color: var(--design-text-muted); } .components-menu-item__shortcut { color: currentColor; } .components-modal__screen-overlay { background-color: rgba(var(--design-surface-3-rgb), 0.8); } .components-modal__frame { background-color: var(--design-surface-2); box-shadow: var(--design-shadow-3); color: var(--design-text); } .components-modal__frame h1, .components-modal__frame h2, .components-modal__frame h3 { color: var(--design-text); } .components-modal__header { border-bottom-color: transparent; } .components-modal__content.has-scrolled-content:not(.hide-header) .components-modal__header { border-bottom-color: var(--wpds-color-stroke-surface-neutral,var(--design-border)); } .components-modal__content.is-scrollable:focus-visible { box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-components-color-accent, var(--wp-admin-theme-color, var(--design-link)) ); } .components-notice { --wp-components-notice-background-color: var(--wpds-color-background-surface-info-weak,var(--design-info-subtle)); --wp-components-notice-border-color: var(--wpds-color-stroke-surface-info,var(--design-link)); --wp-components-notice-text-color: var(--wpds-color-foreground-content-info,var(--design-link)); background-color: var(--wp-components-notice-background-color); border: var(--wpds-border-width-xs,1px) solid var(--wp-components-notice-border-color); color: var(--wp-components-notice-text-color); } .components-notice.is-success { --wp-components-notice-background-color: var(--wpds-color-background-surface-success-weak,var(--design-success-subtle)); --wp-components-notice-border-color: var(--wpds-color-stroke-surface-success,var(--design-success)); --wp-components-notice-text-color: var(--wpds-color-foreground-content-success,var(--design-success)); } .components-notice.is-warning { --wp-components-notice-background-color: var(--wpds-color-background-surface-warning-weak,var(--design-warning-subtle)); --wp-components-notice-border-color: var(--wpds-color-stroke-surface-warning,var(--design-warning)); --wp-components-notice-text-color: var(--wpds-color-foreground-content-warning,var(--design-warning)); } .components-notice.is-error { --wp-components-notice-background-color: var(--wpds-color-background-surface-error-weak,var(--design-danger-subtle)); --wp-components-notice-border-color: var(--wpds-color-stroke-surface-error,var(--design-danger-border)); --wp-components-notice-text-color: var(--wpds-color-foreground-content-error,var(--design-danger)); } .components-notice__dismiss { color: var(--wpds-color-foreground-interactive-neutral,var(--design-text)); } .components-notice__dismiss:not(:disabled):not([aria-disabled=true]):focus, .components-notice__dismiss:not(:disabled):not([aria-disabled=true]):not(.is-secondary):active, .components-notice__dismiss:not(:disabled):not([aria-disabled=true]):not(.is-secondary):hover { color: var(--wpds-color-foreground-interactive-neutral-active,var(--design-text)); } .components-panel { background-color: var(--design-surface-2); border-color: var(--design-border); } .components-panel__body { border-bottom-color: var(--design-border); border-top-color: var(--design-border); } .components-panel__header { border-bottom-color: var(--design-border); } .components-panel__header h2 { color: inherit; } .components-panel__body>.components-panel__body-title:hover { background-color: var(--design-surface-hover); } .components-panel__body-toggle.components-button, .components-panel__body-toggle.components-button .components-panel__arrow { color: var(--design-text); } .components-panel__icon { color: var(--design-text-muted); } .components-placeholder.components-placeholder { background-color: var(--design-surface-2); box-shadow: inset 0 0 0 1px var(--design-border-strong); color: var(--design-text); } .components-placeholder__label>svg { fill: currentColor; } @media (forced-colors:active) { .components-placeholder__label>svg { fill: CanvasText; } } .components-placeholder__input[type=url], .components-radio-control__input[type=radio] { border-color: var(--design-border-strong); } .components-placeholder__input[type=url]::-moz-placeholder { color: rgba(var(--design-text-rgb), 0.62); } .components-placeholder__input[type=url]::placeholder { color: rgba(var(--design-text-rgb), 0.62); } .components-placeholder.has-illustration { background-color: transparent; box-shadow: none; color: inherit; } .is-dark-theme .components-placeholder.has-illustration { background-color: rgba(var(--design-text-rgb), 0.1); } .components-popover__content { background-color: var(--design-surface-2); box-shadow: 0 0 0 1px var(--design-border), var(--design-shadow-3); } .is-alternate .components-popover__content { box-shadow: 0 0 0 1px var(--design-border-strong); } .is-unstyled .components-popover__content { box-shadow: none; } .components-popover.is-expanded .components-popover__content { box-shadow: 0 -1px 0 0 var(--design-border); } .components-popover.is-expanded.is-alternate .components-popover__content { box-shadow: 0 -1px 0 var(--design-border-strong); } .components-popover__header, .components-popover__arrow:before { background-color: var(--design-surface-2); } .components-popover__triangle-bg { fill: var(--design-surface-2); } .components-popover__triangle-border { fill: transparent; stroke: var(--design-text-muted); } .is-alternate .components-popover__triangle-border { stroke: var(--design-text); } .components-radio-control__input[type=radio]:checked:before { background-color: var(--design-surface-2); border-color: var(--design-surface-2); } .components-radio-control__input[type=radio]:focus { box-shadow: 0 0 0 2px var(--design-surface-2), 0 0 0 4px var(--wp-admin-theme-color); } .components-radio-control__input[type=radio]:focus { box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--design-surface-2), 0 0 0 calc(var(--wp-admin-border-width-focus)*2) var(--wp-admin-theme-color); } .components-radio-control__input[type=radio]:checked { background-color: var(--design-link); border-color: var(--wp-components-color-accent,var(--wp-admin-theme-color,var(--design-link))); } .components-radio-control__input[type=radio]:disabled { background-color: var(--design-surface-2); border-color: var(--design-border-strong); } .components-radio-control__input[type=radio]:disabled:checked:before { border-color: var(--wp-components-color-gray-400,var(--wpds-color-stroke-interactive-neutral,var(--design-border-strong))); } .components-resizable-box__handle:after { background-color: var(--design-surface-2); box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-components-color-accent, var(--wp-admin-theme-color, var(--design-link)) ), var(--design-shadow-2); } .components-resizable-box__side-handle:before { background-color: var(--design-link); } .components-select-control__input { -webkit-tap-highlight-color: rgba(var(--design-text-rgb), 0) !important; } .components-snackbar { background-color: rgba(var(--design-text-rgb), 0.85); box-shadow: var(--design-shadow-2); color: var(--design-surface-1); } .components-snackbar:focus { box-shadow: inset 0 0 0 1px var(--design-surface-2), 0 0 0 var(--wp-admin-border-width-focus) var(--wp-components-color-accent, var(--wp-admin-theme-color, var(--design-link)) ); } .components-snackbar__action.components-button, .components-snackbar__action.components-external-link { color: var(--design-surface-2); } .components-snackbar__action.components-button:focus, .components-snackbar__action.components-external-link:focus { outline-color: var(--design-surface-2); } .components-snackbar__action.components-button:hover { color: currentColor; } .components-tab-panel__tabs-item { background-color: transparent; background-image: none; box-shadow: none; color: var(--wpds-color-foreground-interactive-neutral,var(--design-text)); } .components-tab-panel__tabs-item:disabled, .components-tab-panel__tabs-item[aria-disabled=true] { color: var(--wpds-color-foreground-interactive-neutral-disabled,var(--design-text-muted)); } .components-tab-panel__tabs-item:not(:disabled,[aria-disabled=true]):is(:hover,:focus-visible) { color: var(--wpds-color-foreground-interactive-neutral-active,var(--design-text)); } .components-tab-panel__tabs-item:after { background-color: var(--design-text-muted); } .components-tab-panel__tabs-item:focus-visible:before, .components-tab-panel__tab-content:focus-visible { 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, var(--design-link)) ); } .components-tab-panel__tabs[aria-orientation=vertical] .components-tab-panel__tabs-item.is-active { background-color: var(--design-surface-active); } .components-text-control__input { background-color: var(--design-surface-2); border-color: var(--design-border-strong); box-shadow: 0 0 0 transparent; color: var(--wp-components-color-foreground,var(--wpds-color-foreground-content-neutral,var(--design-text))); } .components-text-control__input[type=color], .components-text-control__input[type=date], .components-text-control__input[type=datetime-local], .components-text-control__input[type=datetime], .components-text-control__input[type=email], .components-text-control__input[type=month], .components-text-control__input[type=number], .components-text-control__input[type=password], .components-text-control__input[type=tel], .components-text-control__input[type=text], .components-text-control__input[type=time], .components-text-control__input[type=url], .components-text-control__input[type=week] { background-color: var(--design-surface-2); border-color: var(--design-border-strong); color: var(--wp-components-color-foreground,var(--wpds-color-foreground-content-neutral,var(--design-text))); } .components-text-control__input:focus, .components-text-control__input[type=color]:focus, .components-text-control__input[type=date]:focus, .components-text-control__input[type=datetime-local]:focus, .components-text-control__input[type=datetime]:focus, .components-text-control__input[type=email]:focus, .components-text-control__input[type=month]:focus, .components-text-control__input[type=number]:focus, .components-text-control__input[type=password]:focus, .components-text-control__input[type=tel]:focus, .components-text-control__input[type=text]:focus, .components-text-control__input[type=time]:focus, .components-text-control__input[type=url]:focus, .components-text-control__input[type=week]:focus { border-color: var(--wp-components-color-accent,var(--wp-admin-theme-color,var(--design-link))); box-shadow: 0 0 0 .5px var(--wp-components-color-accent, var(--wp-admin-theme-color, var(--design-link)) ); } .components-text-control__input::-moz-placeholder, .components-text-control__input[type=color]::-moz-placeholder, .components-text-control__input[type=date]::-moz-placeholder, .components-text-control__input[type=datetime-local]::-moz-placeholder, .components-text-control__input[type=datetime]::-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, .components-text-control__input[type=password]::-moz-placeholder, .components-text-control__input[type=tel]::-moz-placeholder, .components-text-control__input[type=text]::-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 { color: rgba(var(--design-text-rgb), 0.62); } .components-text-control__input::placeholder, .components-text-control__input[type=color]::placeholder, .components-text-control__input[type=date]::placeholder, .components-text-control__input[type=datetime-local]::placeholder, .components-text-control__input[type=datetime]::placeholder, .components-text-control__input[type=email]::placeholder, .components-text-control__input[type=month]::placeholder, .components-text-control__input[type=number]::placeholder, .components-text-control__input[type=password]::placeholder, .components-text-control__input[type=tel]::placeholder, .components-text-control__input[type=text]::placeholder, .components-text-control__input[type=time]::placeholder, .components-text-control__input[type=url]::placeholder, .components-text-control__input[type=week]::placeholder { color: rgba(var(--design-text-rgb), 0.62); } .components-text-control__input, .components-text-control__input[type=color], .components-text-control__input[type=date], .components-text-control__input[type=datetime-local], .components-text-control__input[type=datetime], .components-text-control__input[type=email], .components-text-control__input[type=month], .components-text-control__input[type=number], .components-text-control__input[type=password], .components-text-control__input[type=tel], .components-text-control__input[type=text], .components-text-control__input[type=time], .components-text-control__input[type=url], .components-text-control__input[type=week] { border-color: var(--wp-components-color-gray-600,var(--wpds-color-stroke-interactive-neutral,var(--design-border-strong))); } .components-text-control__input::-moz-placeholder, .components-text-control__input[type=color]::-moz-placeholder, .components-text-control__input[type=date]::-moz-placeholder, .components-text-control__input[type=datetime-local]::-moz-placeholder, .components-text-control__input[type=datetime]::-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, .components-text-control__input[type=password]::-moz-placeholder, .components-text-control__input[type=tel]::-moz-placeholder, .components-text-control__input[type=text]::-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 { color: color-mix(in srgb,var(--wp-components-color-foreground,var(--wpds-color-foreground-content-neutral,var(--design-text))),transparent 38%); } .components-text-control__input::placeholder, .components-text-control__input[type=color]::placeholder, .components-text-control__input[type=date]::placeholder, .components-text-control__input[type=datetime-local]::placeholder, .components-text-control__input[type=datetime]::placeholder, .components-text-control__input[type=email]::placeholder, .components-text-control__input[type=month]::placeholder, .components-text-control__input[type=number]::placeholder, .components-text-control__input[type=password]::placeholder, .components-text-control__input[type=tel]::placeholder, .components-text-control__input[type=text]::placeholder, .components-text-control__input[type=time]::placeholder, .components-text-control__input[type=url]::placeholder, .components-text-control__input[type=week]::placeholder { color: color-mix(in srgb,var(--wp-components-color-foreground,var(--wpds-color-foreground-content-neutral,var(--design-text))),transparent 38%); } .components-tip { color: var(--design-text-muted); } .components-tip svg { fill: var(--design-warning); } .components-accessible-toolbar { border-color: var(--design-border); } .components-accessible-toolbar .components-button:focus:not(:disabled), .components-toolbar .components-button:focus:not(:disabled) { box-shadow: none; } .components-accessible-toolbar .components-button.is-pressed, .components-accessible-toolbar .components-button.is-pressed:hover, .components-toolbar .components-button.is-pressed, .components-toolbar .components-button.is-pressed:hover { background-color: transparent; background-image: none; } .components-accessible-toolbar .components-button.is-pressed:before, .components-toolbar .components-button.is-pressed:before { background-color: var(--design-text); } .components-accessible-toolbar .components-button:focus:before, .components-toolbar .components-button:focus:before { box-shadow: inset 0 0 0 1px var(--design-surface-2), 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color); } .components-toolbar__control.components-button:not(:disabled).is-pressed[data-subscript]:after { color: var(--design-surface-2); } .components-toolbar-group { background-color: var(--wp-components-color-background,var(--wpds-color-background-surface-neutral-strong,var(--design-surface-2))); border-right-color: var(--design-border); } .components-toolbar { background-color: var(--wp-components-color-background,var(--wpds-color-background-surface-neutral-strong,var(--design-surface-2))); border-color: var(--design-border); } div.components-toolbar>div+div.has-left-divider:before { background-color: var(--wpds-color-stroke-surface-neutral,var(--design-border-strong)); } .components-tooltip { background-color: var(--design-text); box-shadow: var(--design-shadow-2); color: var(--design-surface-1); } .components-validated-control:has(:is(input,select):invalid[data-validity-visible]) .components-input-control__backdrop { --wp-components-color-accent: var(--design-danger); border-color: var(--design-danger); } .components-validated-control :is(textarea,input[type=text]):invalid[data-validity-visible] { --wp-admin-theme-color: var(--design-danger); --wp-components-color-accent: var(--design-danger); border-color: var(--design-danger); } .components-validated-control .components-combobox-control__suggestions-container:has(input:invalid[data-validity-visible]):not(:has([aria-expanded=true])) { --wp-components-color-accent: var(--design-danger); } .components-validated-control__wrapper-with-error-delegate:has(select:invalid[data-validity-visible]) .components-input-control__backdrop { --wp-components-color-accent: var(--design-danger); border-color: var(--design-danger); } .components-validated-control__wrapper-with-error-delegate:has(input[type=radio]:invalid[data-validity-visible]) { --wp-components-color-accent: var(--design-danger); } .components-validated-control__wrapper-with-error-delegate:has(input:invalid[data-validity-visible]) .components-form-token-field__input-container:not(:has([aria-expanded=true])), .components-validated-control__wrapper-with-error-delegate:has(input:invalid[data-validity-visible]) .components-validated-control__content-editable [role=textbox] { --wp-components-color-accent: var(--design-danger); border-color: var(--design-danger); } .components-validated-control__indicator { color: var(--wp-components-color-gray-700,var(--wpds-color-foreground-content-neutral-weak,var(--design-text-muted))); } .components-validated-control__indicator.is-invalid { color: var(--design-danger); } .components-validated-control__indicator.is-valid { color: color-mix(in srgb,var(--design-text) 30%,var(--design-success)); } :root { --wp-admin-theme-color: var(--design-link); --wp-admin-theme-color-darker-10: var(--design-link); --wp-admin-theme-color-darker-20: var(--design-link); } .preferences-modal__section-description { color: var(--design-text-muted); } :root { --wp-block-synced-color: var(--design-info); --wp-editor-canvas-background: var(--design-surface-active); --wp-admin-theme-color: var(--design-info); --wp-admin-theme-color-darker-10: var(--design-link); --wp-admin-theme-color-darker-20: var(--design-info); } .block-editor-global-styles-background-panel__inspector-media-replace-container.is-open { background-color: var(--design-surface-3); } .block-editor-global-styles-background-panel__image-tools-panel-item { border-color: var(--design-border); } .block-editor-global-styles-background-panel__image-tools-panel-item button.components-button, .block-editor-block-inspector h2, .block-editor-block-inspector h3 { color: var(--design-text); } .block-editor-global-styles-background-panel__dropdown-toggle { background-color: transparent; background-image: none; } .block-editor-global-styles-background-panel__inspector-image-indicator { background: var(--design-surface-2) linear-gradient(-45deg,transparent 48%,var(--design-surface-active) 0,var(--design-surface-active) 52%,transparent 0); box-shadow: inset 0 0 0 1px var(--design-border); } .block-editor-global-styles-background-panel__dropdown-content-wrapper .components-focal-point-picker-wrapper { background-color: var(--design-surface-3); border-color: var(--design-border); } .block-editor-block-inspector .components-panel__body, .block-editor-block-inspector__no-block-tools { border-top-color: var(--design-border); } .block-editor-block-inspector__no-block-tools, .block-editor-block-inspector__no-blocks { background-color: var(--design-surface-2); } .block-editor-block-list__insertion-point-indicator { background: var(--wp-admin-theme-color); } .block-editor-block-list__empty-block-inserter .block-editor-inserter__toggle.components-button.has-icon, .block-editor-block-list__insertion-point-inserter .block-editor-inserter__toggle.components-button.has-icon { background-color: var(--design-text); color: var(--design-surface-1); } .block-editor-block-list__empty-block-inserter .block-editor-inserter__toggle.components-button.has-icon:hover, .block-editor-block-list__insertion-point-inserter .block-editor-inserter__toggle.components-button.has-icon:hover { background: var(--wp-admin-theme-color); color: var(--design-surface-2); } .block-editor-block-list__insertion-point-inserter .block-editor-inserter__toggle.components-button.has-icon { background: var(--wp-admin-theme-color); } .block-editor-block-list__insertion-point-inserter .block-editor-inserter__toggle.components-button.has-icon:hover { background-color: var(--design-text); } .components-popover.block-editor-block-list__block-popover .block-editor-block-contextual-toolbar { border-color: var(--design-border); } .components-popover.block-editor-block-list__block-popover .block-editor-block-toolbar .components-toolbar, .components-popover.block-editor-block-list__block-popover .block-editor-block-toolbar .components-toolbar-group { border-right-color: var(--design-border); } .components-popover.block-editor-block-list__block-popover .block-editor-block-parent-selector .block-editor-block-parent-selector__button { background-color: var(--design-surface-2); border-color: var(--design-border-strong); } .show-icon-labels .components-popover.block-editor-block-list__block-popover .block-editor-block-mover__move-button-container, .show-icon-labels .components-popover.block-editor-block-list__block-popover .block-editor-block-toolbar__block-controls .block-editor-block-mover, .show-icon-labels .block-editor-block-toolbar__block-controls .block-editor-block-lock-toolbar, .block-editor-block-compare__wrapper .block-editor-block-compare__converted { border-left-color: var(--design-border); } .block-editor-block-lock-modal__checklist-item .block-editor-block-lock-modal__lock-icon { fill: var(--design-text); } .block-editor-block-lock-modal__checklist-item:hover { background-color: var(--design-surface-hover); } .block-editor-block-lock-modal__template-lock { border-top-color: var(--design-border); } .block-editor-block-allowed-blocks-modal__actions { background-color: var(--design-surface-2); border-top-color: var(--design-border); } .block-editor-block-breadcrumb__button.block-editor-block-breadcrumb__button, .block-editor-block-breadcrumb__current, .block-editor-block-card { color: var(--design-text); } .block-editor-block-compare__wrapper .block-editor-block-compare__html { border-bottom-color: var(--design-border); color: var(--design-text); } .block-editor-block-compare__wrapper .block-editor-block-compare__html span { background-color: var(--design-success-subtle); } .block-editor-block-compare__wrapper .block-editor-block-compare__html span.block-editor-block-compare__added { background-color: var(--design-success-border); } .block-editor-block-compare__wrapper .block-editor-block-compare__html span.block-editor-block-compare__removed { background-color: var(--design-danger); } .block-editor-block-draggable-chip { background-color: var(--design-text); box-shadow: var(--design-shadow-2); color: var(--design-surface-1); } .block-editor-block-draggable-chip svg { fill: currentColor; } .block-editor-block-draggable-chip__disabled.block-editor-block-draggable-chip__disabled .block-editor-block-draggable-chip__disabled-icon { background: transparent linear-gradient(-45deg,transparent 47.5%,var(--design-surface-2) 0,var(--design-surface-2) 52.5%,transparent 0); box-shadow: inset 0 0 0 1.5px var(--design-surface-2); } .block-draggable-invalid-drag-token .block-editor-block-draggable-chip__disabled.block-editor-block-draggable-chip__disabled { background-color: var(--design-text-muted); box-shadow: var(--design-shadow-2); } .block-editor-block-manager__category-title { background-color: var(--design-surface-2); } .block-editor-block-manager__category-title, .block-editor-block-manager__checklist-item { border-bottom-color: var(--design-border); } .block-editor-block-manager__checklist-item .block-editor-block-icon { fill: var(--design-text); } .block-editor-block-manager__results, .block-editor-patterns__grid-pagination-wrapper .block-editor-patterns__grid-pagination { border-top-color: var(--design-border); } .components-button.block-editor-block-mover-button:focus:before, .components-button.block-editor-block-mover-button:focus:enabled { box-shadow: none; } .components-button.block-editor-block-mover-button:focus-visible:before { box-shadow: inset 0 0 0 1px var(--design-surface-2), 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color); } .block-editor-block-navigation__label { color: var(--design-text-muted); } .block-editor-block-patterns-list__item .block-editor-block-preview__container:after { outline-color: rgba(var(--design-border-strong-rgb), 0.1); } .block-editor-block-patterns-list__item.is-selected .block-editor-block-preview__container:after { outline-color: var(--design-border-strong); } .block-editor-block-patterns-list__item:hover .block-editor-block-preview__container:after { outline-color: rgba(var(--design-border-strong-rgb), 0.3); } .block-editor-block-patterns-list__item[data-focus-visible] .block-editor-block-preview__container:after { outline-color: var(--wp-admin-theme-color); } .block-editor-block-styles__variants button.components-button.block-editor-block-styles__item { border-color: var(--design-border); color: var(--design-text); } .block-editor-block-styles__variants button.components-button.block-editor-block-styles__item:hover { box-shadow: inset 0 0 0 1px var(--design-border); color: var(--wp-admin-theme-color); } .block-editor-block-styles__variants button.components-button.block-editor-block-styles__item.is-active { background-color: var(--design-text); box-shadow: none; } .block-editor-block-styles__variants button.components-button.block-editor-block-styles__item.is-active:hover { background-color: var(--design-text); } .block-editor-block-styles__variants button.components-button.block-editor-block-styles__item.is-active .block-editor-block-styles__item-text, .block-editor-block-styles__variants button.components-button.block-editor-block-styles__item.is-active:hover .block-editor-block-styles__item-text { color: var(--design-surface-2); } .block-editor-block-styles__variants button.components-button.block-editor-block-styles__item.is-active:focus, .block-editor-block-styles__variants button.components-button.block-editor-block-styles__item:focus { outline-color: var(--design-link); } .block-editor-block-switcher__popover-preview .components-popover__content { background-color: var(--design-surface-2); border-color: var(--design-border); box-shadow: none; } .block-editor-block-switcher__preview-patterns-container .block-editor-block-switcher__preview-patterns-container-list__list-item .block-editor-block-switcher__preview-patterns-container-list__item:focus, .block-editor-block-switcher__preview-patterns-container .block-editor-block-switcher__preview-patterns-container-list__list-item .block-editor-block-switcher__preview-patterns-container-list__item:hover { box-shadow: inset 0 0 0 1px var(--design-surface-2), 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color); } .block-editor-block-switcher__preview-patterns-container .block-editor-block-switcher__preview-patterns-container-list__list-item .block-editor-block-switcher__preview-patterns-container-list__item:hover { box-shadow: inset 0 0 0 1px var(--design-surface-2), 0 0 0 var(--wp-admin-border-width-focus) var(--design-border-strong); } .block-editor-block-switcher__no-transforms { color: var(--design-text-muted); } .block-editor-block-pattern-setup.view-mode-grid .block-editor-block-pattern-setup__container .block-editor-block-pattern-setup-list__item:focus .block-editor-block-preview__container { box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--design-surface-2), 0 0 0 calc(var(--wp-admin-border-width-focus)*2) var(--wp-admin-theme-color); } .block-editor-block-pattern-setup.view-mode-grid .block-editor-block-pattern-setup__container .block-editor-block-pattern-setup-list__list-item .block-editor-block-preview__container { border-color: var(--design-border); } .block-editor-block-pattern-setup .block-editor-block-pattern-setup__toolbar { background-color: var(--design-surface-2); border-top-color: var(--design-border); color: var(--design-text); } .block-editor-block-pattern-setup .block-editor-block-pattern-setup__container .carousel-container .pattern-slide { background-color: var(--design-surface-2); } .block-editor-panel-color-gradient-settings__color-indicator { background: linear-gradient(-45deg,transparent 48%,var(--design-surface-active) 0,var(--design-surface-active) 52%,transparent 0); } .block-editor-color-gradient-item { border-bottom-color: var(--design-border); border-left-color: var(--design-border); border-right-color: var(--design-border); } .block-editor-color-gradient-item:nth-child(1 of .block-editor-color-gradient-item) { border-top-color: var(--design-border); } .block-editor-tools-panel-color-gradient-settings__dropdown>button.is-open { background-color: var(--design-surface-3); color: var(--wp-admin-theme-color); } .block-editor-date-format-picker__custom-format-select-control__custom-option { border-top-color: var(--design-border-strong); } .block-editor-duotone-control__unset-indicator { background: linear-gradient(-45deg,transparent 48%,var(--design-surface-active) 0,var(--design-surface-active) 52%,transparent 0); } .components-font-appearance-control [role=option] { color: var(--design-text); } .block-editor-global-styles__toggle-icon { fill: currentColor; } .block-editor-global-styles-filters-panel__dropdown, .block-editor-global-styles__shadow-dropdown { border-color: var(--design-border); } .block-editor-global-styles-filters-panel__dropdown-toggle.is-open, .block-editor-global-styles__shadow-dropdown-toggle.is-open { background-color: var(--design-surface-3); } .block-editor-global-styles__shadow-indicator { background-color: transparent; background-image: none; border-color: var(--design-border); color: var(--design-text); } .block-editor-global-styles__shadow-indicator:focus { border-color: var(--design-border); } .block-editor-global-styles__shadow-indicator.unset { background: linear-gradient(-45deg,transparent 48%,var(--design-surface-active) 0,var(--design-surface-active) 52%,transparent 0); } .has-local-override-from-global-styles__reset:focus-visible { outline-color: var(--design-info); } .has-local-override-from-global-styles__dot { background-color: var(--wp-admin-theme-color,var(--design-info)); } .has-local-override-from-global-styles__reset-icon { color: var(--wp-admin-theme-color,var(--design-info)); } .block-editor-grid-visualizer__drop-zone { background-color: rgba(var(--design-border-rgb), 0.1); } .block-editor-grid-item-resizer__box { border: 1px solid var(--wp-admin-theme-color); } .block-editor-grid-item-mover__move-button-container .block-editor-grid-item-mover-button:focus-visible:before { box-shadow: inset 0 0 0 1px var(--design-surface-2), 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color); } @media (min-width:600px) { .show-icon-labels .block-editor-grid-item-mover__move-horizontal-button-container:before { background-color: var(--design-surface-active); } } @media (min-width:782px) { .show-icon-labels .block-editor-grid-item-mover__move-horizontal-button-container:before { background-color: var(--design-text); } } @media (min-width:600px) { .show-icon-labels .block-editor-grid-item-mover__move-vertical-button-container:before { background-color: var(--design-surface-active); } } @media (min-width:782px) { .show-icon-labels .block-editor-grid-item-mover__move-vertical-button-container:before { background-color: var(--design-text); } } .show-icon-labels .editor-collapsible-block-toolbar .block-editor-grid-item-mover__move-horizontal-button-container:before, .show-icon-labels .editor-collapsible-block-toolbar .block-editor-grid-item-mover__move-vertical-button-container:before { background-color: var(--design-surface-active); } .block-editor-block-types-list__list-item.is-synced .components-button.block-editor-block-types-list__item:not(:disabled) .block-editor-block-icon.has-colors { color: var(--wp-block-synced-color); } .block-editor-block-types-list__list-item.is-synced .components-button.block-editor-block-types-list__item:not(:disabled):after { background: var(--wp-block-synced-color); } .components-button.block-editor-block-types-list__item { background-color: transparent; background-image: none; color: var(--design-text); } .components-button.block-editor-block-types-list__item:not(:disabled,[aria-disabled=true]):hover:after { background: var(--wp-admin-theme-color); } .block-editor-block-types-list__item-icon { color: var(--design-text); } .block-editor-link-control__help { color: var(--design-text-muted); } .block-editor-link-control__field .components-base-control__label { color: var(--design-text); } .block-editor-link-control__search-item .components-menu-item__shortcut, .block-editor-link-control__preview .block-editor-link-control__link-information .block-editor-link-control__preview-info { color: var(--design-text-muted); } .block-editor-link-control__search-item[aria-selected] { background-color: var(--design-surface-active); } .block-editor-link-control__preview { background-color: transparent; background-image: none; } .block-editor-link-control__preview .block-editor-link-control__preview-icon, .block-editor-link-control__preview .block-editor-link-control__preview-image, .block-editor-link-control__preview.is-fetching .block-editor-link-control__preview-icon:before { background-color: var(--design-surface-3); } .block-editor-link-control__preview .block-editor-link-control__preview-title:focus-visible { box-shadow: inset 0 0 0 1px var(--design-surface-2), 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color); } .block-editor-link-control__setting .components-base-control__field .components-checkbox-control__label, .block-editor-link-control__tools .components-button.block-editor-link-control__drawer-toggle[aria-expanded=true], .link-preview-button__title { color: var(--design-text); } .link-preview-button.components-button { border-color: var(--design-border); } .link-preview-button__hint { color: var(--design-text-muted); } .link-preview-button__icon { color: var(--design-text); } .block-editor-list-view-leaf.is-selected .block-editor-list-view-block-contents, .block-editor-list-view-leaf.is-selected .components-button.has-icon { color: var(--design-surface-2); } .block-editor-list-view-leaf.is-selected .block-editor-list-view-block-contents:focus:after { box-shadow: inset 0 0 0 1px var(--design-surface-2), 0 0 0 var(--wp-admin-border-width-focus) var(--wpds-color-stroke-focus, var(--wp-admin-theme-color, var(--design-link)) ); } .block-editor-list-view-leaf.is-selected.is-synced .block-editor-list-view-block-contents:focus:after { box-shadow: inset 0 0 0 1px var(--design-surface-2), 0 0 0 var(--wp-admin-border-width-focus) var(--wp-block-synced-color); } .block-editor-list-view-leaf.is-selected .block-editor-list-view-block__menu:focus { box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--design-surface-2); } .block-editor-list-view-leaf .block-editor-list-view-block-contents:focus:after, .block-editor-list-view-leaf.is-nesting .block-editor-list-view-block-contents:after, .block-editor-list-view-leaf.is-nesting .block-editor-list-view__menu { box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wpds-color-stroke-focus, var(--wp-admin-theme-color, var(--design-link)) ); } .block-editor-list-view-leaf .block-editor-inserter__toggle { background-color: var(--design-text); color: var(--design-surface-1); } .block-editor-list-view-leaf .block-editor-inserter__toggle:active { color: var(--design-surface-2); } .block-editor-list-view-leaf.is-selected .block-editor-list-view-block-select-button__anchor { background-color: rgba(var(--design-text-rgb), 0.3); color: var(--design-surface-2); } .block-editor-list-view-leaf .block-editor-list-view-block-select-button__image:not(:only-child) { box-shadow: 0 0 0 2px var(--design-surface-2); } .block-editor-list-view-leaf.is-selected .block-editor-list-view-block-select-button__image:not(:only-child) { box-shadow: 0 0 0 2px var(--wp-admin-theme-color); } .block-editor-list-view-leaf.is-disabled .block-editor-list-view-block-select-button:hover { color: inherit; } .list-view-appender .block-editor-inserter__toggle { background-color: var(--design-text); color: var(--design-surface-1); } .list-view-appender .block-editor-inserter__toggle:focus, .list-view-appender .block-editor-inserter__toggle:hover { color: var(--design-surface-2); } .block-editor-media-replace-flow__media-upload-menu:not(:empty)+.block-editor-media-flow__url-input, .block-editor-media-replace-flow__options.is-variant-toolbar .block-editor-media-replace-flow__media-upload-menu:not(:empty)+.block-editor-media-flow__url-input { border-top-color: var(--design-border-strong); } .block-editor-responsive-block-control, .block-editor-tabbed-sidebar__tablist-and-close-button { border-bottom-color: var(--design-border); } .components-popover.block-editor-rich-text__inline-format-toolbar .components-popover__content { box-shadow: none; } .block-editor-skip-to-selected-block:focus { background-color: var(--design-surface-3); } .block-editor-tabbed-sidebar, .block-editor-tabbed-sidebar__close-button { background-color: var(--design-surface-2); } .block-editor-url-input__suggestion { background-color: var(--design-surface-2); box-shadow: none; color: var(--design-text-muted); } .block-editor-url-input__suggestion:hover { background-color: var(--design-surface-hover); } .block-editor-url-input__suggestion.is-selected, .block-editor-url-input__suggestion:focus { background: var(--wp-admin-theme-color-darker-20); color: var(--design-surface-2); } .block-editor-url-input__button .block-editor-url-input__back:after { background-color: var(--design-surface-active); } .block-editor-url-input__button-modal { background-color: var(--design-surface-2); border-color: var(--design-border-strong); box-shadow: var(--design-shadow-2); } .block-editor-url-popover__additional-controls, .block-editor-url-popover__settings { border-top-color: var(--design-border); } .block-editor-url-popover__link-viewer-url.has-invalid-link { color: var(--design-danger); } .block-editor-url-popover__expand-on-click .text p.description { color: var(--design-text-muted); } .block-editor-content-only-controls__link, .block-editor-content-only-controls__media { border-color: var(--design-border); } .block-editor-content-only-controls__media-placeholder { background: var(--design-surface-2) linear-gradient(-45deg,transparent 48%,var(--design-surface-active) 0,var(--design-surface-active) 52%,transparent 0); box-shadow: inset 0 0 0 1px var(--design-border); } .block-editor-content-only-controls__rich-text { background-color: var(--design-surface-2); border-color: var(--design-border); box-shadow: 0 0 0 transparent; color: var(--design-text); } .block-editor-content-only-controls__rich-text:focus { border-color: var(--wp-admin-theme-color,var(--design-link)); box-shadow: 0 0 0 .5px var(--wp-admin-theme-color, var(--design-link)); } .block-editor-content-only-controls__rich-text::-moz-placeholder { color: rgba(var(--design-text-rgb), 0.62); } .block-editor-content-only-controls__rich-text::placeholder { color: rgba(var(--design-text-rgb), 0.62); } .block-editor-content-only-controls__rich-text { border-color: var(--design-border); } .block-editor-content-only-controls__rich-text::-moz-placeholder { color: color-mix(in srgb,var(--design-text),transparent 38%); } .block-editor-content-only-controls__rich-text::placeholder { color: color-mix(in srgb,var(--design-text),transparent 38%); } .block-editor-block-fields__container:first-of-type { border-block-start: 1px solid var(--design-border); } .block-editor-hooks__block-hooks .block-editor-hooks__block-hooks-helptext { color: var(--design-text-muted); } .block-editor-hooks__position-control-item-hint { color: var(--wpds-color-foreground-content-neutral-weak,var(--design-text-muted)); } .block-editor-hooks__layout-constrained-helptext { color: var(--design-text-muted); } .block-editor__spacing-visualizer { border-color: var(--wp-admin-theme-color); } .block-editor-block-toolbar .components-toolbar, .block-editor-block-toolbar .components-toolbar-group { border-right-color: var(--design-border); } .block-editor-block-toolbar.is-connected .block-editor-block-switcher .components-button:before { background: color-mix(in srgb,var(--wp-block-synced-color) 10%,transparent); } .block-editor-block-toolbar .components-button.block-editor-block-toolbar__block-icon-button[aria-disabled=true], .block-editor-block-toolbar .components-button.block-editor-block-toolbar__block-icon-button[aria-disabled=true]:hover { color: var(--design-text); } .block-editor-block-contextual-toolbar { background-color: var(--design-surface-2); } .block-editor-block-contextual-toolbar.is-unstyled { box-shadow: 0 1px 0 0 var(--design-border); } .block-editor-block-contextual-toolbar .block-editor-block-toolbar::-webkit-scrollbar-thumb { background-color: var(--design-surface-active); } .block-editor-block-contextual-toolbar .block-editor-block-toolbar:focus-within::-webkit-scrollbar-thumb, .block-editor-block-contextual-toolbar .block-editor-block-toolbar:focus::-webkit-scrollbar-thumb, .block-editor-block-contextual-toolbar .block-editor-block-toolbar:hover::-webkit-scrollbar-thumb { background-color: var(--design-text-muted); } .block-editor-block-contextual-toolbar .block-editor-block-toolbar { scrollbar-color: var(--design-surface-active) transparent; } .block-editor-block-contextual-toolbar .block-editor-block-toolbar:focus, .block-editor-block-contextual-toolbar .block-editor-block-toolbar:focus-within, .block-editor-block-contextual-toolbar .block-editor-block-toolbar:hover { scrollbar-color: var(--design-text-muted) transparent; } @media (hover:none) { .block-editor-block-contextual-toolbar .block-editor-block-toolbar { scrollbar-color: var(--design-text-muted) transparent; } } .block-editor-block-contextual-toolbar .block-editor-block-parent-selector:after { background-color: var(--design-text); } @media (min-width:600px) { .show-icon-labels .block-editor-block-mover:not(.is-horizontal) .block-editor-block-mover__move-button-container:before { background-color: var(--design-surface-active); } } @media (min-width:782px) { .show-icon-labels .block-editor-block-mover:not(.is-horizontal) .block-editor-block-mover__move-button-container:before { background-color: var(--design-text); } } .show-icon-labels .block-editor-block-toolbar__block-controls .block-editor-block-mover { border-left-color: var(--design-border); } .block-editor-inserter { background-color: transparent; background-image: none; } .block-editor-inserter__popover.is-quick .components-popover__content { box-shadow: var(--design-shadow-2); } .block-editor-inserter__popover.is-quick .components-popover__content .block-editor-inserter__quick-inserter>* { border-left-color: var(--design-border); border-right-color: var(--design-border); } .block-editor-inserter__popover.is-quick .components-popover__content .block-editor-inserter__quick-inserter>:first-child { border-top-color: var(--design-border); } .block-editor-inserter__popover.is-quick .components-popover__content .block-editor-inserter__quick-inserter>:last-child { border-bottom-color: var(--design-border); } .block-editor-inserter__popover.is-quick .components-popover__content .block-editor-inserter__quick-inserter>.components-button { border-color: var(--design-border); } .block-editor-inserter__menu.is-bottom:after { border-bottom-color: var(--design-surface-2); } .block-editor-inserter__search { background-color: var(--design-surface-2); border-bottom-color: transparent; } .block-editor-inserter__search.is-scrolled { border-bottom-color: var(--design-border); } .block-editor-inserter__panel-title, .block-editor-inserter__panel-title button { color: var(--design-text-muted); } .block-editor-inserter__insertable-blocks-at-selection { border-bottom-color: var(--design-border-strong); } @media (min-width:782px) { .block-editor-inserter__category-panel { background-color: var(--design-surface-3); border-left-color: var(--design-border); border-top-color: var(--design-border); } } .block-editor-inserter__patterns-filter-help { border-top-color: var(--design-border); color: var(--design-text-muted); } .block-editor-inserter__preview-content { background-color: var(--design-surface-3); } .block-editor-inserter__preview-content-missing { background-color: var(--design-surface-3); color: var(--design-text-muted); } .block-editor-inserter__tips, .block-editor-inserter__quick-inserter-separator { border-top-color: var(--design-border); } .block-editor-inserter__quick-inserter-expand.components-button { background-color: var(--design-text); color: var(--design-surface-1); } .block-editor-inserter__quick-inserter-expand.components-button:hover { color: var(--design-surface-2); } .block-editor-inserter__quick-inserter-expand.components-button:active, .block-editor-block-visibility-modal__description { color: var(--design-text-muted); } .block-editor-inserter__quick-inserter-expand.components-button.components-button:focus:not(:disabled) { background: var(--wp-admin-theme-color); border-color: var(--wp-admin-theme-color); } .block-editor-inserter__media-list__list-item.is-hovered .block-editor-inserter__media-list__item-preview>* { outline-color: rgba(var(--design-border-rgb), 0.3); } .block-editor-inserter__media-list__list-item .block-editor-inserter__media-list__item-preview-options>button { background-color: var(--design-surface-2); } .block-editor-inserter__media-list__list-item .block-editor-inserter__media-list__item-preview-options>button:hover { box-shadow: inset 0 0 0 2px var(--design-surface-2), 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color); } .block-editor-inserter__media-list__item .block-editor-inserter__media-list__item-preview>* { outline-color: rgba(var(--design-border-rgb), 0.1); } .block-editor-inserter__media-list__item .block-editor-inserter__media-list__item-preview .block-editor-inserter__media-list__item-preview-spinner { background-color: rgba(var(--design-surface-2-rgb), 0.7); } .block-editor-inserter__media-list__item:focus .block-editor-inserter__media-list__item-preview>* { outline-color: var(--wp-admin-theme-color); } .block-editor-block-visibility-modal__options-icon--checked { fill: var(--design-surface-2); } :root { --wp-block-synced-color: var(--design-info); --wp-editor-canvas-background: var(--design-surface-active); --wp-admin-theme-color: var(--design-info); --wp-admin-theme-color-darker-10: var(--design-link); --wp-admin-theme-color-darker-20: var(--design-info); } .patterns-menu-items__convert-modal .components-form-token-field__suggestions-list:not(:empty), .interface-complementary-area-header { background-color: var(--design-surface-2); } .patterns-rename-pattern-category-modal__validation-message { color: var(--design-danger); } .interface-complementary-area { background-color: var(--design-surface-2); color: var(--design-text); } .interface-complementary-area h2, .interface-complementary-area h3 { color: var(--design-text); } .interface-complementary-area hr { border-bottom-color: var(--design-border); } .interface-interface-skeleton__secondary-sidebar, .interface-interface-skeleton__sidebar { background-color: var(--design-surface-2); color: var(--design-text); } .interface-interface-skeleton__sidebar { border-top-color: var(--design-border); } @media (min-width:782px) { .interface-interface-skeleton__sidebar { box-shadow: -1px 0 0 0 var(--design-border); } } .interface-interface-skeleton__secondary-sidebar { border-top-color: var(--design-border); } @media (min-width:782px) { .interface-interface-skeleton__secondary-sidebar { box-shadow: 1px 0 0 0 var(--design-border); } } .interface-interface-skeleton__header { box-shadow: 0 1px 0 0 var(--design-border); color: var(--design-text); } .interface-interface-skeleton__footer { background-color: var(--design-surface-2); border-top-color: var(--design-border); color: var(--design-text); } .interface-interface-skeleton__footer .block-editor-block-breadcrumb { background-color: var(--design-surface-2); } .interface-interface-skeleton__actions { background-color: var(--design-surface-2); color: var(--design-text); } @media (min-width:782px) { .is-entity-save-view-open .interface-interface-skeleton__actions:focus, .is-entity-save-view-open .interface-interface-skeleton__actions:focus-within { border-left-color: var(--design-border); } } .font-library__footer { background-color: var(--design-surface-2); border-top-color: var(--design-border); } .font-library__font-card { border-color: var(--design-border); } .font-library__font-card:hover { background-color: var(--design-surface-hover); } .font-library__font-card .font-library__font-card__count, .font-library__local-fonts .font-library__upload-area__text { color: var(--design-text-muted); } .font-library-modal__tablist-container { background-color: var(--design-surface-2); border-bottom-color: var(--design-border); } button.font-library__upload-area { background-color: var(--design-surface-3); } .global-styles-ui-screen-revisions__revision-item:before { background-color: var(--design-surface-active); } .global-styles-ui-screen-revisions__revision-item[aria-selected=true] .global-styles-ui-screen-revisions__changes>li, .global-styles-ui-screen-revisions__revision-item[aria-selected=true] .global-styles-ui-screen-revisions__meta { color: var(--design-text); } .global-styles-ui-screen-revisions__revision-item:after { border-color: var(--design-border); } .global-styles-ui-screen-revisions__changes, .global-styles-ui-screen-revisions__meta { color: var(--design-text-muted); } .global-styles-ui-screen-revisions__pagination.global-styles-ui-screen-revisions__pagination .components-button.is-tertiary { color: var(--design-text); } .global-styles-ui-screen-revisions__pagination.global-styles-ui-screen-revisions__pagination .components-button.is-tertiary:disabled, .global-styles-ui-screen-revisions__pagination.global-styles-ui-screen-revisions__pagination .components-button.is-tertiary[aria-disabled=true], .global-styles-ui-font-size__item-value, .global-styles-ui-screen-typography__font-variants-count { color: var(--design-text-muted); } .global-styles-ui-screen-revisions__footer { background-color: var(--design-surface-2); border-top-color: var(--design-border); } .global-styles-ui-variations_item .global-styles-ui-variations_item-preview { outline-color: rgba(var(--design-border-rgb), 0.1); } .global-styles-ui-variations_item:not(.is-active):hover .global-styles-ui-variations_item-preview { outline-color: rgba(var(--design-border-rgb), 0.3); } .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 { outline-color: var(--design-border); } .global-styles-ui-variations_item:focus-visible .global-styles-ui-variations_item-preview { outline-color: var(--wp-admin-theme-color); } .global-styles-ui-typography-preview { background-color: var(--design-surface-3); } .global-styles-ui-section-title { color: var(--design-text); } .global-styles-ui-icon-with-current-color { fill: currentColor; } .global-styles-ui__block-preview-panel { border-color: var(--design-border); } .global-styles-ui__shadow-preview-panel { background-image: repeating-linear-gradient(45deg,var(--design-surface-active) 25%,transparent 0,transparent 75%,var(--design-surface-active) 0,var(--design-surface-active)),repeating-linear-gradient(45deg,var(--design-surface-active) 25%,transparent 0,transparent 75%,var(--design-surface-active) 0,var(--design-surface-active)); border-color: var(--design-border); } .global-styles-ui__shadow-preview-panel .global-styles-ui__shadow-preview-block { background-color: var(--design-surface-2); border-color: var(--design-border); } .global-styles-ui__shadow-editor__dropdown-toggle.is-open { background-color: var(--design-surface-3); } .global-styles-ui-screen-variations { border-top-color: var(--design-border); } .global-styles-ui-color-palette__tablist-container, .dataviews-filters__summary-operators-container:has(+.dataviews-filters__search-widget-listbox), .dataviews-filters__summary-operators-container:has(+.dataviews-filters__search-widget-no-elements) { border-bottom-color: var(--design-border); } .dataviews-picker-wrapper, .dataviews-wrapper { background-color: var(--wp-dataviews-color-background,var(--wpds-color-background-surface-neutral-strong,var(--design-surface-2))); } .dataviews-filters__container, .dataviews__view-actions { background-color: inherit; } .dataviews-title-field { color: var(--wpds-color-foreground-content-neutral,var(--design-text)); } .dataviews-title-field a { color: var(--wpds-color-foreground-interactive-neutral,var(--design-text)); } .dataviews-title-field a:hover { color: var(--wpds-color-foreground-interactive-brand,var(--wp-admin-theme-color,var(--design-link))); } .dataviews-title-field a:focus { box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color, var(--design-info)); color: var(--wp-admin-theme-color--rgb); } .dataviews-title-field button.components-button.is-link { color: var(--wpds-color-foreground-interactive-neutral-active,var(--design-text)); } .dataviews-title-field button.components-button.is-link:hover { color: var(--wpds-color-foreground-interactive-brand,var(--wp-admin-theme-color,var(--design-link))); } .dataviews-title-field--clickable { color: var(--wpds-color-foreground-interactive-neutral,var(--design-text)); } .dataviews-title-field--clickable:hover { color: var(--wpds-color-foreground-interactive-brand,var(--wp-admin-theme-color,var(--design-link))); } .dataviews-title-field--clickable:focus { box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color, var(--design-info)); color: var(--wp-admin-theme-color--rgb); } .dataviews__view-actions--infinite-scroll { background-color: var(--design-surface-2); } .dataviews-bulk-actions-footer__item-count { color: var(--wpds-color-foreground-content-neutral,var(--design-text)); } .dataviews-layout__container { background-color: inherit; } .dataviews-filters__summary-operators-container:has(+.dataviews-filters__user-input-widget) { border-bottom-color: var(--design-border-strong); } .dataviews-filters__summary-operators-container .dataviews-filters__summary-operators-filter-name { color: var(--wpds-color-foreground-content-neutral-weak,var(--design-text-muted)); } .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip { border-color: var(--design-border); color: var(--wpds-color-foreground-interactive-neutral,var(--design-text)); } .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip:focus-visible { background-color: var(--wpds-color-background-interactive-neutral-weak-active,var(--design-surface-3)); border-color: var(--wpds-color-stroke-interactive-neutral-active,var(--design-border)); color: var(--wpds-color-foreground-interactive-neutral,var(--design-text)); } .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip:hover:not(.dataviews-filters__summary-chip-container .dataviews-filters__summary-chip.is-not-clickable) { background-color: var(--wpds-color-background-interactive-neutral-weak-active,var(--design-surface-hover)); border-color: var(--wpds-color-stroke-interactive-neutral-active,var(--design-border)); color: var(--wpds-color-foreground-interactive-neutral,var(--design-text)); } .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip[aria-expanded=true] { background-color: var(--wpds-color-background-interactive-neutral-weak-active,var(--design-surface-3)); border-color: var(--wpds-color-stroke-interactive-neutral-active,var(--design-border)); color: var(--wpds-color-foreground-interactive-neutral,var(--design-text)); } .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip.has-values { background: var(--wpds-color-background-interactive-brand-weak,transparent); border-color: var(--wpds-color-stroke-interactive-brand,var(--wp-admin-theme-color,var(--design-link))); color: var(--wpds-color-foreground-interactive-brand,var(--wp-admin-theme-color,var(--design-link))); } .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip.has-values:hover:not(.dataviews-filters__summary-chip-container .dataviews-filters__summary-chip.has-values.is-not-clickable), .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip.has-values[aria-expanded=true] { background-color: var(--design-link); border-color: var(--wpds-color-stroke-interactive-brand-active,color-mix(in oklch,var(--wp-admin-theme-color,var(--design-link)) 85%,var(--design-border))); color: var(--wpds-color-foreground-interactive-brand-active,color-mix(in oklch,var(--wp-admin-theme-color,var(--design-link)) 52%,var(--design-text))); } .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip:focus-visible, .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove:focus-visible { 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, var(--design-link)) ); } .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove svg { fill: var(--wpds-color-foreground-interactive-neutral,var(--design-text)); } .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove:focus { background-color: var(--design-surface-3); } .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove:hover { background-color: var(--design-surface-hover); } .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove:focus svg, .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove:hover svg { fill: var(--wpds-color-foreground-interactive-neutral-active,var(--design-text)); } .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove.has-values svg { fill: var(--wpds-color-foreground-interactive-brand,var(--wp-admin-theme-color,var(--design-link))); } .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove.has-values:hover { background-color: var(--design-link); } .dataviews-filters__search-widget-filter-combobox-list { border-top-color: var(--design-border); } .dataviews-filters__search-widget-listitem { color: var(--wpds-color-foreground-interactive-neutral,var(--design-text)); } .dataviews-filters__search-widget-listitem:focus, .dataviews-filters__search-widget-listitem:hover, .dataviews-filters__search-widget-listitem[data-active-item] { background-color: var(--wpds-color-background-interactive-brand-weak-active,color-mix(in oklch,var(--wp-admin-theme-color,var(--design-link)) 12%,var(--design-surface-2))); color: var(--wpds-color-foreground-interactive-neutral-active,var(--design-text)); } .dataviews-filters__search-widget-listitem:focus .dataviews-filters__search-widget-listitem-single-selection, .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 { background-color: var(--design-surface-2); border-color: var(--wpds-color-stroke-interactive-brand-active,color-mix(in oklch,var(--wp-admin-theme-color,var(--design-link)) 85%,var(--design-border-strong))); } .dataviews-filters__search-widget-listitem:focus .dataviews-filters__search-widget-listitem-single-selection.is-selected, .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 { background-color: var(--design-link); border-color: var(--wpds-color-stroke-interactive-brand-active,color-mix(in oklch,var(--wp-admin-theme-color,var(--design-link)) 85%,var(--design-border-strong))); } .dataviews-filters__search-widget-listitem:focus .dataviews-filters__search-widget-listitem-multi-selection, .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 { background-color: var(--design-surface-2); border-color: var(--wpds-color-stroke-interactive-brand-active,color-mix(in oklch,var(--wp-admin-theme-color,var(--design-link)) 85%,var(--design-border-strong))); } .dataviews-filters__search-widget-listitem:focus .dataviews-filters__search-widget-listitem-multi-selection.is-selected, .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 { background-color: var(--design-link); border-color: var(--wpds-color-stroke-interactive-brand-active,color-mix(in oklch,var(--wp-admin-theme-color,var(--design-link)) 85%,var(--design-border-strong))); } .dataviews-filters__search-widget-listitem:focus .dataviews-filters__search-widget-listitem-description, .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 { color: var(--wpds-color-foreground-interactive-neutral-weak-active,var(--design-text)); } .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-description { color: var(--wpds-color-foreground-interactive-neutral-weak,var(--design-text-muted)); } .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-single-selection { border-color: var(--design-border-strong); } .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-single-selection:checked:before { background-color: var(--design-surface-2); border-color: var(--design-surface-2); } .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-single-selection:focus { box-shadow: 0 0 0 2px var(--design-surface-2), 0 0 0 4px var(--wp-admin-theme-color); } .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-single-selection:checked { background: var(--wp-admin-theme-color); } .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-single-selection.is-selected { background-color: var(--design-link); border-color: var(--wpds-color-stroke-interactive-brand,var(--wp-admin-theme-color,var(--design-link))); } .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-single-selection.is-selected:before { background-color: var(--wpds-color-foreground-interactive-brand-strong,var(--design-surface-2)); border-color: var(--design-surface-2); } .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection { border-color: var(--design-border-strong); } .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection:focus { border-color: var(--wp-admin-theme-color); box-shadow: 0 0 0 .5px var(--wp-admin-theme-color); } .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection::-moz-placeholder { color: rgba(var(--design-text-rgb), 0.62); } .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection::placeholder { color: rgba(var(--design-text-rgb), 0.62); } .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection:focus { box-shadow: 0 0 0 2px var(--design-surface-2), 0 0 0 4px var(--wp-admin-theme-color); } .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection:checked, .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection[aria-checked=mixed] { background: var(--wp-admin-theme-color); border-color: var(--wp-admin-theme-color); } .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 { color: var(--design-surface-2); } .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection:disabled, .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection[aria-disabled=true] { background-color: var(--design-surface-3); border-color: var(--design-border-strong); } .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection { background: var(--wpds-color-background-interactive-neutral-weak,transparent); color: var(--wpds-color-foreground-content-neutral,var(--design-text)); } .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection.is-selected { background-color: var(--design-link); border-color: var(--wpds-color-stroke-interactive-brand,var(--wp-admin-theme-color,var(--design-link))); } .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection.is-selected svg { fill: var(--wpds-color-foreground-interactive-neutral-strong,var(--design-surface-2)); } .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input { border-color: var(--design-border-strong); } .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::-moz-placeholder { color: rgba(var(--design-text-rgb), 0.62); } .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::placeholder { color: rgba(var(--design-text-rgb), 0.62); } .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input:focus { background-color: var(--design-surface-2); box-shadow: inset 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, var(--design-link)) ); } .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::-moz-placeholder { color: var(--wpds-color-foreground-content-neutral-weak,var(--design-text-muted)); } .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::placeholder { color: var(--wpds-color-foreground-content-neutral-weak,var(--design-text-muted)); } .dataviews-filters-toggle__count { background-color: var(--design-link); color: var(--wpds-color-foreground-interactive-neutral-strong,var(--design-surface-2)); outline-color: var(--design-surface-2); } .dataviews-footer { background-color: inherit; border-top-color: var(--design-border); } .dataviews-view-config__modified-indicator { background-color: var(--design-link); } .dataviews-view-grid .dataviews-view-grid__row .dataviews-view-grid__row__gridcell[data-focus-visible]:after { box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wpds-color-stroke-focus, var(--wp-admin-theme-color, var(--design-link)) ); } .dataviews-view-grid .dataviews-view-grid__card.is-selected .dataviews-view-grid__fields .dataviews-view-grid__field .dataviews-view-grid__field-value, .dataviews-view-grid-infinite-scroll .dataviews-view-grid__card.is-selected .dataviews-view-grid__fields .dataviews-view-grid__field .dataviews-view-grid__field-value { color: var(--wpds-color-foreground-content-neutral,var(--design-text)); } .dataviews-view-grid .dataviews-view-grid__card.is-selected .dataviews-view-grid__media:after, .dataviews-view-grid-infinite-scroll .dataviews-view-grid__card.is-selected .dataviews-view-grid__media:after { box-shadow: inset 0 0 0 var(--wpds-border-width-xs,1px) var(--wpds-color-stroke-interactive-brand, var(--wp-admin-theme-color, var(--design-link)) ), inset 0 0 0 var(--wpds-border-width-sm,2px) var(--wpds-color-background-surface-neutral-strong, var(--design-surface-2)); } .dataviews-view-grid .dataviews-view-grid__card .dataviews-view-grid__media:focus:after, .dataviews-view-grid-infinite-scroll .dataviews-view-grid__card .dataviews-view-grid__media:focus:after { box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wpds-color-stroke-focus, var(--wp-admin-theme-color, var(--design-link)) ); } .dataviews-view-grid .dataviews-view-grid__media, .dataviews-view-grid-infinite-scroll .dataviews-view-grid__media { background-color: var(--wpds-color-background-surface-neutral-strong,var(--design-surface-2)); } .dataviews-view-grid .dataviews-view-grid__media:after, .dataviews-view-grid-infinite-scroll .dataviews-view-grid__media:after { box-shadow: inset 0 0 0 var(--wpds-border-width-xs,1px) var(--design-border); } .dataviews-view-grid .dataviews-view-grid__media .dataviews-view-grid__media-placeholder, .dataviews-view-grid-infinite-scroll .dataviews-view-grid__media .dataviews-view-grid__media-placeholder { background-color: var(--design-surface-2); } .dataviews-view-grid .dataviews-view-grid__fields .dataviews-view-grid__field .dataviews-view-grid__field-name, .dataviews-view-grid-infinite-scroll .dataviews-view-grid__fields .dataviews-view-grid__field .dataviews-view-grid__field-name { color: var(--wpds-color-foreground-content-neutral-weak,var(--design-text-muted)); } .dataviews-view-grid__card .dataviews-view-grid__media-actions .dataviews-all-actions-button { background-color: var(--wpds-color-background-surface-neutral-strong,var(--design-surface-2)); } .dataviews-view-grid__group-header { color: var(--wpds-color-foreground-content-neutral,var(--design-text)); } .dataviews-view-list div[role=article], .dataviews-view-list div[role=row] { border-top-color: var(--design-border); } .dataviews-view-list div[role=article].is-selected.is-selected, .dataviews-view-list div[role=article].is-selected.is-selected+div[role=article], .dataviews-view-list div[role=article].is-selected.is-selected+div[role=row], .dataviews-view-list div[role=row].is-selected.is-selected, .dataviews-view-list div[role=row].is-selected.is-selected+div[role=article], .dataviews-view-list div[role=row].is-selected.is-selected+div[role=row] { border-top-color: var(--design-link); } .dataviews-view-list div[role=article]:not(.is-selected).is-hovered, .dataviews-view-list div[role=article]:not(.is-selected):focus-within, .dataviews-view-list div[role=article]: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, .dataviews-view-list div[role=row]:not(.is-selected):hover, .dataviews-view-list div[role=article]:not(.is-selected).is-hovered .dataviews-title-field, .dataviews-view-list div[role=article]:not(.is-selected).is-hovered .dataviews-view-list__field, .dataviews-view-list div[role=article]:not(.is-selected):focus-within .dataviews-title-field, .dataviews-view-list div[role=article]:not(.is-selected):focus-within .dataviews-view-list__field, .dataviews-view-list div[role=article]:not(.is-selected):hover .dataviews-title-field, .dataviews-view-list div[role=article]:not(.is-selected):hover .dataviews-view-list__field, .dataviews-view-list div[role=row]:not(.is-selected).is-hovered .dataviews-title-field, .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, .dataviews-view-list div[role=row]:not(.is-selected):focus-within .dataviews-view-list__field, .dataviews-view-list div[role=row]:not(.is-selected):hover .dataviews-title-field, .dataviews-view-list div[role=row]:not(.is-selected):hover .dataviews-view-list__field { color: var(--wpds-color-foreground-interactive-brand,var(--wp-admin-theme-color,var(--design-link))); } .dataviews-view-list div[role=article].is-selected .dataviews-view-list__item-wrapper, .dataviews-view-list div[role=article].is-selected:focus-within .dataviews-view-list__item-wrapper, .dataviews-view-list div[role=row].is-selected .dataviews-view-list__item-wrapper, .dataviews-view-list div[role=row].is-selected:focus-within .dataviews-view-list__item-wrapper { background-color: var(--wpds-color-background-interactive-brand-weak-active,color-mix(in oklch,var(--wp-admin-theme-color,var(--design-link)) 12%,var(--design-surface-2))); color: var(--wpds-color-foreground-interactive-neutral,var(--design-text)); } .dataviews-view-list div[role=article].is-selected .dataviews-view-list__item-wrapper .dataviews-title-field, .dataviews-view-list div[role=article].is-selected .dataviews-view-list__item-wrapper .dataviews-view-list__field, .dataviews-view-list div[role=article].is-selected:focus-within .dataviews-view-list__item-wrapper .dataviews-title-field, .dataviews-view-list div[role=article].is-selected:focus-within .dataviews-view-list__item-wrapper .dataviews-view-list__field, .dataviews-view-list div[role=row].is-selected .dataviews-view-list__item-wrapper .dataviews-title-field, .dataviews-view-list div[role=row].is-selected .dataviews-view-list__item-wrapper .dataviews-view-list__field, .dataviews-view-list div[role=row].is-selected:focus-within .dataviews-view-list__item-wrapper .dataviews-title-field, .dataviews-view-list div[role=row].is-selected:focus-within .dataviews-view-list__item-wrapper .dataviews-view-list__field { color: var(--wpds-color-foreground-interactive-neutral-active,var(--design-text)); } .dataviews-view-list .dataviews-view-list__item:focus-visible:before { box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wpds-color-stroke-focus, var(--wp-admin-theme-color, var(--design-link)) ); } .dataviews-view-list .dataviews-view-list__media-wrapper { background-color: var(--wpds-color-background-surface-neutral-strong,var(--design-surface-2)); } .dataviews-view-list .dataviews-view-list__media-wrapper:after, .dataviews-column-primary__media:after { box-shadow: inset 0 0 0 var(--wpds-border-width-xs,1px) var(--design-border); } .dataviews-view-list .dataviews-view-list__field { color: var(--wpds-color-foreground-interactive-neutral-weak,var(--design-text-muted)); } .dataviews-view-list__group-header { color: var(--wpds-color-foreground-content-neutral,var(--design-text)); } .dataviews-view-table { background-color: inherit; border-color: inherit; color: var(--wpds-color-foreground-content-neutral-weak,var(--design-text-muted)); } .dataviews-view-table th { color: var(--wpds-color-foreground-content-neutral,var(--design-text)); } .dataviews-view-table td.dataviews-view-table__actions-column--sticky, .dataviews-view-table th.dataviews-view-table__actions-column--sticky { background-color: var(--wp-dataviews-color-background,var(--wpds-color-background-surface-neutral-strong,var(--design-surface-2))); } .dataviews-view-table td.dataviews-view-table__actions-column--stuck:after, .dataviews-view-table th.dataviews-view-table__actions-column--stuck:after { background-color: var(--wpds-color-background-surface-neutral,var(--design-surface-2)); } .dataviews-view-table tr { border-top-color: var(--design-border); } .dataviews-view-table tr.is-selected { background-color: var(--wpds-color-background-interactive-brand-weak-active,color-mix(in oklch,var(--wp-admin-theme-color,var(--design-link)) 12%,var(--design-surface-2))); color: var(--wpds-color-foreground-content-neutral,var(--design-text)); } .dataviews-view-table tr.is-selected, .dataviews-view-table tr.is-selected+tr { border-top-color: var(--design-link); } .dataviews-view-table tr.is-selected .dataviews-view-table__actions-column--sticky { background-color: var(--wpds-color-background-interactive-brand-weak-active,color-mix(in oklch,var(--wp-admin-theme-color,var(--design-link)) 12%,var(--design-surface-2))); } .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 { background-color: var(--wp-dataviews-color-background,var(--wpds-color-background-surface-neutral-strong,var(--design-surface-2))); } .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 { background-color: var(--wpds-color-background-interactive-brand-weak-active,color-mix(in oklch,var(--wp-admin-theme-color,var(--design-link)) 12%,var(--design-surface-2))); } .dataviews-view-table thead.dataviews-view-table__thead--stuck:after { background-color: var(--wpds-color-stroke-surface-neutral-weak,var(--design-surface-3)); } .dataviews-view-table .dataviews-view-table-header-button:not(:hover) { color: var(--wpds-color-foreground-interactive-neutral,var(--design-text)); } .dataviews-column-primary__media, .dataviews-view-picker-grid .dataviews-view-picker-grid__media { background-color: var(--wpds-color-background-surface-neutral-strong,var(--design-surface-2)); } .dataviews-view-table__group-header-row .dataviews-view-table__group-header-cell, .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 { color: var(--wpds-color-foreground-content-neutral,var(--design-text)); } .dataviews-view-picker-grid .dataviews-view-picker-grid__card.is-selected .dataviews-view-picker-grid__media:after { box-shadow: inset 0 0 0 var(--wpds-border-width-xs,1px) var(--wpds-color-stroke-interactive-brand, var(--wp-admin-theme-color, var(--design-link)) ), inset 0 0 0 var(--wpds-border-width-sm,2px) var(--wpds-color-background-surface-neutral-strong, var(--design-surface-2)); } .dataviews-view-picker-grid .dataviews-view-picker-grid__card .dataviews-view-picker-grid__media:focus:after { box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wpds-color-stroke-focus, var(--wp-admin-theme-color, var(--design-link)) ); } .dataviews-view-picker-grid:focus-visible [data-active-item=true], .dataviews-view-picker-table tbody:focus-visible [data-active-item=true], .dataviews-view-activity .dataviews-view-activity__item-content .dataviews-view-activity__item-title--clickable:focus-visible, .dataviews-view-picker-activity:focus-visible .dataviews-view-picker-activity__item[data-active-item=true], .dataforms-layouts-panel__field-trigger-icon:focus-visible, .rotation-ruler:has(.rotation-ruler__input:focus-visible) { outline-color: var(--design-link); } .dataviews-view-picker-grid .dataviews-view-picker-grid__media:after { box-shadow: inset 0 0 0 var(--wpds-border-width-xs,1px) var(--design-border); } .dataviews-view-picker-grid .dataviews-view-picker-grid__fields .dataviews-view-picker-grid__field .dataviews-view-picker-grid__field-name { color: var(--wpds-color-foreground-content-neutral-weak,var(--design-text-muted)); } .dataviews-view-picker-grid-group__header { color: var(--wpds-color-foreground-content-neutral,var(--design-text)); } .dataviews-view-picker-table { background-color: inherit; } .dataviews-view-picker-table .dataviews-view-table__row.is-hovered, .dataviews-view-picker-table .dataviews-view-table__row.is-selected, .dataviews-view-picker-table .dataviews-view-table__row.is-selected.is-hovered { background-color: var(--wpds-color-background-interactive-brand-weak-active,color-mix(in oklch,var(--wp-admin-theme-color,var(--design-link)) 12%,var(--design-surface-2))); } .dataviews-view-activity .dataviews-view-activity__group-header, .dataviews-view-activity .dataviews-view-activity__item-content .dataviews-view-activity__item-fields, .dataviews-view-picker-activity .dataviews-view-picker-activity__item-content .dataviews-view-picker-activity__item-fields, .dataviews-view-picker-activity .dataviews-view-picker-activity-group__header { color: var(--wpds-color-foreground-content-neutral-weak,var(--design-text-muted)); } .dataviews-view-activity .dataviews-view-activity__item-type:after, .dataviews-view-activity .dataviews-view-activity__item-type:before { background-color: var(--wpds-color-stroke-surface-neutral,var(--design-border-strong)); } .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 { background: linear-gradient(to bottom,var(--wpds-color-stroke-surface-neutral,var(--design-border-strong)) 0,color-mix(in srgb,var(--wpds-color-stroke-surface-neutral,var(--design-border-strong)) 20%,transparent) 60%,transparent 100%); } .dataviews-view-activity .dataviews-view-activity__item-type-icon { background-color: var(--wpds-color-background-surface-neutral-strong,var(--design-surface-2)); } .dataviews-view-activity .dataviews-view-activity__item-type-icon .dataviews-view-activity__item-bullet, .dataviews-view-activity .dataviews-view-activity__item-type-icon img, .dataviews-view-activity .dataviews-view-activity__item-type-icon svg, .dataviews-view-picker-activity .dataviews-view-picker-activity__item-type-icon .dataviews-view-picker-activity__item-bullet, .dataviews-view-picker-activity .dataviews-view-picker-activity__item-type-icon img, .dataviews-view-picker-activity .dataviews-view-picker-activity__item-type-icon svg { box-shadow: inset 0 0 0 var(--wpds-border-width-xs,1px) var(--wpds-color-stroke-surface-neutral, var(--design-border)); } .dataviews-view-activity .dataviews-view-activity__item-type-icon .dataviews-view-activity__item-bullet { background-color: var(--wpds-color-stroke-surface-neutral,var(--design-border)); } .dataviews-view-picker-activity .dataviews-view-picker-activity__item.is-selected, .dataviews-view-picker-activity .dataviews-view-picker-activity__item:hover { background-color: var(--wpds-color-background-interactive-brand-weak-active,color-mix(in oklch,var(--wp-admin-theme-color,var(--design-link)) 12%,var(--design-surface-2))); } .dataviews-view-picker-activity .dataviews-view-picker-activity__item-type:after, .dataviews-view-picker-activity .dataviews-view-picker-activity__item-type:before { background-color: var(--wpds-color-stroke-surface-neutral,var(--design-border-strong)); } .dataviews-view-picker-activity .dataviews-view-picker-activity-group:last-of-type>.dataviews-view-picker-activity__item:last-of-type .dataviews-view-picker-activity__item-type:after, .dataviews-view-picker-activity>.dataviews-view-picker-activity__item:last-child .dataviews-view-picker-activity__item-type:after { background: linear-gradient(to bottom,var(--wpds-color-stroke-surface-neutral,var(--design-border-strong)) 0,color-mix(in srgb,var(--wpds-color-stroke-surface-neutral,var(--design-border-strong)) 20%,transparent) 60%,transparent 100%); } .dataviews-view-picker-activity .dataviews-view-picker-activity__item-type-icon .dataviews-view-picker-activity__item-bullet { background-color: var(--wpds-color-stroke-surface-neutral,var(--design-border)); } .dataviews-controls__date-preset, .fields-create-template-part-modal__area-radio-group { border-color: var(--design-border); } .dataviews-controls__date-preset:active { background-color: var(--wpds-color-background-interactive-neutral-strong-active,var(--design-text)); } .dataforms-layouts-panel__field-trigger { color: inherit; } .dataforms-layouts-panel__field-trigger:not(.is-disabled):hover, .dataforms-layouts-panel__field-trigger:not(.is-disabled):hover .dataforms-layouts-panel__field-label { color: var(--wpds-color-foreground-interactive-brand,var(--wp-admin-theme-color,var(--design-link))); } .dataforms-layouts-panel__field-trigger.is-disabled .dataforms-layouts-panel__field-control { color: var(--wpds-color-foreground-content-neutral-weak,var(--design-text-muted)); } .dataforms-layouts-panel__field-trigger--edit-always .dataforms-layouts-panel__field-trigger-icon:focus-visible, .dataforms-layouts-panel__field-trigger--edit-always .dataforms-layouts-panel__field-trigger-icon:hover { fill: var(--wpds-color-foreground-interactive-brand,var(--wp-admin-theme-color,var(--design-link))); } .dataforms-layouts-panel__field-trigger-icon { color: var(--wpds-color-foreground-interactive-brand,var(--wp-admin-theme-color,var(--design-link))); } .dataforms-layouts-panel__field-label { color: var(--wpds-color-foreground-content-neutral-weak,var(--design-text-muted)); } .dataforms-layouts-panel__field-label-error-content, .dataforms-layouts-panel__field-label.has-error { color: var(--wpds-color-foreground-content-error-weak,var(--design-danger)); } .dataforms-layouts-regular__field .components-base-control__label, .dataforms-layouts-regular__field .components-form-token-field__label, .dataforms-layouts-regular__field .components-input-control__label { color: var(--wpds-color-foreground-content-neutral,var(--design-text)); } .dataforms-layouts-card__field-description { color: var(--wpds-color-foreground-content-neutral-weak,var(--design-text-muted)); } :root { --wp-block-synced-color: var(--design-info); --wp-editor-canvas-background: var(--design-surface-active); --wp-admin-theme-color: var(--design-info); --wp-admin-theme-color-darker-10: var(--design-link); --wp-admin-theme-color-darker-20: var(--design-info); } .fields-create-template-part-modal__area-radio-wrapper { color: var(--design-text); } .fields-create-template-part-modal__area-radio-wrapper+.fields-create-template-part-modal__area-radio-wrapper { border-top-color: var(--design-border); } .fields-create-template-part-modal__area-radio-checkmark, .fields-create-template-part-modal__area-radio-icon, .fields-controls__author-icon svg, .fields-controls__status-icon svg, .rotation-ruler__label { fill: currentColor; } .fields-create-template-part-modal__area-radio-description { color: var(--design-text-muted); } fieldset.fields__media-edit .components-base-control__label { color: var(--design-text); } fieldset.fields__media-edit .fields__media-edit-compact-group { border-color: var(--design-border); } fieldset.fields__media-edit .fields__media-edit-compact-group .fields__media-edit-compact:not(:last-child) { border-bottom-color: var(--design-border); } fieldset.fields__media-edit .fields__media-edit-compact .fields__media-edit-compact-movers { background-color: var(--design-surface-2); } fieldset.fields__media-edit .fields__media-edit-picker-button { border-color: var(--design-border); } fieldset.fields__media-edit .fields__media-edit-picker-button:not(.has-attachment):hover { background-color: color-mix(in srgb,var(--wp-admin-theme-color,var(--design-link)) 4%,transparent); border-color: var(--wp-admin-theme-color-darker-20); } fieldset.fields__media-edit .fields__media-edit-expanded .fields__media-edit-expanded-actions { background-color: var(--design-surface-2); } .fields-controls__featured-image-placeholder { background-color: var(--design-surface-3); box-shadow: none; } .media-editor-preview__file-info { background-color: var(--design-surface-3); } .media-editor-preview__mime-type, .media-editor-preview--empty, .media-editor-preview--error, .media-editor-preview__url { color: var(--design-text-muted); } .wp-media-editor-image-editor__dimming, .wp-media-editor-image-editor--dragging .wp-media-editor-image-editor__dimming { box-shadow: 0 0 0 9999px var(--design-border); } .wp-media-editor-image-editor__grid-line { background-color: rgba(var(--design-surface-2-rgb), 0.4); } .wp-media-editor-image-editor__dimensions-tooltip { background-color: var(--design-surface-2); box-shadow: 0 0 0 1px var(--design-border), var(--design-shadow-1); color: var(--design-text); } .wp-media-editor-image-editor__stencil-rect { border-color: var(--design-border); } .wp-media-editor-image-editor__canvas--focus-visible:focus .wp-media-editor-image-editor__stencil-rect { border-color: var(--wp-image-editor-focus-color,var(--wp-admin-theme-color,var(--design-info))); box-shadow: 0 0 0 1px var(--wp-image-editor-focus-color, var(--wp-admin-theme-color, var(--design-info)) ); } .wp-media-editor-image-editor__handle { background-color: var(--design-surface-2); border-color: var(--design-info); } .wp-media-editor-image-editor__canvas--focus-visible .wp-media-editor-image-editor__handle:focus { background-color: var(--design-info); border-color: transparent; box-shadow: 0 0 0 2px var(--design-surface-2), 0 0 0 4px var(--wp-image-editor-focus-color, var(--wp-admin-theme-color, var(--design-info)) ); } .media-editor .media-editor__canvas-toolbar, .media-editor .media-editor__canvas-area { background-color: var(--design-surface-active); } .media-editor-modal.components-modal__frame .media-editor-modal__footer { background-color: var(--design-surface-2); } .media-editor__history-actions .components-button.has-icon:not([aria-disabled=true]) { color: var(--wp-admin-theme-color); } .media-editor-canvas__error, .media-editor-keyboard-shortcuts-modal .media-editor-keyboard-shortcuts-modal__note { color: var(--design-text-muted); } .media-editor-keyboard-shortcuts-modal .media-editor-keyboard-shortcuts-modal__shortcut { border-top-color: var(--design-border); } .media-editor-keyboard-shortcuts-modal .media-editor-keyboard-shortcuts-modal__shortcut:last-child { border-bottom-color: var(--design-border); } .rotation-ruler, .rotation-ruler__active-label { color: var(--design-text); } .rotation-ruler__pointer { background-color: var(--design-link); } .rotation-ruler__strip { mask-image: linear-gradient(90deg,transparent 0,var(--design-text) 8px,var(--design-text) calc(100% - 8px),transparent); -webkit-mask-image: linear-gradient(90deg,transparent 0,var(--design-text) 8px,var(--design-text) calc(100% - 8px),transparent); } .rotation-ruler__tick { stroke: currentColor; } .rotation-ruler__active-label:before { background: linear-gradient(90deg,transparent 0,var(--design-surface-active) 12px,var(--design-surface-active) calc(100% - 12px),transparent); } .editor-autocompleters__user:not(.is-primary) .editor-autocompleters__user-slug, .editor-collab-sidebar-panel__user-name, .editor-collab-sidebar-panel__user-time { color: var(--design-text-muted); } .editor-collab-sidebar-panel__add-note, .editor-collab-sidebar-panel__thread { background-color: var(--design-surface-3); border-color: var(--design-border); } .editor-collab-sidebar-panel__add-note.is-selected, .editor-collab-sidebar-panel__thread.is-selected { background-color: var(--design-surface-2); box-shadow: var(--design-shadow-3); } .editor-collab-sidebar-panel__show-more-button { color: var(--wpds-color-foreground-interactive-brand,var(--wp-admin-theme-color,var(--design-link))); } .editor-collab-sidebar-panel__show-more-button:active, .editor-collab-sidebar-panel__show-more-button:focus, .editor-collab-sidebar-panel__show-more-button:hover { color: var(--wpds-color-foreground-interactive-brand-active,color-mix(in oklch,var(--wp-admin-theme-color,var(--design-link)) 52%,var(--design-text))); } .editor-collab-sidebar-panel__user-avatar { background-color: var(--design-surface-2); } .editor-collab-sidebar-panel__more-reply-separator:after, .editor-collab-sidebar-panel__more-reply-separator:before, .editor-collab-sidebar-panel__status-separator:after, .editor-collab-sidebar-panel__status-separator:before { background-color: var(--design-surface-active); } .editor-collab-sidebar-panel__deleted-block-notice { color: var(--design-text-muted); } .editor-collab-sidebar-panel__note-form [role=textbox] code { background-color: var(--design-surface-3); } .editor-collab-sidebar-panel__note-form [role=textbox] a { color: var(--wp-admin-theme-color); } .editor-collab-sidebar-panel__skip-to-block, .editor-collab-sidebar-panel__skip-to-note { background-color: var(--design-surface-2) !important; } .editor-note-indicator__avatar { background-color: var(--design-surface-2); } .wp-note-mention { background-color: var(--design-link); color: var(--wpds-color-foreground-interactive-brand,var(--wp-admin-theme-color,var(--design-link))); } @media (forced-colors:active) { .wp-note-mention { border-color: currentcolor; } } .editor-avatar { box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--design-surface-2), var(--design-shadow-2); } .editor-avatar__image { background-color: var(--wp-admin-theme-color,var(--design-link)); color: var(--design-surface-2); } .has-avatar-border-color>.editor-avatar__image:after { box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus,2px) var(--design-surface-2); } .editor-avatar__name { color: var(--editor-avatar-name-color,var(--design-surface-2)); } .editor-avatar.is-badge { background-color: var(--wp-admin-theme-color,var(--design-link)); } .editor-avatar.is-dimmed>.editor-avatar__image { background-color: var(--design-text-muted); } .editor-avatar.is-dimmed.has-avatar-border-color>.editor-avatar__image { border-color: var(--design-border); } .editor-avatar__status-indicator { fill: var(--design-text); color: var(--design-text); } .editor-avatar-group__overflow { color: var(--design-text); } .editor-collaborators-presence__list.components-popover .components-popover__content { background-color: var(--design-surface-2); border-color: var(--design-border); box-shadow: var(--design-shadow-2); } .editor-collaborators-presence__list.components-popover .editor-collaborators-presence__list-header-title span { color: var(--design-text-muted); } .editor-collaborators-presence__list.components-popover .editor-collaborators-presence__list-header-action button, .editor-collaborators-presence__list.components-popover .editor-collaborators-presence__list-item-name { color: var(--design-text); } .editor-collaborators-presence__list.components-popover .editor-collaborators-presence__list-item:focus-visible, .editor-document-tools .editor-document-tools__left>.components-button.has-icon:focus:not(:active), .editor-document-tools .editor-document-tools__left>.components-dropdown>.components-button.has-icon:focus:not(:active) { outline-color: var(--design-link); } .editor-collaborators-presence { background-color: var(--design-surface-3); } .editor-collaborators-presence:hover { background-color: var(--design-surface-hover); } .editor-collaborators-presence:has(.is-pressed) { background-color: var(--design-surface-active); } .editor-collaborators-presence__button.editor-collaborators-presence__button.components-button, .editor-collaborators-presence__button.editor-collaborators-presence__button.components-button.is-pressed, .editor-collaborators-presence__button.editor-collaborators-presence__button.components-button.is-pressed:hover, .editor-collaborators-presence__button.editor-collaborators-presence__button.components-button:hover { background-color: transparent; background-image: none; color: var(--design-text); } .editor-collaborators-presence__button.editor-collaborators-presence__button.components-button:focus:not(:active) { box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus,2px) var(--wp-admin-theme-color, var(--design-info)); } .editor-collapsible-block-toolbar:after, .editor-collapsible-block-toolbar .components-toolbar-group:after, .editor-collapsible-block-toolbar .components-toolbar:after { background-color: var(--design-surface-active); } .editor-block-visibility__disabled-blocks-count { background-color: var(--design-surface-2); border-color: var(--design-border); box-shadow: -32px 0 0 0 var(--design-surface-2), 32px 0 0 0 var(--design-surface-2); } .editor-document-bar { background-color: var(--design-surface-3); } .editor-document-bar:hover, .editor-document-bar .components-button:hover { background-color: var(--design-surface-hover); } .editor-document-bar__command { color: var(--wp-block-synced-color); } .editor-document-bar__title { color: var(--design-text); } .editor-document-bar__post-title { color: currentColor; } .editor-document-bar__post-type-label { color: var(--design-text); } .editor-document-bar__back.components-button.has-icon.has-text { color: var(--design-text-muted); } .editor-document-bar__back.components-button.has-icon.has-text:hover { background-color: transparent; color: var(--design-text); } .editor-document-bar__icon-layout.editor-document-bar__icon-layout svg { fill: var(--design-text-muted); } .document-outline__item .document-outline__emdash:before { color: var(--design-surface-2); } .document-outline__button { background-color: transparent; background-image: none; color: var(--design-text); } .document-outline__button:disabled, .document-outline__button[aria-disabled=true] { color: var(--design-text-muted); } .document-outline__level { background-color: var(--design-surface-active); color: var(--design-text); } .is-invalid .document-outline__level { background-color: var(--design-warning); } .editor-document-outline.has-no-headings { color: var(--design-text-muted); } .editor-document-tools .editor-document-tools__left>.components-button.has-icon.is-pressed, .editor-document-tools .editor-document-tools__left>.components-dropdown>.components-button.has-icon.is-pressed { background-color: var(--design-text); } .entities-saved-states__panel-header { background-color: var(--design-surface-2); border-bottom-color: var(--design-border); } .editor-error-boundary { background-color: var(--design-surface-2); border-color: var(--design-border); box-shadow: var(--design-shadow-3); } .editor-global-styles-sidebar__blocks-group { border-top-color: var(--design-border); } .editor-welcome-guide.guide-styles .editor-welcome-guide__image { background-color: var(--design-info); } .editor-welcome-guide .components-button:hover svg { fill: var(--design-surface-2); } .editor-header { background-color: var(--design-surface-2); } .show-icon-labels .editor-header .components-button.has-icon[aria-disabled=true], .show-icon-labels.interface-pinned-items .components-button.has-icon[aria-disabled=true], .show-icon-labels .editor-header .is-tertiary:active, .show-icon-labels.interface-pinned-items .is-tertiary:active { background-color: transparent; } .show-icon-labels .editor-header__toolbar .block-editor-block-mover:before, .show-icon-labels .editor-header__toolbar .block-editor-block-mover .block-editor-block-mover__move-button-container:before { background-color: var(--design-surface-active); } .show-icon-labels.interface-pinned-items { border-bottom-color: var(--design-border); } .editor-editor-interface.is-distraction-free .editor-header { background-color: var(--design-surface-2); } @media (min-width:782px) { .editor-editor-interface.is-distraction-free .editor-header { box-shadow: 0 1px 0 0 var(--design-border); } } .editor-keyboard-shortcut-help-modal__shortcut { border-top-color: var(--design-border); } .editor-keyboard-shortcut-help-modal__shortcut:last-child { border-bottom-color: var(--design-border); } .editor-keyboard-shortcut-help-modal__shortcut-key-combination { background-color: transparent; background-image: none; } .editor-list-view-sidebar__list-view-container>.document-outline:focus-within::-webkit-scrollbar-thumb, .editor-list-view-sidebar__list-view-container>.document-outline:focus::-webkit-scrollbar-thumb, .editor-list-view-sidebar__list-view-container>.document-outline:hover::-webkit-scrollbar-thumb, .editor-list-view-sidebar__list-view-panel-content:focus-within::-webkit-scrollbar-thumb, .editor-list-view-sidebar__list-view-panel-content:focus::-webkit-scrollbar-thumb, .editor-list-view-sidebar__list-view-panel-content:hover::-webkit-scrollbar-thumb { background-color: var(--design-text-muted); } .editor-list-view-sidebar__list-view-container>.document-outline:focus, .editor-list-view-sidebar__list-view-container>.document-outline:focus-within, .editor-list-view-sidebar__list-view-container>.document-outline:hover, .editor-list-view-sidebar__list-view-panel-content:focus, .editor-list-view-sidebar__list-view-panel-content:focus-within, .editor-list-view-sidebar__list-view-panel-content:hover { scrollbar-color: var(--design-text-muted) transparent; } @media (hover:none) { .editor-list-view-sidebar__list-view-container>.document-outline, .editor-list-view-sidebar__list-view-panel-content { scrollbar-color: var(--design-text-muted) transparent; } } .editor-list-view-sidebar__outline { border-bottom-color: var(--design-border); } .editor-list-view-sidebar__outline>div>span, .editor-post-card-panel .editor-post-card-panel__description, .editor-post-content-information, .editor-post-last-edited-panel, .components-site-home { color: var(--design-text-muted); } .editor-post-featured-image__preview, .editor-post-featured-image__toggle { border-color: var(--design-border); } .editor-post-featured-image__preview { background-image: repeating-linear-gradient(45deg,var(--design-surface-active) 25%,transparent 0,transparent 75%,var(--design-surface-active) 0,var(--design-surface-active)),repeating-linear-gradient(45deg,var(--design-surface-active) 25%,transparent 0,transparent 75%,var(--design-surface-active) 0,var(--design-surface-active)); outline-color: rgba(var(--design-border-rgb), 0.1); } .editor-post-featured-image__actions:not(.editor-post-featured-image__actions-missing-image) .editor-post-featured-image__action { background-color: rgba(var(--design-surface-2-rgb), 0.75); } .editor-post-last-revision__title.components-button.has-icon:active { background-color: var(--design-surface-active); } .editor-post-last-revision__title.components-button.has-icon:hover { background-color: var(--design-surface-hover); } .editor-post-last-revision__title.components-button.has-icon:focus { box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color); } .editor-post-publish-panel__header { background-color: var(--design-surface-2); border-bottom-color: var(--design-border); } .editor-post-publish-panel__prepublish strong { color: var(--design-text); } .editor-post-publish-panel__prepublish .components-panel__body { background-color: var(--design-surface-2); } .post-publish-panel__postpublish .components-panel__body { border-bottom-color: var(--design-border); } .post-publish-panel__postpublish-post-address-container input[readonly] { background-color: var(--design-surface-3); border-color: var(--design-border-strong); } .post-publish-panel__tip { color: var(--design-warning); } .editor-post-publish-panel { background-color: var(--design-surface-2); } @media (min-width:782px) { .editor-post-publish-panel { border-left-color: var(--design-border); } } .editor-revisions-header__no-revisions { color: var(--design-text-muted); } .revision-diff-markers { background-color: rgba(var(--design-text-rgb), 0.05); } .revision-diff-markers .revision-diff-marker.is-added { background-color: var(--design-success); } .revision-diff-markers .revision-diff-marker.is-removed { background: repeating-linear-gradient(45deg,var(--design-danger),var(--design-danger) 6px,rgba(var(--design-danger-rgb), 0.45) 0,rgba(var(--design-danger-rgb), 0.45) 8px); } .revision-diff-markers .revision-diff-marker.is-modified { background: repeating-linear-gradient(-45deg,var(--design-warning),var(--design-warning) 6px,rgba(var(--design-warning-rgb), 0.45) 0,rgba(var(--design-warning-rgb), 0.45) 8px); } .revision-diff-markers .revision-diff-marker:focus { outline-color: var(--design-border); } .editor-revision-fields-diff__added { background-color: color-mix(in srgb,currentColor 5%,var(--design-success) 15%); } .editor-revision-fields-diff__removed { color: var(--design-danger); } .editor-post-saved-state, .editor-post-saved-state.is-saved[aria-disabled=true], .editor-post-saved-state.is-saved[aria-disabled=true]:hover, .editor-post-saved-state.is-saving[aria-disabled=true], .editor-post-saved-state.is-saving[aria-disabled=true]:hover, .editor-sync-connection-error-modal__retry-countdown { color: var(--design-text-muted); } .editor-post-saved-state svg, .editor-upload-progress-snackbar__check svg, .wp-block-image__crop-icon svg, .wp-block-navigation-placeholder__preview>svg, .wp-block-navigation-placeholder__actions__indicator svg { fill: currentColor; } .editor-change-status__password-fieldset, .editor-change-status__publish-date-wrapper, .editor-post-sticky__checkbox-control { border-top-color: var(--design-border); } .editor-post-template__swap-template-modal .editor-post-template__swap-template-search { background-color: var(--design-surface-2); } .editor-post-template__dropdown .components-button.is-pressed, .editor-post-template__dropdown .components-button.is-pressed:hover { background-color: inherit; background-image: inherit; color: inherit; } .editor-template-actions-panel__preview .block-editor-block-preview__container:after { outline-color: rgba(var(--design-border-strong-rgb), 0.1); } .editor-template-actions-panel__preview[role=button]:hover .block-editor-block-preview__container:after { outline-color: rgba(var(--design-border-strong-rgb), 0.3); } .editor-template-actions-panel__preview[role=button]:focus-visible .block-editor-block-preview__container:after { outline-color: var(--wp-admin-theme-color); } textarea.editor-post-text-editor { border-color: var(--design-border-strong); } textarea.editor-post-text-editor::-moz-placeholder { color: rgba(var(--design-text-rgb), 0.62); } textarea.editor-post-text-editor::placeholder { color: rgba(var(--design-text-rgb), 0.62); } .editor-post-url__front-page-link { color: var(--wp-admin-theme-color); } .editor-post-url__front-page-link:hover { color: var(--wp-admin-theme-color-darker-20,var(--design-link)); } .editor-post-url__front-page-link:focus { color: var(--wp-admin-theme-color); } .editor-resizable-editor__resize-handle { background-color: transparent; background-image: none; } .editor-resizable-editor__resize-handle:after { background-color: rgba(var(--design-text-muted-rgb), 0.4); } .editor-layout__toggle-entities-saved-states-panel, .editor-layout__toggle-publish-panel, .editor-layout__toggle-sidebar-panel { background-color: var(--design-surface-2); border-color: var(--design-border); } .editor-start-page-options__modal .editor-start-page-options__modal__actions, .editor-start-template-options__modal .editor-start-template-options__modal__actions { background-color: var(--design-surface-2); border-top-color: var(--design-border); } .editor-sidebar__revisions-block-message { color: var(--design-text-muted); } .fields-controls__password { border-top-color: var(--design-border); } .editor-style-book__tablist-container { background-color: var(--design-surface-2); } .editor-styles-canvas { background-color: var(--wp-editor-canvas-background); } .editor-styles-canvas__section, .editor-styles-canvas__close-button, .editor-text-editor { background-color: var(--design-surface-2); } .table-of-contents__count, .table-of-contents__number, .table-of-contents__popover .word-count, .editor-text-editor__toolbar h2, .editor-push-changes-to-global-styles-modal__value { color: var(--design-text); } .editor-text-editor .editor-post-title.is-raw-text textarea { border-color: var(--design-border-strong); } .editor-text-editor .editor-post-title:not(.is-raw-text) { border-color: var(--design-border); } .editor-text-editor__toolbar { background-color: rgba(var(--design-surface-2-rgb), 0.8); } .editor-visual-editor { background-color: var(--wp-editor-canvas-background); } .block-library-utils__media-control .block-library-utils__media-control__replace-flow button.components-button { border-color: var(--design-border); color: var(--design-text); } .block-library-utils__media-control .block-library-utils__media-control__replace-flow button.components-button:hover, .wp-block-post-content .wp-block-embed__learn-more a { color: var(--wp-admin-theme-color); } .block-library-utils__media-control__inspector-image-indicator { background: var(--design-surface-2) linear-gradient(-45deg,transparent 48%,var(--design-surface-active) 0,var(--design-surface-active) 52%,transparent 0); box-shadow: inset 0 0 0 1px var(--design-border); outline-color: transparent; } .wp-block-button:focus { box-shadow: 0 0 0 1px var(--design-surface-2), 0 0 0 3px var(--wp-admin-theme-color); } .wp-block-comments__legacy-placeholder input:not([type=submit]), .wp-block-comments__legacy-placeholder textarea, .wp-block-post-comments input:not([type=submit]), .wp-block-post-comments textarea { border-color: var(--design-border-strong); } .wp-block-comment-author-avatar__placeholder { stroke: currentColor; border-color: currentcolor; } .wp-block-cover.is-transient:before { background-color: var(--design-surface-2); } .wp-block-form-input.is-selected .is-input-hidden, .wp-block-form-submission-notification.is-selected>* { background-color: transparent; background-image: none; } .blocks-gallery-item figure.is-selected:before { box-shadow: 0 0 0 1px inset var(--design-surface-2), 0 0 0 3px var(--wp-admin-theme-color) inset; } .wp-block-gallery__source-settings .wp-block-gallery__source-description { color: var(--design-text-muted); } .block-library-html__modal-tab { border-color: var(--design-border); } .block-library-html__modal-editor { background-color: transparent; background-image: none; color: inherit; } .wp-block-image__placeholder.has-illustration:before { background-color: var(--design-surface-2); } .wp-block-more .rich-text { background-color: var(--design-surface-2); color: var(--design-text-muted); } .wp-block-more:before { border-top-color: var(--design-border-strong); } .wp-block-navigation-item, .wp-block-navigation__container { background-color: inherit; } .is-editing>.wp-block-navigation__submenu-container>.block-list-appender .block-editor-button-block-appender { background-color: var(--design-text); color: var(--design-surface-1); } .block-library-colors-selector .block-library-colors-selector__state-selection { box-shadow: inset 0 0 0 1px var(--design-border-strong); } .block-library-colors-selector .block-library-colors-selector__state-selection.has-text-color>svg { color: inherit; } .wp-block-navigation .wp-block+.block-list-appender .block-editor-button-block-appender { background-color: var(--design-text); color: var(--design-surface-1); } .wp-block-navigation .wp-block .wp-block .block-editor-button-block-appender { background-color: transparent; color: var(--design-text); } .components-placeholder.wp-block-navigation-placeholder { background-color: transparent; background-image: none; box-shadow: none; } .components-placeholder.wp-block-navigation-placeholder { color: inherit; } .wp-block-navigation.is-selected .components-placeholder.wp-block-navigation-placeholder { color: var(--design-text); } .wp-block-navigation-placeholder__preview { background-color: transparent; background-image: none; color: currentColor; } .wp-block-navigation-placeholder__controls { background-color: var(--design-surface-2); box-shadow: inset 0 0 0 1px var(--design-border-strong); } .wp-block-navigation-placeholder__actions.wp-block-navigation-placeholder__actions hr { background-color: var(--design-text); } .components-button.wp-block-navigation__responsive-container-close.wp-block-navigation__responsive-container-close, .components-button.wp-block-navigation__responsive-container-open.wp-block-navigation__responsive-container-open { color: inherit; } .wp-block-navigation__overlay-menu-preview { background-color: var(--design-surface-3); } .wp-block-navigation__overlay-menu-preview.open { background-color: var(--design-surface-2); border-color: var(--design-border); } .wp-block-navigation__navigation-selector-button, .wp-block-navigation__navigation-selector-button--createnew { border-color: currentcolor; } .wp-block-navigation__overlay-preview { background-color: var(--design-surface-2); border-color: var(--design-border); } .wp-block-navigation__overlay-preview-empty, .wp-block-navigation__overlay-preview-loading, .wp-block-navigation__overlay-preview-placeholder { background-color: var(--design-surface-3); } .wp-block-navigation__overlay-preview-empty { color: var(--design-text-muted); } .wp-block-navigation-link__invalid-item, .link-control-transform__subheading { color: var(--design-text); } .link-control-transform { border-top-color: var(--design-border); } .navigation-link-control__error-text { color: var(--design-danger); } @media (min-width:782px) { .wp-block-navigation-submenu.is-selected>.wp-block-navigation__submenu-container .wp-block-navigation__submenu-container:before { background-color: transparent; background-image: none; } } .wp-block-nextpage>span { background-color: var(--design-surface-2); color: var(--design-text-muted); } .wp-block-nextpage:before { border-top-color: var(--design-border-strong); } .wp-block-post-author__transform { background-color: var(--design-surface-3); } .wp-block-pullquote__citation { color: inherit; } .blocks-shortcode__textarea { background-color: var(--design-surface-2) !important; border-color: var(--design-border-strong) !important; color: var(--design-text) !important; } .wp-block-site-logo.wp-block-site-logo .components-placeholder .components-button.components-button { background: var(--wp-admin-theme-color); border-color: var(--wp-admin-theme-color); color: var(--design-surface-2); } .wp-block-site-logo.wp-block-site-logo .components-placeholder .components-button.components-button>svg { color: inherit; } .block-library-site-logo__inspector-media-replace-container img { box-shadow: inset 0 0 0 1px var(--design-border); } .wp-block-site-tagline__placeholder, .wp-block-site-title__placeholder { border-color: currentcolor; } .wp-block-social-link-anchor { background-color: transparent; background-image: none; color: currentColor; } .block-library-spacer__resize-container.has-show-handle, .wp-block-spacer.is-hovered .block-library-spacer__resize-container, .wp-block-spacer.is-selected.custom-sizes-disabled { background-color: rgba(var(--design-text-rgb), 0.1); } .is-dark-theme .block-library-spacer__resize-container.has-show-handle, .is-dark-theme .wp-block-spacer.is-hovered .block-library-spacer__resize-container, .is-dark-theme .wp-block-spacer.is-selected.custom-sizes-disabled { background-color: rgba(var(--design-surface-2-rgb), 0.15); } .wp-block-table td.is-selected, .wp-block-table th.is-selected { border-color: var(--wp-admin-theme-color); } .wp-block-table table.has-individual-borders tr { border-color: currentcolor; } .block-library-template-part__selection-search { background-color: var(--design-surface-2); } .wp-block-term-template .term-loading .term-loading-placeholder { background-color: var(--design-surface-3); } .wp-block-text-columns .block-editor-rich-text__editable:focus { outline-color: var(--design-border); } .block-library-video-tracks-editor__single-track-editor-edit-track-label, .block-library-video-tracks-editor__tracks-informative-message-title { color: var(--design-text-muted); } .block-library-query-pattern__selection-modal .block-library-query-pattern__selection-search { background-color: var(--design-surface-2); } .wp-block-post-featured-image .components-placeholder .components-button, .wp-block-post-featured-image .wp-block-post-featured-image__placeholder .components-button { background: var(--wp-admin-theme-color); color: var(--design-surface-2); } .wp-block-post-featured-image .components-placeholder .components-button>svg, .wp-block-post-featured-image .wp-block-post-featured-image__placeholder .components-button>svg { color: inherit; } .block-library-poster-image__preview { outline-color: rgba(var(--design-border-rgb), 0.1); } .block-library-poster-image__actions:not(.block-library-poster-image__actions-select) .block-library-poster-image__action { background-color: rgba(var(--design-surface-2-rgb), 0.75); } :root .editor-styles-wrapper .has-very-light-gray-background-color { background-color: var(--design-surface-3); } :root .editor-styles-wrapper .has-very-dark-gray-background-color { background-color: var(--design-text); } :root .editor-styles-wrapper .has-very-light-gray-color { color: var(--design-surface-2); } :root .editor-styles-wrapper .has-very-dark-gray-color { color: var(--design-text); } :root .editor-styles-wrapper .has-vivid-green-cyan-to-vivid-cyan-blue-gradient-background { background: linear-gradient(135deg,var(--design-success),var(--design-link)); } :root .editor-styles-wrapper .has-purple-crush-gradient-background { background: linear-gradient(135deg,var(--design-info),var(--design-link) 50%,var(--design-info)); } :root .editor-styles-wrapper .has-hazy-dawn-gradient-background { background: linear-gradient(135deg,var(--design-danger-border),var(--design-info-border)); } :root .editor-styles-wrapper .has-subdued-olive-gradient-background { background: linear-gradient(135deg,var(--design-warning-subtle),var(--design-success)); } :root .editor-styles-wrapper .has-atomic-cream-gradient-background { background: linear-gradient(135deg,var(--design-warning-border),var(--design-info)); } :root .editor-styles-wrapper .has-nightshade-gradient-background { background: linear-gradient(135deg,var(--design-info),var(--design-info)); } :root .editor-styles-wrapper .has-midnight-gradient-background { background: linear-gradient(135deg,var(--design-link),var(--design-link)); } :root { --wp-block-synced-color: var(--design-info); --wp-editor-canvas-background: var(--design-surface-active); --wp-admin-theme-color: var(--design-info); --wp-admin-theme-color-darker-10: var(--design-link); --wp-admin-theme-color-darker-20: var(--design-info); } .edit-post-meta-boxes-main { background-color: var(--design-surface-2); outline-color: transparent; } .edit-post-meta-boxes-main__presenter { box-shadow: 0 1px var(--design-border); outline-color: transparent; } .edit-post-meta-boxes-main__presenter>button { background-color: transparent; } .edit-post-meta-boxes-main__presenter>button[aria-expanded]:is(:hover,:focus-visible) { color: var(--wp-admin-theme-color); } .edit-post-meta-boxes-main__presenter>button[role=separator]:before { background-color: var(--design-surface-active); } .edit-post-meta-boxes-area .postbox-header { border-top-color: var(--design-border); } .edit-post-welcome-guide__image, .edit-template-welcome-guide__image { background-color: var(--design-info); } .edit-post-welcome-guide .components-button:hover svg, .edit-template-welcome-guide .components-button svg, .edit-template-welcome-guide .components-button:hover svg { fill: var(--design-surface-2); } body.js.block-editor-page { background-color: var(--design-surface-2); } body.js.block-editor-page ul#adminmenu a.wp-has-current-submenu:after, body.js.block-editor-page ul#adminmenu>li.current>a.current:after { border-right-color: var(--design-surface-1); } .commands-command-menu__header .components-button { border-color: var(--design-border); } .commands-command-menu__container [cmdk-input] { color: var(--design-text); } .commands-command-menu__container [cmdk-input]::-moz-placeholder { color: var(--design-text-muted); } .commands-command-menu__container [cmdk-input]::placeholder { color: var(--design-text-muted); } .commands-command-menu__container [cmdk-item] { color: var(--design-text); } .commands-command-menu__container [cmdk-item][aria-disabled=true] { color: var(--design-text-muted); } .commands-command-menu__container [cmdk-item] svg { fill: var(--design-text); } .commands-command-menu__container [cmdk-item]:active>div, .commands-command-menu__container [cmdk-item][aria-selected=true]>div { color: var(--design-surface-2); } .commands-command-menu__container [cmdk-item]:active>div svg, .commands-command-menu__container [cmdk-item][aria-selected=true]>div svg { fill: var(--design-surface-2); } .commands-command-menu__container [cmdk-root]>[cmdk-list]:has([cmdk-empty]), .commands-command-menu__container [cmdk-root]>[cmdk-list]:has([cmdk-group-items]:not(:empty)) { border-top-color: var(--design-border); } .commands-command-menu__container [cmdk-root]>[cmdk-list] [cmdk-group-heading], .commands-command-menu__container [cmdk-empty] { color: var(--design-text); } .commands-command-menu__item-category { color: var(--design-text-muted); } [aria-selected=true] .commands-command-menu__item-category, [cmdk-item]:active .commands-command-menu__item-category { color: rgba(var(--design-surface-2-rgb), 0.8); } .block-directory-block-ratings svg { fill: var(--design-text); } .block-directory-block-ratings .block-directory-block-ratings__star-empty { fill: var(--design-text-muted); } .block-directory-compact-list__item-author { color: var(--design-text-muted); } .block-directory-downloadable-block-icon { border-color: var(--design-border); } .block-directory-downloadable-block-list-item { background-color: transparent; background-image: none; } .block-directory-downloadable-block-list-item__icon .block-directory-downloadable-block-list-item__spinner { background-color: rgba(var(--design-surface-2-rgb), 0.75); } .block-directory-downloadable-block-list-item__details { color: var(--design-text); } .block-directory-downloadable-block-notice { color: var(--design-danger); } .block-directory-downloadable-blocks-panel.has-blocks-loading, .block-directory-downloadable-blocks-panel__no-local { color: var(--design-text-muted); } .block-editor-format-toolbar__link-container-value.has-invalid-link { color: var(--design-danger); } .media-author-field__icon svg { fill: currentColor; } .dataviews-media-field__media-thumbnail__stack { color: var(--design-text-muted); } .dataviews-media-field__media-thumbnail--icon { fill: currentColor; color: var(--design-text-muted); } .media-upload-modal .media-upload-modal__upload-status { background-color: var(--wp-dataviews-color-background,var(--design-surface-2)); } .wp-block-legacy-widget__edit-form { background-color: var(--design-surface-2); border-color: var(--design-border); } .wp-block-legacy-widget__edit-form .wp-block-legacy-widget__edit-form-title, .wp-block-legacy-widget__edit-form .widget-inside.widget-inside a, .wp-block-legacy-widget__edit-form .widget-inside.widget-inside input, .wp-block-legacy-widget__edit-form .widget-inside.widget-inside label { color: var(--design-text); } .wp-block-legacy-widget__edit-form .widget-inside.widget-inside input[type=date], .wp-block-legacy-widget__edit-form .widget-inside.widget-inside input[type=datetime-local], .wp-block-legacy-widget__edit-form .widget-inside.widget-inside input[type=datetime], .wp-block-legacy-widget__edit-form .widget-inside.widget-inside input[type=email], .wp-block-legacy-widget__edit-form .widget-inside.widget-inside input[type=month], .wp-block-legacy-widget__edit-form .widget-inside.widget-inside input[type=number], .wp-block-legacy-widget__edit-form .widget-inside.widget-inside input[type=password], .wp-block-legacy-widget__edit-form .widget-inside.widget-inside input[type=search], .wp-block-legacy-widget__edit-form .widget-inside.widget-inside input[type=tel], .wp-block-legacy-widget__edit-form .widget-inside.widget-inside input[type=text], .wp-block-legacy-widget__edit-form .widget-inside.widget-inside input[type=time], .wp-block-legacy-widget__edit-form .widget-inside.widget-inside input[type=url], .wp-block-legacy-widget__edit-form .widget-inside.widget-inside input[type=week], .wp-block-legacy-widget__edit-form .widget-inside.widget-inside select { border-color: var(--design-border-strong); color: var(--design-text); } .wp-block-legacy-widget__edit-form.wp-block-legacy-widget__edit-form, .wp-block-legacy-widget__edit-no-preview.wp-block-legacy-widget__edit-no-preview, .is-dark-theme .wp-block-widget-group__placeholder .block-editor-button-block-appender { color: var(--design-text); } .wp-block-legacy-widget__edit-no-preview:hover:after, .wp-block-legacy-widget__edit-preview:hover:after { border-color: var(--design-border-strong); } .wp-block-legacy-widget__edit-no-preview.wp-block-legacy-widget__edit-no-preview.wp-block-legacy-widget__edit-no-preview { background-color: var(--design-surface-3); } .dataviews-picker-wrapper, .dataviews-wrapper { background-color: var(--wp-dataviews-color-background,var(--wpds-color-background-surface-neutral-strong,var(--design-surface-2))); } .dataviews-filters__container, .dataviews__view-actions { background-color: inherit; } .dataviews-title-field { color: var(--wpds-color-foreground-content-neutral,var(--design-text)); } .dataviews-title-field a { color: var(--wpds-color-foreground-interactive-neutral,var(--design-text)); } .dataviews-title-field a:hover { color: var(--wpds-color-foreground-interactive-brand,var(--wp-admin-theme-color,var(--design-link))); } .dataviews-title-field a:focus { box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color, var(--design-info)); color: var(--wp-admin-theme-color--rgb); } .dataviews-title-field button.components-button.is-link { color: var(--wpds-color-foreground-interactive-neutral-active,var(--design-text)); } .dataviews-title-field button.components-button.is-link:hover { color: var(--wpds-color-foreground-interactive-brand,var(--wp-admin-theme-color,var(--design-link))); } .dataviews-title-field--clickable { color: var(--wpds-color-foreground-interactive-neutral,var(--design-text)); } .dataviews-title-field--clickable:hover { color: var(--wpds-color-foreground-interactive-brand,var(--wp-admin-theme-color,var(--design-link))); } .dataviews-title-field--clickable:focus { box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color, var(--design-info)); color: var(--wp-admin-theme-color--rgb); } .dataviews__view-actions--infinite-scroll { background-color: var(--design-surface-2); } .dataviews-bulk-actions-footer__item-count { color: var(--wpds-color-foreground-content-neutral,var(--design-text)); } .dataviews-layout__container { background-color: inherit; } .dataviews-filters__summary-operators-container:has(+.dataviews-filters__search-widget-listbox), .dataviews-filters__summary-operators-container:has(+.dataviews-filters__search-widget-no-elements) { border-bottom-color: var(--design-border); } .dataviews-filters__summary-operators-container:has(+.dataviews-filters__user-input-widget) { border-bottom-color: var(--design-border-strong); } .dataviews-filters__summary-operators-container .dataviews-filters__summary-operators-filter-name { color: var(--wpds-color-foreground-content-neutral-weak,var(--design-text-muted)); } .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip { border-color: var(--design-border); color: var(--wpds-color-foreground-interactive-neutral,var(--design-text)); } .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip:focus-visible { background-color: var(--wpds-color-background-interactive-neutral-weak-active,var(--design-surface-3)); border-color: var(--wpds-color-stroke-interactive-neutral-active,var(--design-border)); color: var(--wpds-color-foreground-interactive-neutral,var(--design-text)); } .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip:hover:not(.dataviews-filters__summary-chip-container .dataviews-filters__summary-chip.is-not-clickable) { background-color: var(--wpds-color-background-interactive-neutral-weak-active,var(--design-surface-hover)); border-color: var(--wpds-color-stroke-interactive-neutral-active,var(--design-border)); color: var(--wpds-color-foreground-interactive-neutral,var(--design-text)); } .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip[aria-expanded=true] { background-color: var(--wpds-color-background-interactive-neutral-weak-active,var(--design-surface-3)); border-color: var(--wpds-color-stroke-interactive-neutral-active,var(--design-border)); color: var(--wpds-color-foreground-interactive-neutral,var(--design-text)); } .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip.has-values { background: var(--wpds-color-background-interactive-brand-weak,transparent); border-color: var(--wpds-color-stroke-interactive-brand,var(--wp-admin-theme-color,var(--design-link))); color: var(--wpds-color-foreground-interactive-brand,var(--wp-admin-theme-color,var(--design-link))); } .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip.has-values:hover:not(.dataviews-filters__summary-chip-container .dataviews-filters__summary-chip.has-values.is-not-clickable), .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip.has-values[aria-expanded=true] { background-color: var(--design-link); border-color: var(--wpds-color-stroke-interactive-brand-active,color-mix(in oklch,var(--wp-admin-theme-color,var(--design-link)) 85%,var(--design-border))); color: var(--wpds-color-foreground-interactive-brand-active,color-mix(in oklch,var(--wp-admin-theme-color,var(--design-link)) 52%,var(--design-text))); } .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip:focus-visible, .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove:focus-visible { 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, var(--design-link)) ); } .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove svg { fill: var(--wpds-color-foreground-interactive-neutral,var(--design-text)); } .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove:focus { background-color: var(--design-surface-3); } .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove:hover { background-color: var(--design-surface-hover); } .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove:focus svg, .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove:hover svg { fill: var(--wpds-color-foreground-interactive-neutral-active,var(--design-text)); } .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove.has-values svg { fill: var(--wpds-color-foreground-interactive-brand,var(--wp-admin-theme-color,var(--design-link))); } .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove.has-values:hover { background-color: var(--design-link); } .dataviews-filters__search-widget-filter-combobox-list { border-top-color: var(--design-border); } .dataviews-filters__search-widget-listitem { color: var(--wpds-color-foreground-interactive-neutral,var(--design-text)); } .dataviews-filters__search-widget-listitem:focus, .dataviews-filters__search-widget-listitem:hover, .dataviews-filters__search-widget-listitem[data-active-item] { background-color: var(--wpds-color-background-interactive-brand-weak-active,color-mix(in oklch,var(--wp-admin-theme-color,var(--design-link)) 12%,var(--design-surface-2))); color: var(--wpds-color-foreground-interactive-neutral-active,var(--design-text)); } .dataviews-filters__search-widget-listitem:focus .dataviews-filters__search-widget-listitem-single-selection, .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 { background-color: var(--design-surface-2); border-color: var(--wpds-color-stroke-interactive-brand-active,color-mix(in oklch,var(--wp-admin-theme-color,var(--design-link)) 85%,var(--design-border-strong))); } .dataviews-filters__search-widget-listitem:focus .dataviews-filters__search-widget-listitem-single-selection.is-selected, .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 { background-color: var(--design-link); border-color: var(--wpds-color-stroke-interactive-brand-active,color-mix(in oklch,var(--wp-admin-theme-color,var(--design-link)) 85%,var(--design-border-strong))); } .dataviews-filters__search-widget-listitem:focus .dataviews-filters__search-widget-listitem-multi-selection, .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 { background-color: var(--design-surface-2); border-color: var(--wpds-color-stroke-interactive-brand-active,color-mix(in oklch,var(--wp-admin-theme-color,var(--design-link)) 85%,var(--design-border-strong))); } .dataviews-filters__search-widget-listitem:focus .dataviews-filters__search-widget-listitem-multi-selection.is-selected, .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 { background-color: var(--design-link); border-color: var(--wpds-color-stroke-interactive-brand-active,color-mix(in oklch,var(--wp-admin-theme-color,var(--design-link)) 85%,var(--design-border-strong))); } .dataviews-filters__search-widget-listitem:focus .dataviews-filters__search-widget-listitem-description, .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 { color: var(--wpds-color-foreground-interactive-neutral-weak-active,var(--design-text)); } .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-description { color: var(--wpds-color-foreground-interactive-neutral-weak,var(--design-text-muted)); } .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-single-selection { border-color: var(--design-border-strong); } .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-single-selection:checked:before { background-color: var(--design-surface-2); border-color: var(--design-surface-2); } .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-single-selection:focus { box-shadow: 0 0 0 2px var(--design-surface-2), 0 0 0 4px var(--wp-admin-theme-color); } .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-single-selection:checked { background: var(--wp-admin-theme-color); } .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-single-selection.is-selected { background-color: var(--design-link); border-color: var(--wpds-color-stroke-interactive-brand,var(--wp-admin-theme-color,var(--design-link))); } .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-single-selection.is-selected:before { background-color: var(--wpds-color-foreground-interactive-brand-strong,var(--design-surface-2)); border-color: var(--design-surface-2); } .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection { border-color: var(--design-border-strong); } .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection:focus { border-color: var(--wp-admin-theme-color); box-shadow: 0 0 0 .5px var(--wp-admin-theme-color); } .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection::-moz-placeholder { color: rgba(var(--design-text-rgb), 0.62); } .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection::placeholder { color: rgba(var(--design-text-rgb), 0.62); } .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection:focus { box-shadow: 0 0 0 2px var(--design-surface-2), 0 0 0 4px var(--wp-admin-theme-color); } .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection:checked, .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection[aria-checked=mixed] { background: var(--wp-admin-theme-color); border-color: var(--wp-admin-theme-color); } .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 { color: var(--design-surface-2); } .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection:disabled, .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection[aria-disabled=true] { background-color: var(--design-surface-3); border-color: var(--design-border-strong); } .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection { background: var(--wpds-color-background-interactive-neutral-weak,transparent); color: var(--wpds-color-foreground-content-neutral,var(--design-text)); } .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection.is-selected { background-color: var(--design-link); border-color: var(--wpds-color-stroke-interactive-brand,var(--wp-admin-theme-color,var(--design-link))); } .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection.is-selected svg { fill: var(--wpds-color-foreground-interactive-neutral-strong,var(--design-surface-2)); } .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input { border-color: var(--design-border-strong); } .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input:focus { box-shadow: 0 0 0 .5px var(--wp-admin-theme-color); } .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::-moz-placeholder { color: rgba(var(--design-text-rgb), 0.62); } .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::placeholder { color: rgba(var(--design-text-rgb), 0.62); } .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input:focus { background-color: var(--design-surface-2); box-shadow: inset 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, var(--design-link)) ); } .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::-moz-placeholder { color: var(--wpds-color-foreground-content-neutral-weak,var(--design-text-muted)); } .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::placeholder { color: var(--wpds-color-foreground-content-neutral-weak,var(--design-text-muted)); } .dataviews-filters-toggle__count { background-color: var(--design-link); color: var(--wpds-color-foreground-interactive-neutral-strong,var(--design-surface-2)); outline-color: var(--design-surface-2); } .dataviews-footer { background-color: inherit; border-top-color: var(--design-border); } .dataviews-view-config__modified-indicator { background-color: var(--design-link); } .dataviews-view-grid .dataviews-view-grid__row .dataviews-view-grid__row__gridcell[data-focus-visible]:after { box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wpds-color-stroke-focus, var(--wp-admin-theme-color, var(--design-link)) ); } .dataviews-view-grid .dataviews-view-grid__card.is-selected .dataviews-view-grid__fields .dataviews-view-grid__field .dataviews-view-grid__field-value, .dataviews-view-grid-infinite-scroll .dataviews-view-grid__card.is-selected .dataviews-view-grid__fields .dataviews-view-grid__field .dataviews-view-grid__field-value { color: var(--wpds-color-foreground-content-neutral,var(--design-text)); } .dataviews-view-grid .dataviews-view-grid__card.is-selected .dataviews-view-grid__media:after, .dataviews-view-grid-infinite-scroll .dataviews-view-grid__card.is-selected .dataviews-view-grid__media:after { box-shadow: inset 0 0 0 var(--wpds-border-width-xs,1px) var(--wpds-color-stroke-interactive-brand, var(--wp-admin-theme-color, var(--design-link)) ), inset 0 0 0 var(--wpds-border-width-sm,2px) var(--wpds-color-background-surface-neutral-strong, var(--design-surface-2)); } .dataviews-view-grid .dataviews-view-grid__card .dataviews-view-grid__media:focus:after, .dataviews-view-grid-infinite-scroll .dataviews-view-grid__card .dataviews-view-grid__media:focus:after { box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wpds-color-stroke-focus, var(--wp-admin-theme-color, var(--design-link)) ); } .dataviews-view-grid .dataviews-view-grid__media, .dataviews-view-grid-infinite-scroll .dataviews-view-grid__media { background-color: var(--wpds-color-background-surface-neutral-strong,var(--design-surface-2)); } .dataviews-view-grid .dataviews-view-grid__media:after, .dataviews-view-grid-infinite-scroll .dataviews-view-grid__media:after { box-shadow: inset 0 0 0 var(--wpds-border-width-xs,1px) var(--design-border); } .dataviews-view-grid .dataviews-view-grid__media .dataviews-view-grid__media-placeholder, .dataviews-view-grid-infinite-scroll .dataviews-view-grid__media .dataviews-view-grid__media-placeholder { background-color: var(--design-surface-2); } .dataviews-view-grid .dataviews-view-grid__fields .dataviews-view-grid__field .dataviews-view-grid__field-name, .dataviews-view-grid-infinite-scroll .dataviews-view-grid__fields .dataviews-view-grid__field .dataviews-view-grid__field-name { color: var(--wpds-color-foreground-content-neutral-weak,var(--design-text-muted)); } .dataviews-view-grid__card .dataviews-view-grid__media-actions .dataviews-all-actions-button { background-color: var(--wpds-color-background-surface-neutral-strong,var(--design-surface-2)); } .dataviews-view-grid__group-header { color: var(--wpds-color-foreground-content-neutral,var(--design-text)); } .dataviews-view-list div[role=article], .dataviews-view-list div[role=row] { border-top-color: var(--design-border); } .dataviews-view-list div[role=article].is-selected.is-selected, .dataviews-view-list div[role=article].is-selected.is-selected+div[role=article], .dataviews-view-list div[role=article].is-selected.is-selected+div[role=row], .dataviews-view-list div[role=row].is-selected.is-selected, .dataviews-view-list div[role=row].is-selected.is-selected+div[role=article], .dataviews-view-list div[role=row].is-selected.is-selected+div[role=row] { border-top-color: var(--design-link); } .dataviews-view-list div[role=article]:not(.is-selected).is-hovered, .dataviews-view-list div[role=article]:not(.is-selected):focus-within, .dataviews-view-list div[role=article]: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, .dataviews-view-list div[role=row]:not(.is-selected):hover { background-color: var(--wpds-color-background-interactive-brand-weak,transparent); color: var(--wpds-color-foreground-interactive-brand,var(--wp-admin-theme-color,var(--design-link))); } .dataviews-view-list div[role=article]:not(.is-selected).is-hovered .dataviews-title-field, .dataviews-view-list div[role=article]:not(.is-selected).is-hovered .dataviews-view-list__field, .dataviews-view-list div[role=article]:not(.is-selected):focus-within .dataviews-title-field, .dataviews-view-list div[role=article]:not(.is-selected):focus-within .dataviews-view-list__field, .dataviews-view-list div[role=article]:not(.is-selected):hover .dataviews-title-field, .dataviews-view-list div[role=article]:not(.is-selected):hover .dataviews-view-list__field, .dataviews-view-list div[role=row]:not(.is-selected).is-hovered .dataviews-title-field, .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, .dataviews-view-list div[role=row]:not(.is-selected):focus-within .dataviews-view-list__field, .dataviews-view-list div[role=row]:not(.is-selected):hover .dataviews-title-field, .dataviews-view-list div[role=row]:not(.is-selected):hover .dataviews-view-list__field { color: var(--wpds-color-foreground-interactive-brand,var(--wp-admin-theme-color,var(--design-link))); } .dataviews-view-list div[role=article].is-selected .dataviews-view-list__item-wrapper, .dataviews-view-list div[role=article].is-selected:focus-within .dataviews-view-list__item-wrapper, .dataviews-view-list div[role=row].is-selected .dataviews-view-list__item-wrapper, .dataviews-view-list div[role=row].is-selected:focus-within .dataviews-view-list__item-wrapper { background-color: var(--wpds-color-background-interactive-brand-weak-active,color-mix(in oklch,var(--wp-admin-theme-color,var(--design-link)) 12%,var(--design-surface-2))); color: var(--wpds-color-foreground-interactive-neutral,var(--design-text)); } .dataviews-view-list div[role=article].is-selected .dataviews-view-list__item-wrapper .dataviews-title-field, .dataviews-view-list div[role=article].is-selected .dataviews-view-list__item-wrapper .dataviews-view-list__field, .dataviews-view-list div[role=article].is-selected:focus-within .dataviews-view-list__item-wrapper .dataviews-title-field, .dataviews-view-list div[role=article].is-selected:focus-within .dataviews-view-list__item-wrapper .dataviews-view-list__field, .dataviews-view-list div[role=row].is-selected .dataviews-view-list__item-wrapper .dataviews-title-field, .dataviews-view-list div[role=row].is-selected .dataviews-view-list__item-wrapper .dataviews-view-list__field, .dataviews-view-list div[role=row].is-selected:focus-within .dataviews-view-list__item-wrapper .dataviews-title-field, .dataviews-view-list div[role=row].is-selected:focus-within .dataviews-view-list__item-wrapper .dataviews-view-list__field { color: var(--wpds-color-foreground-interactive-neutral-active,var(--design-text)); } .dataviews-view-list .dataviews-view-list__item { background-color: transparent; background-image: none; } .dataviews-view-list .dataviews-view-list__item:focus-visible:before { box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wpds-color-stroke-focus, var(--wp-admin-theme-color, var(--design-link)) ); } .dataviews-view-list .dataviews-view-list__media-wrapper { background-color: var(--wpds-color-background-surface-neutral-strong,var(--design-surface-2)); } .dataviews-view-list .dataviews-view-list__media-wrapper:after, .dataviews-column-primary__media:after { box-shadow: inset 0 0 0 var(--wpds-border-width-xs,1px) var(--design-border); } .dataviews-view-list .dataviews-view-list__field { color: var(--wpds-color-foreground-interactive-neutral-weak,var(--design-text-muted)); } .dataviews-view-list__group-header { color: var(--wpds-color-foreground-content-neutral,var(--design-text)); } .dataviews-view-table { background-color: inherit; border-color: inherit; color: var(--wpds-color-foreground-content-neutral-weak,var(--design-text-muted)); } .dataviews-view-table th { color: var(--wpds-color-foreground-content-neutral,var(--design-text)); } .dataviews-view-table td.dataviews-view-table__actions-column--sticky, .dataviews-view-table th.dataviews-view-table__actions-column--sticky { background-color: var(--wp-dataviews-color-background,var(--wpds-color-background-surface-neutral-strong,var(--design-surface-2))); } .dataviews-view-table td.dataviews-view-table__actions-column--stuck:after, .dataviews-view-table th.dataviews-view-table__actions-column--stuck:after { background-color: var(--wpds-color-background-surface-neutral,var(--design-surface-2)); } .dataviews-view-table tr { border-top-color: var(--design-border); } .dataviews-view-table tr.is-selected { background-color: var(--wpds-color-background-interactive-brand-weak-active,color-mix(in oklch,var(--wp-admin-theme-color,var(--design-link)) 12%,var(--design-surface-2))); color: var(--wpds-color-foreground-content-neutral,var(--design-text)); } .dataviews-view-table tr.is-selected, .dataviews-view-table tr.is-selected+tr { border-top-color: var(--design-link); } .dataviews-view-table tr.is-selected .dataviews-view-table__actions-column--sticky { background-color: var(--wpds-color-background-interactive-brand-weak-active,color-mix(in oklch,var(--wp-admin-theme-color,var(--design-link)) 12%,var(--design-surface-2))); } .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 { background-color: var(--wp-dataviews-color-background,var(--wpds-color-background-surface-neutral-strong,var(--design-surface-2))); } .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 { background-color: var(--wpds-color-background-interactive-brand-weak-active,color-mix(in oklch,var(--wp-admin-theme-color,var(--design-link)) 12%,var(--design-surface-2))); } .dataviews-view-table thead.dataviews-view-table__thead--stuck:after { background-color: var(--wpds-color-stroke-surface-neutral-weak,var(--design-surface-3)); } .dataviews-view-table .dataviews-view-table-header-button:not(:hover) { color: var(--wpds-color-foreground-interactive-neutral,var(--design-text)); } .dataviews-column-primary__media, .dataviews-view-picker-grid .dataviews-view-picker-grid__media { background-color: var(--wpds-color-background-surface-neutral-strong,var(--design-surface-2)); } .dataviews-view-table__group-header-row .dataviews-view-table__group-header-cell, .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 { color: var(--wpds-color-foreground-content-neutral,var(--design-text)); } .dataviews-view-picker-grid .dataviews-view-picker-grid__card.is-selected .dataviews-view-picker-grid__media:after { box-shadow: inset 0 0 0 var(--wpds-border-width-xs,1px) var(--wpds-color-stroke-interactive-brand, var(--wp-admin-theme-color, var(--design-link)) ), inset 0 0 0 var(--wpds-border-width-sm,2px) var(--wpds-color-background-surface-neutral-strong, var(--design-surface-2)); } .dataviews-view-picker-grid .dataviews-view-picker-grid__card .dataviews-view-picker-grid__media:focus:after { box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wpds-color-stroke-focus, var(--wp-admin-theme-color, var(--design-link)) ); } .dataviews-view-picker-grid:focus-visible [data-active-item=true], .dataviews-view-picker-table tbody:focus-visible [data-active-item=true], .dataviews-view-activity .dataviews-view-activity__item-content .dataviews-view-activity__item-title--clickable:focus-visible, .dataviews-view-picker-activity:focus-visible .dataviews-view-picker-activity__item[data-active-item=true], .dataforms-layouts-panel__field-trigger-icon:focus-visible { outline-color: var(--design-link); } .dataviews-view-picker-grid .dataviews-view-picker-grid__media:after { box-shadow: inset 0 0 0 var(--wpds-border-width-xs,1px) var(--design-border); } .dataviews-view-picker-grid .dataviews-view-picker-grid__fields .dataviews-view-picker-grid__field .dataviews-view-picker-grid__field-name { color: var(--wpds-color-foreground-content-neutral-weak,var(--design-text-muted)); } .dataviews-view-picker-grid-group__header { color: var(--wpds-color-foreground-content-neutral,var(--design-text)); } .dataviews-view-picker-table { background-color: inherit; } .dataviews-view-picker-table .dataviews-view-table__row.is-hovered, .dataviews-view-picker-table .dataviews-view-table__row.is-selected, .dataviews-view-picker-table .dataviews-view-table__row.is-selected.is-hovered { background-color: var(--wpds-color-background-interactive-brand-weak-active,color-mix(in oklch,var(--wp-admin-theme-color,var(--design-link)) 12%,var(--design-surface-2))); } .dataviews-view-activity .dataviews-view-activity__group-header, .dataviews-view-activity .dataviews-view-activity__item-content .dataviews-view-activity__item-fields, .dataviews-view-picker-activity .dataviews-view-picker-activity__item-content .dataviews-view-picker-activity__item-fields, .dataviews-view-picker-activity .dataviews-view-picker-activity-group__header { color: var(--wpds-color-foreground-content-neutral-weak,var(--design-text-muted)); } .dataviews-view-activity .dataviews-view-activity__item-type:after, .dataviews-view-activity .dataviews-view-activity__item-type:before { background-color: var(--wpds-color-stroke-surface-neutral,var(--design-border-strong)); } .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 { background: linear-gradient(to bottom,var(--wpds-color-stroke-surface-neutral,var(--design-border-strong)) 0,color-mix(in srgb,var(--wpds-color-stroke-surface-neutral,var(--design-border-strong)) 20%,transparent) 60%,transparent 100%); } .dataviews-view-activity .dataviews-view-activity__item-type-icon { background-color: var(--wpds-color-background-surface-neutral-strong,var(--design-surface-2)); } .dataviews-view-activity .dataviews-view-activity__item-type-icon .dataviews-view-activity__item-bullet, .dataviews-view-activity .dataviews-view-activity__item-type-icon img, .dataviews-view-activity .dataviews-view-activity__item-type-icon svg, .dataviews-view-picker-activity .dataviews-view-picker-activity__item-type-icon .dataviews-view-picker-activity__item-bullet, .dataviews-view-picker-activity .dataviews-view-picker-activity__item-type-icon img, .dataviews-view-picker-activity .dataviews-view-picker-activity__item-type-icon svg { box-shadow: inset 0 0 0 var(--wpds-border-width-xs,1px) var(--wpds-color-stroke-surface-neutral, var(--design-border)); } .dataviews-view-activity .dataviews-view-activity__item-type-icon .dataviews-view-activity__item-bullet { background-color: var(--wpds-color-stroke-surface-neutral,var(--design-border)); } .dataviews-view-picker-activity .dataviews-view-picker-activity__item.is-selected, .dataviews-view-picker-activity .dataviews-view-picker-activity__item:hover { background-color: var(--wpds-color-background-interactive-brand-weak-active,color-mix(in oklch,var(--wp-admin-theme-color,var(--design-link)) 12%,var(--design-surface-2))); } .dataviews-view-picker-activity .dataviews-view-picker-activity__item-type:after, .dataviews-view-picker-activity .dataviews-view-picker-activity__item-type:before { background-color: var(--wpds-color-stroke-surface-neutral,var(--design-border-strong)); } .dataviews-view-picker-activity .dataviews-view-picker-activity-group:last-of-type>.dataviews-view-picker-activity__item:last-of-type .dataviews-view-picker-activity__item-type:after, .dataviews-view-picker-activity>.dataviews-view-picker-activity__item:last-child .dataviews-view-picker-activity__item-type:after { background: linear-gradient(to bottom,var(--wpds-color-stroke-surface-neutral,var(--design-border-strong)) 0,color-mix(in srgb,var(--wpds-color-stroke-surface-neutral,var(--design-border-strong)) 20%,transparent) 60%,transparent 100%); } .dataviews-view-picker-activity .dataviews-view-picker-activity__item-type-icon .dataviews-view-picker-activity__item-bullet { background-color: var(--wpds-color-stroke-surface-neutral,var(--design-border)); } .dataviews-controls__date-preset, .fields-create-template-part-modal__area-radio-group { border-color: var(--design-border); } .dataviews-controls__date-preset:active { background-color: var(--wpds-color-background-interactive-neutral-strong-active,var(--design-text)); } .dataforms-layouts-panel__field-trigger { color: inherit; } .dataforms-layouts-panel__field-trigger:not(.is-disabled):hover, .dataforms-layouts-panel__field-trigger:not(.is-disabled):hover .dataforms-layouts-panel__field-label { color: var(--wpds-color-foreground-interactive-brand,var(--wp-admin-theme-color,var(--design-link))); } .dataforms-layouts-panel__field-trigger.is-disabled .dataforms-layouts-panel__field-control { color: var(--wpds-color-foreground-content-neutral-weak,var(--design-text-muted)); } .dataforms-layouts-panel__field-trigger--edit-always .dataforms-layouts-panel__field-trigger-icon:focus-visible, .dataforms-layouts-panel__field-trigger--edit-always .dataforms-layouts-panel__field-trigger-icon:hover { fill: var(--wpds-color-foreground-interactive-brand,var(--wp-admin-theme-color,var(--design-link))); } .dataforms-layouts-panel__field-trigger-icon { color: var(--wpds-color-foreground-interactive-brand,var(--wp-admin-theme-color,var(--design-link))); } .dataforms-layouts-panel__field-label { color: var(--wpds-color-foreground-content-neutral-weak,var(--design-text-muted)); } .dataforms-layouts-panel__field-label-error-content, .dataforms-layouts-panel__field-label.has-error { color: var(--wpds-color-foreground-content-error-weak,var(--design-danger)); } .dataforms-layouts-regular__field .components-base-control__label, .dataforms-layouts-regular__field .components-form-token-field__label, .dataforms-layouts-regular__field .components-input-control__label { color: var(--wpds-color-foreground-content-neutral,var(--design-text)); } .dataforms-layouts-card__field-description { color: var(--wpds-color-foreground-content-neutral-weak,var(--design-text-muted)); } .fields-create-template-part-modal__area-radio-wrapper { color: var(--design-text); } .fields-create-template-part-modal__area-radio-wrapper+.fields-create-template-part-modal__area-radio-wrapper { border-top-color: var(--design-border); } .fields-create-template-part-modal__area-radio-checkmark, .fields-create-template-part-modal__area-radio-icon, .fields-controls__author-icon svg, .fields-controls__status-icon svg, .global-styles-ui-icon-with-current-color, .global-styles-ui-sidebar__panel .block-editor-block-icon svg { fill: currentColor; } .fields-create-template-part-modal__area-radio-description { color: var(--design-text-muted); } input[type=radio]:not(:checked):hover~.fields-create-template-part-modal__area-radio-description { color: inherit; } fieldset.fields__media-edit .components-base-control__label { color: var(--design-text); } fieldset.fields__media-edit .fields__media-edit-compact-group { border-color: var(--design-border); } fieldset.fields__media-edit .fields__media-edit-compact-group .fields__media-edit-compact:not(:last-child) { border-bottom-color: var(--design-border); } fieldset.fields__media-edit .fields__media-edit-compact .fields__media-edit-compact-movers { background-color: var(--design-surface-2); } fieldset.fields__media-edit .fields__media-edit-picker-button { border-color: var(--design-border); } fieldset.fields__media-edit .fields__media-edit-picker-button:not(.has-attachment):hover { background-color: color-mix(in srgb,var(--wp-admin-theme-color,var(--design-link)) 4%,transparent); border-color: var(--wp-admin-theme-color-darker-20); } fieldset.fields__media-edit .fields__media-edit-expanded .fields__media-edit-expanded-actions { background-color: var(--design-surface-2); } .fields-controls__featured-image-placeholder { background-color: var(--design-surface-3); box-shadow: none; } .font-library__footer { background-color: var(--design-surface-2); border-top-color: var(--design-border); } .font-library__font-card { border-color: var(--design-border); } .font-library__font-card:hover { background-color: var(--design-surface-hover); } .font-library__font-card .font-library__font-card__count, .font-library__local-fonts .font-library__upload-area__text { color: var(--design-text-muted); } .font-library-modal__tablist-container { background-color: var(--design-surface-2); border-bottom-color: var(--design-border); } button.font-library__upload-area { background-color: var(--design-surface-3); } .global-styles-ui-screen-revisions__revision-item:hover .global-styles-ui-screen-revisions__date, .global-styles-ui-screen-revisions__revision-item[aria-selected=true] .global-styles-ui-screen-revisions__date { color: var(--wp-admin-theme-color); } .global-styles-ui-screen-revisions__revision-item:before { background-color: var(--design-surface-active); border-color: transparent; } .global-styles-ui-screen-revisions__revision-item[aria-selected=true] .global-styles-ui-screen-revisions__changes>li, .global-styles-ui-screen-revisions__revision-item[aria-selected=true] .global-styles-ui-screen-revisions__meta { color: var(--design-text); } .global-styles-ui-screen-revisions__revision-item:after { border-color: var(--design-border); } .global-styles-ui-screen-revisions__changes, .global-styles-ui-screen-revisions__meta { color: var(--design-text-muted); } .global-styles-ui-screen-revisions__pagination.global-styles-ui-screen-revisions__pagination .components-button.is-tertiary { color: var(--design-text); } .global-styles-ui-screen-revisions__pagination.global-styles-ui-screen-revisions__pagination .components-button.is-tertiary:disabled, .global-styles-ui-screen-revisions__pagination.global-styles-ui-screen-revisions__pagination .components-button.is-tertiary[aria-disabled=true], .global-styles-ui-font-size__item-value, .global-styles-ui-screen-typography__font-variants-count { color: var(--design-text-muted); } .global-styles-ui-screen-revisions__footer { background-color: var(--design-surface-2); border-top-color: var(--design-border); } .global-styles-ui-variations_item .global-styles-ui-variations_item-preview { outline-color: rgba(var(--design-border-rgb), 0.1); } .global-styles-ui-variations_item:not(.is-active):hover .global-styles-ui-variations_item-preview { outline-color: rgba(var(--design-border-rgb), 0.3); } .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 { outline-color: var(--design-border); } .global-styles-ui-variations_item:focus-visible .global-styles-ui-variations_item-preview { outline-color: var(--wp-admin-theme-color); } .global-styles-ui-typography-preview { background-color: var(--design-surface-3); } .global-styles-ui-section-title { color: var(--design-text); } .global-styles-ui__block-preview-panel { border-color: var(--design-border); } .global-styles-ui__shadow-preview-panel { background-image: repeating-linear-gradient(45deg,var(--design-surface-active) 25%,transparent 0,transparent 75%,var(--design-surface-active) 0,var(--design-surface-active)),repeating-linear-gradient(45deg,var(--design-surface-active) 25%,transparent 0,transparent 75%,var(--design-surface-active) 0,var(--design-surface-active)); border-color: var(--design-border); } .global-styles-ui__shadow-preview-panel .global-styles-ui__shadow-preview-block { background-color: var(--design-surface-2); border-color: var(--design-border); } .global-styles-ui__shadow-editor__dropdown-toggle.is-open, .edit-site-custom-template-modal .edit-site-custom-template-modal__suggestions_list__list-item:focus { background-color: var(--design-surface-3); } .global-styles-ui-screen-variations { border-top-color: var(--design-border); } .global-styles-ui-color-palette__tablist-container { border-bottom-color: var(--design-border); } .edit-site-custom-template-modal .edit-site-custom-template-modal__suggestions_list__list-item__info { color: var(--design-text-muted); } .edit-site-custom-template-modal__no-results, .edit-site-add-new-template__template-list__contents>.components-button, .edit-site-custom-template-modal__contents>.components-button { border-color: var(--design-border); } .edit-site-add-new-template__modal .edit-site-add-new-template__custom-template-button svg, .edit-site-add-new-template__modal .edit-site-add-new-template__template-button svg { fill: var(--wp-admin-theme-color); } .edit-site-add-new-template__template-list__contents>.components-button span:first-child, .edit-site-custom-template-modal__contents>.components-button span:first-child { color: var(--design-text); } .edit-site-add-new-template__template-list__contents>.components-button span, .edit-site-custom-template-modal__contents>.components-button span { color: var(--design-text-muted); } .edit-site-add-new-template__template-list__contents>.components-button:hover, .edit-site-custom-template-modal__contents>.components-button:hover { background: rgba(var(--wp-admin-theme-color--rgb),.04); color: var(--wp-admin-theme-color-darker-10); } .edit-site-add-new-template__template-list__contents>.components-button:hover span, .edit-site-custom-template-modal__contents>.components-button:hover span, .edit-site-add-new-template__template-list__contents>.components-button:focus span:first-child, .edit-site-custom-template-modal__contents>.components-button:focus span:first-child { color: var(--wp-admin-theme-color); } .edit-site-add-new-template__template-list__contents>.components-button:focus, .edit-site-custom-template-modal__contents>.components-button:focus { outline-color: transparent; } .edit-site-patterns__pattern-icon { fill: var(--wp-block-synced-color); } .edit-site-patterns__section-header { border-bottom-color: var(--design-border); } .dataviews-action-modal__duplicate-pattern .components-form-token-field__suggestions-list:not(:empty) { background-color: var(--wpds-color-background-surface-neutral-strong,var(--design-surface-2)); } .edit-site-editor__toggle-save-panel { background-color: var(--design-surface-2); border-color: var(--design-border); } .edit-site-welcome-guide.guide-editor .edit-site-welcome-guide__image { background-color: var(--design-info); } .edit-site-welcome-guide.guide-page .edit-site-welcome-guide__video { border-right-color: var(--design-link); border-top-color: var(--design-link); } .edit-site-welcome-guide.guide-template .edit-site-welcome-guide__video { border-left-color: var(--design-link); border-top-color: var(--design-link); } .edit-site-welcome-guide .components-button:hover svg { fill: var(--design-surface-2); } .edit-site-layout, .edit-site-layout__canvas .edit-site-resizable-frame__inner { color: var(--wpds-color-foreground-content-neutral,var(--design-text)); } .edit-site-layout, .edit-site-layout:not(.is-full-canvas) .editor-visual-editor { background-color: var(--design-surface-3); } .edit-site-sidebar__screen-wrapper:has(.edit-site-layout__mobile-content) { background-color: var(--design-surface-2); } @media (min-width:782px) { .edit-site-layout__canvas .edit-site-resizable-frame__inner-content { box-shadow: var(--design-shadow-2); } .edit-site-layout__canvas .edit-site-resizable-frame__inner-content:hover { box-shadow: var(--design-shadow-3); } } .edit-site-layout__actions { background-color: var(--design-surface-2); color: var(--wpds-color-foreground-content-neutral,var(--design-text)); } @media (min-width:782px) { .edit-site-layout__actions { border-left-color: var(--design-border); } } .edit-site-layout__area { box-shadow: var(--design-shadow-2); } .edit-site-save-hub { border-top-color: var(--design-border); color: var(--wpds-color-foreground-content-neutral,var(--design-text)); } .edit-site-save-hub__button { color: inherit; } .edit-site-save-hub__button:not(.is-primary).is-busy, .edit-site-save-hub__button:not(.is-primary).is-busy[aria-disabled=true]:hover { color: var(--wpds-color-foreground-interactive-neutral,var(--design-text)); } .edit-site-sidebar__screen-wrapper:focus-within::-webkit-scrollbar-thumb, .edit-site-sidebar__screen-wrapper:focus::-webkit-scrollbar-thumb, .edit-site-sidebar__screen-wrapper:hover::-webkit-scrollbar-thumb { background-color: var(--design-text-muted); } .edit-site-sidebar__screen-wrapper:focus, .edit-site-sidebar__screen-wrapper:focus-within, .edit-site-sidebar__screen-wrapper:hover { scrollbar-color: var(--design-text-muted) transparent; } @media (hover:none) { .edit-site-sidebar__screen-wrapper { scrollbar-color: var(--design-text-muted) transparent; } } .edit-site-sidebar-button { color: var(--wpds-color-foreground-interactive-neutral,var(--design-text)); } .edit-site-sidebar-button:focus, .edit-site-sidebar-button:focus-visible, .edit-site-sidebar-button:hover:not(:disabled,[aria-disabled=true]), .edit-site-sidebar-button:not(:disabled,[aria-disabled=true]):active, .edit-site-sidebar-button[aria-expanded=true] { color: var(--wpds-color-foreground-interactive-neutral-active,var(--design-text)); } .edit-site-sidebar-navigation-item.components-item { color: var(--wpds-color-foreground-interactive-neutral-weak,var(--design-text-muted)); } .edit-site-sidebar-navigation-item.components-item:focus, .edit-site-sidebar-navigation-item.components-item:hover, .edit-site-sidebar-navigation-item.components-item[aria-current=true] { color: var(--wpds-color-foreground-interactive-neutral-weak-active,var(--design-text)); } .edit-site-sidebar-navigation-item.components-item:focus .edit-site-sidebar-navigation-item__drilldown-indicator, .edit-site-sidebar-navigation-item.components-item:hover .edit-site-sidebar-navigation-item__drilldown-indicator, .edit-site-sidebar-navigation-item.components-item[aria-current=true] .edit-site-sidebar-navigation-item__drilldown-indicator { fill: var(--wpds-color-foreground-interactive-neutral-weak-active,var(--design-text)); } .edit-site-sidebar-navigation-item.components-item[aria-current=true] { background-color: var(--design-surface-active); color: var(--wpds-color-foreground-interactive-neutral-weak-active,var(--design-text)); } .edit-site-sidebar-navigation-item.components-item:focus-visible { --wp-components-color-accent: var(--wpds-color-stroke-focus,var(--wp-admin-theme-color,var(--design-link))); } .edit-site-sidebar-navigation-item.components-item .edit-site-sidebar-navigation-item__drilldown-indicator { fill: var(--wpds-color-foreground-interactive-neutral-weak,var(--design-text-muted)); } .edit-site-sidebar-navigation-screen__content .components-text { color: var(--wpds-color-foreground-content-neutral,var(--design-text)); } .edit-site-sidebar-navigation-screen__title-icon { background-color: var(--design-surface-3); } .edit-site-sidebar-navigation-screen__content .global-styles-ui-variations_item .global-styles-ui-variations_item-preview { outline-color: rgba(var(--design-surface-2-rgb), 0.05); } .edit-site-sidebar-navigation-screen__content .global-styles-ui-variations_item:not(.is-active):hover .global-styles-ui-variations_item-preview { outline-color: rgba(var(--design-surface-2-rgb), 0.15); } .edit-site-sidebar-navigation-screen__content .global-styles-ui-variations_item.is-active .global-styles-ui-variations_item-preview { outline-color: var(--design-surface-2); } .edit-site-sidebar-navigation-screen__content .global-styles-ui-variations_item:focus-visible .global-styles-ui-variations_item-preview { outline-color: var(--wp-admin-theme-color); } .edit-site-sidebar-navigation-screen__footer { background-color: var(--wpds-color-background-surface-neutral-weak,var(--design-surface-3)); border-top-color: var(--design-border); } .edit-site-sidebar-navigation-screen__input-control .components-input-control__container { background-color: rgba(var(--design-text-rgb), 0); } .edit-site-sidebar-navigation-screen__input-control .components-input-control__container .components-button { color: var(--wpds-color-foreground-interactive-neutral,var(--design-text)) !important; } .edit-site-sidebar-navigation-screen__input-control .components-input-control__input { background-color: rgba(var(--design-text-rgb), 0) !important; color: var(--wpds-color-foreground-interactive-neutral,var(--design-text)) !important; } .edit-site-sidebar-navigation-screen__input-control .components-base-control__help { color: var(--wpds-color-foreground-content-neutral-weak,var(--design-text-muted)); } .edit-site-sidebar-navigation-screen-details-footer div.edit-site-sidebar-navigation-item.components-item:focus, .edit-site-sidebar-navigation-screen-details-footer div.edit-site-sidebar-navigation-item.components-item:hover, .edit-site-sidebar-navigation-screen-details-footer div.edit-site-sidebar-navigation-item.components-item[aria-current] { background-color: transparent; background-image: none; } .sidebar-navigation__more-menu .components-button, .sidebar-navigation__more-menu .components-button:focus, .sidebar-navigation__more-menu .components-button:hover, .sidebar-navigation__more-menu .components-button[aria-current] { color: var(--wpds-color-foreground-interactive-neutral,var(--design-text)); } .edit-site-sidebar-navigation-screen-patterns__group-header p { color: var(--wpds-color-foreground-content-neutral-weak,var(--design-text-muted)); } .edit-site-sidebar-navigation-screen-patterns__divider, .fields-controls__password { border-top-color: var(--design-border); } .edit-site-sidebar-navigation-screen-navigation-menus__content .block-editor-list-view-block-select-button { color: var(--wpds-color-foreground-interactive-neutral-weak,var(--design-text-muted)); } .edit-site-sidebar-navigation-screen-navigation-menus__content .block-editor-list-view-block-select-button:focus, .edit-site-sidebar-navigation-screen-navigation-menus__content .block-editor-list-view-block-select-button:hover, .edit-site-sidebar-navigation-screen-navigation-menus__content .block-editor-list-view-block-select-button[aria-current] { color: var(--wpds-color-foreground-interactive-neutral-weak-active,var(--design-text)); } .edit-site-sidebar-navigation-screen-navigation-menus__content .block-editor-list-view-block__menu { color: var(--wpds-color-foreground-interactive-neutral-weak,var(--design-text-muted)); } .edit-site-sidebar-navigation-screen-navigation-menus__content .block-editor-list-view-block__menu:focus, .edit-site-sidebar-navigation-screen-navigation-menus__content .block-editor-list-view-block__menu:hover { color: var(--wpds-color-foreground-interactive-neutral-weak-active,var(--design-text)); } .edit-site-sidebar-navigation-screen-navigation-menus__content .block-editor-inserter__toggle { background-color: var(--design-link); color: var(--wpds-color-foreground-interactive-brand-strong,var(--design-surface-2)); } .edit-site-sidebar-navigation-screen-navigation-menus__content .block-editor-inserter__toggle:focus, .edit-site-sidebar-navigation-screen-navigation-menus__content .block-editor-inserter__toggle:hover { background-color: var(--design-link); color: var(--wpds-color-foreground-interactive-brand-strong-active,var(--design-surface-2)); } .edit-site-site-hub__back-button:active:not(:disabled,[aria-disabled=true]), .edit-site-site-hub__back-button:hover:not(:disabled,[aria-disabled=true]) { color: var(--wpds-color-foreground-interactive-neutral-active,var(--design-text)); } .edit-site-resizable-frame__handle { background-color: rgba(var(--design-text-muted-rgb), 0.4); } .edit-site-styles .edit-site-sidebar-button { color: var(--wpds-color-foreground-interactive-neutral,var(--design-text)); } body.js.appearance_page_gutenberg-template-parts, body.js.site-editor-php { background-color: var(--design-surface-2); } body.js.appearance_page_gutenberg-template-parts ul#adminmenu a.wp-has-current-submenu:after, body.js.appearance_page_gutenberg-template-parts ul#adminmenu>li.current>a.current:after, body.js.site-editor-php ul#adminmenu a.wp-has-current-submenu:after, body.js.site-editor-php ul#adminmenu>li.current>a.current:after { border-right-color: var(--design-surface-1); } body.js.site-editor-php { background-color: var(--design-surface-3); } .edit-site-layout .edit-site-sidebar-navigation-screen__title { color: var(--design-text); } .components-button.is-primary, .components-button.is-primary:visited { background: var(--design-primary); color: var(--design-on-primary); } .components-button.is-primary:hover:not(:disabled, [aria-disabled=true]) { background: var(--design-primary-hover); color: var(--design-on-primary); } .components-button.is-primary:active:not(:disabled, [aria-disabled=true]) { background: var(--design-primary-active); color: var(--design-on-primary); }