1/* rtl:ignore */
  2.wp-color-picker {
  3	width: 80px;
  4	direction: ltr;
  5}
  6
  7.wp-picker-container .hidden {
  8	display: none;
  9}
 10
 11/* Needs higher specificity to override `.wp-core-ui .button`. */
 12.wp-picker-container .wp-color-result.button {
 13	min-height: 30px;
 14	margin: 0 6px 6px 0;
 15	padding: 0 0 0 30px;
 16	font-size: 11px;
 17}
 18
 19.wp-color-result-text {
 20	background: #f6f7f7;
 21	border-radius: 0 2px 2px 0;
 22	border-left: 1px solid #c3c4c7;
 23	color: #50575e;
 24	display: block;
 25	line-height: 2.54545455; /* 28px */
 26	padding: 0 6px;
 27	text-align: center;
 28}
 29
 30.wp-color-result:hover,
 31.wp-color-result:focus {
 32	background: #f6f7f7;
 33	border-color: #8c8f94;
 34	color: #1d2327;
 35}
 36
 37.wp-color-result:hover:after,
 38.wp-color-result:focus:after {
 39	color: #1d2327;
 40	border-color: #a7aaad;
 41	border-left: 1px solid #8c8f94;
 42}
 43
 44.wp-picker-container {
 45	display: inline-block;
 46}
 47
 48.wp-color-result:focus {
 49	border-color: #4f94d4;
 50	box-shadow: 0 0 3px rgba(34, 113, 177, 0.8);
 51}
 52
 53.wp-color-result:active {
 54	/* See Trac ticket #39662 */
 55	transform: none !important;
 56}
 57
 58.wp-picker-open + .wp-picker-input-wrap {
 59	display: inline-block;
 60	vertical-align: top;
 61}
 62
 63.wp-picker-input-wrap label {
 64	display: inline-block;
 65	vertical-align: top;
 66}
 67
 68/* For the old `custom-background` page, to override the inline-block and margins from `.form-table td fieldset label`. */
 69.form-table .wp-picker-input-wrap label {
 70	margin: 0 !important;
 71}
 72
 73.wp-picker-input-wrap .button.wp-picker-default,
 74.wp-picker-input-wrap .button.wp-picker-clear,
 75.wp-customizer .wp-picker-input-wrap .button.wp-picker-default,
 76.wp-customizer .wp-picker-input-wrap .button.wp-picker-clear {
 77	margin-left: 6px;
 78	padding: 0 8px;
 79	line-height: 2.54545455; /* 28px */
 80	min-height: 30px;
 81}
 82
 83.wp-picker-container .iris-square-slider .ui-slider-handle:focus {
 84	background-color: #50575e
 85}
 86
 87.wp-picker-container .iris-picker {
 88	border-radius: 0;
 89	border-color: #dcdcde;
 90	margin-top: 6px;
 91}
 92
 93.wp-picker-container input[type="text"].wp-color-picker {
 94	width: 4rem;
 95	font-size: 12px;
 96	font-family: monospace;
 97	line-height: 2.33333333; /* 28px */
 98	margin: 0;
 99	padding: 0 5px;
100	vertical-align: top;
101	min-height: 30px;
102}
103
104.wp-color-picker::-webkit-input-placeholder {
105	color: #646970;
106}
107
108.wp-color-picker::-moz-placeholder {
109	color: #646970;
110}
111
112.wp-picker-container input[type="text"].iris-error {
113	background-color: #fcf0f1;
114	border-color: #d63638;
115	color: #000;
116}
117
118.iris-picker .ui-square-handle:focus,
119.iris-picker .iris-strip .ui-slider-handle:focus {
120	border-color: #3582c4;
121	border-style: solid;
122	box-shadow: 0 0 0 1px #3582c4;
123	outline: 2px solid transparent;
124}
125
126.iris-picker .iris-palette:focus {
127	box-shadow: 0 0 0 2px #3582c4;
128}
129
130@media screen and (max-width: 782px) {
131	.wp-picker-container input[type="text"].wp-color-picker {
132		width: 5rem;
133		font-size: 16px;
134		line-height: 1.875; /* 30px */
135		min-height: 32px;
136	}
137
138	.wp-customizer .wp-picker-container input[type="text"].wp-color-picker {
139		padding: 0 5px;
140	}
141
142	.wp-picker-input-wrap .button.wp-picker-default,
143	.wp-picker-input-wrap .button.wp-picker-clear {
144		padding: 0 8px;
145		line-height: 2.14285714; /* 30px */
146		min-height: 32px;
147	}
148
149	.wp-customizer .wp-picker-input-wrap .button.wp-picker-default,
150	.wp-customizer .wp-picker-input-wrap .button.wp-picker-clear {
151		padding: 0 8px;
152		font-size: 14px;
153		line-height: 2.14285714; /* 30px */
154		min-height: 32px;
155	}
156
157	.wp-picker-container .wp-color-result.button {
158		padding: 0 0 0 40px;
159		font-size: 14px;
160		line-height: 2.14285714; /* 30px */
161	}
162
163	.wp-customizer .wp-picker-container .wp-color-result.button {
164		font-size: 14px;
165		line-height: 2.14285714; /* 30px */
166	}
167
168	.wp-picker-container .wp-color-result-text {
169		padding: 0 14px;
170		font-size: inherit;
171		line-height: inherit;
172	}
173
174	.wp-customizer .wp-picker-container .wp-color-result-text {
175		padding: 0 10px;
176	}
177}
178