height: 24px;

[500] Fix | Delete

-webkit-appearance: none;

[501] Fix | Delete

appearance: none;

[502] Fix | Delete

transition: 0.1s border-color ease-in-out;

[503] Fix | Delete

}

[504] Fix | Delete

@media (prefers-reduced-motion: reduce) {

[505] Fix | Delete

.components-checkbox-control__input[type=checkbox] {

[506] Fix | Delete

transition-duration: 0s;

[507] Fix | Delete

}

[508] Fix | Delete

}

[509] Fix | Delete

@media (min-width: 600px) {

[510] Fix | Delete

.components-checkbox-control__input[type=checkbox] {

[511] Fix | Delete

font-size: 13px;

[512] Fix | Delete

/* Override core line-height. To be reviewed. */

[513] Fix | Delete

line-height: normal;

[514] Fix | Delete

}

[515] Fix | Delete

}

[516] Fix | Delete

.components-checkbox-control__input[type=checkbox]:focus {

[517] Fix | Delete

border-color: #007cba;

[518] Fix | Delete

border-color: var(--wp-admin-theme-color);

[519] Fix | Delete

box-shadow: 0 0 0 1px #007cba;

[520] Fix | Delete

box-shadow: 0 0 0 1px var(--wp-admin-theme-color);

[521] Fix | Delete

outline: 2px solid transparent;

[522] Fix | Delete

}

[523] Fix | Delete

.components-checkbox-control__input[type=checkbox]::-webkit-input-placeholder {

[524] Fix | Delete

color: rgba(30, 30, 30, 0.62);

[525] Fix | Delete

}

[526] Fix | Delete

.components-checkbox-control__input[type=checkbox]::-moz-placeholder {

[527] Fix | Delete

opacity: 1;

[528] Fix | Delete

color: rgba(30, 30, 30, 0.62);

[529] Fix | Delete

}

[530] Fix | Delete

.components-checkbox-control__input[type=checkbox]:-ms-input-placeholder {

[531] Fix | Delete

color: rgba(30, 30, 30, 0.62);

[532] Fix | Delete

}

[533] Fix | Delete

.is-dark-theme .components-checkbox-control__input[type=checkbox]::-webkit-input-placeholder {

[534] Fix | Delete

color: rgba(255, 255, 255, 0.65);

[535] Fix | Delete

}

[536] Fix | Delete

.is-dark-theme .components-checkbox-control__input[type=checkbox]::-moz-placeholder {

[537] Fix | Delete

opacity: 1;

[538] Fix | Delete

color: rgba(255, 255, 255, 0.65);

[539] Fix | Delete

}

[540] Fix | Delete

.is-dark-theme .components-checkbox-control__input[type=checkbox]:-ms-input-placeholder {

[541] Fix | Delete

color: rgba(255, 255, 255, 0.65);

[542] Fix | Delete

}

[543] Fix | Delete

.components-checkbox-control__input[type=checkbox]:focus {

[544] Fix | Delete

box-shadow: 0 0 0 2px #fff, 0 0 0 4px #007cba;

[545] Fix | Delete

box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--wp-admin-theme-color);

[546] Fix | Delete

outline: 2px solid transparent;

[547] Fix | Delete

}

[548] Fix | Delete

.components-checkbox-control__input[type=checkbox]:checked {

[549] Fix | Delete

background: #007cba;

[550] Fix | Delete

background: var(--wp-admin-theme-color);

[551] Fix | Delete

border-color: #007cba;

[552] Fix | Delete

border-color: var(--wp-admin-theme-color);

[553] Fix | Delete

}

[554] Fix | Delete

.components-checkbox-control__input[type=checkbox]:checked::-ms-check {

[555] Fix | Delete

opacity: 0;

[556] Fix | Delete

}

[557] Fix | Delete

.components-checkbox-control__input[type=checkbox]:checked::before, .components-checkbox-control__input[type=checkbox][aria-checked=mixed]::before {

[558] Fix | Delete

margin: -3px -5px;

[559] Fix | Delete

color: #fff;

[560] Fix | Delete

}

[561] Fix | Delete

@media (min-width: 782px) {

[562] Fix | Delete

.components-checkbox-control__input[type=checkbox]:checked::before, .components-checkbox-control__input[type=checkbox][aria-checked=mixed]::before {

[563] Fix | Delete

margin: -4px 0 0 -5px;

[564] Fix | Delete

}

[565] Fix | Delete

}

