PluginProbe ʕ •ᴥ•ʔ
WooCommerce / 9.4.0-rc.2
WooCommerce v9.4.0-rc.2
10.8.1 10.8.0 10.8.0-rc.1 10.8.0-beta.2 10.8.0-beta.1 7.8.0-beta.1 7.8.0-beta.2 7.8.0-rc.1 7.8.0-rc.2 7.8.1 7.8.2 7.8.3 7.8.4 7.9.0 7.9.0-beta.1 7.9.0-beta.2 7.9.0-rc.2 7.9.0-rc.3 7.9.1 7.9.2 8.0.0 8.0.0-beta.1 8.0.0-beta.2 8.0.0-rc.1 8.0.0-rc.2 8.0.1 8.0.2 8.0.3 8.0.4 8.0.5 8.1.0 8.1.0-beta.1 8.1.0-rc.1 8.1.0-rc.2 8.1.1 8.1.2 8.1.3 8.1.4 8.2.0 8.2.0-beta.1 8.2.0-rc.1 8.2.0-rc.2 8.2.1 8.2.2 8.2.3 8.2.4 8.2.5 8.3.0 8.3.0-beta.1 8.3.0-rc.1 8.3.0-rc.2 8.3.1 8.3.2 8.3.3 8.3.4 8.4.0 8.4.0-beta.1 8.4.0-rc.1 8.4.1 8.4.2 8.4.3 8.5.0 8.5.0-beta.1 8.5.0-rc.1 8.5.1 8.5.2 8.5.3 8.5.4 8.5.5 8.6.0 8.6.0-beta.1 8.6.0-rc.1 8.6.1 8.6.2 8.6.3 8.6.4 8.7.0 8.7.0-beta.1 8.7.0-beta.2 8.7.0-rc.1 8.7.1 8.7.2 8.7.3 8.8.0 8.8.0-beta.1 8.8.0-rc.1 8.8.1 8.8.2 8.8.3 8.8.4 8.8.5 8.8.6 8.8.7 8.9.0 8.9.0-beta.1 8.9.0-rc.1 8.9.1 8.9.2 8.9.3 8.9.4 8.9.5 9.0.0 9.0.0-beta.1 9.0.0-beta.2 9.0.0-rc.1 9.0.1 9.0.2 9.0.3 9.0.4 9.1.0 9.1.0-beta.1 9.1.0-rc.1 9.1.1 9.1.2 9.1.3 9.1.4 9.1.5 9.1.6 9.2.0 9.2.0-beta.1 9.2.0-rc.1 9.2.1 9.2.2 9.2.3 9.2.4 9.2.5 9.3.0 9.3.0-beta.1 9.3.0-rc.1 9.3.1 9.3.2 9.3.3 9.3.4 9.3.5 9.3.6 9.4.0 9.4.0-beta.1 9.4.0-beta.2 9.4.0-rc.1 9.4.0-rc.2 9.4.0-rc.3 9.4.0-rc.4 9.4.1 9.4.2 9.4.3 9.4.4 9.4.5 9.5.0 9.5.0-beta.1 9.5.0-beta.2 9.5.0-rc.1 9.5.1 9.5.2 9.5.3 9.5.4 9.6.0 9.6.0-beta.1 9.6.0-beta.2 9.6.0-rc.1 9.6.1 9.6.2 9.6.3 9.6.4 9.7.0 9.7.0-beta.1 9.7.0-rc.1 9.7.1 9.7.2 9.7.3 9.8.0 9.8.0-beta.1 9.8.0-rc.1 9.8.1 9.8.2 9.8.3 9.8.4 9.8.5 9.8.6 9.8.7 9.9.0 9.9.0-beta.1 9.9.0-rc.1 9.9.1 9.9.2 9.9.3 9.9.4 9.9.5 9.9.6 9.9.7 3.7.3 7.1.2 3.8.0 7.2.0 3.8.0-beta.1 7.2.0-beta.1 3.8.0-rc.1 7.2.0-beta.2 3.8.0-rc.2 7.2.0-rc.1 3.8.1 7.2.0-rc.2 3.8.2 7.2.1 3.8.3 7.2.2 3.9.0 7.2.3 3.9.0-beta.1 7.2.4 3.9.0-beta.2 7.3.0 3.9.0-rc.1 7.3.0-beta.1 3.9.0-rc.2 7.3.0-beta.2 3.9.0-rc.3 7.3.0-rc.1 3.9.0-rc.4 7.3.0-rc.2 3.9.1 7.3.1 3.9.2 7.4.0 3.9.3 7.4.0-beta.1 3.9.4 7.4.0-beta.2 3.9.5 7.4.0-rc.1 4.0.0 7.4.0-rc.2 4.0.0-beta.1 7.4.1 4.0.0-rc.1 7.4.2 4.0.0-rc.2 7.5.0 4.0.1 7.5.0-beta.1 4.0.2 7.5.0-beta.2 4.0.3 7.5.0-rc.1 4.0.4 7.5.1 4.1.0 7.5.2 4.1.0-beta.1 7.6.0 4.1.0-beta.2 7.6.0-beta.1 4.1.0-rc.1 7.6.0-beta.2 4.1.0-rc.2 7.6.0-rc.1 4.1.1 7.6.0-rc.2 4.1.2 7.6.0-rc.3 4.1.3 7.6.1 4.1.4 7.6.2 4.2.0 7.7.0 4.2.0-RC.1 7.7.0-beta.1 4.2.0-RC.2 7.7.0-beta.2 4.2.0-beta.1 7.7.0-rc.1 4.2.1 7.7.1 4.2.2 7.7.2 4.2.3 7.7.3 4.2.4 7.8.0 4.2.5 4.3.0 4.3.0-beta.1 4.3.0-rc.1 4.3.0-rc.2 4.3.0-rc.3 4.3.1 4.3.2 4.3.3 4.3.4 4.3.5 4.3.6 4.4.0 4.4.0-beta.1 4.4.0-rc.1 4.4.1 4.4.2 4.4.3 4.4.4 4.5.0 4.5.0-beta.1 4.5.0-rc.1 4.5.0-rc.3 4.5.1 4.5.2 4.5.3 4.5.4 4.5.5 4.6.0 4.6.0-beta.1 4.6.0-rc.1 4.6.1 4.6.2 4.6.3 4.6.4 4.6.5 4.7.0 4.7.0-beta.1 4.7.0-beta.2 4.7.0-rc.1 4.7.1 4.7.1-beta.1 4.7.2 4.7.3 4.7.4 4.8.0 4.8.0-beta.1 4.8.0-rc.1 4.8.0-rc.2 4.8.1 4.8.2 4.8.3 4.9.0 4.9.0-beta.1 4.9.0-rc.1 4.9.0-rc.2 4.9.1 4.9.2 4.9.3 4.9.4 4.9.5 5.0.0 5.0.0-beta.1 5.0.0-beta.2 5.0.0-rc.1 5.0.0-rc.2 5.0.0-rc.3 5.0.1 5.0.2 5.0.3 5.1.0 5.1.0-beta.1 5.1.0-rc.1 trunk 5.1.1 10.0.0 5.1.2 10.0.0-rc.1 5.1.3 10.0.0-rc.2 5.2.0 10.0.1 5.2.0-beta.1 10.0.2 5.2.0-rc.1 10.0.3 5.2.0-rc.2 10.0.4 5.2.1 10.0.5 5.2.2 10.0.6 5.2.3 10.1.0 5.2.4 10.1.0-rc.1 5.2.5 10.1.0-rc.2 5.3.0 10.1.0-rc.3 5.3.0-beta.1 10.1.0-rc.4 5.3.0-rc.1 10.1.1 5.3.0-rc.2 10.1.2 5.3.1 10.1.3 5.3.2 10.1.4 5.3.3 10.2.0 5.4.0 10.2.0-beta.1 5.4.0-beta.1 10.2.0-beta.2 5.4.0-rc.1 10.2.0-rc.1 5.4.1 10.2.1 5.4.2 10.2.2 5.4.3 10.2.3 5.4.4 10.2.4 5.4.5 10.3.0 5.5.0 10.3.0-beta.1 5.5.0-beta.1 10.3.0-beta.2 5.5.0-rc.1 10.3.0-rc.1 5.5.0-rc.2 10.3.0-rc.2 5.5.1 10.3.1 5.5.2 10.3.2 5.5.3 10.3.3 5.5.4 10.3.4 5.5.5 10.3.5 5.6.0 10.3.6 5.6.0-beta.1 10.3.7 5.6.0-rc.1 10.3.8 5.6.0-rc.2 10.4.0 5.6.1 10.4.0-beta.1 5.6.2 10.4.0-beta.2 5.6.3 10.4.0-rc.1 5.7.0 10.4.1 5.7.0-beta.1 10.4.2 5.7.0-rc.1 10.4.3 5.7.1 10.4.4 5.7.2 10.5.0 5.7.3 10.5.0-beta.1 5.8.0 10.5.0-beta.2 5.8.0-beta.1 10.5.0-rc.1 5.8.0-beta.2 10.5.0-rc.2 5.8.0-rc.1 10.5.0-rc.3 5.8.1 10.5.1 5.8.2 10.5.2 5.9.0 10.5.3 5.9.0-beta.1 10.6.0 5.9.0-rc.1 10.6.0-beta.1 5.9.0-rc.2 10.6.0-beta.2 5.9.1 10.6.0-rc.1 5.9.2 10.6.1 6.0.0 10.6.2 6.0.0-beta.1 10.7.0 6.0.0-rc.1 10.7.0-beta.1 6.0.1 10.7.0-beta.2 6.0.2 10.7.0-rc.1 6.1.0 3.0.0 6.1.0-beta.1 3.0.1 6.1.0-rc.1 3.0.2 6.1.0-rc.2 3.0.3 6.1.1 3.0.4 6.1.2 3.0.5 6.1.3 3.0.6 6.2.0 3.0.7 6.2.0-beta.1 3.0.8 6.2.0-rc.1 3.0.9 6.2.0-rc.2 3.1.0 6.2.1 3.1.1 6.2.2 3.1.2 6.2.3 3.2.0 6.3.0 3.2.1 6.3.0-beta.1 3.2.2 6.3.0-rc.1 3.2.3 6.3.0-rc.2 3.2.4 6.3.1 3.2.5 6.3.2 3.2.6 6.4.0 3.3.0 6.4.0-beta.1 3.3.1 6.4.0-rc.1 3.3.2 6.4.1 3.3.2-rc.1 6.4.2 3.3.3 6.5.0 3.3.4 6.5.0-beta.1 3.3.5 6.5.0-rc.1 3.3.6 6.5.0-rc.2 3.4.0 6.5.1 3.4.0-beta.1 6.5.2 3.4.0-rc.2 6.6.0 3.4.1 6.6.0-beta.1 3.4.2 6.6.0-rc.1 3.4.3 6.6.0-rc.2 3.4.4 6.6.1 3.4.5 6.6.2 3.4.6 6.7.0 3.4.7 6.7.0-beta.1 3.4.8 6.7.0-beta.2 3.5.0 6.7.0-rc.1 3.5.0-beta.1 6.7.1 3.5.0-rc.1 6.8.0 3.5.0-rc.2 6.8.0-beta.1 3.5.1 6.8.0-beta.2 3.5.10 6.8.0-rc.1 3.5.2 6.8.1 3.5.3 6.8.2 3.5.4 6.8.3 3.5.5 6.9.0 3.5.6 6.9.0-beta.1 3.5.7 6.9.0-beta.2 3.5.8 6.9.0-rc.1 3.5.9 6.9.1 3.6.0 6.9.2 3.6.0-beta.1 6.9.3 3.6.0-rc.1 6.9.4 3.6.0-rc.2 6.9.5 3.6.0-rc.3 7.0.0 3.6.1 7.0.0-beta.1 3.6.2 7.0.0-beta.2 3.6.3 7.0.0-beta.3 3.6.4 7.0.0-rc.1 3.6.5 7.0.0-rc.2 3.6.6 7.0.1 3.6.7 7.0.2 3.7.0 7.1.0 3.7.0-beta.1 7.1.0-beta.1 3.7.0-rc.1 7.1.0-beta.2 3.7.0-rc.2 7.1.0-rc.1 3.7.1 7.1.0-rc.2 3.7.2 7.1.1
woocommerce / assets / css / admin.scss
woocommerce / assets / css Last commit date
jquery-ui 5 years ago photoswipe 5 years ago _animation.scss 3 years ago _fonts.scss 2 years ago _mixins.scss 1 year ago _variables.scss 2 years ago activation-rtl.css 2 years ago activation.css 2 years ago activation.scss 2 years ago admin-rtl.css 1 year ago admin.css 1 year ago admin.scss 1 year ago auth-rtl.css 2 years ago auth.css 2 years ago auth.scss 2 years ago brands-admin-rtl.css 1 year ago brands-admin.css 1 year ago brands-admin.scss 1 year ago brands-rtl.css 1 year ago brands.css 1 year ago brands.scss 1 year ago dashboard-rtl.css 2 years ago dashboard-setup-rtl.css 4 years ago dashboard-setup.css 4 years ago dashboard-setup.scss 3 years ago dashboard.css 2 years ago dashboard.scss 2 years ago helper-rtl.css 2 years ago helper.css 2 years ago helper.scss 1 year ago marketplace-suggestions-rtl.css 2 years ago marketplace-suggestions.css 2 years ago marketplace-suggestions.scss 3 years ago menu-rtl.css 2 years ago menu.css 2 years ago menu.scss 2 years ago network-order-widget-rtl.css 4 years ago network-order-widget.css 4 years ago network-order-widget.scss 3 years ago prettyPhoto-rtl.css 2 years ago prettyPhoto.css 2 years ago prettyPhoto.scss 3 years ago privacy-rtl.css 6 years ago privacy.css 6 years ago privacy.scss 3 years ago reports-print-rtl.css 3 years ago reports-print.css 3 years ago reports-print.scss 3 years ago select2.css 3 years ago select2.scss 3 years ago twenty-nineteen-rtl.css 1 year ago twenty-nineteen.css 1 year ago twenty-nineteen.scss 1 year ago twenty-seventeen-rtl.css 1 year ago twenty-seventeen.css 1 year ago twenty-seventeen.scss 1 year ago twenty-twenty-one-admin-rtl.css 2 years ago twenty-twenty-one-admin.css 2 years ago twenty-twenty-one-admin.scss 2 years ago twenty-twenty-one-rtl.css 1 year ago twenty-twenty-one.css 1 year ago twenty-twenty-one.scss 1 year ago twenty-twenty-rtl.css 1 year ago twenty-twenty-three-rtl.css 1 year ago twenty-twenty-three.css 1 year ago twenty-twenty-three.scss 1 year ago twenty-twenty-two-rtl.css 1 year ago twenty-twenty-two.css 1 year ago twenty-twenty-two.scss 1 year ago twenty-twenty.css 1 year ago twenty-twenty.scss 1 year ago wc-setup-rtl.css 2 years ago wc-setup.css 2 years ago wc-setup.scss 2 years ago woocommerce-blocktheme-rtl.css 1 year ago woocommerce-blocktheme.css 1 year ago woocommerce-blocktheme.scss 1 year ago woocommerce-layout-rtl.css 2 years ago woocommerce-layout.css 2 years ago woocommerce-layout.scss 2 years ago woocommerce-rtl.css 1 year ago woocommerce-smallscreen-rtl.css 1 year ago woocommerce-smallscreen.css 1 year ago woocommerce-smallscreen.scss 1 year ago woocommerce.css 1 year ago woocommerce.scss 1 year ago
admin.scss
8772 lines
1 /**
2 * admin.scss
3 * General WooCommerce admin styles. Settings, product data tabs, reports, etc.
4 */
5
6 /**
7 * Imports
8 */
9 @import "mixins";
10 @import "variables";
11 @import "animation";
12 @import "fonts";
13
14 /**
15 * Styling begins
16 */
17 .blockUI.blockOverlay {
18 @include loader();
19 }
20
21 $font-sf-pro-text: helveticaneue-light, "Helvetica Neue Light",
22 "Helvetica Neue", sans-serif;
23
24 .wc-addons-wrap {
25 .marketplace-header {
26 background-image: url(../images/marketplace-header-bg@2x.png);
27 background-position: right;
28 background-size: cover;
29 box-sizing: border-box;
30 display: flex;
31 flex-direction: column;
32 justify-content: center;
33 min-height: 216px;
34 padding: 24px 16px;
35 width: 100%;
36
37 &__title {
38 color: #fff;
39 font-size: 32px;
40 font-style: normal;
41 font-weight: 400;
42 line-height: 1.15;
43 margin-bottom: 8px;
44 padding: 0;
45 }
46
47 &__description {
48 color: #fff;
49 font-size: 16px;
50 line-height: 24px;
51 margin-bottom: 24px;
52 margin-top: 0;
53 }
54
55 &__search-form {
56 clear: both;
57 display: block;
58 max-width: 318px;
59 position: relative;
60
61 input {
62 border: 1px solid #ddd;
63 box-shadow: none;
64 font-size: 13px;
65 height: 48px;
66 padding-left: 16px;
67 padding-right: 50px;
68 width: 100%;
69 margin: 0;
70 }
71
72 button {
73 background: none;
74 border: none;
75 cursor: pointer;
76 height: 48px;
77 position: absolute;
78 right: 0;
79 width: 53px;
80 }
81 }
82 }
83
84 .top-bar {
85 background: #fff;
86 box-shadow: inset 0 -1px 0 #ccc;
87 display: block;
88 height: 60px;
89 margin: 0 0 16px;
90
91 @media only screen and (min-width: 768px) {
92 margin-bottom: 24px;
93 }
94 }
95
96 .current-section-dropdown {
97 background: #fff;
98 border: 1px solid #a7aaad;
99 margin-bottom: 20px;
100 position: relative;
101 width: 100%;
102
103 @media only screen and (min-width: 600px) {
104 width: 288px;
105 }
106
107 ul {
108 background: #fff;
109 border-radius: 2px;
110 display: none;
111 flex-direction: column;
112 justify-content: left;
113 left: 0;
114 margin: 0;
115 padding: 14px 0;
116 position: absolute;
117 top: 50px;
118 width: 100%;
119 z-index: 10;
120
121 @media only screen and (min-width: 600px) {
122 border: 1px solid #1e1e1e;
123 left: -1px;
124 top: 48px;
125 }
126
127 @media only screen and (min-width: 1100px) {
128 justify-content: center;
129 }
130
131 li {
132 font-size: 13px;
133 line-height: 16px;
134 margin: 0;
135
136 &.current a::after {
137 background-image: url(../images/icons/gridicons-checkmark.svg);
138 content: "";
139 display: block;
140 height: 20px;
141 position: absolute;
142 right: 20px;
143 top: 7px;
144 width: 20px;
145 }
146 }
147
148 a,
149 a:visited,
150 a:hover,
151 a:focus {
152 border: none;
153 box-shadow: none;
154 box-sizing: border-box;
155 color: #1e1e1e;
156 display: inline-block;
157 text-decoration: none;
158 outline: none;
159 padding: 14px 18px;
160 position: relative;
161 width: 100%;
162
163 @media only screen and (min-width: 600px) {
164 padding: 10px 18px;
165 }
166 }
167 }
168
169 &.wp-tour-kit-spotlit {
170 padding: 20px;
171 }
172 }
173
174 .current-section-name {
175 cursor: pointer;
176 font-size: 14px;
177 line-height: 24px;
178 padding: 12px 16px;
179 position: relative;
180 }
181
182 .current-section-name::after {
183 background-image: url(../images/icons/gridicons-chevron-down.svg);
184 background-size: contain;
185 content: "";
186 display: block;
187 height: 20px;
188 position: absolute;
189 right: 20px;
190 top: 16px;
191 width: 20px;
192 }
193
194 .current-section-dropdown.is-open {
195 ul {
196 display: flex;
197 }
198
199 .current-section-name::after {
200 transform: rotate(0.5turn);
201 }
202 }
203
204 .update-plugins .update-count {
205 background-color: var(--wp-admin-theme-color, #d54e21);
206 border-radius: 10px;
207 color: #fff;
208 display: inline-block;
209 font-size: 9px;
210 font-weight: 600;
211 line-height: 17px;
212 margin: 1px 0 0 4px;
213 padding: 0 6px;
214 vertical-align: text-top;
215 }
216
217 /**
218 * Marketplace related variables
219 */
220 $font-sf-pro-display: sans-serif;
221
222 h1.search-form-title {
223 clear: left;
224 font-size: 20px;
225 font-family: $font-sf-pro-display;
226 line-height: 1.2;
227 margin: 48px 0 12px;
228 padding: 0;
229 }
230
231 .addons-featured {
232 margin: 0;
233 }
234
235 ul.subsubsub.subsubsub {
236 margin: -2px 0 12px;
237 }
238
239 .subsubsub li::after {
240 content: "|";
241 }
242
243 .subsubsub li:last-child::after {
244 content: "";
245 }
246
247 .addons-button {
248 border-radius: 3px;
249 cursor: pointer;
250 display: block;
251 height: 37px;
252 line-height: 37px;
253 margin-top: 16px;
254 text-align: center;
255 text-decoration: none;
256 width: 124px;
257 }
258
259 .addons-wcs-banner-block {
260 align-items: center;
261 background: #fff;
262 border: 1px solid #ddd;
263 display: flex;
264 margin: 0 0 1em 0;
265 padding: 2em 2em 1em;
266 }
267
268 .addons-wcs-banner-block-image {
269 background: #f7f7f7;
270 border: 1px solid #e6e6e6;
271 margin-right: 2em;
272 padding: 4em;
273 max-width: 200px;
274
275 .addons-img {
276 max-height: 86px;
277 max-width: 97px;
278 }
279
280 &.is-full-image {
281 padding: 0;
282 background: none;
283 border: none;
284
285 .addons-img {
286 max-height: 100%;
287 max-width: 100%;
288 }
289 }
290 }
291
292 .addons-shipping-methods .addons-wcs-banner-block {
293 margin-left: 0;
294 margin-right: 0;
295 margin-top: 1em;
296 }
297
298 .addons-wcs-banner-block-content {
299 display: flex;
300 flex-direction: column;
301 justify-content: space-around;
302 align-self: stretch;
303 padding: 1em 0;
304
305 h1 {
306 padding-bottom: 0;
307 }
308
309 p {
310 margin-bottom: 0;
311 }
312
313 .wcs-logos-container {
314 display: flex;
315 align-items: center;
316 flex-direction: row;
317 justify-content: center;
318
319 @media screen and (min-width: 500px) {
320 justify-content: left;
321 }
322
323 li {
324 margin-right: 8px;
325
326 &:last-child {
327 margin-right: 0;
328 }
329 }
330 }
331
332 .wcs-service-logo {
333 max-width: 45px;
334 }
335 }
336
337 .addons-column {
338 flex: 1;
339 width: 50%;
340 padding: 0 0.5em;
341 }
342
343 .addons-column:nth-child(2) {
344 margin-right: 0;
345 }
346
347 .addons-small-dark-items {
348 display: flex;
349 flex-wrap: wrap;
350 justify-content: space-around;
351 }
352
353 .addons-small-dark-item {
354 margin: 0 0 20px;
355 }
356
357 .addons-small-dark-item-icon img {
358 height: 30px;
359 }
360
361 .addons-small-dark-item a {
362 margin: 28px auto 0;
363 }
364
365 .addons-button-solid {
366 background-color: #674399;
367 color: #fff;
368 }
369
370 .addons-button-promoted {
371 float: right;
372 width: auto;
373 padding: 0 20px;
374 margin-top: 0;
375 }
376
377 .addons-button-promoted:hover {
378 opacity: 0.8;
379 }
380
381 .addons-button-expandable {
382 display: inline-block;
383 padding: 0 16px;
384 width: auto;
385 }
386
387 .addons-button-solid:hover {
388 color: #fff;
389 opacity: 0.8;
390 }
391
392 .addons-button-outline-green {
393 border: 1px solid #73ae39;
394 color: #73ae39;
395 }
396
397 .addons-button-outline-green:hover {
398 color: #73ae39;
399 opacity: 0.8;
400 }
401
402 .addons-button-outline-purple {
403 border: 1px solid #674399;
404 color: #674399;
405 }
406
407 .addons-button-outline-purple:hover {
408 color: #674399;
409 opacity: 0.8;
410 }
411
412 .addons-button-outline-white {
413 border: 1px solid #fff;
414 color: #fff;
415 }
416
417 .addons-button-outline-white:hover {
418 color: #fff;
419 opacity: 0.8;
420 }
421
422 .addons-button-installed {
423 background: #e6e6e6;
424 color: #3c3c3c;
425 }
426
427 .addons-button-installed:hover {
428 color: #3c3c3c;
429 opacity: 0.8;
430 }
431
432 @media only screen and (max-width: 400px) {
433 .addons-button {
434 width: 100%;
435 }
436
437 .addons-small-dark-item {
438 width: 100%;
439 }
440 }
441
442 .marketplace-content-wrapper {
443 font-family: $font-sf-pro-text;
444 margin: 0 auto;
445 max-width: 1032px;
446 width: 100%;
447 }
448
449 .addon-product-group {
450 margin-bottom: 24px;
451
452 &.wp-tour-kit-spotlit {
453 padding: 20px;
454 }
455 }
456
457 .addon-product-group-title {
458 font-family: $font-sf-pro-display;
459 font-size: 20px;
460 font-weight: 400;
461 line-height: 24px;
462 margin: 0 0 4px;
463 }
464
465 .current-section-dropdown__title {
466 display: none;
467 font-family: $font-sf-pro-display;
468 }
469
470 .addon-product-group-description-container {
471 align-items: center;
472 display: flex;
473 flex-direction: row;
474 font-size: 14px;
475 justify-content: space-between;
476 line-height: 20px;
477
478 .addon-product-group-see-more,
479 .addon-product-group-see-more:visited {
480 color: var(--wp-admin-theme-color, #007cba);
481 /* Primary / Blue */
482 display: block;
483 font-size: 13px;
484 text-decoration: none;
485 }
486 }
487
488 .products {
489 display: flex;
490 flex-flow: row;
491 flex-wrap: wrap;
492 font-weight: normal;
493 justify-content: space-between;
494 margin: 0;
495 max-width: 1032px;
496 overflow: hidden;
497
498 .product.addons-product-banner,
499 .product.addons-buttons-banner {
500 max-width: calc(100% - 2px);
501 }
502
503 @media screen and (min-width: 960px) {
504 // Adjust heading titles font for three-column product groups
505 &.addons-products-three-column li.product {
506 max-width: calc(33.33% - 12px);
507
508 h2,
509 h3 {
510 font-size: 16px;
511 }
512 }
513 }
514
515 li {
516 background: #fff;
517 border: 1px solid #dcdcde;
518 border-radius: 2px;
519 box-sizing: border-box;
520 display: flex;
521 flex: 1 0 auto;
522 flex-direction: column;
523 justify-content: space-between;
524 margin: 12px 0;
525 max-width: calc(50% - 12px);
526 min-width: 280px;
527 min-height: 220px;
528 overflow: hidden;
529 padding: 0;
530 vertical-align: top;
531
532 &.addons-full-width {
533 max-width: 100%;
534 }
535
536 @media only screen and (max-width: 768px) {
537 max-width: none;
538 width: 100%;
539 }
540
541 a {
542 text-decoration: none;
543 }
544
545 .product-details {
546 padding: 24px;
547 position: relative;
548
549 /* Display an image (product's icon) top right */
550 .product-img-wrap {
551 display: block;
552 margin-left: 24px;
553 position: absolute;
554 right: 24px;
555 top: 24px;
556
557 img {
558 border-radius: 3px;
559 display: block;
560 margin: 0;
561 max-width: 48px;
562 max-height: 48px;
563 }
564 }
565
566 /* Align aproduct-related banner image vertically centered */
567 &.addon-product-banner-details {
568 align-items: center;
569 display: flex;
570 flex-direction: row;
571 justify-content: space-between;
572
573 .product-img-wrap {
574 position: unset;
575
576 img {
577 max-width: 150px;
578 max-height: 150px;
579 }
580 }
581 }
582
583 h2,
584 h3 {
585 color: var(--wp-admin-theme-color, #007cba);
586 font-size: 20px;
587 font-weight: 400;
588 letter-spacing: -0.32px;
589 line-height: 28px;
590 margin: 0 !important;
591 // Don't cover a product icon
592 max-width: calc(100% - 48px);
593 }
594
595 .addons-buttons-banner-details h2 {
596 color: #1d2327; // Gray / Gray 90
597 }
598
599 &.featured,
600 &.promoted {
601 .label {
602 align-items: center;
603 border-radius: 2px;
604 background: #dcdcde;
605 display: flex;
606 flex-direction: row;
607 height: 20px;
608 justify-content: flex-end;
609 margin-bottom: 8px;
610 max-width: 52px;
611 padding: 3px 12px;
612 top: 28px;
613 right: 24px;
614 text-align: center;
615
616 &.promoted {
617 float: right;
618 max-width: 58px;
619 }
620 }
621
622 h2 {
623 color: var(--wp-admin-theme-color, #2c3338);
624 }
625 }
626
627 p {
628 color: #2c3338;
629 font-size: 14px;
630 line-height: 20px;
631 margin: 14px 64px 0 0;
632 width: 100%;
633 }
634
635 .addons-buttons-banner-details p {
636 font-size: 14px;
637 margin-bottom: 14px;
638 max-width: none;
639 }
640
641 .product-developed-by {
642 color: #50575e;
643 /* Gray 60 */
644 font-size: 12px;
645 line-height: 20px;
646 margin-top: 4px;
647
648 .product-vendor-link {
649 color: #50575e;
650 /* Gray 60 */
651 }
652 }
653
654 .product-developed-by {
655 color: #50575e; // Gray 60
656 font-size: 12px;
657 font-family: sans-serif;
658 line-height: 20px;
659 margin-top: 4px;
660
661 .product-vendor-link {
662 color: #50575e; // Gray 60
663 }
664 }
665 }
666
667 .product-footer {
668 align-items: center;
669 border-top: 1px solid #dcdcde;
670 display: flex;
671 flex-direction: row;
672 justify-content: space-between;
673 padding: 24px;
674
675 .price {
676 font-size: 16px;
677 color: #1d2327;
678 }
679
680 .price-suffix {
681 color: #646970; // Gray 50
682 }
683
684 .product-reviews-block {
685 display: flex;
686 flex-direction: row;
687 margin-top: 4px;
688
689 .product-rating-star {
690 background-repeat: no-repeat;
691 background-size: contain;
692 height: 16px;
693 margin: 4px 4px 4px 0;
694 width: 17px;
695
696 &__fill {
697 background-image: url(../images/icons/star-golden.svg);
698 }
699
700 &__half-fill {
701 background-image: url(../images/icons/star-half-filled.svg);
702 }
703
704 &__no-fill {
705 background-image: url(../images/icons/star-gray.svg);
706 }
707 }
708
709 .product-reviews-count {
710 color: #646970; // Gray 50
711 font-size: 12px;
712 font-family: sans-serif;
713 line-height: 24px;
714 letter-spacing: -0.154px;
715 margin-left: 4px;
716 }
717 }
718
719 .button {
720 background-color: #fff;
721 border-color: var(--wp-admin-theme-color, #007cba);
722 color: var(--wp-admin-theme-color, #007cba);
723 float: right;
724 font-size: 13px;
725 height: 36px;
726 line-height: 30px;
727 padding: 2px 14px;
728 }
729 }
730 }
731
732 .product-footer-promoted {
733 align-items: flex-end;
734 display: flex;
735 justify-content: space-between;
736 padding: 24px;
737
738 .icon img {
739 border-radius: 4px;
740 width: 80px;
741 }
742 }
743
744 .addons-buttons-banner {
745 display: flex;
746 flex-direction: row;
747
748 .addons-buttons-banner-image {
749 background-repeat: no-repeat;
750 background-size: cover;
751 height: 190px;
752 margin: 24px;
753 width: 200px;
754 }
755
756 .addons-buttons-banner-details-container {
757 padding-left: 0;
758 width: calc(100% - 198px - 24px - 24px);
759 }
760
761 .addons-buttons-banner-details-container {
762 display: flex;
763 flex-direction: column;
764 justify-content: space-between;
765 }
766
767 .button.addons-buttons-banner-button,
768 .button.addons-buttons-banner-button:hover {
769 background: #fff;
770 border: 1.5px solid #624594;
771 color: #624594;
772 padding: 4px 12px;
773 margin-right: 16px;
774
775 &.addons-buttons-banner-button-primary {
776 background-color: #624594;
777 color: #fff;
778 }
779 }
780 }
781 }
782
783 .storefront {
784 max-width: 990px;
785 background: url(../images/storefront-bg.jpg) bottom right #f6f6f6;
786 border: 1px solid #ddd;
787 margin: 1em auto;
788 padding: 24px;
789 overflow: hidden;
790 zoom: 1;
791
792 img {
793 display: block;
794 width: 100%;
795 max-width: 400px;
796 height: auto;
797 margin: 0 auto 16px;
798 box-shadow: 0 1px 6px rgba(0, 0, 0, 0.1);
799 }
800
801 p:last-of-type {
802 margin-bottom: 0;
803 }
804
805 p {
806 max-width: 750px;
807 }
808 }
809 }
810
811 .marketplace-header__tabs {
812 display: flex;
813 margin: 0;
814 }
815
816 .marketplace-header__tab {
817 display: flex;
818 flex: 1;
819 margin: 0;
820 }
821
822 .marketplace-header__tab-link {
823 align-items: center;
824 border-bottom: 2px solid transparent;
825 box-sizing: border-box;
826 display: flex;
827 font-size: 14px;
828 height: 60px;
829 justify-content: center;
830 line-height: 20px;
831 padding: 0 24px;
832 text-decoration: none;
833 width: 100%;
834
835 &.is-current {
836 border-bottom: 2px solid #1e1e1e;
837 color: #1e1e1e;
838 }
839 }
840
841 .no-touch,
842 .no-js {
843 .wc-addons-wrap {
844 .current-section-dropdown:hover {
845 ul {
846 display: flex;
847 }
848
849 .current-section-name::after {
850 transform: rotate(0.5turn);
851 }
852 }
853 }
854 }
855
856 .wc-subscriptions-wrap {
857 max-width: 1200px;
858
859 .update-plugins .update-count {
860 background-color: var(--wp-admin-theme-color, #d54e21);
861 border-radius: 10px;
862 color: #fff;
863 display: inline-block;
864 font-size: 9px;
865 font-weight: 600;
866 line-height: 17px;
867 margin: 1px 0 0 2px;
868 padding: 0 6px;
869 vertical-align: text-top;
870 }
871 }
872
873 .woocommerce-page-wc-marketplace {
874 .notice {
875 margin-left: 20px;
876 margin-right: 20px;
877 }
878
879 // NOTE: .woocommerce-page is removed within admin.
880 &.woocommerce-page, &.woocommerce-admin-page {
881 .wrap {
882 margin-top: 32px;
883 }
884 }
885 }
886
887 .woocommerce-page-wc-subscriptions {
888 #wpbody-content {
889 .screen-reader-text + .notice {
890 margin-top: 32px;
891 }
892 }
893 }
894
895 .woocommerce-embed-page.woocommerce-page-wc-marketplace {
896 #screen-meta-links {
897 position: absolute;
898 right: 0;
899 }
900 }
901
902 .woocommerce-message,
903 .woocommerce-BlankState {
904 a.button-primary,
905 button.button-primary {
906 display: inline-block;
907 }
908 }
909
910 .woocommerce-message {
911 position: relative;
912 overflow: hidden;
913
914 &.updated {
915 border-left-color: var(--wp-admin-theme-color, $woocommerce) !important;
916 }
917
918 a.skip,
919 a.docs {
920 text-decoration: none !important;
921 }
922
923 a.woocommerce-message-close {
924 position: static;
925 float: right;
926 padding: 0 15px 10px 28px;
927 margin-top: -10px;
928 font-size: 13px;
929 line-height: 1.23076923;
930 text-decoration: none;
931
932 &::before {
933 position: relative;
934 top: 18px;
935 left: -20px;
936 transition: all 0.1s ease-in-out;
937 }
938 }
939
940 .twitter-share-button {
941 margin-top: -3px;
942 margin-left: 3px;
943 vertical-align: middle;
944 }
945 }
946
947 #variable_product_options #message,
948 #inventory_product_data .notice,
949 #variable_product_options .notice {
950 display: flex;
951 background-color: #ffffff;
952 border-color: #eee;
953 border-width: 1px 0px 0px 0px;
954 border-style: solid;
955 align-items: center;
956 box-shadow: 0 0 0;
957 margin: 5px 0 0;
958 > p {
959 a {
960 text-decoration: none;
961 white-space: nowrap;
962 }
963 }
964 > p:not(:last-child) {
965 width: 85%;
966 }
967 > img.info-icon {
968 width: 1em;
969 filter: brightness(50%);
970 }
971 .woocommerce-add-variation-price-container {
972 width: auto;
973 display: flex;
974 justify-content: flex-end;
975 > button {
976 align-self: center;
977 }
978 }
979 }
980
981 .woocommerce-set-price-variations {
982 .woocommerce-usage-modal__wrapper {
983 .woocommerce-usage-modal__message {
984 height: 60px;
985 flex-wrap: wrap;
986 display: flex;
987 > span {
988 padding-bottom: 16px;
989 }
990 }
991 .woocommerce-usage-modal__actions {
992 display: flex;
993 justify-content: flex-end;
994 margin-top: 20px;
995 > button {
996 margin-left: 16px;
997 width: auto;
998 display: unset;
999 }
1000 }
1001 }
1002 }
1003
1004 /**
1005 * Variations related variables
1006 */
1007 $container-height: 360px;
1008 $max-content-width: 544px;
1009 $default-font-size: 14px;
1010 $default-line-height: 18px;
1011
1012 #variable_product_options {
1013 .form-row select {
1014 max-width: 100%;
1015 }
1016
1017 .variation_actions {
1018 max-width: 131px;
1019 }
1020
1021 .toolbar-top {
1022 .button,
1023 .select {
1024 margin: 1px;
1025 }
1026 }
1027
1028 %container-defaults {
1029 box-sizing: border-box;
1030 display: flex;
1031 padding: 32px 0;
1032 height: $container-height;
1033 }
1034
1035 %centered-text {
1036 width: 90%;
1037 max-width: $max-content-width;
1038 font-size: $default-font-size;
1039 line-height: $default-line-height;
1040 text-align: center;
1041 }
1042
1043 .add-attributes-container {
1044 @extend %container-defaults;
1045 align-items: center;
1046
1047 a {
1048 text-decoration: none;
1049
1050 &[target="_blank"]="_blank""]::after {
1051 content: url("../images/icons/external-link.svg");
1052 margin-left: 2px;
1053 vertical-align: sub;
1054 }
1055 }
1056
1057 .add-attributes-message {
1058 display: flex;
1059 flex-direction: column;
1060 align-items: center;
1061 gap: 24px;
1062 width: 100%;
1063
1064 p {
1065 @extend %centered-text;
1066 }
1067 }
1068 }
1069
1070 #variable_product_options_inner {
1071 > .toolbar:not(.expand-close-hidden) {
1072 border-bottom: 1px solid #eee;
1073 }
1074 .add-variation-container {
1075 display: none;
1076 }
1077
1078 &.no-variations {
1079 > .toolbar:not(.expand-close-hidden) {
1080 border-bottom: none;
1081 }
1082 .add-variation-container {
1083 display: flex;
1084 @extend %container-defaults;
1085 flex-direction: column;
1086 justify-content: center;
1087 align-items: center;
1088 gap: 24px;
1089 position: relative;
1090
1091 .arrow-image-wrapper {
1092 position: absolute;
1093 top: 10px;
1094 left: 87px;
1095 }
1096
1097 p {
1098 @extend %centered-text;
1099 }
1100 }
1101 }
1102 }
1103 }
1104
1105 #product_attributes {
1106 .add-global-attribute-container {
1107 display: flex;
1108 flex-direction: column;
1109 height: 360px;
1110
1111 &.hidden {
1112 display: none;
1113 }
1114
1115 .message {
1116 box-sizing: border-box;
1117 display: flex;
1118 flex-direction: column;
1119 justify-content: center;
1120 align-items: center;
1121 padding: 32px 0px;
1122 gap: 24px;
1123 flex: 1;
1124 @media screen and (max-width: 782px) {
1125 button {
1126 vertical-align: top;
1127 }
1128 }
1129 p {
1130 width: 90%;
1131 max-width: 544px;
1132 font-size: 14px;
1133 line-height: 18px;
1134 text-align: center;
1135 }
1136 }
1137 }
1138 .toolbar-top {
1139 .button,
1140 .select2-container {
1141 margin: 1px;
1142 }
1143 }
1144 .select2-container {
1145 min-width: 190px;
1146 }
1147 }
1148 #select2-attribute_taxonomy-results {
1149 .select2-results__option,
1150 .select2-results__group {
1151 margin: 0;
1152 padding: 8px 4px;
1153 }
1154 }
1155
1156 .clear {
1157 clear: both;
1158 }
1159
1160 .wrap.woocommerce div.updated,
1161 .wrap.woocommerce div.error {
1162 margin-top: 10px;
1163 }
1164
1165 mark.amount {
1166 background: transparent none;
1167 color: inherit;
1168 }
1169
1170 /**
1171 * Help Tip
1172 */
1173 .woocommerce-help-tip,
1174 .woocommerce-product-type-tip {
1175 color: #666;
1176 display: inline-block;
1177 font-size: 1.1em;
1178 font-style: normal;
1179 height: 16px;
1180 line-height: 16px;
1181 position: relative;
1182 vertical-align: middle;
1183 width: 16px;
1184
1185 &::after {
1186 @include icon_dashicons("\f223");
1187 cursor: help;
1188 }
1189 }
1190
1191 .wc-wp-version-gte-53 {
1192 .woocommerce-help-tip,
1193 .woocommerce-product-type-tip {
1194 font-size: 1.2em;
1195 cursor: help;
1196 }
1197 }
1198
1199 h2 .woocommerce-help-tip,
1200 .woocommerce-product-type-tip {
1201 margin-top: -5px;
1202 margin-left: 0.25em;
1203 }
1204
1205 table.wc_status_table {
1206 margin-bottom: 1em;
1207
1208 h2 {
1209 font-size: 14px;
1210 margin: 0;
1211 }
1212
1213 tr:nth-child(2n) {
1214 th,
1215 td {
1216 background: #fcfcfc;
1217 }
1218 }
1219
1220 th {
1221 font-weight: 700;
1222 padding: 9px;
1223 }
1224
1225 td:first-child {
1226 width: 33%;
1227 }
1228
1229 td.help {
1230 width: 1em;
1231 }
1232
1233 td,
1234 th {
1235 font-size: 1.1em;
1236 font-weight: normal;
1237
1238 &.run-tool {
1239 text-align: right;
1240
1241 .run-tool-status {
1242 font-size: 90%;
1243 margin-right: 0.5em;
1244 display: inline-block;
1245 opacity: 80%;
1246
1247 .dashicons.spin {
1248 animation: rotation 2s infinite linear;
1249 }
1250 }
1251 }
1252
1253 strong.name {
1254 display: block;
1255 margin-bottom: 0.5em;
1256 }
1257
1258 @include table-marks();
1259
1260 mark.error,
1261 .red {
1262 color: $red;
1263 }
1264
1265 ul {
1266 margin: 0;
1267 }
1268 }
1269
1270 .help_tip {
1271 cursor: help;
1272 }
1273 }
1274
1275 table.wp-list-table.urls {
1276 td,
1277 th {
1278 @include table-marks();
1279 }
1280 }
1281
1282 table.wc_status_table--tools {
1283 td,
1284 th {
1285 padding: 2em;
1286 }
1287 }
1288
1289 .taxonomy-product_cat {
1290 .check-column .woocommerce-help-tip {
1291 font-size: 1.5em;
1292 margin: -3px 0 0 5px;
1293 display: block;
1294 position: absolute;
1295 }
1296 }
1297
1298 #debug-report {
1299 display: none;
1300 margin: 10px 0;
1301 padding: 0;
1302 position: relative;
1303
1304 textarea {
1305 font-family: monospace;
1306 width: 100%;
1307 margin: 0;
1308 height: 300px;
1309 padding: 20px;
1310 border-radius: 0;
1311 resize: none;
1312 font-size: 12px;
1313 line-height: 20px;
1314 outline: 0;
1315 }
1316 }
1317
1318 /**
1319 * FileV2 logs
1320 */
1321 .wc-logs-header {
1322 margin: 1.5em 0 2em;
1323 display: flex;
1324 flex-flow: row wrap;
1325 align-items: center;
1326 gap: 1em;
1327
1328 h2 {
1329 margin: 0;
1330 }
1331
1332 .file-id {
1333 padding: 3px 5px;
1334 background: rgba( 0, 0, 0, 0.07 );
1335 font-family: Consolas, Monaco, monospace;
1336 }
1337 }
1338
1339 .wc-logs-single-file-rotations {
1340 display: flex;
1341 align-items: center;
1342 gap: 0.5em;
1343
1344 h3 {
1345 font-size: inherit;
1346 margin: 0;
1347 }
1348
1349 .wc-logs-rotation-links {
1350 list-style: none;
1351 margin: 0;
1352 display: flex;
1353 gap: 0.5em;
1354
1355 li {
1356 display: block;
1357 margin: 0;
1358 }
1359 }
1360 }
1361
1362 .wc-logs-single-file-actions {
1363 margin-left: auto;
1364 display: flex;
1365 flex-flow: row wrap;
1366 gap: 0.5em;
1367 }
1368
1369 .wc-logs-search {
1370 margin-left: auto;
1371 display: flex;
1372 flex-flow: column;
1373 }
1374
1375 .wc-logs-search-fieldset {
1376 display: flex;
1377 gap: 0.5em;
1378 justify-content: flex-end;
1379 }
1380
1381 .wc-logs-search-notice {
1382 font-size: 0.9em;
1383 line-height: 2;
1384 text-align: right;
1385 visibility: hidden;
1386 height: 0;
1387
1388 .wc-logs-search:focus-within & {
1389 visibility: visible;
1390 height: auto;
1391 }
1392 }
1393
1394 .wc-logs-entries {
1395 background: #f6f7f7;
1396 border: 1px solid #c3c4c7;
1397 font-family: Consolas, Monaco, monospace;
1398 word-wrap: break-word;
1399 line-height: 2.3;
1400 counter-reset: line;
1401
1402 .line {
1403 display: block;
1404 width: 100%;
1405 position: relative;
1406 white-space: pre-wrap;
1407
1408 &:before {
1409 counter-increment: line;
1410 content: counter(line);
1411 display: block;
1412 float: left;
1413 padding: 0 1em 0 0.5em;
1414 width: 3em;
1415 text-align: right;
1416 }
1417
1418 &:target {
1419 box-shadow: 0 0.16em 0.16em -0.16em #c3c4c7, 0 -0.16em 0.16em -0.16em #c3c4c7;
1420 z-index: 1;
1421 scroll-margin-top: 50vh;
1422
1423 .line-content {
1424 background: #fff8c5;
1425 }
1426
1427 .log-level:before {
1428 color: #fff8c5;
1429 }
1430 }
1431
1432 &.has-context {
1433 summary {
1434 cursor: pointer;
1435 }
1436
1437 details {
1438 white-space: pre-wrap;
1439 }
1440 }
1441 }
1442
1443 .line-anchor {
1444 position: absolute;
1445 color: inherit;
1446 text-decoration: none;
1447 display: block;
1448 height: 100%;
1449 width: 4.5em;
1450 }
1451
1452 .line-content {
1453 display: block;
1454 overflow: hidden;
1455 padding: 0 1em;
1456 border-left: 1px solid #c3c4c7;
1457 background: #ffffff;
1458 }
1459
1460 .log-timestamp {
1461 font-weight: 700;
1462 }
1463
1464 .log-level {
1465 font-size: 100%;
1466 }
1467 }
1468
1469 .wc-logs-search-results {
1470 tbody {
1471 word-wrap: break-word;
1472
1473 .column-file_id {
1474 line-height: 2;
1475 }
1476
1477 .column-line_number,
1478 .column-line {
1479 line-height: 2.3;
1480 }
1481
1482 .column-line {
1483 font-family: Consolas, Monaco, monospace;
1484 }
1485 }
1486
1487 td {
1488 vertical-align: middle;
1489 }
1490
1491 .column-file_id {
1492 width: 16%;
1493 }
1494
1495 .column-line_number {
1496 width: 8%;
1497 }
1498
1499 .search-match {
1500 background: #fff8c5;
1501 padding: 0.46em 0;
1502 border: 1px dashed #c3c4c7;
1503 line-height: 2.3;
1504 }
1505 }
1506
1507 .wc-logs-settings {
1508 .wc-settings-row-logs-retention-period-days {
1509 td {
1510 line-height: 2;
1511 }
1512 }
1513 }
1514
1515 /**
1516 * Log severity level colors.
1517 *
1518 * Descending severity:
1519 * emergency, alert -> red
1520 * critical, error -> orange
1521 * warning, notice -> yellow
1522 * info -> blue
1523 * debug -> green
1524 */
1525 .log-level {
1526 display: inline;
1527 padding: 0 0.5em;
1528 font-size: 80%;
1529 font-weight: 700;
1530 line-height: 1;
1531 color: #000000;
1532 background: #ffffff;
1533 text-align: center;
1534 white-space: nowrap;
1535 vertical-align: baseline;
1536 border-style: solid;
1537 border-width: 0.16em 0.16em 0.16em 1em;
1538 border-top-left-radius: 0.5em;
1539 border-bottom-left-radius: 0.5em;
1540
1541 &:before {
1542 content: "";
1543 color: #ffffff;
1544 margin-left: -1.3em;
1545 margin-right: 0.7em;
1546 }
1547
1548 &:empty {
1549 display: none;
1550 }
1551 }
1552
1553 .log-level--emergency,
1554 .log-level--alert {
1555 border-color: #ff4136;
1556 }
1557
1558 .log-level--critical,
1559 .log-level--error {
1560 border-color: #ff851b;
1561 }
1562
1563 .log-level--warning,
1564 .log-level--notice {
1565 color: #222;
1566 border-color: #ffdc00;
1567 }
1568
1569 .log-level--info {
1570 border-color: #0074d9;
1571 }
1572
1573 .log-level--debug {
1574 border-color: #3d9970;
1575 }
1576
1577 /**
1578 * Legacy file/DB log viewers
1579 */
1580 .wp-list-table.logs {
1581 // Adjust log table columns only when table is not collapsed
1582 @media screen and (min-width: 783px) {
1583 .column-timestamp {
1584 width: 18%;
1585 }
1586
1587 .column-level {
1588 width: 14%;
1589 }
1590
1591 .column-source {
1592 width: 15%;
1593 }
1594
1595 .column-context {
1596 width: 10%;
1597 }
1598 }
1599
1600 .column-message {
1601 pre {
1602 margin: 0;
1603 white-space: pre-wrap;
1604 }
1605 }
1606
1607 .column-context {
1608 .button {
1609 span {
1610 line-height: 1.3;
1611 }
1612 }
1613 }
1614
1615 .log-context {
1616 display: none;
1617
1618 pre {
1619 white-space: pre-wrap;
1620 }
1621 }
1622 }
1623
1624 #log-viewer-select {
1625 padding: 10px 0 8px;
1626 line-height: 28px;
1627
1628 h2 a {
1629 vertical-align: middle;
1630 }
1631 }
1632
1633 #log-viewer {
1634 background: #fff;
1635 border: 1px solid #e5e5e5;
1636 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
1637 padding: 5px 20px;
1638
1639 pre {
1640 font-family: monospace;
1641 white-space: pre-wrap;
1642 word-wrap: break-word;
1643 }
1644 }
1645
1646 /**
1647 * Inline edit
1648 */
1649 .inline-edit-product.quick-edit-row {
1650 .inline-edit-col-center,
1651 .inline-edit-col-right {
1652 float: right !important;
1653 }
1654 }
1655
1656 #woocommerce-fields.inline-edit-col {
1657 clear: left;
1658
1659 label.featured,
1660 label.manage_stock {
1661 margin-left: 10px;
1662 }
1663
1664 label.stock_status_field {
1665 clear: both;
1666 float: left;
1667 }
1668
1669 .dimensions div {
1670 display: block;
1671 margin: 0.2em 0;
1672
1673 span.title {
1674 display: block;
1675 float: left;
1676 width: 5em;
1677 }
1678
1679 span.input-text-wrap {
1680 display: block;
1681 margin-left: 5em;
1682 }
1683 }
1684
1685 .text {
1686 box-sizing: border-box;
1687 width: 99%;
1688 float: left;
1689 margin: 1px 1% 1px 1px;
1690 }
1691
1692 .length,
1693 .width,
1694 .height {
1695 width: 32.33%;
1696 }
1697
1698 .height {
1699 margin-right: 0;
1700 }
1701 }
1702
1703 #woocommerce-fields-bulk.inline-edit-col {
1704 label {
1705 clear: left;
1706 }
1707
1708 .inline-edit-group {
1709 label {
1710 clear: none;
1711 width: 49%;
1712 margin: 0.2em 0;
1713 }
1714
1715 &.dimensions label {
1716 width: 75%;
1717 max-width: 75%;
1718 }
1719 }
1720
1721 .regular_price,
1722 .sale_price,
1723 .weight,
1724 .stock,
1725 .length {
1726 box-sizing: border-box;
1727 width: 100%;
1728 margin-left: 4.4em;
1729 }
1730
1731 .length,
1732 .width,
1733 .height {
1734 box-sizing: border-box;
1735 width: 25%;
1736 }
1737 }
1738
1739 .column-coupon_code {
1740 line-height: 2.25em;
1741 }
1742
1743 ul.wc_coupon_list,
1744 .column-coupon_code {
1745 margin: 0;
1746 overflow: hidden;
1747 zoom: 1;
1748 clear: both;
1749 }
1750
1751 ul.wc_coupon_list {
1752 padding-bottom: 5px;
1753
1754 li {
1755 margin: 0;
1756
1757 &.code {
1758 display: inline-block;
1759 position: relative;
1760 padding: 0 0.5em;
1761 background-color: #fff;
1762 border: 1px solid #aaa;
1763 -webkit-box-shadow: 0 1px 0 #dfdfdf;
1764 box-shadow: 0 1px 0 #dfdfdf;
1765
1766 border-radius: 4px;
1767 margin-right: 5px;
1768 margin-top: 5px;
1769
1770 &.editable {
1771 padding-right: 2em;
1772 }
1773
1774 .tips {
1775 cursor: pointer;
1776
1777 span {
1778 color: #888;
1779
1780 &:hover {
1781 color: #000;
1782 }
1783 }
1784 }
1785
1786 .remove-coupon {
1787 text-decoration: none;
1788 color: #888;
1789 position: absolute;
1790 top: 7px;
1791 right: 20px;
1792
1793 /*rtl:raw:
1794 left: 7px;
1795 */
1796
1797 &::before {
1798 @include icon_dashicons("\f158");
1799 }
1800
1801 &:hover::before {
1802 color: $red;
1803 }
1804 }
1805 }
1806 }
1807 }
1808
1809 ul.wc_coupon_list_block {
1810 margin: 0;
1811 padding-bottom: 2px;
1812
1813 li {
1814 border-top: 1px solid #fff;
1815 border-bottom: 1px solid #ccc;
1816 line-height: 2.5em;
1817 margin: 0;
1818 padding: 0.5em 0;
1819 }
1820
1821 li:first-child {
1822 border-top: 0;
1823 padding-top: 0;
1824 }
1825
1826 li:last-child {
1827 border-bottom: 0;
1828 padding-bottom: 0;
1829 }
1830 }
1831
1832 .button.wc-reload {
1833 @include ir();
1834 padding: 0;
1835 height: 28px;
1836 width: 28px !important;
1837 display: inline-block;
1838
1839 &::after {
1840 @include icon_dashicons("\f345");
1841 line-height: 28px;
1842 }
1843 }
1844
1845 #woocommerce-order-data {
1846 .postbox-header,
1847 .hndle,
1848 .handlediv {
1849 display: none;
1850 }
1851
1852 .inside {
1853 display: block !important;
1854 }
1855 }
1856
1857 #order_data {
1858 padding: 23px 24px 12px;
1859
1860 h2 {
1861 margin: 0;
1862 font-family: "HelveticaNeue-Light", "Helvetica Neue Light",
1863 "Helvetica Neue", sans-serif;
1864 font-size: 21px;
1865 font-weight: normal;
1866 line-height: 1.2;
1867 text-shadow: 1px 1px 1px white;
1868 padding: 0;
1869 }
1870
1871 h3 {
1872 font-size: 14px;
1873 }
1874
1875 h3,
1876 h4 {
1877 color: #333;
1878 margin: 1.33em 0 0;
1879 }
1880
1881 p {
1882 color: #777;
1883 }
1884
1885 p.order_number {
1886 margin: 0;
1887 font-family: "HelveticaNeue-Light", "Helvetica Neue Light",
1888 "Helvetica Neue", sans-serif;
1889 font-weight: normal;
1890 line-height: 1.6em;
1891 font-size: 16px;
1892 }
1893
1894 .order_data_column_container {
1895 clear: both;
1896
1897 p._billing_email_field {
1898 margin-top: 13px;
1899 }
1900 }
1901
1902 .order_data_column {
1903 width: 32%;
1904 padding: 0 2% 0 0;
1905 float: left;
1906
1907 > h3 span {
1908 display: block;
1909 }
1910
1911 &:last-child {
1912 padding-right: 0;
1913 }
1914
1915 p {
1916 padding: 0 !important;
1917 }
1918
1919 .address strong {
1920 display: block;
1921 }
1922
1923 .form-field {
1924 float: left;
1925 clear: left;
1926 width: 48%;
1927 padding: 0;
1928 margin: 9px 0 0;
1929
1930 label {
1931 display: block;
1932 padding: 0 0 3px;
1933 }
1934
1935 input:not(.checkbox),
1936 textarea {
1937 width: 100%;
1938 }
1939
1940 select {
1941 width: 100%;
1942 max-width: 100%;
1943 }
1944
1945 .select2-container {
1946 width: 100% !important;
1947 }
1948
1949 small {
1950 display: block;
1951 margin: 5px 0 0;
1952 color: #999;
1953 }
1954 }
1955
1956 .form-field.last,
1957 ._billing_last_name_field,
1958 ._billing_address_2_field,
1959 ._billing_postcode_field,
1960 ._billing_state_field,
1961 ._billing_phone_field,
1962 ._shipping_last_name_field,
1963 ._shipping_address_2_field,
1964 ._shipping_postcode_field,
1965 ._shipping_state_field {
1966 float: right;
1967 clear: right;
1968 }
1969
1970 .form-field-wide,
1971 ._billing_company_field,
1972 ._shipping_company_field,
1973 ._transaction_id_field {
1974 width: 100%;
1975 clear: both;
1976
1977 input:not(.checkbox),
1978 textarea,
1979 select,
1980 .wc-enhanced-select,
1981 .wc-category-search,
1982 .wc-customer-search {
1983 width: 100%;
1984 }
1985 input.date-picker {
1986 width: 50%;
1987 }
1988 input.hour,
1989 input.minute {
1990 width: 3.5em;
1991 }
1992 }
1993
1994 p.none_set {
1995 color: #999;
1996 }
1997
1998 div.edit_address {
1999 display: none;
2000 zoom: 1;
2001 padding-right: 1px;
2002
2003 .select2-container {
2004 .select2-selection--single {
2005 height: 32px;
2006
2007 .select2-selection__rendered {
2008 line-height: 32px;
2009 }
2010 }
2011 }
2012 }
2013
2014 .wc-customer-user,
2015 .wc-order-status {
2016 label a {
2017 float: right;
2018 margin-left: 8px;
2019 }
2020 }
2021
2022 a.edit_address {
2023 width: 14px;
2024 height: 0;
2025 padding: 14px 0 0;
2026 margin: 0 0 0 6px;
2027 overflow: hidden;
2028 position: relative;
2029 color: #999;
2030 border: 0;
2031 float: right;
2032
2033 &:hover,
2034 &:focus {
2035 color: #000;
2036 }
2037
2038 &::after {
2039 font-family: "WooCommerce";
2040 position: absolute;
2041 top: 0;
2042 left: 0;
2043 text-align: center;
2044 vertical-align: top;
2045 line-height: 14px;
2046 font-size: 14px;
2047 font-weight: 400;
2048 }
2049 }
2050
2051 a.edit_address::after {
2052 font-family: "Dashicons";
2053 content: "\f464";
2054 }
2055
2056 .billing-same-as-shipping,
2057 .load_customer_shipping,
2058 .load_customer_billing {
2059 font-size: 13px;
2060 display: inline-block;
2061 font-weight: normal;
2062 }
2063
2064 .load_customer_shipping {
2065 margin-right: 0.3em;
2066 }
2067 }
2068 }
2069
2070 .order_actions {
2071 margin: 0;
2072 overflow: hidden;
2073 zoom: 1;
2074
2075 li {
2076 border-top: 1px solid #fff;
2077 border-bottom: 1px solid #ddd;
2078 padding: 6px 0;
2079 margin: 0;
2080 line-height: 1.6em;
2081 float: left;
2082 width: 50%;
2083 text-align: center;
2084
2085 a {
2086 float: none;
2087 text-align: center;
2088 text-decoration: underline;
2089 }
2090
2091 &.wide {
2092 width: auto;
2093 float: none;
2094 clear: both;
2095 padding: 6px;
2096 text-align: left;
2097 overflow: hidden;
2098 }
2099
2100 #delete-action {
2101 line-height: 25px;
2102 vertical-align: middle;
2103 text-align: left;
2104 float: left;
2105 }
2106
2107 .save_order {
2108 float: right;
2109 }
2110
2111 &#actions {
2112 overflow: hidden;
2113
2114 .button {
2115 width: 24px;
2116 box-sizing: border-box;
2117 float: right;
2118 }
2119
2120 select {
2121 width: 225px;
2122 box-sizing: border-box;
2123 float: left;
2124 }
2125 }
2126 }
2127 }
2128
2129 #woocommerce-order-items {
2130 .inside {
2131 margin: 0;
2132 padding: 0;
2133 background: #fefefe;
2134 }
2135
2136 .wc-order-data-row {
2137 border-bottom: 1px solid #dfdfdf;
2138 padding: 1.5em 2em;
2139 background: #f8f8f8;
2140
2141 @include clearfix();
2142 line-height: 2em;
2143 text-align: right;
2144
2145 p {
2146 margin: 0;
2147 line-height: 2em;
2148 }
2149
2150 .wc-used-coupons {
2151 text-align: left;
2152
2153 .tips {
2154 display: inline-block;
2155 }
2156 }
2157 }
2158
2159 .wc-used-coupons {
2160 float: left;
2161 width: 50%;
2162 }
2163
2164 .wc-order-totals {
2165 float: right;
2166 width: 50%;
2167 margin: 0;
2168 padding: 0;
2169 text-align: right;
2170
2171 .amount {
2172 font-weight: 700;
2173 }
2174
2175 .label {
2176 vertical-align: top;
2177 }
2178
2179 .total {
2180 font-size: 1em !important;
2181 width: 10em;
2182 margin: 0 0 0 0.5em;
2183 box-sizing: border-box;
2184
2185 input[type="text"]="text""] {
2186 width: 96%;
2187 float: right;
2188 }
2189 }
2190
2191 .refunded-total {
2192 color: $red;
2193 }
2194
2195 .label-highlight {
2196 font-weight: bold;
2197 }
2198 }
2199
2200 .refund-actions {
2201 margin-top: 5px;
2202 padding-top: 12px;
2203 border-top: 1px solid #dfdfdf;
2204
2205 .button {
2206 float: right;
2207 margin-left: 4px;
2208 }
2209
2210 .cancel-action {
2211 float: left;
2212 margin-left: 0;
2213 }
2214 }
2215
2216 .add_meta {
2217 margin-left: 0 !important;
2218 }
2219
2220 h3 small {
2221 color: #999;
2222 }
2223
2224 .amount {
2225 white-space: nowrap;
2226 }
2227
2228 .add-items {
2229 .description {
2230 margin-right: 10px;
2231 }
2232
2233 .button {
2234 float: left;
2235 margin-right: 0.25em;
2236 }
2237
2238 .button-primary {
2239 float: none;
2240 margin-right: 0;
2241 }
2242 }
2243 }
2244
2245 #woocommerce-order-items {
2246 .inside {
2247 display: block !important;
2248 }
2249
2250 .postbox-header,
2251 .hndle,
2252 .handlediv {
2253 display: none;
2254 }
2255
2256 .woocommerce_order_items_wrapper {
2257 margin: 0;
2258 overflow-x: auto;
2259
2260 table.woocommerce_order_items {
2261 width: 100%;
2262 background: #fff;
2263
2264 thead th {
2265 text-align: left;
2266 padding: 1em;
2267 font-weight: normal;
2268 color: #999;
2269 background: #f8f8f8;
2270 -webkit-touch-callout: none;
2271 -webkit-user-select: none;
2272 -khtml-user-select: none;
2273 -moz-user-select: none;
2274 -ms-user-select: none;
2275 user-select: none;
2276
2277 &.sortable {
2278 cursor: pointer;
2279 }
2280
2281 &:last-child {
2282 padding-right: 2em;
2283 }
2284
2285 &:first-child {
2286 padding-left: 2em;
2287 }
2288
2289 .wc-arrow {
2290 float: right;
2291 position: relative;
2292 margin-right: -1em;
2293 }
2294 }
2295
2296 tbody th,
2297 td {
2298 padding: 1.5em 1em 1em;
2299 text-align: left;
2300 line-height: 1.5em;
2301 vertical-align: top;
2302 border-bottom: 1px solid #f8f8f8;
2303
2304 textarea {
2305 width: 100%;
2306 }
2307
2308 select {
2309 width: 50%;
2310 }
2311
2312 input,
2313 textarea {
2314 font-size: 14px;
2315 padding: 4px;
2316 color: #555;
2317 }
2318
2319 &:last-child {
2320 padding-right: 2em;
2321 }
2322
2323 &:first-child {
2324 padding-left: 2em;
2325 }
2326 }
2327
2328 tbody tr:last-child td {
2329 border-bottom: 1px solid #dfdfdf;
2330 }
2331
2332 tbody tr:first-child td {
2333 border-top: 8px solid #f8f8f8;
2334 }
2335
2336 tbody#order_line_items tr:first-child td {
2337 border-top: none;
2338 }
2339
2340 td.thumb {
2341 text-align: left;
2342 width: 38px;
2343 padding-bottom: 1.5em;
2344
2345 .wc-order-item-thumbnail {
2346 width: 38px;
2347 height: 38px;
2348 border: 2px solid #e8e8e8;
2349 background: #f8f8f8;
2350 color: #ccc;
2351 position: relative;
2352 font-size: 21px;
2353 display: block;
2354 text-align: center;
2355
2356 &:empty::before {
2357 @include icon_dashicons("\f128");
2358 width: 38px;
2359 line-height: 38px;
2360 display: block;
2361 }
2362
2363 img {
2364 width: 100%;
2365 height: 100%;
2366 margin: 0;
2367 padding: 0;
2368 position: relative;
2369 }
2370 }
2371 }
2372
2373 td.name {
2374 .wc-order-item-sku,
2375 .wc-order-item-variation {
2376 display: block;
2377 margin-top: 0.5em;
2378 font-size: 0.92em !important;
2379 color: #888;
2380 }
2381 }
2382
2383 .item {
2384 min-width: 200px;
2385 }
2386
2387 .center,
2388 .variation-id {
2389 text-align: center;
2390 }
2391
2392 .cost,
2393 .tax,
2394 .quantity,
2395 .line_cost,
2396 .line_tax,
2397 .tax_class,
2398 .item_cost {
2399 text-align: right;
2400
2401 label {
2402 white-space: nowrap;
2403 color: #999;
2404 font-size: 0.833em;
2405
2406 input {
2407 display: inline;
2408 }
2409 }
2410
2411 input {
2412 width: 70px;
2413 vertical-align: middle;
2414 text-align: right;
2415 }
2416
2417 select {
2418 width: 85px;
2419 height: 26px;
2420 vertical-align: middle;
2421 font-size: 1em;
2422 }
2423
2424 .split-input {
2425 display: inline-block;
2426 background: #fff;
2427 border: 1px solid #ddd;
2428 box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.07);
2429 margin: 1px 0;
2430 min-width: 80px;
2431 overflow: hidden;
2432 line-height: 1em;
2433 text-align: right;
2434
2435 div.input {
2436 width: 100%;
2437 box-sizing: border-box;
2438
2439 label {
2440 font-size: 0.75em;
2441 padding: 4px 6px 0;
2442 color: #555;
2443 display: block;
2444 }
2445
2446 input {
2447 width: 100%;
2448 box-sizing: border-box;
2449 border: 0;
2450 box-shadow: none;
2451 margin: 0;
2452 padding: 0 6px 4px;
2453 color: #555;
2454 background: transparent;
2455
2456 &::-webkit-input-placeholder {
2457 color: #ddd;
2458 }
2459 }
2460 }
2461
2462 div.input:first-child {
2463 border-bottom: 1px dashed #ddd;
2464 background: #fff;
2465
2466 label {
2467 color: #ccc;
2468 }
2469
2470 input {
2471 color: #ccc;
2472 }
2473 }
2474 }
2475
2476 .view {
2477 white-space: nowrap;
2478 }
2479
2480 .edit {
2481 text-align: left;
2482 }
2483
2484 small.times,
2485 del,
2486 .wc-order-item-taxes,
2487 .wc-order-item-discount,
2488 .wc-order-item-refund-fields {
2489 font-size: 0.92em !important;
2490 color: #888;
2491 }
2492
2493 .wc-order-item-taxes,
2494 .wc-order-item-refund-fields {
2495 margin: 0;
2496
2497 label {
2498 display: block;
2499 }
2500 }
2501
2502 .wc-order-item-discount {
2503 display: block;
2504 margin-top: 0.5em;
2505 }
2506
2507 small.times {
2508 margin-right: 0.25em;
2509 }
2510 }
2511
2512 .quantity {
2513 text-align: center;
2514
2515 input {
2516 text-align: center;
2517 width: 50px;
2518 }
2519 }
2520
2521 span.subtotal {
2522 opacity: 0.5;
2523 }
2524
2525 td.tax_class,
2526 th.tax_class {
2527 text-align: left;
2528 }
2529
2530 .calculated {
2531 border-color: #ae8ca2;
2532 border-style: dotted;
2533 }
2534
2535 table.meta {
2536 width: 100%;
2537 }
2538
2539 table.meta,
2540 table.display_meta {
2541 margin: 0.5em 0 0;
2542 font-size: 0.92em !important;
2543 color: #888;
2544
2545 tr {
2546 th {
2547 border: 0;
2548 padding: 0 4px 0.5em 0;
2549 line-height: 1.5em;
2550 width: 20%;
2551 }
2552
2553 td {
2554 padding: 0 4px 0.5em 0;
2555 border: 0;
2556 line-height: 1.5em;
2557
2558 input {
2559 width: 100%;
2560 margin: 0;
2561 position: relative;
2562 border-bottom: 0;
2563 box-shadow: none;
2564 }
2565
2566 textarea {
2567 width: 100%;
2568 height: 4em;
2569 margin: 0;
2570 box-shadow: none;
2571 }
2572
2573 input:focus + textarea {
2574 border-top-color: #999;
2575 }
2576
2577 p {
2578 margin: 0 0 0.5em;
2579 line-height: 1.5em;
2580 }
2581
2582 p:last-child {
2583 margin: 0;
2584 }
2585 }
2586 }
2587 }
2588
2589 .refund_by {
2590 border-bottom: 1px dotted #999;
2591 }
2592
2593 tr.fee .thumb div {
2594 @include ir();
2595 font-size: 1.5em;
2596 line-height: 1em;
2597 vertical-align: middle;
2598 margin: 0 auto;
2599
2600 &::before {
2601 @include icon("\e007");
2602 color: #ccc;
2603 }
2604 }
2605
2606 tr.refund .thumb div {
2607 @include ir();
2608 font-size: 1.5em;
2609 line-height: 1em;
2610 vertical-align: middle;
2611 margin: 0 auto;
2612
2613 &::before {
2614 @include icon("\e014");
2615 color: #ccc;
2616 }
2617 }
2618
2619 tr.shipping {
2620 .thumb div {
2621 @include ir();
2622 font-size: 1.5em;
2623 line-height: 1em;
2624 vertical-align: middle;
2625 margin: 0 auto;
2626
2627 &::before {
2628 @include icon("\e01a");
2629 color: #ccc;
2630 }
2631 }
2632
2633 .shipping_method_name,
2634 .shipping_method {
2635 width: 100%;
2636 margin: 0 0 0.5em;
2637 }
2638 }
2639
2640 th.line_tax {
2641 white-space: nowrap;
2642 }
2643
2644 th.line_tax,
2645 td.line_tax {
2646 .delete-order-tax {
2647 @include ir();
2648 float: right;
2649 font-size: 14px;
2650 visibility: hidden;
2651 margin: 3px -18px 0 0;
2652
2653 &::before {
2654 @include icon_dashicons("\f153");
2655 color: #999;
2656 }
2657
2658 &:hover::before {
2659 color: $red;
2660 }
2661 }
2662
2663 &:hover .delete-order-tax {
2664 visibility: visible;
2665 }
2666 }
2667
2668 small.refunded {
2669 display: block;
2670 color: $red;
2671 white-space: nowrap;
2672 margin-top: 0.5em;
2673
2674 &::before {
2675 @include icon_dashicons("\f171");
2676 position: relative;
2677 top: auto;
2678 left: auto;
2679 margin: -1px 4px 0 0;
2680 vertical-align: middle;
2681 line-height: 1em;
2682 }
2683 }
2684 }
2685 }
2686
2687 .wc-order-edit-line-item {
2688 padding-left: 0;
2689 }
2690
2691 .wc-order-edit-line-item-actions {
2692 width: 44px;
2693 text-align: right;
2694 padding-left: 0;
2695 vertical-align: middle;
2696
2697 a {
2698 color: #ccc;
2699 display: inline-block;
2700 cursor: pointer;
2701 padding: 0;
2702 margin: 0 0 6px 12px;
2703 vertical-align: middle;
2704 text-decoration: none;
2705 line-height: 16px;
2706 width: 16px;
2707 height: 16px;
2708 overflow: hidden;
2709
2710 &::before {
2711 margin: 0;
2712 padding: 0;
2713 font-size: 16px;
2714 width: 16px;
2715 height: 16px;
2716 }
2717
2718 &:hover {
2719 &::before {
2720 color: #999;
2721 }
2722 }
2723
2724 &:first-child {
2725 margin-left: 0;
2726 }
2727 }
2728
2729 .edit-order-item::before {
2730 @include icon_dashicons("\f464");
2731 position: relative;
2732 }
2733
2734 .delete-order-item,
2735 .delete_refund {
2736 &::before {
2737 @include icon_dashicons("\f158");
2738 position: relative;
2739 }
2740
2741 &:hover::before {
2742 color: $red;
2743 }
2744 }
2745 }
2746
2747 tbody tr .wc-order-edit-line-item-actions {
2748 opacity: 0;
2749 }
2750
2751 tbody tr:focus-within,
2752 tbody tr:hover {
2753 .wc-order-edit-line-item-actions {
2754 opacity: 1;
2755 }
2756 }
2757
2758 .wc-order-totals .wc-order-edit-line-item-actions {
2759 width: 1.5em;
2760 visibility: visible !important;
2761
2762 a {
2763 padding: 0;
2764 }
2765 }
2766 }
2767
2768 #woocommerce-order-downloads {
2769 .buttons {
2770 float: left;
2771 padding: 0;
2772 margin: 0;
2773 vertical-align: top;
2774
2775 .add_item_id,
2776 .select2-container {
2777 width: 400px !important;
2778 margin-right: 9px;
2779 vertical-align: top;
2780 float: left;
2781 }
2782
2783 button {
2784 margin: 2px 0 0;
2785 }
2786 }
2787
2788 h3 small {
2789 color: #999;
2790 }
2791 }
2792
2793 #order_custom #postcustomstuff {
2794 .add-custom-field {
2795 padding: 12px 8px 8px;
2796 }
2797
2798 .submit {
2799 border: 0 none;
2800 float: none;
2801 }
2802 }
2803
2804 #side-sortables #woocommerce-order-downloads {
2805 .buttons,
2806 .select2-container {
2807 max-width: 100%;
2808 }
2809 }
2810
2811 #poststuff #woocommerce-order-actions .inside {
2812 margin: 0;
2813 padding: 0;
2814
2815 ul.order_actions li {
2816 padding: 6px 10px;
2817 box-sizing: border-box;
2818
2819 &:last-child {
2820 border-bottom: 0;
2821 }
2822 }
2823
2824 button {
2825 margin: 1px;
2826 }
2827 }
2828
2829 #poststuff #woocommerce-order-notes .inside {
2830 margin: 0;
2831 padding: 0;
2832
2833 ul.order_notes li {
2834 padding: 0 10px;
2835 }
2836
2837 button {
2838 margin: 1px;
2839 vertical-align: top;
2840 }
2841 }
2842
2843 #woocommerce_customers {
2844 p.search-box {
2845 margin: 6px 0 4px;
2846 float: left;
2847 }
2848
2849 .tablenav {
2850 float: right;
2851 clear: none;
2852 }
2853 }
2854
2855 .widefat {
2856 &.customers td {
2857 vertical-align: middle;
2858 padding: 4px 7px;
2859 }
2860
2861 .column-order_title {
2862 width: 15%;
2863
2864 time {
2865 display: block;
2866 color: #999;
2867 margin: 3px 0;
2868 }
2869 }
2870
2871 .column-orders,
2872 .column-paying,
2873 .column-spent {
2874 text-align: center;
2875 width: 8%;
2876 }
2877
2878 .column-last_order {
2879 width: 11%;
2880 }
2881
2882 .column-wc_actions {
2883 width: 110px;
2884
2885 a.button {
2886 @include ir();
2887 display: inline-block;
2888 margin: 2px 4px 2px 0;
2889 padding: 0 !important;
2890 height: 2em !important;
2891 width: 2em;
2892 overflow: hidden;
2893 vertical-align: middle;
2894
2895 &::after {
2896 font-family: "Dashicons";
2897 speak: never;
2898 font-weight: normal;
2899 font-variant: normal;
2900 text-transform: none;
2901 margin: 0;
2902 text-indent: 0;
2903 position: absolute;
2904 top: 0;
2905 left: 0;
2906 width: 100%;
2907 height: 100%;
2908 text-align: center;
2909 line-height: 1.85;
2910 }
2911
2912 img {
2913 display: block;
2914 width: 12px;
2915 height: auto;
2916 }
2917 }
2918
2919 a.edit::after {
2920 content: "\f464";
2921 }
2922
2923 a.link::after {
2924 font-family: "WooCommerce";
2925 content: "\e00d";
2926 }
2927
2928 a.view::after {
2929 content: "\f177";
2930 }
2931
2932 a.refresh::after {
2933 font-family: "WooCommerce";
2934 content: "\e031";
2935 }
2936
2937 a.processing::after {
2938 font-family: "WooCommerce";
2939 content: "\e00f";
2940 }
2941
2942 a.complete::after {
2943 content: "\f147";
2944 }
2945 }
2946
2947 small.meta {
2948 display: block;
2949 color: #999;
2950 font-size: inherit;
2951 margin: 3px 0;
2952 }
2953 }
2954
2955 .wc-wp-version-gte-53 {
2956 .widefat {
2957 .column-wc_actions {
2958 a.button {
2959 &::after {
2960 margin-top: 2px;
2961 }
2962 }
2963 }
2964 }
2965 }
2966
2967 .woocommerce_page_wc-orders,
2968 .post-type-shop_order {
2969 .tablenav .one-page .displaying-num {
2970 display: none;
2971 }
2972
2973 select#order-search-filter {
2974 margin: 0 4px 0 0;
2975 float: left;
2976 }
2977
2978 .tablenav {
2979 .select2-selection--single {
2980 height: 32px;
2981
2982 .select2-selection__rendered {
2983 line-height: 29px;
2984 }
2985
2986 .select2-selection__arrow {
2987 height: 30px;
2988 }
2989 }
2990
2991 #order-query-submit {
2992 margin: 0 8px 0 0;
2993 }
2994 }
2995
2996 .wp-list-table {
2997 margin-top: 1em;
2998
2999 thead,
3000 tfoot {
3001 th {
3002 padding: 0.75em 1em;
3003 }
3004
3005 th.sortable a,
3006 th.sorted a {
3007 padding: 0;
3008 }
3009
3010 th:first-child {
3011 padding-left: 2em;
3012 }
3013
3014 th:last-child {
3015 padding-right: 2em;
3016 }
3017 }
3018
3019 tbody {
3020 td,
3021 th {
3022 padding: 1em;
3023 line-height: 26px;
3024 }
3025
3026 td:first-child {
3027 padding-left: 2em;
3028 }
3029
3030 td:last-child {
3031 padding-right: 2em;
3032 }
3033 }
3034
3035 tbody tr {
3036 border-top: 1px solid #f5f5f5;
3037 }
3038
3039 tbody tr:hover:not(.status-trash):not(.no-link) td {
3040 cursor: pointer;
3041 }
3042
3043 .no-link {
3044 cursor: default !important;
3045 }
3046
3047 // Columns.
3048 td,
3049 th {
3050 width: 12ch;
3051 vertical-align: middle;
3052
3053 p {
3054 margin: 0;
3055 }
3056 }
3057
3058 .check-column {
3059 width: 1px;
3060 white-space: nowrap;
3061 padding: 1em 1em 1em 1em !important;
3062 vertical-align: middle;
3063
3064 .locked-indicator {
3065 margin-left: 0;
3066 }
3067
3068 input {
3069 vertical-align: text-top;
3070 margin: 1px 0;
3071 }
3072 }
3073
3074 .column-order_number {
3075 width: 20ch;
3076
3077 .small-screen-only {
3078 display: none;
3079 }
3080 }
3081
3082 .column-order_total {
3083 width: 8ch;
3084 text-align: right;
3085
3086 a span {
3087 float: right;
3088 }
3089 }
3090
3091 .column-order_date,
3092 .column-order_status {
3093 width: 10ch;
3094 }
3095
3096 .column-order_status {
3097 width: 14ch;
3098 }
3099
3100 .column-shipping_address,
3101 .column-billing_address {
3102 width: 20ch;
3103 line-height: 1.5em;
3104
3105 .description {
3106 display: block;
3107 color: #999;
3108 }
3109 }
3110
3111 .column-wc_actions {
3112 text-align: right;
3113
3114 a.button {
3115 text-indent: 9999px;
3116 margin: 2px 0 2px 4px;
3117 }
3118 }
3119
3120 .order-preview {
3121 float: right;
3122 width: 16px;
3123 padding: 20px 4px 4px 4px;
3124 height: 0;
3125 overflow: hidden;
3126 position: relative;
3127 border: 2px solid transparent;
3128 border-radius: 4px;
3129
3130 &::before {
3131 @include icon("\e010");
3132 line-height: 16px;
3133 font-size: 14px;
3134 vertical-align: middle;
3135 top: 4px;
3136 }
3137
3138 &:hover {
3139 border: 2px solid var(--wp-admin-theme-color, #00a0d2);
3140 }
3141 }
3142
3143 .wp-locked .order-preview {
3144 visibility: hidden;
3145 }
3146
3147 .order-preview.disabled {
3148 &::before {
3149 content: "";
3150 background: url("../images/wpspin-2x.gif") no-repeat center top;
3151 background-size: 71%;
3152 }
3153 }
3154 }
3155 }
3156
3157 .woocommerce_page_wc-orders .wp-list-table .locked-indicator-icon {
3158 margin-left: -2px;
3159
3160 &:before {
3161 vertical-align: top;
3162 }
3163 }
3164
3165 .order-status {
3166 display: inline-flex;
3167 line-height: 2.5em;
3168 color: #454545;
3169 background: #e5e5e5;
3170 border-radius: 4px;
3171 border-bottom: 1px solid rgba(0, 0, 0, 0.05);
3172 margin: -0.25em 0;
3173 cursor: inherit !important;
3174 white-space: nowrap;
3175 max-width: 100%;
3176
3177 &.status-completed {
3178 background: #c8d7e1;
3179 color: #003d66;
3180 }
3181
3182 &.status-on-hold {
3183 background: #f8dda7;
3184 color: #573B00;
3185 }
3186
3187 &.status-failed {
3188 background: #eba3a3;
3189 color: #570000;
3190 }
3191
3192 &.status-processing {
3193 background: #c6e1c6;
3194 color: #2c4700;
3195 }
3196
3197 &.status-trash {
3198 background: #eba3a3;
3199 color: #550202;
3200 }
3201
3202 > span {
3203 margin: 0 1em;
3204 overflow: hidden;
3205 text-overflow: ellipsis;
3206 }
3207 }
3208
3209 .wc-order-preview {
3210 .order-status {
3211 float: right;
3212 margin-right: 54px;
3213 }
3214
3215 article {
3216 padding: 0 !important;
3217 }
3218
3219 .modal-close {
3220 border-radius: 0;
3221 }
3222
3223 .wc-order-preview-table {
3224 width: 100%;
3225 margin: 0;
3226
3227 th,
3228 td {
3229 padding: 1em 1.5em;
3230 text-align: left;
3231 border: 0;
3232 border-bottom: 1px solid #eee;
3233 margin: 0;
3234 background: transparent;
3235 box-shadow: none;
3236 text-align: right;
3237 vertical-align: top;
3238 }
3239
3240 td:first-child,
3241 th:first-child {
3242 text-align: left;
3243 }
3244
3245 th {
3246 border-color: #ccc;
3247 }
3248
3249 tr:last-child td {
3250 border: 0;
3251 }
3252
3253 .wc-order-item-sku {
3254 margin-top: 0.5em;
3255 }
3256
3257 .wc-order-item-meta {
3258 margin-top: 0.5em;
3259
3260 th,
3261 td {
3262 padding: 0;
3263 border: 0;
3264 text-align: left;
3265 vertical-align: top;
3266 }
3267
3268 td:last-child {
3269 padding-left: 0.5em;
3270 }
3271 }
3272 }
3273
3274 .wc-order-preview-addresses {
3275 overflow: hidden;
3276 padding-bottom: 1.5em;
3277
3278 .wc-order-preview-address,
3279 .wc-order-preview-note {
3280 width: 50%;
3281 float: left;
3282 padding: 1.5em 1.5em 0;
3283 box-sizing: border-box;
3284 word-wrap: break-word;
3285
3286 h2 {
3287 margin-top: 0;
3288 }
3289
3290 strong {
3291 display: block;
3292 margin-top: 1.5em;
3293 }
3294
3295 strong:first-child {
3296 margin-top: 0;
3297 }
3298 }
3299 }
3300
3301 footer {
3302 .wc-action-button-group {
3303 display: inline-block;
3304 float: left;
3305 }
3306
3307 .button.button-large {
3308 margin-left: 10px;
3309 padding: 0 10px !important;
3310 line-height: 28px;
3311 height: auto;
3312 display: inline-block;
3313 }
3314 }
3315
3316 .wc-action-button-group label {
3317 display: none;
3318 }
3319 }
3320
3321 .wc-action-button-group {
3322 vertical-align: middle;
3323 line-height: 26px;
3324 text-align: left;
3325
3326 label {
3327 margin-right: 6px;
3328 cursor: default;
3329 font-weight: bold;
3330 line-height: 28px;
3331 }
3332
3333 .wc-action-button-group__items {
3334 display: inline-flex;
3335 flex-flow: row wrap;
3336 align-content: flex-start;
3337 justify-content: flex-start;
3338 }
3339
3340 .wc-action-button {
3341 margin: 0 0 0 -1px !important;
3342 border: 1px solid #ccc;
3343 padding: 0 10px !important;
3344 border-radius: 0 !important;
3345 float: none;
3346 line-height: 28px;
3347 height: auto;
3348 z-index: 1;
3349 position: relative;
3350 overflow: hidden;
3351 text-overflow: ellipsis;
3352 flex: 1 0 auto;
3353 box-sizing: border-box;
3354 text-align: center;
3355 white-space: nowrap;
3356 }
3357
3358 .wc-action-button:hover,
3359 .wc-action-button:focus {
3360 border: 1px solid #999;
3361 z-index: 2;
3362 }
3363
3364 .wc-action-button:first-child {
3365 margin-left: 0 !important;
3366 border-top-left-radius: 3px !important;
3367 border-bottom-left-radius: 3px !important;
3368 }
3369
3370 .wc-action-button:last-child {
3371 border-top-right-radius: 3px !important;
3372 border-bottom-right-radius: 3px !important;
3373 }
3374 }
3375
3376 @media screen and (max-width: 782px) {
3377 .woocommerce_page_wc-orders #order-search-filter {
3378 display: none;
3379 }
3380
3381 .wc-order-preview footer {
3382 .wc-action-button-group .wc-action-button-group__items {
3383 display: flex;
3384 }
3385
3386 .wc-action-button-group {
3387 float: none;
3388 display: block;
3389 margin-bottom: 4px;
3390 }
3391
3392 .button.button-large {
3393 width: 100%;
3394 float: none;
3395 text-align: center;
3396 margin: 0;
3397 display: block;
3398 }
3399 }
3400
3401 .woocommerce_page_wc-orders .wc-orders-list-table.wp-list-table,
3402 .post-type-shop_order .wp-list-table {
3403 .check-column {
3404 width: 1em;
3405 vertical-align: top;
3406 }
3407
3408 thead th.column-order_number {
3409 width: 100%;
3410 }
3411
3412 td.column-order_number {
3413 .toggle-row {
3414 height: 20px;
3415 }
3416
3417 .order-preview {
3418 margin-top: 13px;
3419 }
3420 }
3421
3422 td.column-order_total,
3423 td.column-wc_actions {
3424 text-align: left;
3425 }
3426
3427 td.column-wc_actions {
3428 min-height: 2.0em !important;
3429 }
3430
3431 tr:not(.is-expanded) {
3432 td.column-order_number {
3433 vertical-align: top;
3434
3435 a.order-view {
3436 display: inline-block;
3437 vertical-align: top;
3438 width: calc( 50% - 40px - 4px );
3439 margin-right: 4px;
3440 }
3441
3442 .small-screen-only {
3443 display: inline-block;
3444 vertical-align: top;
3445
3446 &.order_date {
3447 width: calc( 20% - 4px );
3448 margin-right: 4px;
3449 }
3450
3451 &.order_status {
3452 width: 30%;
3453 text-align: right;
3454 }
3455 }
3456
3457 @media screen and (max-width: 400px) {
3458 a.order-view {
3459 display: block;
3460 width: calc( 100% - 40px );
3461 }
3462
3463 .small-screen-only {
3464 &.order_date {
3465 width: calc( 40% - 4px );
3466 }
3467
3468 &.order_status {
3469 width: calc( 60% - 40px);
3470 }
3471 }
3472 }
3473 }
3474 }
3475
3476 }
3477 }
3478
3479 .column-customer_message .note-on {
3480 @include ir();
3481 margin: 0 auto;
3482 color: #999;
3483
3484 &::after {
3485 @include icon("\e026");
3486 line-height: 16px;
3487 }
3488 }
3489
3490 .column-order_notes .note-on {
3491 @include ir();
3492 margin: 0 auto;
3493 color: #999;
3494
3495 &::after {
3496 @include icon("\e027");
3497 line-height: 16px;
3498 }
3499 }
3500
3501 .attributes-table {
3502 td,
3503 th {
3504 width: 15%;
3505 vertical-align: top;
3506 }
3507
3508 .attribute-terms {
3509 width: 32%;
3510 }
3511
3512 .attribute-actions {
3513 width: 2em;
3514
3515 .configure-terms {
3516 @include ir();
3517 padding: 0 !important;
3518 height: 2em !important;
3519 width: 2em;
3520
3521 &::after {
3522 @include icon("\f111");
3523 font-family: "Dashicons";
3524 line-height: 1.85;
3525 }
3526 }
3527 }
3528 }
3529
3530 /* Order notes */
3531 ul.order_notes {
3532 padding: 2px 0 0;
3533
3534 li {
3535 .note_content {
3536 padding: 10px;
3537 background: #efefef;
3538 position: relative;
3539
3540 p {
3541 margin: 0;
3542 padding: 0;
3543 word-wrap: break-word;
3544 }
3545 }
3546
3547 p.meta {
3548 padding: 10px;
3549 color: #999;
3550 margin: 0;
3551 font-size: 11px;
3552
3553 .exact-date {
3554 border-bottom: 1px dotted #999;
3555 }
3556 }
3557
3558 a.delete_note {
3559 color: $red;
3560 }
3561
3562 .note_content::after {
3563 content: "";
3564 display: block;
3565 position: absolute;
3566 bottom: -10px;
3567 left: 20px;
3568 width: 0;
3569 height: 0;
3570 border-width: 10px 10px 0 0;
3571 border-style: solid;
3572 border-color: #efefef transparent;
3573 }
3574 }
3575
3576 li.system-note {
3577 .note_content {
3578 background: #d7cad2;
3579 }
3580
3581 .note_content::after {
3582 border-color: #d7cad2 transparent;
3583 }
3584 }
3585
3586 li.customer-note {
3587 .note_content {
3588 background: #a7cedc;
3589 }
3590
3591 .note_content::after {
3592 border-color: #a7cedc transparent;
3593 }
3594 }
3595 }
3596
3597 .add_note {
3598 border-top: 1px solid #ddd;
3599 padding: 10px 10px 0;
3600
3601 h4 {
3602 margin-top: 5px !important;
3603 }
3604
3605 #add_order_note {
3606 width: 100%;
3607 height: 50px;
3608 }
3609 }
3610
3611 table.wp-list-table {
3612 .column-thumb {
3613 width: 52px;
3614 text-align: center;
3615 white-space: nowrap;
3616 }
3617
3618 .column-handle {
3619 width: 17px;
3620 display: none;
3621 }
3622
3623 tbody {
3624 td.column-handle {
3625 cursor: move;
3626 width: 17px;
3627 text-align: center;
3628 vertical-align: text-top;
3629
3630 &::before {
3631 content: "\f333";
3632 font-family: "Dashicons";
3633 text-align: center;
3634 line-height: 1;
3635 color: #999;
3636 display: block;
3637 width: 17px;
3638 height: 100%;
3639 margin: 4px 0 0 0;
3640 }
3641 }
3642 }
3643
3644 .column-name {
3645 width: 22%;
3646 }
3647
3648 .column-product_cat,
3649 .column-product_tag {
3650 width: 11% !important;
3651 }
3652
3653 .column-featured,
3654 .column-product_type {
3655 width: 48px;
3656 text-align: left !important;
3657 }
3658
3659 .column-customer_message,
3660 .column-order_notes {
3661 width: 48px;
3662 text-align: center;
3663
3664 img {
3665 margin: 0 auto;
3666 padding-top: 0 !important;
3667 }
3668 }
3669
3670 .manage-column.column-featured img,
3671 .manage-column.column-product_type img {
3672 padding-left: 2px;
3673 }
3674
3675 .column-price .woocommerce-price-suffix {
3676 display: none;
3677 }
3678
3679 .row-actions {
3680 color: #999;
3681 }
3682
3683 .row-actions span.id {
3684 padding-top: 8px;
3685 }
3686
3687 td.column-thumb img {
3688 margin: 0;
3689 width: auto;
3690 height: auto;
3691 max-width: 40px;
3692 max-height: 40px;
3693 vertical-align: middle;
3694 }
3695
3696 span.na {
3697 color: #999;
3698 }
3699
3700 .column-sku {
3701 width: 10%;
3702 }
3703
3704 .column-price {
3705 width: 10ch;
3706 }
3707
3708 .column-is_in_stock {
3709 text-align: left !important;
3710 width: 12ch;
3711 }
3712
3713 span.wc-image,
3714 span.wc-featured {
3715 @include ir();
3716 margin: 0 auto;
3717
3718 &::before {
3719 @include icon_dashicons("\f128");
3720 }
3721 }
3722
3723 span.wc-featured {
3724 &::before {
3725 content: "\f155";
3726 }
3727
3728 &.not-featured::before {
3729 content: "\f154";
3730 }
3731 }
3732
3733 td.column-featured span.wc-featured {
3734 font-size: 1.6em;
3735 cursor: pointer;
3736 }
3737
3738 mark {
3739 &.instock,
3740 &.outofstock,
3741 &.onbackorder {
3742 font-weight: 700;
3743 background: transparent none;
3744 line-height: 1;
3745 }
3746
3747 &.instock {
3748 color: $green;
3749 }
3750
3751 &.outofstock {
3752 color: #a44;
3753 }
3754
3755 &.onbackorder {
3756 color: #eaa600;
3757 }
3758 }
3759
3760 .order-notes_head,
3761 .notes_head,
3762 .status_head {
3763 @include ir();
3764 margin: 0 auto;
3765
3766 &::after {
3767 @include icon;
3768 }
3769 }
3770
3771 .order-notes_head::after {
3772 content: "\e028";
3773 }
3774
3775 .notes_head::after {
3776 content: "\e026";
3777 }
3778
3779 .status_head::after {
3780 content: "\e011";
3781 }
3782
3783 .column-order_items {
3784 width: 12%;
3785
3786 table.order_items {
3787 width: 100%;
3788 margin: 3px 0 0;
3789 padding: 0;
3790 display: none;
3791
3792 td {
3793 border: 0;
3794 margin: 0;
3795 padding: 0 0 3px;
3796 }
3797
3798 td.qty {
3799 color: #999;
3800 padding-right: 6px;
3801 text-align: left;
3802 }
3803 }
3804 }
3805 }
3806
3807 mark.notice {
3808 background: #fff;
3809 color: $red;
3810 margin: 0 0 0 10px;
3811 }
3812
3813 a.export_rates,
3814 a.import_rates {
3815 float: right;
3816 margin-left: 9px;
3817 margin-top: -2px;
3818 margin-bottom: 0;
3819 }
3820
3821 #rates-search {
3822 float: right;
3823
3824 input.wc-tax-rates-search-field {
3825 padding: 4px 8px;
3826 font-size: 1.2em;
3827 }
3828 }
3829
3830 #rates-pagination {
3831 float: right;
3832 margin-right: 0.5em;
3833
3834 .tablenav {
3835 margin: 0;
3836 }
3837 }
3838
3839 .wc_input_table_wrapper {
3840 overflow-x: auto;
3841 display: block;
3842 }
3843
3844 table.wc_tax_rates,
3845 table.wc_input_table {
3846 width: 100%;
3847
3848 th,
3849 td {
3850 display: table-cell !important;
3851 }
3852
3853 span.tips {
3854 color: $blue;
3855 }
3856
3857 th {
3858 white-space: nowrap;
3859 padding: 10px;
3860 }
3861
3862 td {
3863 padding: 0;
3864 border-right: 1px solid #dfdfdf;
3865 border-bottom: 1px solid #dfdfdf;
3866 border-top: 0;
3867 background: #fff;
3868 cursor: default;
3869
3870 input[type="text"]="text""],
3871 input[type="number"]="number""] {
3872 width: 100% !important;
3873 min-width: 100px;
3874 padding: 8px 10px;
3875 margin: 0;
3876 border: 0;
3877 outline: 0;
3878 background: transparent none;
3879
3880 &:focus {
3881 outline: 0;
3882 box-shadow: none;
3883 }
3884 }
3885
3886 &.compound,
3887 &.apply_to_shipping {
3888 padding: 5px 7px;
3889 vertical-align: middle;
3890
3891 input {
3892 padding: 0;
3893 }
3894 }
3895 }
3896
3897 td:last-child {
3898 border-right: 0;
3899 }
3900
3901 tr.current td {
3902 background-color: #fefbcc;
3903 }
3904
3905 .item_cost,
3906 .cost {
3907 text-align: right;
3908
3909 input {
3910 text-align: right;
3911 }
3912 }
3913
3914 th.sort {
3915 width: 17px;
3916 padding: 0 4px;
3917 }
3918
3919 td.sort {
3920 padding: 0 4px;
3921 }
3922
3923 .ui-sortable:not(.ui-sortable-disabled) td.sort {
3924 cursor: move;
3925 font-size: 15px;
3926 background: #f9f9f9;
3927 text-align: center;
3928 vertical-align: middle;
3929
3930 &::before {
3931 content: "\f333";
3932 font-family: "Dashicons";
3933 text-align: center;
3934 line-height: 1;
3935 color: #999;
3936 display: block;
3937 width: 17px;
3938 float: left;
3939 height: 100%;
3940 }
3941
3942 &:hover::before {
3943 color: #333;
3944 }
3945 }
3946
3947 .button {
3948 float: left;
3949 margin-right: 5px;
3950 }
3951
3952 .export,
3953 .import {
3954 float: right;
3955 margin-right: 0;
3956 margin-left: 5px;
3957 }
3958
3959 span.tips {
3960 padding: 0 3px;
3961 }
3962
3963 .pagination {
3964 float: right;
3965
3966 .button {
3967 margin-left: 5px;
3968 margin-right: 0;
3969 }
3970
3971 .current {
3972 background: #bbb;
3973 text-shadow: none;
3974 }
3975 }
3976
3977 tr:last-child td {
3978 border-bottom: 0;
3979 }
3980 }
3981
3982 table.wc_tax_rates {
3983 td.country {
3984 position: relative;
3985 }
3986 }
3987
3988 table.wc_gateways,
3989 table.wc_emails,
3990 table.wc_shipping {
3991 position: relative;
3992
3993 th,
3994 td {
3995 display: table-cell !important;
3996 padding: 1em !important;
3997 vertical-align: top;
3998 line-height: 1.75em;
3999 }
4000
4001 &.wc_emails td {
4002 vertical-align: middle;
4003 }
4004
4005 tr:nth-child(odd) td {
4006 background: #f9f9f9;
4007 }
4008
4009 td.name {
4010 font-weight: 700;
4011 }
4012
4013 .settings {
4014 text-align: right;
4015 }
4016
4017 .radio,
4018 .default,
4019 .status {
4020 text-align: center;
4021
4022 .tips {
4023 margin: 0 auto;
4024 }
4025
4026 input {
4027 margin: 0;
4028 }
4029 }
4030
4031 td.sort {
4032 font-size: 15px;
4033 text-align: center;
4034
4035 .wc-item-reorder-nav {
4036 white-space: nowrap;
4037 width: 72px;
4038
4039 &::before {
4040 content: "\f333";
4041 font-family: "Dashicons";
4042 text-align: center;
4043 line-height: 1;
4044 color: #999;
4045 display: block;
4046 width: 24px;
4047 float: left;
4048 height: 100%;
4049 line-height: 24px;
4050 cursor: move;
4051 }
4052
4053 button {
4054 position: relative;
4055 overflow: hidden;
4056 float: left;
4057 display: block;
4058 width: 24px;
4059 height: 24px;
4060 margin: 0;
4061 background: transparent;
4062 border: none;
4063 box-shadow: none;
4064 color: #82878c;
4065 text-indent: -9999px;
4066 cursor: pointer;
4067 outline: none;
4068 }
4069
4070 button::before {
4071 display: inline-block;
4072 position: absolute;
4073 top: 0;
4074 right: 0;
4075 width: 100%;
4076 height: 100%;
4077 font: normal 20px/23px dashicons;
4078 text-align: center;
4079 text-indent: 0;
4080 -webkit-font-smoothing: antialiased;
4081 -moz-osx-font-smoothing: grayscale;
4082 }
4083
4084 button:hover,
4085 button:focus {
4086 color: #191e23;
4087 }
4088
4089 .wc-move-down::before {
4090 content: "\f347";
4091 }
4092
4093 .wc-move-up::before {
4094 content: "\f343";
4095 }
4096
4097 .wc-move-disabled {
4098 color: #d5d5d5 !important;
4099 cursor: default;
4100 pointer-events: none;
4101 }
4102 }
4103 }
4104
4105 .wc-payment-gateway-method-name {
4106 font-weight: normal;
4107 }
4108
4109 .wc-email-settings-table-name {
4110 font-weight: 700;
4111
4112 span {
4113 font-weight: normal;
4114 color: #999;
4115 margin: 0 0 0 4px !important;
4116 }
4117 }
4118
4119 .wc-payment-gateway-method-toggle-enabled,
4120 .wc-payment-gateway-method-toggle-disabled {
4121 padding-top: 1px;
4122 display: block;
4123 outline: 0;
4124 box-shadow: none;
4125 }
4126
4127 .wc-email-settings-table-status {
4128 text-align: center;
4129 width: 1em;
4130
4131 .tips {
4132 margin: 0 auto;
4133 }
4134 }
4135 }
4136
4137 .wc-shipping-zone-settings {
4138 #zone_name {
4139 width: 600px;
4140 padding: 2px 8px;
4141 }
4142
4143 th {
4144 padding: 24px 24px 24px 0;
4145 }
4146
4147 td.forminp {
4148 input,
4149 textarea {
4150 padding: 8px;
4151 max-width: 100% !important;
4152 }
4153
4154 .wc-shipping-zone-region-select {
4155 width: 448px;
4156 max-width: 100% !important;
4157
4158 .select2-choices {
4159 padding: 8px 8px 4px;
4160 border-color: #ddd;
4161 min-height: 0;
4162 line-height: 1;
4163
4164 input {
4165 padding: 0;
4166 }
4167
4168 li {
4169 margin: 0 4px 4px 0;
4170 }
4171 }
4172 }
4173 }
4174
4175 .wc-shipping-zone-postcodes-toggle {
4176 margin: 0.5em 0 0;
4177 text-decoration: underline;
4178 display: block;
4179 font-size: 13px;
4180 font-weight: 400;
4181 line-height: 16px;
4182 }
4183
4184 .wc-shipping-zone-postcodes-toggle + .wc-shipping-zone-postcodes {
4185 display: none;
4186 }
4187
4188 .wc-shipping-zone-postcodes {
4189 width: 100%;
4190 max-width: 600px;
4191
4192 #zone_postcodes {
4193 margin: 10px 0;
4194 padding: 8px;
4195 width: 100%;
4196 }
4197
4198 .description {
4199 font-size: 13px;
4200 font-weight: 400;
4201 line-height: 18px;
4202 color: #3C434A;
4203 }
4204 }
4205
4206 #wc-shipping-zone-region-picker-root {
4207 width: 100%;
4208 max-width: 600px;
4209 }
4210 }
4211
4212 .wc-shipping-zone-settings + p.submit {
4213 margin-top: 0;
4214 }
4215
4216 .wc-shipping-zone-settings tbody {
4217 display: table-row-group;
4218 }
4219
4220 /**
4221 * New Shipping Settings Refresh Modal Styles
4222 **/
4223
4224 .wc-backbone-modal-add-shipping-method,
4225 .wc-backbone-modal-shipping-method-settings,
4226 .wc-shipping-class-modal {
4227 font-family: $font-sf-pro-text;
4228 font-size: 13px;
4229 font-weight: 400;
4230 line-height: 16px;
4231 color: #1e1e1e;
4232
4233 &.wc-backbone-modal .wc-backbone-modal-content {
4234 border-radius: 8px;
4235 border-top: 8px solid transparent;
4236 border-bottom: 8px solid transparent;
4237 max-width: 600px;
4238
4239 @media screen and (max-width: 782px) {
4240 border-radius: none;
4241 border-top: none;
4242 border-bottom: none;
4243 }
4244 }
4245
4246 .wc-backbone-modal-main article {
4247 padding: 0 32px 32px 32px;
4248 }
4249
4250 .wc-backbone-modal-main header{
4251 padding: 20px 32px;
4252 }
4253
4254 .wc-backbone-modal-main footer {
4255 padding: 20px 32px 12px 32px;
4256 }
4257
4258 .wc-backbone-modal-main .wc-backbone-modal-header h1 {
4259 font-weight: 400;
4260 }
4261
4262 .wc-backbone-modal-main .wc-backbone-modal-header {
4263 background-color: #fff;
4264 border-bottom: none;
4265 font-size: 20px;
4266 line-height: 28px;
4267
4268 .modal-close-link {
4269 border-left: none;
4270
4271 &:hover {
4272 background-color: #fff;
4273 }
4274 }
4275 }
4276 .wc-backbone-modal-main footer {
4277 box-shadow: none;
4278 border-top: 1px solid #E0E0E0;
4279 background-color: #fff;
4280
4281 .inner {
4282 display: flex;
4283 justify-content: space-between;
4284 flex-direction: row-reverse;
4285 }
4286
4287 .wc-shipping-zone-method-modal-info {
4288 display: flex;
4289 align-items: center;
4290 font-size: 11px;
4291 font-weight: 500;
4292 line-height: 16px;
4293 color: #787C82;
4294
4295 &.wc-shipping-zone-method-modal-info-inactive {
4296 display: none;
4297 }
4298 }
4299 }
4300
4301 .wc-shipping-method-add-class-costs {
4302 margin-top: -24px;
4303 text-decoration: none;
4304 color: #3858E9;
4305 font-size: 12px;
4306 line-height: 16px;
4307 }
4308
4309 .wc-shipping-zone-method-input {
4310 input {
4311 clip: rect(0 0 0 0);
4312 clip-path: inset(100%);
4313 height: 1px;
4314 overflow: hidden;
4315 position: absolute;
4316 white-space: nowrap;
4317 width: 1px;
4318
4319 &:checked + label {
4320 outline: 2px solid var(--wp-admin-theme-color);
4321
4322 .dashicons-yes {
4323 display: block;
4324 }
4325 }
4326 }
4327
4328 label {
4329 display: block;
4330 width: 100%;
4331 padding: 20px 16px;
4332 outline: 1px solid #DDDDDD;
4333 margin: 12px 0;
4334 border-radius: 4px;
4335 }
4336 }
4337
4338 .wc-shipping-legacy-local-pickup-help-text-container {
4339 margin: 1.5em 0;
4340 }
4341
4342 .wc-shipping-zone-method-input-help-text {
4343 display: none;
4344 }
4345
4346 .wc-shipping-zone-method-selector {
4347 position: relative;
4348 }
4349
4350 .dashicons-yes {
4351 display: none;
4352 color: #949494;
4353 float: right;
4354 }
4355
4356 .woocommerce-help-tip {
4357 color: #949494;
4358
4359 &:after {
4360 top: -6px;
4361 font-size: 24px;
4362 }
4363 }
4364
4365 .wc-shipping-zone-method-fields {
4366
4367 & > label {
4368 font-size: 12px;
4369 font-weight: 500;
4370 line-height: 16px;
4371
4372 & > .woocommerce-help-tip {
4373 display: none;
4374 }
4375
4376 & > .woocommerce-help-tip.wc-shipping-visible-help-text {
4377 display: inline-block;
4378 }
4379 }
4380
4381 fieldset {
4382 margin-bottom: 24px;
4383 position: relative;
4384
4385 input,
4386 select {
4387 margin: 6px 0;
4388 padding: 12px;
4389 font-size: 13px;
4390 line-height: 16px;
4391
4392 &:not([type="checkbox"]) {
4393 width: 100%;
4394 max-width: 100%;
4395 }
4396 &[type="checkbox"]="checkbox""] {
4397 border-radius: 2px;
4398 margin: 4px 8px 6px 0;
4399
4400 & + .woocommerce-help-tip {
4401 margin: 6px 0 4px 8px;
4402 }
4403 }
4404
4405 &.wc-shipping-modal-price {
4406 &.wc-shipping-currency-position-left,
4407 &.wc-shipping-currency-position-left_space {
4408
4409 &.wc-shipping-currency-size-1 {
4410 padding-left: 28px;
4411 }
4412 &.wc-shipping-currency-size-2 {
4413 padding-left: 33px;
4414 }
4415 &.wc-shipping-currency-size-3 {
4416 padding-left: 38px;
4417 }
4418 &.wc-shipping-currency-size-4 {
4419 padding-left: 43px;
4420 }
4421 &.wc-shipping-currency-size-5 {
4422 padding-left: 48px;
4423 }
4424 }
4425
4426 &.wc-shipping-currency-position-right,
4427 &.wc-shipping-currency-position-right_space {
4428 padding-left: 12px;
4429 }
4430 }
4431 }
4432 }
4433
4434 .wc-shipping-zone-method-currency {
4435 position: absolute;
4436 top: 19px;
4437 color: #757575;
4438
4439 &.wc-shipping-currency-position-left,
4440 &.wc-shipping-currency-position-left_space {
4441 left: 12px;
4442 }
4443
4444 &.wc-shipping-currency-position-right,
4445 &.wc-shipping-currency-position-right_space {
4446 right: 12px;
4447 }
4448 }
4449 }
4450
4451 .wc-backbone-modal-action-inactive {
4452 display: none;
4453 }
4454
4455 .wc-shipping-zone-method-fields-help-text,
4456 .wc-shipping-class-modal-help-text {
4457 font-size: 12px;
4458 font-weight: 400;
4459 line-height: 16px;
4460 color: #757575;
4461 }
4462
4463 .wc-backbone-modal-back-inactive {
4464 display: none;
4465 }
4466
4467 #btn-next.is-busy {
4468 background-image: linear-gradient(-45deg, #fafafa 33%, #e0e0e0 33%, #e0e0e0 70%, #fafafa 70%);
4469 animation-duration: 2.5s;
4470 animation-timing-function: linear;
4471 animation-delay: 0s;
4472 animation-iteration-count: infinite;
4473 animation-direction: normal;
4474 animation-fill-mode: none;
4475 animation-play-state: running;
4476 animation-name: components-button__busy-animation;
4477 animation-timeline: auto;
4478 animation-range-start: normal;
4479 color: #757575;
4480 }
4481 }
4482
4483 .wc-backbone-modal-add-shipping-method .wc-backbone-modal-main article {
4484 padding: 0 32px 50px 32px;
4485 }
4486
4487 table {
4488 tr,
4489 tr:hover {
4490 table.wc-shipping-zone-methods {
4491 tr .row-actions {
4492 position: relative;
4493 }
4494
4495 tr:hover .row-actions {
4496 position: static;
4497 }
4498 }
4499 }
4500 }
4501
4502 .wc-shipping-class-modal {
4503 .edit {
4504 margin: 5px 0;
4505 }
4506
4507 .edit > input,
4508 .edit > select {
4509 width: 100%;
4510 max-width: 100%;
4511 padding: 12px;
4512 }
4513
4514 .view {
4515 font-size: 12px;
4516 font-weight: 500;
4517 line-height: 16px;
4518 }
4519
4520 .wc-shipping-class-modal-input {
4521 padding: 0 0 24px 0;
4522
4523 input {
4524 font-size: 13px;
4525 line-height: 16px;
4526 }
4527 }
4528
4529 .wc-shipping-class-count {
4530 display: none;
4531 }
4532 }
4533
4534 .wc-shipping-class-hide-sibling-view + .view {
4535 display: none;
4536 }
4537
4538 .wc-shipping-zones-heading {
4539 display: flex;
4540 align-items: center;
4541
4542 .page-title-action, .page-title-action:active {
4543 margin: 7px 0 0 10px;
4544 }
4545 }
4546
4547 .wc-shipping-zone-heading-help-text {
4548 max-width: 800px;
4549 }
4550
4551 .wc-shipping-zone-heading-help-text {
4552 color: #3C434A;
4553 font-size: 13px;
4554 font-style: normal;
4555 font-weight: 400;
4556 line-height: 19px;
4557 }
4558
4559 .wc-shipping-zone-help-text {
4560 color: #3C434A;
4561 font-size: 12px;
4562 font-style: normal;
4563 font-weight: 400;
4564 line-height: 17px;
4565 }
4566
4567 #wc-shipping-zone-region-picker-root .woocommerce-tree-select-control .components-base-control {
4568 padding: 2px 8px;
4569 border-radius: 4px;
4570
4571 .woocommerce-tree-select-control__control-input {
4572 font-size: 14px;
4573 }
4574 }
4575
4576 table.wc-shipping-zones,
4577 table.wc-shipping-zone-methods,
4578 table.wc-shipping-classes {
4579 font-size: 14px;
4580
4581 thead tr th {
4582 vertical-align: middle;
4583 padding: 1em;
4584 font-weight: 600;
4585 }
4586
4587 tbody tr td {
4588 padding: 24px 12px;
4589
4590 &:last-child {
4591 padding: 24px 32px 24px 12px;
4592 }
4593 }
4594
4595 tfoot tr td {
4596 padding: 24px 12px;
4597 vertical-align: top;
4598
4599 &:last-child {
4600 padding: 24px 32px 24px 12px;
4601 }
4602 }
4603
4604 td,
4605 th {
4606 display: table-cell !important;
4607 font-size: 14px;
4608 vertical-align: middle;
4609 padding: 24px 12px;
4610
4611 li {
4612 line-height: 24px;
4613 font-size: 14px;
4614 }
4615
4616 .woocommerce-help-tip {
4617 margin: 0 !important;
4618 }
4619 }
4620
4621 thead {
4622 .wc-shipping-zone-sort {
4623 text-align: center;
4624 }
4625 }
4626
4627 .wc-shipping-zone-rows,
4628 .wc-shipping-zone-method-rows,
4629 .wc-shipping-class-rows {
4630 tr:nth-child(even) td {
4631 background: #f9f9f9;
4632 }
4633 }
4634
4635 .wc-shipping-zone-rows-tfoot .even td {
4636 background: #f9f9f9;
4637 }
4638
4639 td.wc-shipping-zones-blank-state,
4640 td.wc-shipping-zone-method-blank-state {
4641 overflow: hidden;
4642 position: relative;
4643 padding: 7.5em 7.5% !important;
4644
4645 &.wc-shipping-zone-method-blank-state {
4646 padding: 2em !important;
4647
4648 p {
4649 margin-bottom: 0;
4650 }
4651 }
4652
4653 p,
4654 li {
4655 color: var(--wc-secondary-text, $woocommerce);
4656 font-size: 1.2em;
4657 line-height: 1.2em;
4658 margin: 0 0 1.5em;
4659 position: relative;
4660 z-index: 1;
4661 text-shadow: 1px 1px 1px white;
4662
4663 &.main {
4664 font-size: 1.6em;
4665 }
4666 }
4667
4668 li {
4669 margin-left: 1em;
4670 list-style: circle inside;
4671 }
4672
4673 &::before {
4674 content: "\e01b";
4675 font-family: "WooCommerce";
4676 text-align: center;
4677 line-height: 1;
4678 color: #e9e9e9;
4679 display: block;
4680 width: 1em;
4681 font-size: 40em;
4682 top: 50%;
4683 right: -3.75%;
4684 margin-top: -0.1875em;
4685 position: absolute;
4686 }
4687
4688 .button-primary {
4689 font-size: 1.2em;
4690 padding: 0.75em 1.5em;
4691 margin: 0 0.25em;
4692 height: auto;
4693 position: relative;
4694 z-index: 1;
4695 }
4696 }
4697
4698 tbody.wc-shipping-tables-tbody {
4699 .wc-shipping-zone-name,
4700 .wc-shipping-zone-method-title,
4701 .wc-shipping-class-name {
4702 font-weight: 500;
4703 }
4704
4705 }
4706
4707 tr.wc-shipping-zone-worldwide {
4708 td {
4709 background: #f9f9f9;
4710 border-top: 2px solid #e1e1e1;
4711 }
4712 }
4713
4714 ul,
4715 p {
4716 margin: 0;
4717 }
4718
4719 td.wc-shipping-zone-sort,
4720 td.wc-shipping-zone-method-sort {
4721 cursor: move;
4722 font-size: 15px;
4723 text-align: center;
4724
4725 &::before {
4726 content: "";
4727 mask: url(../images/icons/move-icon.svg);
4728 mask-image: url(../images/icons/move-icon.svg);
4729 -webkit-mask-image: url(../images/icons/move-icon.svg);
4730 background-color: #1E1E1E;
4731 display: block;
4732 width: 17px;
4733 float: left;
4734 height: 24px;
4735 }
4736
4737 &:hover::before {
4738 background-color: #999;
4739 }
4740 }
4741
4742 td.wc-shipping-zone-worldwide {
4743 text-align: center;
4744
4745 &::before {
4746 content: "\f319";
4747 font-family: "dashicons";
4748 text-align: center;
4749 line-height: 1;
4750 color: #000;
4751 display: block;
4752 width: 17px;
4753 float: left;
4754 height: 100%;
4755 line-height: 24px;
4756 }
4757 }
4758
4759 .wc-shipping-zone-name,
4760 .wc-shipping-zone-methods {
4761 width: 25%;
4762 }
4763
4764 .wc-shipping-zone-actions {
4765 width: 13%;
4766 text-align: right;
4767
4768 a.wc-shipping-zone-actions,
4769 a.wc-shipping-zone-actions:hover {
4770 color: var(--wc-red);
4771 }
4772 }
4773
4774 .wc-shipping-class-description,
4775 .wc-shipping-class-name,
4776 .wc-shipping-class-slug,
4777 .wc-shipping-zone-name,
4778 .wc-shipping-class-actions,
4779 .wc-shipping-zone-region {
4780 input,
4781 select,
4782 textarea {
4783 width: 100%;
4784 }
4785 }
4786
4787 .wc-shipping-class-count {
4788 text-align: center;
4789 }
4790
4791 td.wc-shipping-zone-methods {
4792 .method_disabled {
4793 text-decoration: line-through;
4794 }
4795
4796 ul {
4797 position: relative;
4798 padding-right: 32px;
4799 display: flex;
4800 flex-wrap: wrap;
4801
4802 li {
4803 color: #000;
4804 display: inline;
4805 margin: 0;
4806 }
4807 }
4808
4809 .wc-shipping-zone-method {
4810 background-color: #F0F0F0;
4811 margin: 0 3px 3px 0;
4812 padding: 5px 9px;
4813 border-radius: 5px;
4814 }
4815
4816 .add_shipping_method {
4817 display: block;
4818 width: 24px;
4819 padding: 24px 0 0;
4820 height: 0;
4821 overflow: hidden;
4822 cursor: pointer;
4823
4824 &::before {
4825 @include icon;
4826 font-family: "Dashicons";
4827 content: "\f502";
4828 color: #999;
4829 vertical-align: middle;
4830 line-height: 24px;
4831 font-size: 16px;
4832 margin: 0;
4833 }
4834
4835 &.disabled {
4836 cursor: not-allowed;
4837
4838 &::before {
4839 color: #ccc;
4840 }
4841 }
4842 }
4843 }
4844
4845 .wc-shipping-zone-method-title {
4846 width: 25%;
4847 }
4848
4849 .wc-shipping-zone-method-enabled {
4850 text-align: center;
4851
4852 a {
4853 float: left;
4854 }
4855
4856 .woocommerce-input-toggle {
4857 margin-top: 3px;
4858 }
4859 }
4860
4861 .wc-shipping-zone-method-type {
4862 display: block;
4863 }
4864
4865 tfoot {
4866 input,
4867 select {
4868 vertical-align: middle !important;
4869 }
4870
4871 .button-secondary {
4872 float: right;
4873 }
4874 }
4875
4876 .editing {
4877 .wc-shipping-zone-view,
4878 .wc-shipping-zone-edit {
4879 display: none;
4880 }
4881 }
4882 }
4883
4884 .woocommerce-input-toggle {
4885 height: 16px;
4886 width: 32px;
4887 border: 2px solid var(--wp-admin-theme-color, $woocommerce);
4888 background-color: var(--wp-admin-theme-color, $woocommerce);
4889 display: inline-block;
4890 text-indent: -9999px;
4891 border-radius: 10em;
4892 position: relative;
4893 margin-top: -1px;
4894 vertical-align: text-top;
4895
4896 &::before {
4897 content: "";
4898 display: block;
4899 width: 16px;
4900 height: 16px;
4901 background: #fff;
4902 position: absolute;
4903 top: 0;
4904 right: 0;
4905 border-radius: 100%;
4906 }
4907
4908 &.woocommerce-input-toggle--disabled {
4909 border-color: #999;
4910 background-color: #999;
4911
4912 &::before {
4913 right: auto;
4914 left: 0;
4915 }
4916 }
4917
4918 &.woocommerce-input-toggle--loading {
4919 opacity: 0.5;
4920 }
4921 }
4922
4923 .wc-modal-shipping-method-settings {
4924
4925 form .form-table {
4926 width: 100%;
4927 background: #fff;
4928 margin: 0 0 1.5em;
4929
4930 tr {
4931 th {
4932 width: 40%;
4933 position: relative;
4934
4935 .woocommerce-help-tip {
4936 float: right;
4937 margin: -8px -0.5em 0 0;
4938 vertical-align: middle;
4939 right: 0;
4940 top: 50%;
4941 position: absolute;
4942 }
4943 }
4944
4945 td {
4946 input,
4947 select,
4948 textarea {
4949 width: 50%;
4950 min-width: 250px;
4951 }
4952
4953 input[type="checkbox"]="checkbox""] {
4954 width: auto;
4955 min-width: 16px;
4956 }
4957 width: 40%;
4958 }
4959
4960 td,
4961 th {
4962 vertical-align: middle;
4963 margin: 0;
4964 line-height: 24px;
4965 padding: 1em;
4966 border-bottom: 1px solid #f8f8f8;
4967 }
4968 }
4969
4970 &:last-of-type {
4971 margin-bottom: 0;
4972 }
4973 }
4974 }
4975
4976 img.help_tip {
4977 margin: 0 0 0 9px;
4978 vertical-align: middle;
4979 }
4980
4981 .postbox img.help_tip {
4982 margin-top: 0;
4983 }
4984
4985 .postbox .woocommerce-help-tip {
4986 margin: 0 0 0 9px;
4987 }
4988
4989 .status-enabled,
4990 .status-manual,
4991 .status-disabled {
4992 font-size: 1.4em;
4993
4994 @include ir();
4995 }
4996
4997 .status-manual::before {
4998 @include icon("\e008");
4999 color: #999;
5000 }
5001
5002 .status-enabled::before {
5003 @include icon("\e015");
5004 color: var(--wp-admin-theme-color, $woocommerce);
5005 }
5006
5007 .status-disabled::before {
5008 @include icon("\e013");
5009 color: #ccc;
5010 }
5011
5012 .woocommerce {
5013 h2.woo-nav-tab-wrapper {
5014 margin-bottom: 1em;
5015 }
5016
5017 nav.woo-nav-tab-wrapper {
5018 margin: 1.5em 0 1em;
5019 }
5020
5021 .subsubsub:not(.list-table-filters) {
5022 margin: -8px 0 0;
5023 }
5024
5025 .wc-admin-breadcrumb {
5026 margin-left: 0.5em;
5027
5028 a {
5029 color: var(--wp-admin-theme-color, $woocommerce);
5030 }
5031 }
5032
5033 #template div {
5034 margin: 0;
5035
5036 p .button {
5037 float: right;
5038 margin-left: 10px;
5039 margin-top: -4px;
5040 }
5041
5042 .editor textarea {
5043 margin-bottom: 8px;
5044 }
5045 }
5046
5047 textarea[disabled="disabled"]="disabled""] {
5048 background: #dfdfdf !important;
5049 }
5050
5051 .settings-panel {
5052 ul.advice {
5053 list-style: square;
5054 list-style-position: inside;
5055 }
5056 }
5057
5058 table.form-table {
5059 margin: 0;
5060 position: relative;
5061 table-layout: fixed;
5062
5063 .forminp-radio ul {
5064 margin: 0;
5065
5066 li {
5067 line-height: 1.4em;
5068 }
5069 }
5070
5071 input[type="text"]="text""],
5072 input[type="number"]="number""],
5073 input[type="email"]="email""] {
5074 height: auto;
5075 }
5076
5077 textarea.input-text {
5078 height: 100%;
5079 min-width: 150px;
5080 display: block;
5081 }
5082
5083 // Give regular settings inputs a standard width and padding.
5084 textarea,
5085 input[type="text"]="text""],
5086 input[type="email"]="email""],
5087 input[type="number"]="number""],
5088 input[type="password"]="password""],
5089 input[type="datetime"]="datetime""],
5090 input[type="datetime-local"]="datetime-local""],
5091 input[type="date"]="date""],
5092 input[type="time"]="time""],
5093 input[type="week"]="week""],
5094 input[type="url"]="url""],
5095 input[type="tel"]="tel""],
5096 input.regular-input {
5097 width: 400px;
5098 margin: 0;
5099 padding: 6px;
5100 box-sizing: border-box;
5101 vertical-align: top;
5102 }
5103
5104 input[type="datetime-local"]="datetime-local""],
5105 input[type="date"]="date""],
5106 input[type="time"]="time""],
5107 input[type="week"]="week""],
5108 input[type="tel"]="tel""] {
5109 width: 200px;
5110 }
5111
5112 select {
5113 width: 400px;
5114 margin: 0;
5115 box-sizing: border-box;
5116 line-height: 32px;
5117 vertical-align: top;
5118 }
5119
5120 input[size]] {
5121 width: auto !important;
5122 }
5123
5124 // Ignore nested inputs.
5125 table {
5126 select,
5127 textarea,
5128 input[type="text"]="text""],
5129 input[type="email"]="email""],
5130 input[type="number"]="number""],
5131 input.regular-input {
5132 width: auto;
5133 }
5134 }
5135
5136 textarea.wide-input {
5137 width: 100%;
5138 }
5139
5140 img.help_tip,
5141 .woocommerce-help-tip {
5142 padding: 0;
5143 margin: -4px 0 0 5px;
5144 vertical-align: middle;
5145 cursor: help;
5146 line-height: 1;
5147 }
5148
5149 span.help_tip {
5150 cursor: help;
5151 color: $blue;
5152 }
5153
5154 th {
5155 position: relative;
5156 padding-right: 24px;
5157 }
5158
5159 th label {
5160 position: relative;
5161 display: block;
5162
5163 img.help_tip,
5164 .woocommerce-help-tip {
5165 margin: -8px -24px 0 0;
5166 position: absolute;
5167 right: 0;
5168 top: 50%;
5169 }
5170 }
5171
5172 th label + .woocommerce-help-tip {
5173 margin: 0 0 0 0;
5174 position: absolute;
5175 right: 0;
5176 top: 20px;
5177 }
5178
5179 .select2-container {
5180 vertical-align: top;
5181 margin-bottom: 3px;
5182 }
5183
5184 .select2-container + span.description {
5185 display: block;
5186 margin-top: 8px;
5187 }
5188
5189 .wp-list-table .woocommerce-help-tip {
5190 float: none;
5191 }
5192
5193 td.disabled {
5194 opacity: 0.5;
5195 }
5196
5197 fieldset {
5198 margin-top: 4px;
5199
5200 img.help_tip,
5201 .woocommerce-help-tip {
5202 margin: -3px 0 0 5px;
5203 }
5204
5205 p.description {
5206 margin-bottom: 8px;
5207
5208 &.is-error, span.is-error {
5209 color: $red;
5210 }
5211 }
5212
5213 &:first-child {
5214 margin-top: 0;
5215 }
5216 }
5217
5218 td.with-tooltip {
5219 > fieldset {
5220 margin-top: 0;
5221 }
5222 span.help-tooltip {
5223 position: absolute;
5224 margin-left: -30px;
5225 margin-top: 7px;
5226 }
5227 }
5228
5229 .iris-picker {
5230 z-index: 100;
5231 display: none;
5232 position: absolute;
5233 border: 1px solid #ccc;
5234 border-radius: 3px;
5235 box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
5236
5237 .ui-slider {
5238 border: 0 !important;
5239 margin: 0 !important;
5240 width: auto !important;
5241 height: auto !important;
5242 background: none transparent !important;
5243
5244 .ui-slider-handle {
5245 margin-bottom: 0 !important;
5246 }
5247 }
5248 }
5249
5250 .iris-error {
5251 background-color: #ffafaf;
5252 }
5253
5254 .colorpickpreview {
5255 padding: 7px 0;
5256 line-height: 1em;
5257 display: inline-block;
5258 width: 26px;
5259 border: 1px solid #ddd;
5260 font-size: 14px;
5261 }
5262
5263 .image_width_settings {
5264 vertical-align: middle;
5265
5266 label {
5267 margin-left: 10px;
5268 }
5269
5270 input {
5271 width: auto;
5272 }
5273 }
5274
5275 .wc_payment_gateways_wrapper,
5276 .wc_emails_wrapper {
5277 padding: 0 15px 10px 0;
5278 }
5279
5280 legend {
5281 font-weight: 700;
5282 line-height: 1.4;
5283 padding: 5px 0 0;
5284 margin: 0 0 8px !important;
5285 }
5286 }
5287
5288 .wc-shipping-zone-settings {
5289 td.forminp {
5290 input,
5291 textarea {
5292 width: 448px;
5293 padding: 6px 11px;
5294 }
5295
5296 .select2-search input {
5297 padding: 6px;
5298 }
5299 }
5300 }
5301 }
5302
5303 .wc-wp-version-gte-53 {
5304 .woocommerce {
5305 h2.wc-table-list-header {
5306 margin: 1em 0 0.35em 0;
5307 }
5308
5309 input + .subsubsub {
5310 margin: 8px 0 0;
5311 }
5312
5313 table.form-table {
5314 // Give regular settings inputs a standard width and padding.
5315 textarea,
5316 input[type="text"]="text""],
5317 input[type="email"]="email""],
5318 input[type="number"]="number""],
5319 input[type="password"]="password""],
5320 input[type="datetime"]="datetime""],
5321 input[type="datetime-local"]="datetime-local""],
5322 input[type="date"]="date""],
5323 input[type="time"]="time""],
5324 input[type="week"]="week""],
5325 input[type="url"]="url""],
5326 input[type="tel"]="tel""],
5327 input.regular-input {
5328 padding: 0 8px;
5329
5330 @media only screen and (max-width: 782px) {
5331 width: 100%;
5332 }
5333 }
5334
5335 select {
5336 @media only screen and (max-width: 782px) {
5337 width: 100%;
5338 }
5339 }
5340
5341 th label {
5342 img.help_tip,
5343 .woocommerce-help-tip {
5344 margin: -7px -24px 0 0;
5345
5346 @media only screen and (max-width: 782px) {
5347 right: auto;
5348 margin-left: 5px;
5349 }
5350 }
5351 }
5352
5353 .forminp-color {
5354 font-size: 0;
5355 }
5356
5357 .colorpickpreview {
5358 padding: 0;
5359 width: 30px;
5360 height: 30px;
5361 box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.2);
5362 font-size: 16px;
5363 border-radius: 4px;
5364 margin-right: 3px;
5365
5366 @media only screen and (max-width: 782px) {
5367 float: left;
5368 width: 40px;
5369 height: 40px;
5370 }
5371 }
5372 }
5373 }
5374 }
5375
5376 .woocommerce #tabs-wrap table a.remove {
5377 margin-left: 4px;
5378 }
5379
5380 .woocommerce #tabs-wrap table p {
5381 margin: 0 0 4px !important;
5382 overflow: hidden;
5383 zoom: 1;
5384 }
5385
5386 .woocommerce #tabs-wrap table p a.add {
5387 float: left;
5388 }
5389
5390 #wp-excerpt-editor-container {
5391 background: #fff;
5392 }
5393
5394 #product_variation-parent #parent_id {
5395 width: 100%;
5396 }
5397
5398 #postimagediv {
5399 .inside {
5400 padding: 0;
5401 margin: 0;
5402 }
5403
5404 p {
5405 margin: 0;
5406 padding: 10px;
5407 }
5408
5409 .image-added-detail {
5410 border-top: 1px solid #dcdcde;
5411 background-color: #f6f7f7;
5412 color: #7f8388;
5413 font-size: 12px;
5414 margin-top: 4px;
5415
5416 .dashicons {
5417 font-size: 13px;
5418 width: 13px;
5419 height: 13px;
5420 margin: 3px 3px 0 0;
5421 }
5422
5423 a {
5424 text-decoration: none;
5425 }
5426 }
5427
5428 img {
5429 border: 1px solid #d5d5d5;
5430 max-width: 100%;
5431 }
5432 }
5433
5434 #woocommerce-product-images .inside {
5435 margin: 0;
5436 padding: 0;
5437
5438 .add_product_images {
5439 padding: 0 12px 12px;
5440 }
5441
5442 #product_images_container {
5443 padding: 0 0 0 9px;
5444
5445 ul {
5446 @include clearfix();
5447 margin: 0;
5448 padding: 0;
5449
5450 li.image,
5451 li.add,
5452 li.wc-metabox-sortable-placeholder {
5453 width: 80px;
5454 float: left;
5455 cursor: move;
5456 border: 1px solid #d5d5d5;
5457 margin: 9px 9px 0 0;
5458 background: #f7f7f7;
5459
5460 @include border-radius(2px);
5461 position: relative;
5462 box-sizing: border-box;
5463
5464 img {
5465 width: 100%;
5466 height: auto;
5467 display: block;
5468 }
5469 }
5470
5471 li.wc-metabox-sortable-placeholder {
5472 border: 3px dashed #ddd;
5473 position: relative;
5474
5475 &::after {
5476 @include icon_dashicons("\f161");
5477 font-size: 2.618em;
5478 line-height: 72px;
5479 color: #ddd;
5480 }
5481 }
5482
5483 ul.actions {
5484 position: absolute;
5485 top: -8px;
5486 right: -8px;
5487 padding: 2px;
5488 display: none;
5489
5490 @media (max-width: 768px) {
5491 display: block;
5492 }
5493
5494 li {
5495 float: right;
5496 margin: 0 0 0 2px;
5497
5498 a {
5499 width: 1em;
5500 height: 1em;
5501 margin: 0;
5502 height: 0;
5503 display: block;
5504 overflow: hidden;
5505
5506 &.tips {
5507 cursor: pointer;
5508 }
5509 }
5510
5511 a.delete {
5512 @include ir();
5513 font-size: 1.4em;
5514
5515 &::before {
5516 @include icon_dashicons("\f153");
5517 color: #999;
5518 background: #fff;
5519 border-radius: 50%;
5520 height: 1em;
5521 width: 1em;
5522 line-height: 1em;
5523 }
5524
5525 &:hover::before {
5526 color: $red;
5527 }
5528 }
5529 }
5530 }
5531
5532 li:hover ul.actions {
5533 display: block;
5534 }
5535 }
5536 }
5537 }
5538
5539 #woocommerce-product-data {
5540 .hndle {
5541 padding: 10px;
5542
5543 span {
5544 display: block;
5545 line-height: 24px;
5546 }
5547
5548 .product-data-wrapper {
5549 label > * {
5550 display: inline-block;
5551 }
5552
5553 .woocommerce-product-type-tip {
5554 font-size: 1.4em;
5555 margin-left: 9px;
5556 }
5557 }
5558
5559 .type_box {
5560 display: inline;
5561 line-height: inherit;
5562 vertical-align: baseline;
5563 }
5564
5565 select {
5566 margin: 0;
5567 }
5568
5569 label {
5570 padding-right: 1em;
5571 font-size: 12px;
5572 vertical-align: baseline;
5573 }
5574
5575 label:first-child {
5576 margin-right: 1.4em;
5577 border-right: 1px solid #dfdfdf;
5578 }
5579
5580 input,
5581 select {
5582 margin-top: -2px;
5583 vertical-align: middle;
5584 }
5585
5586 label.has-checkbox {
5587 margin-right: 15px;
5588 }
5589
5590 label.has-checkbox > input[type="checkbox"]="checkbox""] {
5591 margin-right: 3px;
5592 }
5593
5594 select {
5595 margin-left: 0.5em;
5596 }
5597 }
5598
5599 > .handlediv {
5600 margin-top: 4px;
5601 }
5602
5603 .wrap {
5604 margin: 0;
5605 }
5606 }
5607
5608 #woocommerce-coupon-description {
5609 padding: 3px 8px;
5610 font-size: 1.7em;
5611 line-height: 1.42em;
5612 height: auto;
5613 width: 100%;
5614 outline: 0;
5615 margin: 10px 0;
5616 display: block;
5617
5618 &::-webkit-input-placeholder {
5619 line-height: 1.42em;
5620 color: #bbb;
5621 }
5622
5623 &::-moz-placeholder {
5624 line-height: 1.42em;
5625 color: #bbb;
5626 }
5627
5628 &:-ms-input-placeholder {
5629 line-height: 1.42em;
5630 color: #bbb;
5631 }
5632
5633 &:-moz-placeholder {
5634 line-height: 1.42em;
5635 color: #bbb;
5636 }
5637 }
5638
5639 #woocommerce-product-data,
5640 #woocommerce-coupon-data {
5641 .panel-wrap {
5642 background: #fff;
5643 }
5644
5645 .woocommerce_options_panel,
5646 .wc-metaboxes-wrapper {
5647 float: left;
5648 width: 80%;
5649
5650 ._backorders_field .wc-radios li {
5651 display: block;
5652 padding: 0 0 2px;
5653 }
5654
5655 .wc-radios {
5656 display: block;
5657 float: left;
5658 margin: 0;
5659
5660 li {
5661 display: block;
5662 padding: 0 0 10px;
5663
5664 input {
5665 width: auto;
5666 }
5667 }
5668 }
5669 }
5670 }
5671
5672 #woocommerce-product-data,
5673 #woocommerce-coupon-data,
5674 .woocommerce {
5675 .panel-wrap {
5676 overflow: hidden;
5677 }
5678
5679 ul.wc-tabs {
5680 margin: 0;
5681 width: 20%;
5682 float: left;
5683 line-height: 1em;
5684 padding: 0 0 10px;
5685 position: relative;
5686 background-color: #fafafa;
5687 border-right: 1px solid #eee;
5688 box-sizing: border-box;
5689
5690 &::after {
5691 content: "";
5692 display: block;
5693 width: 100%;
5694 height: 9999em;
5695 position: absolute;
5696 bottom: -9999em;
5697 left: 0;
5698 background-color: #fafafa;
5699 border-right: 1px solid #eee;
5700 }
5701
5702 li {
5703 margin: 0;
5704 padding: 0;
5705 display: block;
5706 position: relative;
5707
5708 a {
5709 margin: 0;
5710 padding: 10px;
5711 display: block;
5712 box-shadow: none;
5713 text-decoration: none;
5714 line-height: 20px !important;
5715 border-bottom: 1px solid #eee;
5716
5717 span {
5718 margin-left: 0.618em;
5719 margin-right: 0.618em;
5720 }
5721
5722 &::before {
5723 @include iconbeforedashicons("\f107");
5724 }
5725 }
5726
5727 &.general_options a::before {
5728 content: "\f107";
5729 }
5730
5731 &.inventory_options a::before {
5732 content: "\f481";
5733 }
5734
5735 &.shipping_options a::before {
5736 font-family: "WooCommerce";
5737 content: "\e01a";
5738 }
5739
5740 &.linked_product_options a::before {
5741 content: "\f103";
5742 }
5743
5744 &.attribute_options a::before {
5745 content: "\f175";
5746 }
5747
5748 &.advanced_options a::before {
5749 font-family: "Dashicons";
5750 content: "\f111";
5751 }
5752
5753 &.marketplace-suggestions_options a::before {
5754 content: none;
5755 }
5756
5757 &.variations_options a::before {
5758 content: "\f509";
5759 }
5760
5761 &.usage_restriction_options a::before {
5762 font-family: "WooCommerce";
5763 content: "\e602";
5764 }
5765
5766 &.usage_limit_options a::before {
5767 font-family: "WooCommerce";
5768 content: "\e601";
5769 }
5770
5771 &.general_coupon_data a::before {
5772 font-family: "WooCommerce";
5773 content: "\e600";
5774 }
5775
5776 &.active a {
5777 color: #555;
5778 position: relative;
5779 background-color: #eee;
5780 }
5781 }
5782 }
5783 }
5784
5785 /**
5786 * Settings / Advanced / Features
5787 */
5788 .woocommerce_page_wc-settings {
5789 .wc-settings-row-woocommerce_custom_orders_table_enabled td.forminp {
5790 padding-bottom: 0;
5791 }
5792
5793 .wc-settings-row-woocommerce_custom_orders_table_data_sync_enabled td.forminp {
5794 padding-top: 0;
5795 }
5796 }
5797
5798 /**
5799 * Shipping
5800 */
5801 .woocommerce_page_wc-settings {
5802 input[type="url"]="url""],
5803 input[type="email"]="email""] {
5804 direction: ltr;
5805 }
5806
5807 .shippingrows {
5808 th.check-column {
5809 padding-top: 20px;
5810 }
5811
5812 tfoot th {
5813 padding-left: 10px;
5814 }
5815
5816 .add.button::before {
5817 @include iconbefore("\e007");
5818 }
5819 }
5820
5821 h3.wc-settings-sub-title {
5822 font-size: 1.2em;
5823 }
5824 }
5825
5826 #woocommerce-product-data,
5827 #woocommerce-product-type-options,
5828 #woocommerce-order-data,
5829 #woocommerce-order-downloads,
5830 #woocommerce-coupon-data {
5831 .inside {
5832 margin: 0;
5833 padding: 0;
5834 }
5835 }
5836
5837 .woocommerce_options_panel,
5838 .panel {
5839 padding: 9px;
5840 color: #555;
5841
5842 .form-field .woocommerce-help-tip {
5843 font-size: 1.4em;
5844 }
5845 }
5846
5847 .woocommerce_page_settings .woocommerce_options_panel,
5848 .panel {
5849 padding: 0;
5850 }
5851
5852 #woocommerce-product-type-options .panel,
5853 #woocommerce-product-specs .inside {
5854 margin: 0;
5855 padding: 9px;
5856 }
5857
5858 .woocommerce_options_panel p,
5859 #woocommerce-product-type-options .panel p,
5860 .woocommerce_options_panel fieldset.form-field {
5861 margin: 0 0 9px;
5862 font-size: 12px;
5863 padding: 5px 9px;
5864 line-height: 24px;
5865
5866 &::after {
5867 content: ".";
5868 display: block;
5869 height: 0;
5870 clear: both;
5871 visibility: hidden;
5872 }
5873 }
5874
5875 .woocommerce_options_panel .checkbox,
5876 .woocommerce_variable_attributes .checkbox {
5877 margin: 4px 0 !important;
5878 vertical-align: middle;
5879 float: left;
5880 }
5881
5882 .woocommerce_variations,
5883 .woocommerce_options_panel {
5884 .downloadable_files table {
5885 width: 100%;
5886 padding: 0 !important;
5887
5888 th {
5889 padding: 7px 0 7px 7px !important;
5890
5891 &.sort {
5892 width: 17px;
5893 padding: 7px !important;
5894 }
5895
5896 .woocommerce-help-tip {
5897 font-size: 1.1em;
5898 margin-left: 0;
5899 }
5900 }
5901
5902 td {
5903 vertical-align: middle !important;
5904 padding: 4px 0 4px 7px !important;
5905 position: relative;
5906
5907 &:last-child {
5908 padding-right: 7px !important;
5909 }
5910
5911 input.input_text {
5912 width: 100%;
5913 float: none;
5914 min-width: 0;
5915 margin: 1px 0;
5916 }
5917
5918 &.file_url {
5919 /* Reduce the size of this field to make space for a warning asterisk. */
5920 input {
5921 display: inline-block;
5922 width: 96%;
5923 }
5924 }
5925
5926 .upload_file_button {
5927 width: auto;
5928 float: right;
5929 cursor: pointer;
5930 }
5931
5932 .delete {
5933 @include ir();
5934 font-size: 1.2em;
5935
5936 &::before {
5937 @include icon_dashicons("\f153");
5938 color: #999;
5939 }
5940
5941 &:hover {
5942 &::before {
5943 color: $red;
5944 }
5945 }
5946 }
5947 }
5948
5949 td.sort {
5950 width: 17px;
5951 cursor: move;
5952 font-size: 15px;
5953 text-align: center;
5954 background: #f9f9f9;
5955 padding-right: 7px !important;
5956
5957 &::before {
5958 content: "\f333";
5959 font-family: "Dashicons";
5960 text-align: center;
5961 line-height: 1;
5962 color: #999;
5963 display: block;
5964 width: 17px;
5965 float: left;
5966 height: 100%;
5967 }
5968
5969 &:hover::before {
5970 color: #333;
5971 }
5972 }
5973
5974 /* Warning asterisk (indicates if there is a problem with a downloadable file). */
5975 span.disabled {
5976 color: var(--wc-red);
5977 }
5978 }
5979 }
5980
5981 .woocommerce_attribute,
5982 .woocommerce_variation {
5983 h3 .sort {
5984 width: 17px;
5985 height: 26px;
5986 cursor: move;
5987 float: right;
5988 font-size: 15px;
5989 font-weight: 400;
5990 margin-right: 0.5em;
5991 text-align: center;
5992 vertical-align: middle;
5993
5994 &::before {
5995 content: "\f333";
5996 font-family: "Dashicons";
5997 text-align: center;
5998 line-height: 28px;
5999 color: #999;
6000 display: block;
6001 width: 17px;
6002 float: left;
6003 height: 100%;
6004 }
6005
6006 &:hover::before {
6007 color: #777;
6008 }
6009 }
6010 .edit_variation {
6011 margin-left: 0.5em;
6012 }
6013
6014 h3:hover,
6015 &.ui-sortable-helper {
6016 .sort {
6017 visibility: visible;
6018 }
6019 }
6020
6021 &.wc-metabox {
6022 &.postbox {
6023 border-top: 0px;
6024 border-left: 0px;
6025 border-right: 0px;
6026 }
6027 }
6028 }
6029
6030 .woocommerce_options_panel {
6031 min-height: 175px;
6032 box-sizing: border-box;
6033
6034 .downloadable_files {
6035 padding: 0 9px 0 162px;
6036 position: relative;
6037 margin: 9px 0;
6038
6039 label {
6040 position: absolute;
6041 left: 0;
6042 margin: 0 0 0 12px;
6043 line-height: 24px;
6044 }
6045 }
6046
6047 p {
6048 margin: 9px 0;
6049 }
6050
6051 p.form-field,
6052 fieldset.form-field {
6053 padding: 5px 20px 5px 162px !important;
6054
6055 /** Padding for aligning labels left - 12px + 150 label width **/
6056 &._sold_individually_field {
6057 padding-right: 0px !important;
6058 }
6059 }
6060
6061 .sale_price_dates_fields {
6062 .short:first-of-type {
6063 margin-bottom: 1em;
6064 }
6065
6066 .short:nth-of-type(2) {
6067 clear: left;
6068 }
6069 }
6070
6071 label,
6072 legend {
6073 float: left;
6074 width: 150px;
6075 padding: 0;
6076 margin: 0 0 0 -150px;
6077
6078 .req {
6079 font-weight: 700;
6080 font-style: normal;
6081 color: $red;
6082 }
6083 }
6084
6085 .description,
6086 input[type="checkbox"]="checkbox""] + .description,
6087 input[type="radio"]="radio""] + .description {
6088 padding: 0;
6089 margin: 0 0 0 7px;
6090 clear: none;
6091 display: inline;
6092 }
6093
6094 input:not([type="checkbox"]):not([type="radio"]) + .description {
6095 display: block;
6096 clear: both;
6097 margin-left: 0;
6098 }
6099
6100 .description-block {
6101 margin-left: 0;
6102 display: block;
6103 }
6104
6105 textarea,
6106 input,
6107 select {
6108 margin: 0;
6109 }
6110
6111 textarea {
6112 float: left;
6113 height: 3.5em;
6114 line-height: 1.5em;
6115 vertical-align: top;
6116 }
6117
6118 input[type="text"]="text""],
6119 input[type="email"]="email""],
6120 input[type="number"]="number""],
6121 input[type="password"]="password""] {
6122 width: 50%;
6123 float: left;
6124 }
6125
6126 input.button {
6127 width: auto;
6128 margin-left: 8px;
6129 }
6130
6131 select {
6132 float: left;
6133 }
6134
6135 input[type="text"]="text""].short,
6136 input[type="email"]="email""].short,
6137 input[type="number"]="number""].short,
6138 input[type="password"]="password""].short,
6139 .short {
6140 width: 50%;
6141 }
6142
6143 .sized {
6144 width: auto !important;
6145 margin-right: 6px;
6146 }
6147
6148 .options_group {
6149 border-top: 1px solid white;
6150 border-bottom: 1px solid #eee;
6151
6152 &:first-child {
6153 border-top: 0;
6154 }
6155
6156 &:last-child {
6157 border-bottom: 0;
6158 }
6159
6160 fieldset {
6161 margin: 9px 0;
6162 font-size: 12px;
6163 padding: 5px 9px;
6164 line-height: 24px;
6165
6166 label {
6167 width: auto;
6168 float: none;
6169 }
6170
6171 ul {
6172 float: left;
6173 width: 50%;
6174 margin: 0;
6175 padding: 0;
6176
6177 li {
6178 margin: 0;
6179 width: auto;
6180
6181 input {
6182 width: auto;
6183 float: none;
6184 margin-right: 4px;
6185 }
6186 }
6187 }
6188
6189 ul.wc-radios label {
6190 margin-left: 0;
6191 }
6192 }
6193 }
6194
6195 .dimensions_field .wrap {
6196 display: block;
6197 width: 50%;
6198
6199 input {
6200 width: 30.75%;
6201 margin-right: 3.8%;
6202 }
6203
6204 .last {
6205 margin-right: 0;
6206 }
6207 }
6208
6209 &.padded {
6210 padding: 1em;
6211 }
6212
6213 .select2-container {
6214 float: left;
6215 }
6216
6217 .inventory_sold_individually {
6218 display: flex;
6219
6220 .woocommerce-help-tip {
6221 align-self: center;
6222 }
6223 }
6224 }
6225
6226 #woocommerce-product-data input.dp-applied {
6227 float: left;
6228 }
6229
6230 #grouped_product_options,
6231 #virtual_product_options,
6232 #simple_product_options {
6233 padding: 12px;
6234 font-style: italic;
6235 color: #666;
6236 }
6237
6238 /**
6239 * WooCommerce meta boxes
6240 */
6241 .wc-metaboxes-wrapper {
6242 :not(#variable_product_options_inner),
6243 &#product_attributes {
6244 .toolbar:not(.expand-close-hidden) {
6245 border-bottom: 1px solid #eee;
6246 }
6247 }
6248 .toolbar {
6249 margin: 0 !important;
6250 border-top: 1px solid white;
6251 padding: 9px 12px !important;
6252
6253 &:first-child {
6254 border-top: 0;
6255 }
6256
6257 &:last-child {
6258 border-bottom: 0;
6259 }
6260
6261 .add_variation {
6262 float: right;
6263 margin-left: 5px;
6264 }
6265
6266 .save-variation-changes,
6267 .cancel-variation-changes {
6268 float: left;
6269 margin-right: 5px;
6270 }
6271 }
6272
6273 p.toolbar {
6274 overflow: hidden;
6275 zoom: 1;
6276 }
6277
6278 .expand-close {
6279 margin-right: 2px;
6280 color: #777;
6281 font-size: 12px;
6282 font-style: italic;
6283
6284 a {
6285 background: none;
6286 padding: 0;
6287 font-size: 12px;
6288 text-decoration: none;
6289 }
6290 }
6291
6292 &#product_attributes .expand-close {
6293 float: right;
6294 line-height: 28px;
6295 }
6296
6297 button.add_variable_attribute,
6298 .fr {
6299 float: right;
6300 margin: 0 0 0 6px;
6301 }
6302
6303 .wc-metaboxes {
6304 border-bottom: 1px solid #eee;
6305 }
6306
6307 .wc-metabox-sortable-placeholder {
6308 border-color: #bbb;
6309 background-color: #f5f5f5;
6310 margin-bottom: 9px;
6311 border-width: 1px;
6312 border-style: dashed;
6313 }
6314
6315 .wc-metabox {
6316 background: #fff;
6317 border-bottom: 1px solid #eee;
6318 margin: 0 !important;
6319
6320 select {
6321 font-weight: 400;
6322 }
6323
6324 &:last-of-type {
6325 border-bottom: 0;
6326 }
6327
6328 .handlediv {
6329 width: 27px;
6330 float: right;
6331
6332 &::before {
6333 content: "\f142" !important;
6334 cursor: pointer;
6335 display: inline-block;
6336 font: 400 20px/1 "Dashicons";
6337 line-height: 0.5 !important;
6338 padding: 8px 10px;
6339 position: relative;
6340 right: 12px;
6341 top: 0;
6342 }
6343 }
6344
6345 &.closed {
6346 @include border-radius(3px);
6347
6348 .handlediv::before {
6349 content: "\f140" !important;
6350 }
6351
6352 h3 {
6353 border: 0;
6354 }
6355 }
6356
6357 h3 {
6358 margin: 0 !important;
6359 padding: 0.75em 0.75em 0.75em 1em !important;
6360 font-size: 1em !important;
6361 overflow: hidden;
6362 zoom: 1;
6363 cursor: move;
6364
6365 button,
6366 a.delete,
6367 a.edit {
6368 float: right;
6369 margin-right: 12px;
6370 }
6371
6372 a.delete {
6373 color: red;
6374 font-weight: normal;
6375 line-height: 26px;
6376 text-decoration: none;
6377 position: relative;
6378 }
6379
6380 a.edit {
6381 font-weight: normal;
6382 line-height: 26px;
6383 text-decoration: none;
6384 position: relative;
6385 }
6386
6387 a.remove_variation {
6388 margin: 0 0.5em;
6389 }
6390
6391 strong {
6392 font-weight: normal;
6393 line-height: 26px;
6394 font-weight: 700;
6395 }
6396
6397 select {
6398 font-family: sans-serif;
6399 max-width: 20%;
6400 margin: 0.25em 0.25em 0.25em 0;
6401 }
6402
6403 .handlediv {
6404 background-position: 6px 5px !important;
6405 margin: 4px 0 -1px !important;
6406 height: 26px;
6407 }
6408
6409 &.fixed {
6410 cursor: pointer !important;
6411 }
6412 }
6413
6414 &.woocommerce_attribute h3,
6415 &.woocommerce_variation h3 {
6416 cursor: pointer;
6417 padding: 0.5em 0.75em 0.5em 1em !important;
6418
6419 a.delete,
6420 a.edit,
6421 .sort {
6422 margin-top: 0.25em;
6423 }
6424 }
6425 &.woocommerce_variation h3 {
6426 a.delete,
6427 a.edit,
6428 .sort {
6429 margin-top: 0.45em;
6430 }
6431 }
6432
6433 table {
6434 width: 100%;
6435 position: relative;
6436 background-color: #fdfdfd;
6437 padding: 1em;
6438 border-top: 1px solid #eee;
6439
6440 td {
6441 text-align: left;
6442 padding: 0 6px 1em 0;
6443 vertical-align: top;
6444 border: 0;
6445
6446 label {
6447 text-align: left;
6448 display: block;
6449 line-height: 21px;
6450 }
6451
6452 input {
6453 float: left;
6454 min-width: 200px;
6455 }
6456
6457 input,
6458 textarea {
6459 width: 100%;
6460 margin: 0;
6461 display: block;
6462 font-size: 14px;
6463 padding: 4px;
6464 color: #555;
6465 }
6466
6467 select,
6468 .select2-container {
6469 width: 100% !important;
6470 }
6471
6472 input.short {
6473 width: 200px;
6474 }
6475
6476 input.checkbox {
6477 width: 16px;
6478 min-width: inherit;
6479 vertical-align: text-bottom;
6480 display: inline-block;
6481 float: none;
6482 }
6483 }
6484
6485 td.attribute_name {
6486 width: 200px;
6487 }
6488
6489 .plus,
6490 .minus {
6491 margin-top: 6px;
6492 }
6493
6494 .fl {
6495 float: left;
6496 }
6497
6498 .fr {
6499 float: right;
6500 }
6501 }
6502 .placeholder {
6503 opacity: 0.4;
6504 }
6505 }
6506 }
6507
6508 .variations-pagenav {
6509 float: right;
6510 line-height: 24px;
6511
6512 .displaying-num {
6513 color: #777;
6514 font-size: 12px;
6515 font-style: italic;
6516 }
6517
6518 a {
6519 padding: 0 10px 3px;
6520 background: rgba(0, 0, 0, 0.05);
6521 font-size: 16px;
6522 font-weight: 400;
6523 text-decoration: none;
6524 }
6525
6526 a.disabled,
6527 a.disabled:active,
6528 a.disabled:focus,
6529 a.disabled:hover {
6530 color: #a0a5aa;
6531 background: rgba(0, 0, 0, 0.05);
6532 }
6533 }
6534
6535 .variations-defaults {
6536 float: left;
6537
6538 select {
6539 margin: 0.25em 0.25em 0.25em 0;
6540 }
6541 }
6542
6543 .woocommerce_variable_attributes {
6544 background-color: #fdfdfd;
6545 border-top: 1px solid #eee;
6546
6547 .data {
6548 @include clearfix;
6549 padding: 1em 2em;
6550 }
6551
6552 .upload_image_button {
6553 display: block;
6554 width: 128px;
6555 height: 128px;
6556 float: left;
6557 margin-right: 20px;
6558 position: relative;
6559 cursor: pointer;
6560
6561 img {
6562 width: 100%;
6563 height: auto;
6564 display: none;
6565 }
6566
6567 &::before {
6568 content: "\f128";
6569 font-family: "Dashicons";
6570 position: absolute;
6571 top: 0;
6572 left: 0;
6573 right: 0;
6574 bottom: 0;
6575 text-align: center;
6576 line-height: 128px;
6577 font-size: 128px;
6578 font-weight: 400;
6579 -webkit-font-smoothing: antialiased;
6580 }
6581
6582 &.remove {
6583 img {
6584 display: block;
6585 }
6586
6587 &::before {
6588 content: "\f335";
6589 display: none;
6590 }
6591
6592 &:hover::before {
6593 display: block;
6594 }
6595 }
6596 }
6597
6598 .options {
6599 border: 1px solid #eee;
6600 border-width: 1px 0;
6601 padding: 0.25em 0;
6602
6603 label {
6604 display: inline-block;
6605 padding: 4px 1em 2px 0;
6606 }
6607
6608 input[type="checkbox"]="checkbox""] {
6609 margin: 0 5px 0 0.5em !important;
6610 vertical-align: middle;
6611 }
6612 }
6613 }
6614
6615 .form-row {
6616 label {
6617 display: inline-block;
6618 }
6619
6620 .woocommerce-help-tip {
6621 float: right;
6622 }
6623
6624 input[type="text"]="text""],
6625 input[type="number"]="number""],
6626 input[type="password"]="password""],
6627 input[type="color"]="color""],
6628 input[type="date"]="date""],
6629 input[type="datetime"]="datetime""],
6630 input[type="datetime-local"]="datetime-local""],
6631 input[type="email"]="email""],
6632 input[type="month"]="month""],
6633 input[type="search"]="search""],
6634 input[type="tel"]="tel""],
6635 input[type="time"]="time""],
6636 input[type="url"]="url""],
6637 input[type="week"]="week""],
6638 select,
6639 textarea {
6640 width: 100%;
6641 vertical-align: middle;
6642 margin: 2px 0 0;
6643 padding: 5px;
6644 }
6645
6646 select {
6647 height: 40px;
6648 }
6649
6650 &.dimensions_field {
6651 .wrap {
6652 clear: left;
6653 display: block;
6654 }
6655
6656 input {
6657 width: 33%;
6658 float: left;
6659 vertical-align: middle;
6660
6661 &:last-of-type {
6662 margin-right: 0;
6663 width: 34%;
6664 }
6665 }
6666 }
6667
6668 &.form-row-first,
6669 &.form-row-last {
6670 width: 48%;
6671 float: right;
6672 }
6673
6674 &.form-row-first {
6675 clear: both;
6676 float: left;
6677 }
6678
6679 &.form-row-full {
6680 clear: both;
6681 }
6682 }
6683
6684 .form-flex-box {
6685 display: flex;
6686 justify-content: space-between;
6687 align-items: center;
6688 }
6689
6690 /**
6691 * Tooltips
6692 */
6693 .tips {
6694 cursor: help;
6695 text-decoration: none;
6696 }
6697
6698 img.tips {
6699 padding: 5px 0 0;
6700 }
6701
6702 #tiptip_holder {
6703 display: none;
6704 z-index: 8675309;
6705 position: absolute;
6706 top: 0;
6707 pointer-events: none;
6708
6709 /*rtl:ignore*/
6710 left: 0;
6711
6712 &.tip_top {
6713 padding-bottom: 5px;
6714
6715 #tiptip_arrow_inner {
6716 margin-top: -7px;
6717 margin-left: -6px;
6718 border-top-color: #333;
6719 }
6720 }
6721
6722 &.tip_bottom {
6723 padding-top: 5px;
6724
6725 #tiptip_arrow_inner {
6726 margin-top: -5px;
6727 margin-left: -6px;
6728 border-bottom-color: #333;
6729 }
6730 }
6731
6732 &.tip_right {
6733 padding-left: 5px;
6734
6735 #tiptip_arrow_inner {
6736 margin-top: -6px;
6737 margin-left: -5px;
6738 border-right-color: #333;
6739 }
6740 }
6741
6742 &.tip_left {
6743 padding-right: 5px;
6744
6745 #tiptip_arrow_inner {
6746 margin-top: -6px;
6747 margin-left: -7px;
6748 border-left-color: #333;
6749 }
6750 }
6751 }
6752
6753 #tiptip_content,
6754 .chart-tooltip,
6755 .wc_error_tip {
6756 color: #fff;
6757 font-size: 0.8em;
6758 max-width: 150px;
6759 background: #333;
6760 text-align: center;
6761 border-radius: 3px;
6762 padding: 0.618em 1em;
6763 box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
6764
6765 code {
6766 padding: 1px;
6767 background: #888;
6768 }
6769 }
6770
6771 #tiptip_arrow,
6772 #tiptip_arrow_inner {
6773 position: absolute;
6774 border-color: transparent;
6775 border-style: solid;
6776 border-width: 6px;
6777 height: 0;
6778 width: 0;
6779 }
6780
6781 /*rtl:raw:
6782 #tiptip_arrow {
6783 right: 50%;
6784 margin-right: -6px;
6785 }
6786 */
6787
6788 .wc_error_tip {
6789 max-width: 20em;
6790 line-height: 1.8em;
6791 position: absolute;
6792 white-space: normal;
6793 background: #d82223;
6794 margin: 1.5em 1px 0 -1em;
6795 z-index: 9999999;
6796
6797 &::after {
6798 content: "";
6799 display: block;
6800 border: 8px solid #d82223;
6801 border-right-color: transparent;
6802 border-left-color: transparent;
6803 border-top-color: transparent;
6804 position: absolute;
6805 top: -3px;
6806 left: 50%;
6807 margin: -1em 0 0 -3px;
6808 }
6809 }
6810
6811 /**
6812 * Date picker
6813 */
6814 img.ui-datepicker-trigger {
6815 vertical-align: middle;
6816 margin-top: -1px;
6817 cursor: pointer;
6818 }
6819
6820 .woocommerce_options_panel img.ui-datepicker-trigger,
6821 .wc-metabox-content img.ui-datepicker-trigger {
6822 float: left;
6823 margin-right: 8px;
6824 margin-top: 4px;
6825 margin-left: 4px;
6826 }
6827
6828 #ui-datepicker-div {
6829 display: none;
6830 }
6831
6832 /**
6833 * Reports
6834 */
6835 .woocommerce-reports-remove-filter {
6836 color: red;
6837 text-decoration: none;
6838 }
6839
6840 .woocommerce-reports-wrap,
6841 .woocommerce-reports-wide {
6842 &.woocommerce-reports-wrap {
6843 margin-left: 300px;
6844 padding-top: 18px;
6845 }
6846
6847 &.halved {
6848 margin: 0;
6849 overflow: hidden;
6850 zoom: 1;
6851 }
6852
6853 .widefat th {
6854 padding: 7px;
6855 }
6856
6857 .widefat td {
6858 vertical-align: top;
6859 padding: 7px;
6860
6861 .description {
6862 margin: 4px 0 0;
6863 }
6864 }
6865
6866 .postbox {
6867 &::after {
6868 content: ".";
6869 display: block;
6870 height: 0;
6871 clear: both;
6872 visibility: hidden;
6873 }
6874
6875 h3 {
6876 cursor: default !important;
6877 }
6878
6879 .inside {
6880 padding: 10px;
6881 margin: 0 !important;
6882 }
6883
6884 div.stats_range,
6885 h3.stats_range {
6886 border-bottom-color: #dfdfdf;
6887 margin: 0;
6888 padding: 0 !important;
6889
6890 .export_csv {
6891 float: right;
6892 line-height: 26px;
6893 border-left: 1px solid #dfdfdf;
6894 padding: 10px;
6895 display: block;
6896 text-decoration: none;
6897
6898 &::before {
6899 @include iconbeforedashicons("\f346");
6900 margin-right: 4px;
6901 }
6902 }
6903
6904 ul {
6905 list-style: none outside;
6906 margin: 0;
6907 padding: 0;
6908 zoom: 1;
6909 background: #f5f5f5;
6910 border-bottom: 1px solid #ccc;
6911
6912 &::before,
6913 &::after {
6914 content: " ";
6915 display: table;
6916 }
6917
6918 &::after {
6919 clear: both;
6920 }
6921
6922 li {
6923 float: left;
6924 margin: 0;
6925 padding: 0;
6926 line-height: 26px;
6927 font-weight: bold;
6928 font-size: 14px;
6929
6930 a {
6931 border-right: 1px solid #dfdfdf;
6932 padding: 10px;
6933 display: block;
6934 text-decoration: none;
6935 }
6936
6937 &.active {
6938 background: #fff;
6939 box-shadow: 0 4px 0 0 #fff;
6940
6941 a {
6942 color: #777;
6943 }
6944 }
6945
6946 &.custom {
6947 padding: 9px 10px;
6948 vertical-align: middle;
6949
6950 form,
6951 div {
6952 display: inline;
6953 margin: 0;
6954
6955 input.range_datepicker {
6956 padding: 0;
6957 margin: 0 10px 0 0;
6958 background: transparent;
6959 border: 0;
6960 color: #777;
6961 text-align: center;
6962 box-shadow: none;
6963
6964 &.from {
6965 margin-right: 0;
6966 }
6967 }
6968 }
6969 }
6970 }
6971 }
6972 }
6973
6974 .chart-with-sidebar {
6975 padding: 12px 12px 12px 249px;
6976 margin: 0 !important;
6977
6978 .chart-sidebar {
6979 width: 225px;
6980 margin-left: -237px;
6981 float: left;
6982 }
6983 }
6984
6985 .chart-widgets {
6986 margin: 0;
6987 padding: 0;
6988
6989 li.chart-widget {
6990 margin: 0 0 1em;
6991 background: #fafafa;
6992 border: 1px solid #dfdfdf;
6993
6994 &::after {
6995 content: ".";
6996 display: block;
6997 height: 0;
6998 clear: both;
6999 visibility: hidden;
7000 }
7001
7002 h4 {
7003 background: #fff;
7004 border: 1px solid #dfdfdf;
7005 border-left-width: 0;
7006 border-right-width: 0;
7007 padding: 10px;
7008 margin: 0;
7009 color: $blue;
7010 border-top-width: 0;
7011 background-image: linear-gradient(to top, #ececec, #f9f9f9);
7012
7013 &.section_title:hover {
7014 color: $red;
7015 }
7016 }
7017
7018 .section_title {
7019 cursor: pointer;
7020
7021 span {
7022 display: block;
7023
7024 &::after {
7025 @include iconafter("\e035");
7026 float: right;
7027 font-size: 0.9em;
7028 line-height: 1.618;
7029 }
7030 }
7031
7032 &.open {
7033 color: #333;
7034
7035 span::after {
7036 display: none;
7037 }
7038 }
7039 }
7040
7041 .section {
7042 border-bottom: 1px solid #dfdfdf;
7043
7044 .select2-container {
7045 width: 100% !important;
7046 }
7047
7048 &:last-of-type {
7049 border-radius: 0 0 3px 3px;
7050 }
7051 }
7052
7053 table {
7054 width: 100%;
7055
7056 td {
7057 padding: 7px 10px;
7058 vertical-align: top;
7059 border-top: 1px solid #e5e5e5;
7060 line-height: 1.4em;
7061 }
7062
7063 tr:first-child td {
7064 border-top: 0;
7065 }
7066
7067 td.count {
7068 background: #f5f5f5;
7069 }
7070
7071 td.name {
7072 max-width: 175px;
7073
7074 a {
7075 word-wrap: break-word;
7076 }
7077 }
7078
7079 td.sparkline {
7080 vertical-align: middle;
7081 }
7082
7083 .wc_sparkline {
7084 width: 32px;
7085 height: 1em;
7086 display: block;
7087 float: right;
7088 }
7089
7090 tr.active td {
7091 background: #f5f5f5;
7092 }
7093 }
7094
7095 form,
7096 p {
7097 margin: 0;
7098 padding: 10px;
7099
7100 .submit {
7101 margin-top: 10px;
7102 }
7103 }
7104
7105 #product_ids {
7106 width: 100%;
7107 }
7108
7109 .select_all,
7110 .select_none {
7111 float: right;
7112 color: #999;
7113 margin-left: 4px;
7114 margin-top: 10px;
7115 }
7116
7117 .description {
7118 margin-left: 0.5em;
7119 font-weight: normal;
7120 opacity: 0.8;
7121 }
7122 }
7123 }
7124
7125 .chart-legend {
7126 list-style: none outside;
7127 margin: 0 0 1em;
7128 padding: 0;
7129 border: 1px solid #dfdfdf;
7130 border-right-width: 0;
7131 border-bottom-width: 0;
7132 background: #fff;
7133
7134 li {
7135 border-right: 5px solid #aaa;
7136 color: #aaa;
7137 padding: 1em;
7138 display: block;
7139 margin: 0;
7140 transition: all ease 0.5s;
7141 box-shadow: inset 0 -1px 0 0 #dfdfdf;
7142
7143 strong {
7144 font-size: 1.618em;
7145 line-height: 1.2em;
7146 color: #464646;
7147 font-weight: normal;
7148 display: block;
7149 font-family: "HelveticaNeue-Light", "Helvetica Neue Light",
7150 "Helvetica Neue", sans-serif;
7151
7152 del {
7153 color: #e74c3c;
7154 font-weight: normal;
7155 }
7156 }
7157
7158 &:hover {
7159 box-shadow: inset 0 -1px 0 0 #dfdfdf,
7160 inset 300px 0 0 #f7edf7;
7161 border-right: 5px solid var(--wc-primary) !important;
7162 padding-left: 1.5em;
7163 color: var(--wc-primary);
7164 }
7165 }
7166 }
7167
7168 .pie-chart-legend {
7169 margin: 12px 0 0;
7170 overflow: hidden;
7171
7172 li {
7173 float: left;
7174 margin: 0;
7175 padding: 6px 0 0;
7176 border-top: 4px solid #999;
7177 text-align: center;
7178 box-sizing: border-box;
7179 width: 50%;
7180 }
7181 }
7182
7183 .stat {
7184 font-size: 1.5em !important;
7185 font-weight: 700;
7186 text-align: center;
7187 }
7188
7189 .chart-placeholder {
7190 width: 100%;
7191 height: 650px;
7192 overflow: hidden;
7193 position: relative;
7194 }
7195
7196 .chart-prompt {
7197 line-height: 650px;
7198 margin: 0;
7199 color: #999;
7200 font-size: 1.2em;
7201 font-style: italic;
7202 text-align: center;
7203 }
7204
7205 .chart-container {
7206 background: #fff;
7207 padding: 12px;
7208 position: relative;
7209 border: 1px solid #dfdfdf;
7210 border-radius: 3px;
7211 }
7212
7213 .main .chart-legend {
7214 margin-top: 12px;
7215
7216 li {
7217 border-right: 0;
7218 margin: 0 8px 0 0;
7219 float: left;
7220 border-top: 4px solid #aaa;
7221 }
7222 }
7223 }
7224
7225 .woocommerce-reports-main {
7226 float: left;
7227 min-width: 100%;
7228
7229 table td {
7230 padding: 9px;
7231 }
7232 }
7233
7234 .woocommerce-reports-sidebar {
7235 display: inline;
7236 width: 281px;
7237 margin-left: -300px;
7238 clear: both;
7239 float: left;
7240 }
7241
7242 .woocommerce-reports-left {
7243 width: 49.5%;
7244 float: left;
7245 }
7246
7247 .woocommerce-reports-right {
7248 width: 49.5%;
7249 float: right;
7250 }
7251 }
7252
7253 .woocommerce-wide-reports-wrap {
7254 padding-bottom: 11px;
7255
7256 .widefat {
7257 .export-data {
7258 float: right;
7259 }
7260
7261 th,
7262 td {
7263 vertical-align: middle;
7264 padding: 7px;
7265 }
7266 }
7267 }
7268
7269 form.report_filters {
7270 p {
7271 vertical-align: middle;
7272 }
7273
7274 label,
7275 input,
7276 div {
7277 vertical-align: middle;
7278 }
7279 }
7280
7281 .chart-tooltip {
7282 position: absolute;
7283 display: none;
7284 line-height: 1;
7285 }
7286
7287 table.bar_chart {
7288 width: 100%;
7289
7290 thead th {
7291 text-align: left;
7292 color: #ccc;
7293 padding: 6px 0;
7294 }
7295
7296 tbody {
7297 th {
7298 padding: 6px 0;
7299 width: 25%;
7300 text-align: left !important;
7301 font-weight: normal !important;
7302 border-bottom: 1px solid #fee;
7303 }
7304
7305 td {
7306 text-align: right;
7307 line-height: 24px;
7308 padding: 6px 6px 6px 0;
7309 border-bottom: 1px solid #fee;
7310
7311 span {
7312 color: #8a4b75;
7313 display: block;
7314 }
7315
7316 span.alt {
7317 color: #47a03e;
7318 margin-top: 6px;
7319 }
7320 }
7321
7322 td.bars {
7323 position: relative;
7324 text-align: left;
7325 padding: 6px 6px 6px 0;
7326 border-bottom: 1px solid #fee;
7327
7328 span,
7329 a {
7330 text-decoration: none;
7331 clear: both;
7332 background: #8a4b75;
7333 float: left;
7334 display: block;
7335 line-height: 24px;
7336 height: 24px;
7337 border-radius: 3px;
7338 }
7339
7340 span.alt {
7341 clear: both;
7342 background: #47a03e;
7343
7344 span {
7345 margin: 0;
7346 color: #c5dec2 !important;
7347 text-shadow: 0 1px 0 #47a03e;
7348 background: transparent;
7349 }
7350 }
7351 }
7352 }
7353 }
7354
7355 .woocommerce_page_wc-orders,
7356 .post-type-shop_order {
7357 .woocommerce-BlankState-message::before {
7358 @include icon("\e01d");
7359 }
7360 }
7361
7362 .post-type-shop_coupon .woocommerce-BlankState-message::before {
7363 @include icon("\e600");
7364 }
7365
7366 .post-type-product .woocommerce-BlankState-message::before {
7367 @include icon("\e006");
7368 }
7369
7370 .woocommerce-BlankState--api .woocommerce-BlankState-message::before {
7371 @include icon("\e01c");
7372 }
7373
7374 .woocommerce-BlankState--webhooks .woocommerce-BlankState-message::before {
7375 @include icon("\e01b");
7376 }
7377
7378 .woocommerce-BlankState {
7379 text-align: center;
7380 padding: 5em 0 0;
7381
7382 .woocommerce-BlankState-message {
7383 color: #aaa;
7384 margin: 0 auto 1.5em;
7385 line-height: 1.5em;
7386 font-size: 1.2em;
7387 max-width: 500px;
7388
7389 &::before {
7390 color: #ddd;
7391 text-shadow: 0 -1px 1px rgba(0, 0, 0, 0.2),
7392 0 1px 0 rgba(255, 255, 255, 0.8);
7393 font-size: 8em;
7394 display: block;
7395 position: relative !important;
7396 top: auto;
7397 left: auto;
7398 line-height: 1em;
7399 margin: 0 0 0.1875em;
7400 }
7401 }
7402
7403 .woocommerce-BlankState-cta {
7404 font-size: 1.2em;
7405 padding: 0.75em 1.5em;
7406 margin: 0 0.25em;
7407 height: auto;
7408 display: inline-block !important;
7409 }
7410 }
7411
7412 .woocommerce_page_wc-orders .woocommerce-BlankState,
7413 .post-type-product .woocommerce-BlankState,
7414 .post-type-shop_order .woocommerce-BlankState {
7415 max-width: 764px;
7416 text-align: center;
7417 margin: auto;
7418
7419 .woocommerce-BlankState-message {
7420 color: #444;
7421 font-size: 1.5em;
7422 margin: 0 auto 1em;
7423 }
7424
7425 .woocommerce-BlankState-message::before {
7426 font-size: 120px;
7427 }
7428
7429 .woocommerce-BlankState-buttons {
7430 margin-bottom: 4em;
7431 }
7432 }
7433
7434 .post-type-product {
7435 #wp-pointer-2 .wp-pointer-arrow {
7436 left: 240px;
7437 }
7438
7439 #wp-pointer-3 .wp-pointer-arrow,
7440 #wp-pointer-4 .wp-pointer-arrow {
7441 left: 46%;
7442 }
7443 }
7444
7445 /**
7446 * Small screen optimisation
7447 */
7448 @media only screen and (max-width: 1280px) {
7449 #order_data {
7450 .order_data_column {
7451 width: 48%;
7452
7453 &:first-child {
7454 width: 100%;
7455 }
7456 }
7457 }
7458
7459 .woocommerce_options_panel {
7460 .description {
7461 display: block;
7462 clear: both;
7463 margin-left: 0;
7464 }
7465
7466 .short,
7467 input[type="text"]="text""].short,
7468 input[type="email"]="email""].short,
7469 input[type="number"]="number""].short,
7470 input[type="password"]="password""].short,
7471 .dimensions_field .wrap {
7472 width: 80%;
7473 }
7474 }
7475
7476 .woocommerce_variations,
7477 .woocommerce_options_panel {
7478 .downloadable_files {
7479 padding: 0;
7480 clear: both;
7481
7482 label {
7483 position: static;
7484 }
7485
7486 table {
7487 margin: 0 12px 24px;
7488 width: 94%;
7489
7490 .sort {
7491 visibility: hidden;
7492 }
7493 }
7494 }
7495
7496 .woocommerce_variable_attributes .downloadable_files table {
7497 margin: 0 0 1em;
7498 width: 100%;
7499 }
7500 }
7501 }
7502
7503 /**
7504 * Optimisation for screens 900px and smaller
7505 */
7506 @media only screen and (max-width: 900px) {
7507 #woocommerce-coupon-data ul.coupon_data_tabs,
7508 #woocommerce-product-data ul.product_data_tabs,
7509 #woocommerce-product-data .wc-tabs-back {
7510 width: 10%;
7511 }
7512
7513 #woocommerce-coupon-data .wc-metaboxes-wrapper,
7514 #woocommerce-coupon-data .woocommerce_options_panel,
7515 #woocommerce-product-data .wc-metaboxes-wrapper,
7516 #woocommerce-product-data .woocommerce_options_panel {
7517 width: 90%;
7518 }
7519
7520 #woocommerce-coupon-data ul.coupon_data_tabs li a,
7521 #woocommerce-product-data ul.product_data_tabs li a {
7522 position: relative;
7523 text-indent: -999px;
7524 padding: 10px;
7525
7526 &::before {
7527 position: absolute;
7528 top: 0;
7529 right: 0;
7530 bottom: 0;
7531 left: 0;
7532 text-indent: 0;
7533 text-align: center;
7534 line-height: 40px;
7535 width: 100%;
7536 height: 40px;
7537 }
7538 }
7539 }
7540
7541 /**
7542 * Optimisation for screens 782px and smaller
7543 */
7544 @media only screen and (max-width: 782px) {
7545 #wp-excerpt-media-buttons a {
7546 font-size: 16px;
7547 line-height: 37px;
7548 height: 39px;
7549 padding: 0 20px 0 15px;
7550 }
7551
7552 #wp-excerpt-editor-tools {
7553 padding-top: 20px;
7554 padding-right: 15px;
7555 overflow: hidden;
7556 margin-bottom: -1px;
7557 }
7558
7559 #woocommerce-product-data .checkbox {
7560 width: 25px;
7561 }
7562
7563 .variations-pagenav {
7564 float: none;
7565 text-align: center;
7566 font-size: 18px;
7567
7568 .displaying-num {
7569 font-size: 16px;
7570 }
7571
7572 a {
7573 padding: 8px 20px 11px;
7574 font-size: 18px;
7575 }
7576
7577 select {
7578 padding: 0 20px;
7579 }
7580 }
7581
7582 .variations-defaults {
7583 float: none;
7584 text-align: center;
7585 margin-top: 10px;
7586 }
7587
7588 .post-type-product {
7589 .wp-list-table {
7590 .column-thumb {
7591 display: none;
7592 text-align: left;
7593 padding-bottom: 0;
7594
7595 &::before {
7596 display: none !important;
7597 }
7598
7599 img {
7600 max-width: 32px;
7601 }
7602 }
7603
7604 .is-expanded td:not(.hidden) {
7605 overflow: visible;
7606 }
7607
7608 .is-expanded .toggle-row {
7609 top: -28px;
7610 }
7611 }
7612 }
7613
7614 .post-type-shop_order {
7615 .wp-list-table {
7616 .column-customer_message,
7617 .column-order_notes {
7618 text-align: inherit;
7619 }
7620
7621 .column-order_notes .note-on {
7622 font-size: 1.3em;
7623 margin: 0;
7624 }
7625
7626 .is-expanded td:not(.hidden) {
7627 overflow: visible;
7628 }
7629 }
7630 }
7631 }
7632
7633 @media only screen and (max-width: 500px) {
7634 .woocommerce_options_panel label,
7635 .woocommerce_options_panel legend {
7636 float: none;
7637 width: auto;
7638 display: block;
7639 margin: 0;
7640 }
7641
7642 .woocommerce_options_panel fieldset.form-field,
7643 .woocommerce_options_panel p.form-field {
7644 padding: 5px 20px !important;
7645 }
7646
7647 .addons-wcs-banner-block {
7648 flex-direction: column;
7649 }
7650
7651 .wc-addons-wrap {
7652 .addons-wcs-banner-block {
7653 padding: 40px;
7654 }
7655
7656 .addons-wcs-banner-block-image {
7657 padding: 1em;
7658 text-align: center;
7659 width: 100%;
7660 padding: 2em 0;
7661 margin: 0;
7662
7663 .addons-img {
7664 margin: 0;
7665 }
7666 }
7667 }
7668 }
7669
7670 /**
7671 * Backbone modal dialog
7672 */
7673 .wc-backbone-modal {
7674 * {
7675 box-sizing: border-box;
7676 }
7677
7678 .wc-backbone-modal-content {
7679 position: fixed;
7680 background: #fff;
7681 z-index: 100000;
7682 left: 50%;
7683 top: 50%;
7684 transform: translate(-50%, -50%);
7685 width: 50%;
7686 max-width: 100%;
7687 min-width: 500px;
7688
7689 article {
7690 overflow: auto;
7691 }
7692 }
7693
7694 &.wc-backbone-modal-shipping-method-settings .wc-backbone-modal-content {
7695 min-width: 500px;
7696 }
7697
7698 &.wc-backbone-modal-add-shipping-method .wc-backbone-modal-content article {
7699 min-height: 180px
7700 }
7701
7702 .select2-container {
7703 width: 100% !important;
7704 }
7705 }
7706
7707 @media screen and (max-width: 782px) {
7708 .wc-backbone-modal .wc-backbone-modal-content {
7709 width: 100%;
7710 height: 100%;
7711 min-width: 100%;
7712 }
7713 }
7714
7715 .wc-backbone-modal-backdrop {
7716 position: fixed;
7717 top: 0;
7718 left: 0;
7719 right: 0;
7720 bottom: 0;
7721 min-height: 360px;
7722 background: #000;
7723 opacity: 0.7;
7724 z-index: 99900;
7725 }
7726
7727 .wc-backbone-modal-main {
7728 padding-bottom: 55px;
7729
7730 header,
7731 article {
7732 display: block;
7733 position: relative;
7734 }
7735
7736 .wc-backbone-modal-header {
7737 height: auto;
7738 background: #fcfcfc;
7739 padding: 1em 1.5em;
7740 border-bottom: 1px solid #ddd;
7741
7742 h1 {
7743 margin: 0;
7744 font-size: 18px;
7745 font-weight: 700;
7746 line-height: 1.5em;
7747 }
7748
7749 .modal-close-link {
7750 cursor: pointer;
7751 color: #777;
7752 height: 54px;
7753 width: 54px;
7754 padding: 0;
7755 position: absolute;
7756 top: 0;
7757 right: 0;
7758 text-align: center;
7759 border: 0;
7760 border-left: 1px solid #ddd;
7761 background-color: transparent;
7762 transition: color 0.1s ease-in-out, background 0.1s ease-in-out;
7763
7764 &::before {
7765 font: normal 22px/50px "dashicons" !important;
7766 color: #666;
7767 display: block;
7768 content: "\f335";
7769 font-weight: 300;
7770 }
7771
7772 &:hover,
7773 &:focus {
7774 background: #ddd;
7775 border-color: #ccc;
7776 color: #000;
7777 }
7778
7779 &:focus {
7780 outline: none;
7781 }
7782 }
7783 }
7784
7785 article {
7786 padding: 1.5em;
7787
7788 p {
7789 margin: 1.5em 0;
7790 }
7791
7792 p:first-child {
7793 margin-top: 0;
7794 }
7795
7796 p:last-child {
7797 margin-bottom: 0;
7798 }
7799
7800 .pagination {
7801 padding: 10px 0 0;
7802 text-align: center;
7803 }
7804
7805 table.widefat {
7806 margin: 0;
7807 width: 100%;
7808 border: 0;
7809 box-shadow: none;
7810
7811 thead th {
7812 padding: 0 1em 1em 1em;
7813 text-align: left;
7814
7815 &:first-child {
7816 padding-left: 0;
7817 }
7818
7819 &:last-child {
7820 padding-right: 0;
7821 text-align: right;
7822 }
7823 }
7824
7825 tbody td,
7826 tbody th {
7827 padding: 1em;
7828 text-align: left;
7829 vertical-align: middle;
7830
7831 &:first-child {
7832 padding-left: 0;
7833 }
7834
7835 &:last-child {
7836 padding-right: 0;
7837 text-align: right;
7838 }
7839
7840 select,
7841 .select2-container {
7842 width: 100%;
7843 }
7844 }
7845 }
7846 }
7847
7848 footer {
7849 position: absolute;
7850 left: 0;
7851 right: 0;
7852 bottom: 0;
7853 z-index: 100;
7854 padding: 1em 1.5em;
7855 background: #fcfcfc;
7856 border-top: 1px solid #dfdfdf;
7857 box-shadow: 0 -4px 4px -4px rgba(0, 0, 0, 0.1);
7858
7859 .inner {
7860 text-align: right;
7861 line-height: 23px;
7862
7863 .button {
7864 margin-bottom: 0;
7865 }
7866 }
7867 }
7868 }
7869
7870 /**
7871 * Select2 elements.
7872 */
7873 .select2-drop,
7874 .select2-dropdown {
7875 z-index: 999999 !important;
7876 }
7877
7878 .select2-results {
7879 line-height: 1.5em;
7880
7881 .select2-results__option,
7882 .select2-results__group {
7883 margin: 0;
7884 padding: 8px;
7885 }
7886
7887 .description {
7888 display: block;
7889 color: #999;
7890 padding-top: 4px;
7891 }
7892 }
7893
7894 .select2-dropdown {
7895 border-color: #ddd;
7896 }
7897
7898 .select2-dropdown--below {
7899 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
7900 }
7901
7902 .select2-dropdown--above {
7903 box-shadow: 0 -1px 1px rgba(0, 0, 0, 0.1);
7904 }
7905
7906 .select2-container {
7907 .select2-selection__rendered.ui-sortable li {
7908 cursor: move;
7909 }
7910
7911 .select2-selection {
7912 border-color: #ddd;
7913 }
7914
7915 .select2-search__field {
7916 min-width: 150px;
7917 }
7918
7919 .select2-selection--single {
7920 height: 40px;
7921
7922 .select2-selection__rendered {
7923 line-height: 40px;
7924 padding-right: 24px;
7925 }
7926
7927 .select2-selection__arrow {
7928 right: 3px;
7929 height: 36px;
7930 }
7931 }
7932
7933 .select2-selection--multiple {
7934 min-height: 28px;
7935 border-radius: 0;
7936 line-height: 1.5;
7937
7938 li {
7939 margin: 0;
7940 }
7941
7942 .select2-selection__choice {
7943 padding: 2px 6px;
7944
7945 .description {
7946 display: none;
7947 }
7948 }
7949 }
7950
7951 .select2-selection__clear {
7952 color: #999;
7953 margin-top: -1px;
7954 z-index: 1;
7955 }
7956
7957 .select2-search--inline .select2-search__field {
7958 font-family: inherit;
7959 font-size: inherit;
7960 font-weight: inherit;
7961 padding: 3px 0;
7962 }
7963 }
7964
7965 .woocommerce table.form-table .select2-container {
7966 min-width: 400px !important;
7967 }
7968
7969 .wc-wp-version-gte-53 {
7970 .select2-results {
7971 .select2-results__option,
7972 .select2-results__group {
7973 &:focus {
7974 outline: none;
7975 }
7976 }
7977 }
7978
7979 .select2-dropdown {
7980 border-color: var(--wp-admin-theme-color, #007cba);
7981
7982 &::after {
7983 position: absolute;
7984 left: 0;
7985 right: 0;
7986 height: 1px;
7987 background: #fff;
7988 content: "";
7989 }
7990 }
7991
7992 .select2-dropdown--below {
7993 box-shadow: 0 0 0 1px var(--wp-admin-theme-color, #007cba), 0 2px 1px rgba(0, 0, 0, 0.1);
7994
7995 &::after {
7996 top: -1px;
7997 }
7998 }
7999
8000 .select2-dropdown--above {
8001 box-shadow: 0 0 0 1px var(--wp-admin-theme-color, #007cba), 0 -2px 1px rgba(0, 0, 0, 0.1);
8002
8003 &::after {
8004 bottom: -1px;
8005 }
8006 }
8007
8008 .select2-container {
8009 @media only screen and (max-width: 782px) {
8010 font-size: 16px;
8011 }
8012
8013 &:focus {
8014 outline: none;
8015 }
8016
8017 .select2-selection--single {
8018 height: 30px;
8019 border-color: #7e8993;
8020
8021 @media only screen and (max-width: 782px) {
8022 height: 40px;
8023 }
8024
8025 &:focus {
8026 outline: none;
8027 }
8028
8029 .select2-selection__rendered {
8030 line-height: 28px;
8031
8032 @media only screen and (max-width: 782px) {
8033 line-height: 38px;
8034 }
8035
8036 &:hover {
8037 color: var(--wp-admin-theme-color, #007cba);
8038 }
8039 }
8040
8041 .select2-selection__arrow {
8042 right: 1px;
8043 height: 28px;
8044 width: 23px;
8045 background: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2220%22%20height%3D%2220%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M5%206l5%205%205-5%202%201-7%207-7-7%202-1z%22%20fill%3D%22%23555%22%2F%3E%3C%2Fsvg%3E")
8046 no-repeat right 5px top 55%;
8047 background-size: 16px 16px;
8048
8049 @media only screen and (max-width: 782px) {
8050 height: 38px;
8051 }
8052
8053 b {
8054 display: none;
8055 }
8056 }
8057 }
8058
8059 &.select2-container--focus .select2-selection--single,
8060 &.select2-container--open .select2-selection--single,
8061 &.select2-container--open .select2-selection--multiple {
8062 border-color: var(--wp-admin-theme-color, #007cba);
8063 box-shadow: 0 0 0 1px var(--wp-admin-theme-color, #007cba);
8064 }
8065
8066 .select2-selection--multiple {
8067 min-height: 30px;
8068 border-color: #7e8993;
8069 border-radius: 4px;
8070 }
8071
8072 .select2-search--inline .select2-search__field {
8073 padding: 0 0 0 3px;
8074 min-height: 28px;
8075 }
8076 }
8077
8078 .woocommerce table.form-table .select2-container {
8079 @media only screen and (max-width: 782px) {
8080 min-width: 100% !important;
8081 }
8082 }
8083 }
8084
8085 .wc-wp-version-gte-55 {
8086 #woocommerce-product-data {
8087 .hndle {
8088 display: block;
8089 line-height: 28px;
8090
8091 .type_box {
8092 display: inline;
8093 line-height: inherit;
8094 vertical-align: baseline;
8095 }
8096 }
8097 }
8098 }
8099
8100 /**
8101 * Select2 colors for built-in admin color themes.
8102 */
8103 .wp-admin {
8104 &.wc-wp-version-gte-53 {
8105 .select2-dropdown {
8106 border-color: var(--wp-admin-theme-color, #007cba);
8107 }
8108
8109 .select2-dropdown--below {
8110 box-shadow: 0 0 0 1px var(--wp-admin-theme-color, #007cba), 0 2px 1px rgba(0, 0, 0, 0.1);
8111 }
8112
8113 .select2-dropdown--above {
8114 box-shadow: 0 0 0 1px var(--wp-admin-theme-color, #007cba), 0 -2px 1px rgba(0, 0, 0, 0.1);
8115 }
8116
8117 .select2-selection--single .select2-selection__rendered:hover {
8118 color: var(--wp-admin-theme-color, #007cba);
8119 }
8120
8121 .select2-container.select2-container--focus .select2-selection--single,
8122 .select2-container.select2-container--open .select2-selection--single,
8123 .select2-container.select2-container--open
8124 .select2-selection--single,
8125 .select2-container.select2-container--open
8126 .select2-selection--multiple {
8127 border-color: var(--wp-admin-theme-color, #007cba);
8128 box-shadow: 0 0 0 1px var(--wp-admin-theme-color, #007cba);
8129 }
8130
8131 .select2-container--default
8132 .select2-results__option--highlighted[aria-selected]],
8133 .select2-container--default
8134 .select2-results__option--highlighted[data-selected]] {
8135 background-color: var(--wp-admin-theme-color, #007cba);
8136 }
8137 }
8138 }
8139
8140 .woocommerce_page_wc-orders .tablenav,
8141 .post-type-product .tablenav,
8142 .post-type-shop_order .tablenav {
8143 .actions {
8144 overflow: visible;
8145 }
8146
8147 select,
8148 input {
8149 height: 32px;
8150 }
8151
8152 .select2-container {
8153 float: left;
8154 width: 240px !important;
8155 font-size: 14px;
8156 vertical-align: middle;
8157 margin: 1px 6px 4px 1px;
8158 }
8159 }
8160
8161 .woocommerce-progress-form-wrapper,
8162 .woocommerce-exporter-wrapper,
8163 .woocommerce-importer-wrapper {
8164 text-align: center;
8165 max-width: 700px;
8166 margin: 40px auto;
8167
8168 .error {
8169 text-align: left;
8170 }
8171
8172 .wc-progress-steps {
8173 padding: 0 0 24px;
8174 margin: 0;
8175 list-style: none outside;
8176 overflow: hidden;
8177 color: #ccc;
8178 width: 100%;
8179 display: -webkit-inline-flex;
8180 display: -ms-inline-flexbox;
8181 display: inline-flex;
8182
8183 li {
8184 width: 25%;
8185 float: left;
8186 padding: 0 0 0.8em;
8187 margin: 0;
8188 text-align: center;
8189 position: relative;
8190 border-bottom: 4px solid #ccc;
8191 line-height: 1.4em;
8192 }
8193
8194 li::before {
8195 content: "";
8196 border: 4px solid #ccc;
8197 border-radius: 100%;
8198 width: 4px;
8199 height: 4px;
8200 position: absolute;
8201 bottom: 0;
8202 left: 50%;
8203 margin-left: -6px;
8204 margin-bottom: -8px;
8205 background: #fff;
8206 }
8207
8208 li.active {
8209 border-color: var(--wp-admin-theme-color, $woocommerce);
8210 color: var(--wp-admin-theme-color, $woocommerce);
8211
8212 &::before {
8213 border-color: var(--wp-admin-theme-color, $woocommerce);
8214 }
8215 }
8216
8217 li.done {
8218 border-color: var(--wp-admin-theme-color, $woocommerce);
8219 color: var(--wp-admin-theme-color, $woocommerce);
8220
8221 &::before {
8222 border-color: var(--wp-admin-theme-color, $woocommerce);
8223 background: var(--wp-admin-theme-color, $woocommerce);
8224 }
8225 }
8226 }
8227
8228 .button {
8229 font-size: 1.25em;
8230 padding: 0.5em 1em !important;
8231 line-height: 1.5em !important;
8232 border-radius: 4px;
8233 }
8234
8235 .error .button {
8236 font-size: 1em;
8237 }
8238
8239 .wc-actions {
8240 overflow: hidden;
8241 border-top: 1px solid #eee;
8242 margin: 0;
8243 padding: 23px 24px 24px;
8244 line-height: 3em;
8245
8246 .button {
8247 float: right;
8248 }
8249
8250 .woocommerce-importer-toggle-advanced-options {
8251 color: #999;
8252 }
8253 }
8254
8255 .woocommerce-exporter,
8256 .woocommerce-importer,
8257 .wc-progress-form-content {
8258 background: #fff;
8259 overflow: hidden;
8260 padding: 0;
8261 margin: 0 0 16px;
8262 box-shadow: 0 1px 3px rgba(0, 0, 0, 0.13);
8263 color: #555;
8264 text-align: left;
8265
8266 header {
8267 border-bottom: 1px solid #eee;
8268 margin: 0;
8269 padding: 24px 24px 0;
8270 }
8271
8272 section {
8273 padding: 24px 24px 0;
8274 }
8275
8276 h2 {
8277 margin: 0 0 24px;
8278 color: #555;
8279 font-size: 24px;
8280 font-weight: normal;
8281 line-height: 1em;
8282 }
8283
8284 p {
8285 font-size: 1em;
8286 line-height: 1.75em;
8287 font-size: 16px;
8288 color: #555;
8289 margin: 0 0 24px;
8290 }
8291
8292 .form-row {
8293 margin-top: 24px;
8294 }
8295
8296 .spinner {
8297 display: none;
8298 }
8299
8300 .woocommerce-importer-options th,
8301 .woocommerce-importer-options td,
8302 .woocommerce-exporter-options th,
8303 .woocommerce-exporter-options td {
8304 vertical-align: top;
8305 line-height: 1.75em;
8306 padding: 0 0 24px 0;
8307
8308 label {
8309 color: #555;
8310 font-weight: normal;
8311 }
8312
8313 input[type="checkbox"]="checkbox""] {
8314 margin: 0 4px 0 0;
8315 padding: 7px;
8316 }
8317
8318 input[type="text"]="text""],
8319 input[type="number"]="number""] {
8320 padding: 7px;
8321 height: auto;
8322 margin: 0;
8323 }
8324
8325 .woocommerce-importer-file-url-field-wrapper {
8326 border: 1px solid #ddd;
8327 -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.07);
8328 box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.07);
8329 background-color: #fff;
8330 color: #32373c;
8331 outline: 0;
8332 line-height: 1;
8333 display: block;
8334
8335 code {
8336 background: none;
8337 font-size: smaller;
8338 padding: 0;
8339 margin: 0;
8340 color: #999;
8341 padding: 7px 0 0 7px;
8342 display: inline-block;
8343 }
8344
8345 input {
8346 font-family: Consolas, Monaco, monospace;
8347 border: 0;
8348 margin: 0;
8349 outline: 0;
8350 box-shadow: none;
8351 display: inline-block;
8352 min-width: 100%;
8353 }
8354 }
8355 }
8356
8357 .woocommerce-exporter-options th,
8358 .woocommerce-importer-options th {
8359 width: 35%;
8360 padding-right: 20px;
8361 }
8362
8363 progress {
8364 width: 100%;
8365 height: 42px;
8366 margin: 0 auto 24px;
8367 display: block;
8368 -webkit-appearance: none;
8369 border: none;
8370 display: none;
8371 background: #f5f5f5;
8372 border: 2px solid #eee;
8373 border-radius: 4px;
8374 padding: 0;
8375 box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.2);
8376 }
8377
8378 progress::-webkit-progress-bar {
8379 background: transparent none;
8380 border: 0;
8381 border-radius: 4px;
8382 padding: 0;
8383 box-shadow: none;
8384 }
8385
8386 progress::-webkit-progress-value {
8387 border-radius: 3px;
8388 box-shadow: inset 0 1px 1px 0 rgba(255, 255, 255, 0.4);
8389 background: var(--wp-admin-theme-color, $woocommerce);
8390 transition: width 1s ease;
8391 }
8392
8393 progress::-moz-progress-bar {
8394 border-radius: 3px;
8395 box-shadow: inset 0 1px 1px 0 rgba(255, 255, 255, 0.4);
8396 background: var(--wp-admin-theme-color, $woocommerce);
8397 transition: width 1s ease;
8398 }
8399
8400 progress::-ms-fill {
8401 border-radius: 3px;
8402 box-shadow: inset 0 1px 1px 0 rgba(255, 255, 255, 0.4);
8403 background: var(--wp-admin-theme-color, $woocommerce);
8404 transition: width 1s ease;
8405 }
8406
8407 &.woocommerce-exporter__exporting,
8408 &.woocommerce-importer__importing {
8409 .spinner {
8410 display: block;
8411 }
8412
8413 progress {
8414 display: block;
8415 }
8416
8417 .wc-actions,
8418 .woocommerce-exporter-options {
8419 display: none;
8420 }
8421 }
8422
8423 .wc-importer-mapping-table-wrapper,
8424 .wc-importer-error-log {
8425 padding: 0;
8426 }
8427
8428 .wc-importer-mapping-table,
8429 .wc-importer-error-log-table {
8430 margin: 0;
8431 border: 0;
8432 box-shadow: none;
8433 width: 100%;
8434 table-layout: fixed;
8435
8436 td,
8437 th {
8438 border: 0;
8439 padding: 12px;
8440 vertical-align: middle;
8441 word-wrap: break-word;
8442
8443 select {
8444 width: 100%;
8445 }
8446 }
8447
8448 tbody tr:nth-child(odd) td,
8449 tbody tr:nth-child(odd) th {
8450 background: #fbfbfb;
8451 }
8452
8453 th {
8454 font-weight: bold;
8455 }
8456
8457 td:first-child,
8458 th:first-child {
8459 padding-left: 24px;
8460 }
8461
8462 td:last-child,
8463 th:last-child {
8464 padding-right: 24px;
8465 }
8466
8467 .wc-importer-mapping-table-name {
8468 width: 50%;
8469
8470 .description {
8471 color: #999;
8472 margin-top: 4px;
8473 display: block;
8474
8475 code {
8476 background: none;
8477 padding: 0;
8478 white-space: pre-line;
8479 /* CSS 3 (and 2.1 as well, actually) */
8480 word-wrap: break-word;
8481 /* IE */
8482 word-break: break-all;
8483 }
8484 }
8485 }
8486 }
8487
8488 .woocommerce-importer-done {
8489 text-align: center;
8490 padding: 48px 24px;
8491 font-size: 1.5em;
8492 line-height: 1.75em;
8493
8494 &::before {
8495 @include icon("\e015");
8496 color: var(--wp-admin-theme-color, $woocommerce);
8497 position: static;
8498 font-size: 100px;
8499 display: block;
8500 float: none;
8501 margin: 0 0 24px;
8502 }
8503 }
8504 }
8505 }
8506
8507 .wc-pointer {
8508 .wc-pointer-buttons {
8509 .close {
8510 float: left;
8511 margin: 6px 0 0 15px;
8512 }
8513 }
8514 }
8515
8516 .wc-quick-edit-warning {
8517 color: darkred;
8518 font-weight: bold;
8519 }
8520
8521 .wc-addons__empty {
8522 margin: 48px auto;
8523 max-width: 640px;
8524
8525 h2 {
8526 font-size: 20px;
8527 font-weight: 400;
8528 line-height: 1.2;
8529 }
8530
8531 p {
8532 font-size: 16px;
8533 line-height: 1.5;
8534 }
8535 }
8536
8537 @media screen and (min-width: 600px) {
8538 .wc-addons-wrap {
8539 .marketplace-header {
8540 padding-left: 84px;
8541 }
8542
8543 .storefront {
8544 h2 {
8545 margin-top: 0;
8546 }
8547
8548 img {
8549 float: left;
8550 margin: 0 16px 0 auto;
8551 width: 278px;
8552 }
8553 }
8554 }
8555
8556 .marketplace-header__tab {
8557 flex: none;
8558 }
8559 }
8560
8561 @media screen and (min-width: 961px) {
8562 .marketplace-header__tabs {
8563 margin-left: 84px;
8564 }
8565 }
8566
8567 @media screen and (min-width: 1024px) {
8568 .current-section-name {
8569 display: none;
8570 }
8571
8572 .wc-addons-wrap {
8573 .current-section-dropdown__title {
8574 display: block;
8575 font-size: 20px;
8576 font-weight: 400;
8577 line-height: 24px;
8578 margin: 0 0 16px;
8579 }
8580
8581 .current-section-dropdown {
8582 background: none;
8583 border: none;
8584 margin-bottom: 32px;
8585 width: 100%;
8586
8587 ul {
8588 background: none;
8589 border: none;
8590 display: flex;
8591 flex-direction: row;
8592 flex-wrap: wrap;
8593 justify-content: flex-start;
8594 margin-top: -12px;
8595 padding: 0;
8596 position: static;
8597
8598 li {
8599 background: #fff;
8600 border: 1px solid #ccc;
8601 border-radius: 32px;
8602 font-size: 14px;
8603 line-height: 20px;
8604 margin: 12px 12px 0 0;
8605
8606 &.current {
8607 background: var(--wp-admin-theme-color, #007cba);
8608 border: 1px solid var(--wp-admin-theme-color, #007cba);
8609
8610 a {
8611 color: #fff;
8612 }
8613
8614 a::after {
8615 background: none;
8616 }
8617 }
8618 }
8619
8620 a,
8621 a:visited,
8622 a:hover,
8623 a:active {
8624 color: #2c3338;
8625 padding: 10px 16px !important;
8626 }
8627 }
8628
8629 li:last-child {
8630 a::after {
8631 display: none;
8632 }
8633 }
8634 }
8635 }
8636 }
8637
8638 /**
8639 * Product Reviews
8640 */
8641 .wp-list-table.product-reviews {
8642 .column-author {
8643 width: 20%;
8644 }
8645
8646 th.column-type {
8647 width: 10%;
8648 }
8649
8650 @media screen and (max-width: 782px) {
8651 th.column-type,
8652 td.column-type,
8653 th.column-author,
8654 td.column-author,
8655 th.column-rating,
8656 td.column-rating {
8657 display: none !important;
8658 }
8659
8660 .toggle-row {
8661 top: 10px;
8662 }
8663 }
8664 }
8665
8666 #wp-content-media-buttons {
8667 display: flex;
8668 align-items: center;
8669
8670 > .woocommerce-help-tip {
8671 margin: 0 5px 4px 5px;
8672 }
8673 }
8674
8675 #postexcerpt {
8676 > .postbox-header {
8677 > .hndle {
8678 justify-content: flex-start;
8679
8680 > .woocommerce-help-tip {
8681 margin: 0 10px;
8682 }
8683 }
8684 }
8685 }
8686
8687 #postdivrich.woocommerce-product-description {
8688 margin-top: 20px;
8689 margin-bottom: 0px;
8690
8691 .wp-editor-tools {
8692 background: none;
8693 padding-top: 0px;
8694 width: 100%;
8695 }
8696 .wp-editor-wrap {
8697 margin: 6px 12px 0;
8698 }
8699 #post-status-info {
8700 margin: 0px 12px 12px;
8701 width: calc(100% - 24px);
8702 }
8703 }
8704
8705 .order-attribution-metabox {
8706 h4 {
8707 margin-bottom: .1em;
8708 }
8709
8710 .woocommerce-order-attribution-origin-container {
8711 display: flex;
8712 justify-content: space-between;
8713 align-items: start;
8714 }
8715
8716 .order-attribution-origin {
8717 flex-grow: 1;
8718 }
8719
8720 .woocommerce-order-attribution-details-toggle {
8721 white-space: nowrap;
8722 }
8723
8724 .woocommerce-order-attribution-details-container {
8725 display: none;
8726 }
8727
8728 .woocommerce-order-attribution-details-toggle {
8729 display: block;
8730 text-decoration: none;
8731 vertical-align: middle;
8732 margin-top: -7px;
8733 position: relative;
8734 top: 5px;
8735
8736 .toggle-text {
8737 text-decoration: underline;
8738
8739 &.hide {
8740 display: none;
8741 }
8742 }
8743
8744 .toggle-indicator {
8745 font-family: dashicons;
8746 font-size: 1.2em;
8747 line-height: 1.6;
8748 vertical-align: middle;
8749 }
8750
8751 &[aria-expanded="false"]="false""] {
8752 .toggle-indicator::before {
8753 content: "\f140";
8754 }
8755 }
8756
8757 &[aria-expanded="true"]="true""] {
8758 .toggle-indicator::before {
8759 content: "\f142";
8760 }
8761 }
8762 }
8763 }
8764
8765 html:has(#status-table-templates){
8766 scroll-padding-top: 80px;
8767 }
8768
8769 // Fix for Safari bug: https://bugs.webkit.org/show_bug.cgi?id=280063.
8770 .woocommerce-admin-page #postbox-container-2 {
8771 clear: left;
8772 }