[566] Fix | Delete

.components-checkbox-control__input[type=checkbox][aria-checked=mixed] {

[567] Fix | Delete

background: #007cba;

[568] Fix | Delete

background: var(--wp-admin-theme-color);

[569] Fix | Delete

border-color: #007cba;

[570] Fix | Delete

border-color: var(--wp-admin-theme-color);

[571] Fix | Delete

}

[572] Fix | Delete

.components-checkbox-control__input[type=checkbox][aria-checked=mixed]::before {

[573] Fix | Delete

content: "";

[574] Fix | Delete

float: left;

[575] Fix | Delete

display: inline-block;

[576] Fix | Delete

vertical-align: middle;

[577] Fix | Delete

width: 16px;

[578] Fix | Delete

/* stylelint-disable */

[579] Fix | Delete

font: normal 30px/1 dashicons;

[580] Fix | Delete

/* stylelint-enable */

[581] Fix | Delete

speak: none;

[582] Fix | Delete

-webkit-font-smoothing: antialiased;

[583] Fix | Delete

-moz-osx-font-smoothing: grayscale;

[584] Fix | Delete

}

[585] Fix | Delete

@media (min-width: 782px) {

[586] Fix | Delete

.components-checkbox-control__input[type=checkbox][aria-checked=mixed]::before {

[587] Fix | Delete

float: none;

[588] Fix | Delete

font-size: 21px;

[589] Fix | Delete

}

[590] Fix | Delete

}

[591] Fix | Delete

@media (min-width: 600px) {

[592] Fix | Delete

.components-checkbox-control__input[type=checkbox] {

[593] Fix | Delete

height: 20px;

[594] Fix | Delete

width: 20px;

[595] Fix | Delete

}

[596] Fix | Delete

}

[597] Fix | Delete

@media (prefers-reduced-motion: reduce) {

[598] Fix | Delete

.components-checkbox-control__input[type=checkbox] {

[599] Fix | Delete

transition-duration: 0s;

[600] Fix | Delete

}

[601] Fix | Delete

}

[602] Fix | Delete

.components-checkbox-control__input[type=checkbox]:focus {

[603] Fix | Delete

box-shadow: 0 0 0 2px #fff, 0 0 0 4px #007cba;

[604] Fix | Delete

box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--wp-admin-theme-color);

[605] Fix | Delete

outline: 2px solid transparent;

[606] Fix | Delete

}

[607] Fix | Delete

.components-checkbox-control__input[type=checkbox]:checked {

[608] Fix | Delete

background: #007cba;

[609] Fix | Delete

background: var(--wp-admin-theme-color);

[610] Fix | Delete

border-color: #007cba;

[611] Fix | Delete

border-color: var(--wp-admin-theme-color);

[612] Fix | Delete

}

[613] Fix | Delete

.components-checkbox-control__input[type=checkbox]:checked::-ms-check {

[614] Fix | Delete

opacity: 0;

[615] Fix | Delete

}

[616] Fix | Delete

.components-checkbox-control__input[type=checkbox]:checked::before {

[617] Fix | Delete

content: none;

[618] Fix | Delete

}

[619] Fix | Delete

[620] Fix | Delete

.components-checkbox-control__input-container {

[621] Fix | Delete

position: relative;

[622] Fix | Delete

display: inline-block;

[623] Fix | Delete

margin-right: 12px;

[624] Fix | Delete

vertical-align: middle;

[625] Fix | Delete

width: 24px;

[626] Fix | Delete

height: 24px;

[627] Fix | Delete

}

[628] Fix | Delete

@media (min-width: 600px) {

[629] Fix | Delete

.components-checkbox-control__input-container {

[630] Fix | Delete

width: 20px;

[631] Fix | Delete

height: 20px;

[632] Fix | Delete

}

[633] Fix | Delete

}

[634] Fix | Delete

[635] Fix | Delete

svg.components-checkbox-control__checked {

[636] Fix | Delete

fill: #fff;

[637] Fix | Delete

cursor: pointer;

[638] Fix | Delete

position: absolute;

[639] Fix | Delete

left: 0;

[640] Fix | Delete

top: 0;

[641] Fix | Delete

width: 24px;

[642] Fix | Delete

height: 24px;

[643] Fix | Delete

-webkit-user-select: none;

[644] Fix | Delete

-ms-user-select: none;

[645] Fix | Delete

user-select: none;

[646] Fix | Delete

pointer-events: none;

[647] Fix | Delete

}

[648] Fix | Delete

@media (min-width: 600px) {

[649] Fix | Delete

svg.components-checkbox-control__checked {

[650] Fix | Delete

left: -2px;

[651] Fix | Delete

top: -2px;

[652] Fix | Delete

}

[653] Fix | Delete

}

[654] Fix | Delete

[655] Fix | Delete

.components-circular-option-picker {

[656] Fix | Delete

display: inline-block;

[657] Fix | Delete

width: 100%;

[658] Fix | Delete

min-width: 188px;

[659] Fix | Delete

}

[660] Fix | Delete

.components-circular-option-picker .components-circular-option-picker__custom-clear-wrapper {

[661] Fix | Delete

display: flex;

[662] Fix | Delete

justify-content: flex-end;

[663] Fix | Delete

}

[664] Fix | Delete

.components-circular-option-picker .components-circular-option-picker__swatches {

[665] Fix | Delete

margin-right: -12px;

[666] Fix | Delete

}

[667] Fix | Delete

[668] Fix | Delete

.components-circular-option-picker__option-wrapper {

[669] Fix | Delete

display: inline-block;

[670] Fix | Delete

height: 28px;

[671] Fix | Delete

width: 28px;

[672] Fix | Delete

margin-right: 12px;

[673] Fix | Delete

margin-bottom: 12px;

[674] Fix | Delete

vertical-align: top;

[675] Fix | Delete

transform: scale(1);

[676] Fix | Delete

transition: 100ms transform ease;

[677] Fix | Delete

}

[678] Fix | Delete

@media (prefers-reduced-motion: reduce) {

[679] Fix | Delete

.components-circular-option-picker__option-wrapper {

[680] Fix | Delete

transition-duration: 0s;

[681] Fix | Delete

}

[682] Fix | Delete

}

[683] Fix | Delete

.components-circular-option-picker__option-wrapper:hover {

[684] Fix | Delete

transform: scale(1.2);

[685] Fix | Delete

}

[686] Fix | Delete

.components-circular-option-picker__option-wrapper > div {

[687] Fix | Delete

height: 100%;

[688] Fix | Delete

width: 100%;

[689] Fix | Delete

}

[690] Fix | Delete

[691] Fix | Delete

.components-circular-option-picker__option-wrapper::before {

[692] Fix | Delete

content: "";

[693] Fix | Delete

position: absolute;

[694] Fix | Delete

top: 1px;

[695] Fix | Delete

left: 1px;

[696] Fix | Delete

bottom: 1px;

[697] Fix | Delete

right: 1px;

[698] Fix | Delete

border-radius: 50%;

[699] Fix | Delete

z-index: -1;

[700] Fix | Delete

/* stylelint-disable-next-line function-url-quotes */

[701] Fix | Delete

background: url('data:image/svg+xml,%3Csvg width="28" height="28" fill="none" xmlns="http://www.w3.org/2000/svg"%3E%3Cpath d="M6 8V6H4v2h2zM8 8V6h2v2H8zM10 16H8v-2h2v2zM12 16v-2h2v2h-2zM12 18v-2h-2v2H8v2h2v-2h2zM14 18v2h-2v-2h2zM16 18h-2v-2h2v2z" fill="%23555D65"/%3E%3Cpath fill-rule="evenodd" clip-rule="evenodd" d="M18 18h2v-2h-2v-2h2v-2h-2v-2h2V8h-2v2h-2V8h-2v2h2v2h-2v2h2v2h2v2zm-2-4v-2h2v2h-2z" fill="%23555D65"/%3E%3Cpath d="M18 18v2h-2v-2h2z" fill="%23555D65"/%3E%3Cpath fill-rule="evenodd" clip-rule="evenodd" d="M8 10V8H6v2H4v2h2v2H4v2h2v2H4v2h2v2H4v2h2v-2h2v2h2v-2h2v2h2v-2h2v2h2v-2h2v2h2v-2h2v-2h-2v-2h2v-2h-2v-2h2v-2h-2v-2h2V8h-2V6h2V4h-2v2h-2V4h-2v2h-2V4h-2v2h-2V4h-2v2h2v2h-2v2H8zm0 2v-2H6v2h2zm2 0v-2h2v2h-2zm0 2v-2H8v2H6v2h2v2H6v2h2v2h2v-2h2v2h2v-2h2v2h2v-2h2v2h2v-2h-2v-2h2v-2h-2v-2h2v-2h-2v-2h2V8h-2V6h-2v2h-2V6h-2v2h-2v2h2v2h-2v2h-2z" fill="%23555D65"/%3E%3Cpath fill-rule="evenodd" clip-rule="evenodd" d="M4 0H2v2H0v2h2v2H0v2h2v2H0v2h2v2H0v2h2v2H0v2h2v2H0v2h2v2H0v2h2v-2h2v2h2v-2h2v2h2v-2h2v2h2v-2h2v2h2v-2h2v2h2v-2h2v2h2v-2h2v-2h-2v-2h2v-2h-2v-2h2v-2h-2v-2h2v-2h-2v-2h2V8h-2V6h2V4h-2V2h2V0h-2v2h-2V0h-2v2h-2V0h-2v2h-2V0h-2v2h-2V0h-2v2H8V0H6v2H4V0zm0 4V2H2v2h2zm2 0V2h2v2H6zm0 2V4H4v2H2v2h2v2H2v2h2v2H2v2h2v2H2v2h2v2H2v2h2v2h2v-2h2v2h2v-2h2v2h2v-2h2v2h2v-2h2v2h2v-2h2v2h2v-2h-2v-2h2v-2h-2v-2h2v-2h-2v-2h2v-2h-2v-2h2V8h-2V6h2V4h-2V2h-2v2h-2V2h-2v2h-2V2h-2v2h-2V2h-2v2H8v2H6z" fill="%23555D65"/%3E%3C/svg%3E');

[702] Fix | Delete

}

[703] Fix | Delete

[704] Fix | Delete

.components-circular-option-picker__option {

[705] Fix | Delete

display: inline-block;

[706] Fix | Delete

vertical-align: top;

[707] Fix | Delete

height: 100%;

[708] Fix | Delete

width: 100%;

[709] Fix | Delete

border: none;

[710] Fix | Delete

border-radius: 50%;

[711] Fix | Delete

background: transparent;

[712] Fix | Delete

box-shadow: inset 0 0 0 14px;

[713] Fix | Delete

transition: 100ms box-shadow ease;

[714] Fix | Delete

cursor: pointer;

[715] Fix | Delete

}

[716] Fix | Delete

@media (prefers-reduced-motion: reduce) {

[717] Fix | Delete

.components-circular-option-picker__option {

[718] Fix | Delete

transition-duration: 0s;

[719] Fix | Delete

}

[720] Fix | Delete

}

[721] Fix | Delete

.components-circular-option-picker__option:hover {

[722] Fix | Delete

box-shadow: inset 0 0 0 14px !important;

[723] Fix | Delete

}

[724] Fix | Delete

.components-circular-option-picker__option.is-pressed {

[725] Fix | Delete

box-shadow: inset 0 0 0 4px;

[726] Fix | Delete

position: relative;

[727] Fix | Delete

z-index: 1;

[728] Fix | Delete

overflow: visible;

[729] Fix | Delete

}

[730] Fix | Delete

.components-circular-option-picker__option.is-pressed + svg {

[731] Fix | Delete

position: absolute;

[732] Fix | Delete

left: 2px;

[733] Fix | Delete

top: 2px;

[734] Fix | Delete

border-radius: 50%;

[735] Fix | Delete

z-index: 2;

[736] Fix | Delete

pointer-events: none;

[737] Fix | Delete

}

[738] Fix | Delete

.components-circular-option-picker__option::after {

[739] Fix | Delete

content: "";

[740] Fix | Delete

position: absolute;

[741] Fix | Delete

top: -1px;

[742] Fix | Delete

left: -1px;

[743] Fix | Delete

bottom: -1px;

[744] Fix | Delete

right: -1px;

[745] Fix | Delete

border-radius: 50%;

[746] Fix | Delete

box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.2);

[747] Fix | Delete

border: 1px solid transparent;

[748] Fix | Delete

}

[749] Fix | Delete

.components-circular-option-picker__option:focus::after {

[750] Fix | Delete

content: "";

[751] Fix | Delete

border: 2px solid #757575;

[752] Fix | Delete

width: 32px;

[753] Fix | Delete

height: 32px;

[754] Fix | Delete

position: absolute;

[755] Fix | Delete

top: -2px;

[756] Fix | Delete

left: -2px;

[757] Fix | Delete

border-radius: 50%;

[758] Fix | Delete

box-shadow: inset 0 0 0 2px #fff;

[759] Fix | Delete

}

[760] Fix | Delete

.components-circular-option-picker__option.components-button:focus {

[761] Fix | Delete

background-color: transparent;

[762] Fix | Delete

box-shadow: inset 0 0 0 14px;

[763] Fix | Delete

outline: none;

[764] Fix | Delete

}

[765] Fix | Delete

[766] Fix | Delete

.components-circular-option-picker__button-action .components-circular-option-picker__option {

[767] Fix | Delete

color: #fff;

[768] Fix | Delete

background: #fff;

[769] Fix | Delete

}

[770] Fix | Delete

[771] Fix | Delete

.components-circular-option-picker__dropdown-link-action {

[772] Fix | Delete

margin-right: 16px;

[773] Fix | Delete

}

[774] Fix | Delete

.components-circular-option-picker__dropdown-link-action .components-button {

[775] Fix | Delete

line-height: 22px;

[776] Fix | Delete

}

[777] Fix | Delete

[778] Fix | Delete

.components-color-edit__color-option-main-area {

[779] Fix | Delete

display: flex;

[780] Fix | Delete

align-items: center;

[781] Fix | Delete

}

[782] Fix | Delete

.components-color-edit__color-option-main-area div.components-circular-option-picker__option-wrapper {

[783] Fix | Delete

display: block;

[784] Fix | Delete

margin: 8px;

[785] Fix | Delete

}

[786] Fix | Delete

[787] Fix | Delete

.components-color-edit__color-option.is-hover {

[788] Fix | Delete

background: #e0e0e0;

[789] Fix | Delete

}

[790] Fix | Delete

[791] Fix | Delete

.components-color-edit__cancel-button {

[792] Fix | Delete

float: right;

[793] Fix | Delete

}

[794] Fix | Delete

[795] Fix | Delete

.components-color-edit__color-option-color-name {

[796] Fix | Delete

width: 100%;

[797] Fix | Delete

}

[798] Fix | Delete

[799] Fix | Delete

.components-color-edit__label-and-insert-container {

[800] Fix | Delete

display: flex;

[801] Fix | Delete

align-items: center;

[802] Fix | Delete

justify-content: space-between;

[803] Fix | Delete

}

[804] Fix | Delete

[805] Fix | Delete

.components-color-edit__insert-button {

[806] Fix | Delete

margin-top: -8px;

[807] Fix | Delete

}

[808] Fix | Delete

[809] Fix | Delete

.components-color-edit__hidden-control {

[810] Fix | Delete

position: relative;

[811] Fix | Delete

left: -9999px;

[812] Fix | Delete

}

[813] Fix | Delete

[814] Fix | Delete

.components-color-edit__color-option-color-name-input .components-base-control__field {

[815] Fix | Delete

margin-bottom: 0;

[816] Fix | Delete

margin-right: 8px;

[817] Fix | Delete

}

[818] Fix | Delete

[819] Fix | Delete

.components-color-edit__slug-input {

[820] Fix | Delete

margin-left: 8px;

[821] Fix | Delete

}

[822] Fix | Delete

[823] Fix | Delete

.components-color-edit__reset-button {

[824] Fix | Delete

float: right;

[825] Fix | Delete

}

[826] Fix | Delete

[827] Fix | Delete

.component-color-indicator {

[828] Fix | Delete

width: 25px;

[829] Fix | Delete

height: 16px;

[830] Fix | Delete

margin-left: 0.8rem;

[831] Fix | Delete

border: 1px solid #dadada;

[832] Fix | Delete

display: inline-block;

[833] Fix | Delete

}

[834] Fix | Delete

.component-color-indicator + .component-color-indicator {

[835] Fix | Delete

margin-left: 0.5rem;

[836] Fix | Delete

}

[837] Fix | Delete

[838] Fix | Delete

/**

[839] Fix | Delete

* Parts of this source were derived and modified from react-color,

[840] Fix | Delete

* released under the MIT license.

[841] Fix | Delete

*

[842] Fix | Delete

* https://github.com/casesandberg/react-color/

[843] Fix | Delete

*

[844] Fix | Delete

* Copyright (c) 2015 Case Sandberg

[845] Fix | Delete

*

[846] Fix | Delete

* Permission is hereby granted, free of charge, to any person obtaining a copy

[847] Fix | Delete

* of this software and associated documentation files (the "Software"), to deal

[848] Fix | Delete

* in the Software without restriction, including without limitation the rights

[849] Fix | Delete

* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell

[850] Fix | Delete

* copies of the Software, and to permit persons to whom the Software is

[851] Fix | Delete

* furnished to do so, subject to the following conditions:

[852] Fix | Delete

*

[853] Fix | Delete

* The above copyright notice and this permission notice shall be included in

[854] Fix | Delete

* all copies or substantial portions of the Software.

[855] Fix | Delete

*

[856] Fix | Delete

* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR

[857] Fix | Delete

* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,

[858] Fix | Delete

* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE

[859] Fix | Delete

* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER

[860] Fix | Delete

* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,

[861] Fix | Delete

* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN

[862] Fix | Delete

* THE SOFTWARE.

[863] Fix | Delete

*/

[864] Fix | Delete

.components-color-picker {

[865] Fix | Delete

width: 100%;

[866] Fix | Delete

}

[867] Fix | Delete

.components-color-picker * {

[868] Fix | Delete

box-sizing: border-box;

[869] Fix | Delete

}

[870] Fix | Delete

[871] Fix | Delete

.components-color-picker__saturation {

[872] Fix | Delete

width: 100%;

[873] Fix | Delete

padding-bottom: 55%;

[874] Fix | Delete

position: relative;

[875] Fix | Delete

}

[876] Fix | Delete

[877] Fix | Delete

.components-color-picker__body {

[878] Fix | Delete

padding: 16px 16px 12px;

[879] Fix | Delete

}

[880] Fix | Delete

[881] Fix | Delete

.components-color-picker__controls {

[882] Fix | Delete

display: flex;

[883] Fix | Delete

}

[884] Fix | Delete

[885] Fix | Delete

.components-color-picker__saturation-pointer,

[886] Fix | Delete

.components-color-picker__hue-pointer,

[887] Fix | Delete

.components-color-picker__alpha-pointer {

[888] Fix | Delete

padding: 0;

[889] Fix | Delete

position: absolute;

[890] Fix | Delete

cursor: pointer;

[891] Fix | Delete

box-shadow: none;

[892] Fix | Delete

border: none;

[893] Fix | Delete

}

[894] Fix | Delete

[895] Fix | Delete

/* CURRENT COLOR COMPONENT */

[896] Fix | Delete

.components-color-picker__swatch {

[897] Fix | Delete

margin-right: 8px;

[898] Fix | Delete

width: 32px;

[899] Fix | Delete

height: 32px;

[900] Fix | Delete

border-radius: 50%;

[901] Fix | Delete

position: relative;

[902] Fix | Delete

overflow: hidden;

[903] Fix | Delete

background-image: linear-gradient(45deg, #ddd 25%, transparent 25%), linear-gradient(-45deg, #ddd 25%, transparent 25%), linear-gradient(45deg, transparent 75%, #ddd 75%), linear-gradient(-45deg, transparent 75%, #ddd 75%);

[904] Fix | Delete

background-size: 10px 10px;

[905] Fix | Delete

background-position: 0 0, 0 5px, 5px -5px, -5px 0;

[906] Fix | Delete

}

[907] Fix | Delete

.is-alpha-disabled .components-color-picker__swatch {

[908] Fix | Delete

width: 12px;

[909] Fix | Delete

height: 12px;

[910] Fix | Delete

margin-top: 0;

[911] Fix | Delete

}

[912] Fix | Delete

[913] Fix | Delete

.components-color-picker__active {

[914] Fix | Delete

position: absolute;

[915] Fix | Delete

top: 0;

[916] Fix | Delete

left: 0;

[917] Fix | Delete

right: 0;

[918] Fix | Delete

bottom: 0;

[919] Fix | Delete

border-radius: 50%;

[920] Fix | Delete

box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.1);

[921] Fix | Delete

z-index: 2;

[922] Fix | Delete

}

[923] Fix | Delete

[924] Fix | Delete

/* SATURATION COMPONENT */

[925] Fix | Delete

.components-color-picker__saturation-color,

[926] Fix | Delete

.components-color-picker__saturation-white,

[927] Fix | Delete

.components-color-picker__saturation-black {

[928] Fix | Delete

position: absolute;

[929] Fix | Delete

top: 0;

[930] Fix | Delete

left: 0;

[931] Fix | Delete

right: 0;

[932] Fix | Delete

bottom: 0;

[933] Fix | Delete

}

[934] Fix | Delete

[935] Fix | Delete

.components-color-picker__saturation-color {

[936] Fix | Delete

overflow: visible;

[937] Fix | Delete

}

[938] Fix | Delete

[939] Fix | Delete

.components-color-picker__saturation-white {

[940] Fix | Delete

/*rtl:ignore*/

[941] Fix | Delete

background: linear-gradient(to right, #fff, rgba(255, 255, 255, 0));

[942] Fix | Delete

}

[943] Fix | Delete

[944] Fix | Delete

.components-color-picker__saturation-black {

[945] Fix | Delete

background: linear-gradient(to top, #000, rgba(0, 0, 0, 0));

[946] Fix | Delete

}

[947] Fix | Delete

[948] Fix | Delete

.components-button.components-color-picker__saturation-pointer {

[949] Fix | Delete

width: 14px;

[950] Fix | Delete

height: 14px;

[951] Fix | Delete

padding: 0;

[952] Fix | Delete

border-radius: 50%;

[953] Fix | Delete

background-color: transparent;

[954] Fix | Delete

transform: translate(-50%, -50%);

[955] Fix | Delete

box-shadow: 0 0 0 1px #fff, inset 0 0 0 1px #000, 0 0 0 2px #000;

[956] Fix | Delete

}

[957] Fix | Delete

.components-button.components-color-picker__saturation-pointer:focus:not(:disabled) {

[958] Fix | Delete

box-shadow: 0 0 0 2px #fff, inset 0 0 0 1px #000, 0 0 0 3px #000;

[959] Fix | Delete

}

[960] Fix | Delete

[961] Fix | Delete

/* HUE & ALPHA BARS */

[962] Fix | Delete

.components-color-picker__toggles {

[963] Fix | Delete

flex: 1;

[964] Fix | Delete

}

[965] Fix | Delete

[966] Fix | Delete

.components-color-picker__alpha {

[967] Fix | Delete

background-image: linear-gradient(45deg, #ddd 25%, transparent 25%), linear-gradient(-45deg, #ddd 25%, transparent 25%), linear-gradient(45deg, transparent 75%, #ddd 75%), linear-gradient(-45deg, transparent 75%, #ddd 75%);

[968] Fix | Delete

background-size: 10px 10px;

[969] Fix | Delete

background-position: 0 0, 0 5px, 5px -5px, -5px 0;

[970] Fix | Delete

}

[971] Fix | Delete

[972] Fix | Delete

.components-color-picker__hue-gradient,

[973] Fix | Delete

.components-color-picker__alpha-gradient {

[974] Fix | Delete

position: absolute;

[975] Fix | Delete

top: 0;

[976] Fix | Delete

left: 0;

[977] Fix | Delete

right: 0;

[978] Fix | Delete

bottom: 0;

[979] Fix | Delete

}

[980] Fix | Delete

[981] Fix | Delete

.components-color-picker__hue,

[982] Fix | Delete

.components-color-picker__alpha {

[983] Fix | Delete

height: 12px;

[984] Fix | Delete

position: relative;

[985] Fix | Delete

}

[986] Fix | Delete

[987] Fix | Delete

.is-alpha-enabled .components-color-picker__hue {

[988] Fix | Delete

margin-bottom: 8px;

[989] Fix | Delete

}

[990] Fix | Delete

[991] Fix | Delete

.components-color-picker__hue-bar,

[992] Fix | Delete

.components-color-picker__alpha-bar {

[993] Fix | Delete

position: relative;

[994] Fix | Delete

margin: 0 3px;

[995] Fix | Delete

height: 100%;

[996] Fix | Delete

padding: 0 2px;

[997] Fix | Delete

}

[998] Fix | Delete

[999] Fix | Delete