PluginProbe ʕ •ᴥ•ʔ
WooCommerce / 9.1.0-beta.1
WooCommerce v9.1.0-beta.1
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 3 years 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 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 2 years 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 2 years ago twenty-nineteen.css 2 years ago twenty-nineteen.scss 2 years ago twenty-seventeen-rtl.css 2 years ago twenty-seventeen.css 2 years ago twenty-seventeen.scss 2 years 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 2 years ago twenty-twenty-one.css 2 years ago twenty-twenty-one.scss 2 years ago twenty-twenty-rtl.css 2 years ago twenty-twenty-three-rtl.css 2 years ago twenty-twenty-three.css 2 years ago twenty-twenty-three.scss 2 years ago twenty-twenty-two-rtl.css 2 years ago twenty-twenty-two.css 2 years ago twenty-twenty-two.scss 2 years ago twenty-twenty.css 2 years ago twenty-twenty.scss 2 years ago wc-setup-rtl.css 2 years ago wc-setup.css 2 years ago wc-setup.scss 2 years ago woocommerce-blocktheme-rtl.css 2 years ago woocommerce-blocktheme.css 2 years ago woocommerce-blocktheme.scss 2 years 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 2 years ago woocommerce-smallscreen.css 2 years ago woocommerce-smallscreen.scss 3 years ago woocommerce.css 1 year ago woocommerce.scss 1 year ago
admin.scss
8726 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 0 0.5em;
2702 margin: 0 0 0 12px;
2703 vertical-align: middle;
2704 text-decoration: none;
2705 line-height: 16px;
2706 width: 16px;
2707 overflow: hidden;
2708
2709 &::before {
2710 margin: 0;
2711 padding: 0;
2712 font-size: 16px;
2713 width: 16px;
2714 height: 16px;
2715 }
2716
2717 &:hover {
2718 &::before {
2719 color: #999;
2720 }
2721 }
2722
2723 &:first-child {
2724 margin-left: 0;
2725 }
2726 }
2727
2728 .edit-order-item::before {
2729 @include icon_dashicons("\f464");
2730 position: relative;
2731 }
2732
2733 .delete-order-item,
2734 .delete_refund {
2735 &::before {
2736 @include icon_dashicons("\f158");
2737 position: relative;
2738 }
2739
2740 &:hover::before {
2741 color: $red;
2742 }
2743 }
2744 }
2745
2746 tbody tr .wc-order-edit-line-item-actions {
2747 visibility: hidden;
2748 }
2749
2750 tbody tr:hover .wc-order-edit-line-item-actions {
2751 visibility: visible;
2752 }
2753
2754 .wc-order-totals .wc-order-edit-line-item-actions {
2755 width: 1.5em;
2756 visibility: visible !important;
2757
2758 a {
2759 padding: 0;
2760 }
2761 }
2762 }
2763
2764 #woocommerce-order-downloads {
2765 .buttons {
2766 float: left;
2767 padding: 0;
2768 margin: 0;
2769 vertical-align: top;
2770
2771 .add_item_id,
2772 .select2-container {
2773 width: 400px !important;
2774 margin-right: 9px;
2775 vertical-align: top;
2776 float: left;
2777 }
2778
2779 button {
2780 margin: 2px 0 0;
2781 }
2782 }
2783
2784 h3 small {
2785 color: #999;
2786 }
2787 }
2788
2789 #order_custom #postcustomstuff {
2790 .add-custom-field {
2791 padding: 12px 8px 8px;
2792 }
2793
2794 .submit {
2795 border: 0 none;
2796 float: none;
2797 }
2798 }
2799
2800 #side-sortables #woocommerce-order-downloads {
2801 .buttons,
2802 .select2-container {
2803 max-width: 100%;
2804 }
2805 }
2806
2807 #poststuff #woocommerce-order-actions .inside {
2808 margin: 0;
2809 padding: 0;
2810
2811 ul.order_actions li {
2812 padding: 6px 10px;
2813 box-sizing: border-box;
2814
2815 &:last-child {
2816 border-bottom: 0;
2817 }
2818 }
2819
2820 button {
2821 margin: 1px;
2822 }
2823 }
2824
2825 #poststuff #woocommerce-order-notes .inside {
2826 margin: 0;
2827 padding: 0;
2828
2829 ul.order_notes li {
2830 padding: 0 10px;
2831 }
2832
2833 button {
2834 margin: 1px;
2835 vertical-align: top;
2836 }
2837 }
2838
2839 #woocommerce_customers {
2840 p.search-box {
2841 margin: 6px 0 4px;
2842 float: left;
2843 }
2844
2845 .tablenav {
2846 float: right;
2847 clear: none;
2848 }
2849 }
2850
2851 .widefat {
2852 &.customers td {
2853 vertical-align: middle;
2854 padding: 4px 7px;
2855 }
2856
2857 .column-order_title {
2858 width: 15%;
2859
2860 time {
2861 display: block;
2862 color: #999;
2863 margin: 3px 0;
2864 }
2865 }
2866
2867 .column-orders,
2868 .column-paying,
2869 .column-spent {
2870 text-align: center;
2871 width: 8%;
2872 }
2873
2874 .column-last_order {
2875 width: 11%;
2876 }
2877
2878 .column-wc_actions {
2879 width: 110px;
2880
2881 a.button {
2882 @include ir();
2883 display: inline-block;
2884 margin: 2px 4px 2px 0;
2885 padding: 0 !important;
2886 height: 2em !important;
2887 width: 2em;
2888 overflow: hidden;
2889 vertical-align: middle;
2890
2891 &::after {
2892 font-family: "Dashicons";
2893 speak: never;
2894 font-weight: normal;
2895 font-variant: normal;
2896 text-transform: none;
2897 margin: 0;
2898 text-indent: 0;
2899 position: absolute;
2900 top: 0;
2901 left: 0;
2902 width: 100%;
2903 height: 100%;
2904 text-align: center;
2905 line-height: 1.85;
2906 }
2907
2908 img {
2909 display: block;
2910 width: 12px;
2911 height: auto;
2912 }
2913 }
2914
2915 a.edit::after {
2916 content: "\f464";
2917 }
2918
2919 a.link::after {
2920 font-family: "WooCommerce";
2921 content: "\e00d";
2922 }
2923
2924 a.view::after {
2925 content: "\f177";
2926 }
2927
2928 a.refresh::after {
2929 font-family: "WooCommerce";
2930 content: "\e031";
2931 }
2932
2933 a.processing::after {
2934 font-family: "WooCommerce";
2935 content: "\e00f";
2936 }
2937
2938 a.complete::after {
2939 content: "\f147";
2940 }
2941 }
2942
2943 small.meta {
2944 display: block;
2945 color: #999;
2946 font-size: inherit;
2947 margin: 3px 0;
2948 }
2949 }
2950
2951 .wc-wp-version-gte-53 {
2952 .widefat {
2953 .column-wc_actions {
2954 a.button {
2955 &::after {
2956 margin-top: 2px;
2957 }
2958 }
2959 }
2960 }
2961 }
2962
2963 .woocommerce_page_wc-orders,
2964 .post-type-shop_order {
2965 .tablenav .one-page .displaying-num {
2966 display: none;
2967 }
2968
2969 select#order-search-filter {
2970 margin: 0 4px 0 0;
2971 float: left;
2972 }
2973
2974 .tablenav {
2975 .select2-selection--single {
2976 height: 32px;
2977
2978 .select2-selection__rendered {
2979 line-height: 29px;
2980 }
2981
2982 .select2-selection__arrow {
2983 height: 30px;
2984 }
2985 }
2986
2987 #order-query-submit {
2988 margin: 0 8px 0 0;
2989 }
2990 }
2991
2992 .wp-list-table {
2993 margin-top: 1em;
2994
2995 thead,
2996 tfoot {
2997 th {
2998 padding: 0.75em 1em;
2999 }
3000
3001 th.sortable a,
3002 th.sorted a {
3003 padding: 0;
3004 }
3005
3006 th:first-child {
3007 padding-left: 2em;
3008 }
3009
3010 th:last-child {
3011 padding-right: 2em;
3012 }
3013 }
3014
3015 tbody {
3016 td,
3017 th {
3018 padding: 1em;
3019 line-height: 26px;
3020 }
3021
3022 td:first-child {
3023 padding-left: 2em;
3024 }
3025
3026 td:last-child {
3027 padding-right: 2em;
3028 }
3029 }
3030
3031 tbody tr {
3032 border-top: 1px solid #f5f5f5;
3033 }
3034
3035 tbody tr:hover:not(.status-trash):not(.no-link) td {
3036 cursor: pointer;
3037 }
3038
3039 .no-link {
3040 cursor: default !important;
3041 }
3042
3043 // Columns.
3044 td,
3045 th {
3046 width: 12ch;
3047 vertical-align: middle;
3048
3049 p {
3050 margin: 0;
3051 }
3052 }
3053
3054 .check-column {
3055 width: 1px;
3056 white-space: nowrap;
3057 padding: 1em 1em 1em 1em !important;
3058 vertical-align: middle;
3059
3060 .locked-indicator {
3061 margin-left: 0;
3062 }
3063
3064 input {
3065 vertical-align: text-top;
3066 margin: 1px 0;
3067 }
3068 }
3069
3070 .column-order_number {
3071 width: 20ch;
3072 }
3073
3074 .column-order_total {
3075 width: 8ch;
3076 text-align: right;
3077
3078 a span {
3079 float: right;
3080 }
3081 }
3082
3083 .column-order_date,
3084 .column-order_status {
3085 width: 10ch;
3086 }
3087
3088 .column-order_status {
3089 width: 14ch;
3090 }
3091
3092 .column-shipping_address,
3093 .column-billing_address {
3094 width: 20ch;
3095 line-height: 1.5em;
3096
3097 .description {
3098 display: block;
3099 color: #999;
3100 }
3101 }
3102
3103 .column-wc_actions {
3104 text-align: right;
3105
3106 a.button {
3107 text-indent: 9999px;
3108 margin: 2px 0 2px 4px;
3109 }
3110 }
3111
3112 .order-preview {
3113 float: right;
3114 width: 16px;
3115 padding: 20px 4px 4px 4px;
3116 height: 0;
3117 overflow: hidden;
3118 position: relative;
3119 border: 2px solid transparent;
3120 border-radius: 4px;
3121
3122 &::before {
3123 @include icon("\e010");
3124 line-height: 16px;
3125 font-size: 14px;
3126 vertical-align: middle;
3127 top: 4px;
3128 }
3129
3130 &:hover {
3131 border: 2px solid var(--wp-admin-theme-color, #00a0d2);
3132 }
3133 }
3134
3135 .wp-locked .order-preview {
3136 visibility: hidden;
3137 }
3138
3139 .order-preview.disabled {
3140 &::before {
3141 content: "";
3142 background: url("../images/wpspin-2x.gif") no-repeat center top;
3143 background-size: 71%;
3144 }
3145 }
3146 }
3147 }
3148
3149 .woocommerce_page_wc-orders .wp-list-table .locked-indicator-icon {
3150 margin-left: -2px;
3151
3152 &:before {
3153 vertical-align: top;
3154 }
3155 }
3156
3157 .order-status {
3158 display: inline-flex;
3159 line-height: 2.5em;
3160 color: #777;
3161 background: #e5e5e5;
3162 border-radius: 4px;
3163 border-bottom: 1px solid rgba(0, 0, 0, 0.05);
3164 margin: -0.25em 0;
3165 cursor: inherit !important;
3166 white-space: nowrap;
3167 max-width: 100%;
3168
3169 &.status-completed {
3170 background: #c8d7e1;
3171 color: #2e4453;
3172 }
3173
3174 &.status-on-hold {
3175 background: #f8dda7;
3176 color: #94660c;
3177 }
3178
3179 &.status-failed {
3180 background: #eba3a3;
3181 color: #761919;
3182 }
3183
3184 &.status-processing {
3185 background: #c6e1c6;
3186 color: #5b841b;
3187 }
3188
3189 &.status-trash {
3190 background: #eba3a3;
3191 color: #761919;
3192 }
3193
3194 > span {
3195 margin: 0 1em;
3196 overflow: hidden;
3197 text-overflow: ellipsis;
3198 }
3199 }
3200
3201 .wc-order-preview {
3202 .order-status {
3203 float: right;
3204 margin-right: 54px;
3205 }
3206
3207 article {
3208 padding: 0 !important;
3209 }
3210
3211 .modal-close {
3212 border-radius: 0;
3213 }
3214
3215 .wc-order-preview-table {
3216 width: 100%;
3217 margin: 0;
3218
3219 th,
3220 td {
3221 padding: 1em 1.5em;
3222 text-align: left;
3223 border: 0;
3224 border-bottom: 1px solid #eee;
3225 margin: 0;
3226 background: transparent;
3227 box-shadow: none;
3228 text-align: right;
3229 vertical-align: top;
3230 }
3231
3232 td:first-child,
3233 th:first-child {
3234 text-align: left;
3235 }
3236
3237 th {
3238 border-color: #ccc;
3239 }
3240
3241 tr:last-child td {
3242 border: 0;
3243 }
3244
3245 .wc-order-item-sku {
3246 margin-top: 0.5em;
3247 }
3248
3249 .wc-order-item-meta {
3250 margin-top: 0.5em;
3251
3252 th,
3253 td {
3254 padding: 0;
3255 border: 0;
3256 text-align: left;
3257 vertical-align: top;
3258 }
3259
3260 td:last-child {
3261 padding-left: 0.5em;
3262 }
3263 }
3264 }
3265
3266 .wc-order-preview-addresses {
3267 overflow: hidden;
3268 padding-bottom: 1.5em;
3269
3270 .wc-order-preview-address,
3271 .wc-order-preview-note {
3272 width: 50%;
3273 float: left;
3274 padding: 1.5em 1.5em 0;
3275 box-sizing: border-box;
3276 word-wrap: break-word;
3277
3278 h2 {
3279 margin-top: 0;
3280 }
3281
3282 strong {
3283 display: block;
3284 margin-top: 1.5em;
3285 }
3286
3287 strong:first-child {
3288 margin-top: 0;
3289 }
3290 }
3291 }
3292
3293 footer {
3294 .wc-action-button-group {
3295 display: inline-block;
3296 float: left;
3297 }
3298
3299 .button.button-large {
3300 margin-left: 10px;
3301 padding: 0 10px !important;
3302 line-height: 28px;
3303 height: auto;
3304 display: inline-block;
3305 }
3306 }
3307
3308 .wc-action-button-group label {
3309 display: none;
3310 }
3311 }
3312
3313 .wc-action-button-group {
3314 vertical-align: middle;
3315 line-height: 26px;
3316 text-align: left;
3317
3318 label {
3319 margin-right: 6px;
3320 cursor: default;
3321 font-weight: bold;
3322 line-height: 28px;
3323 }
3324
3325 .wc-action-button-group__items {
3326 display: inline-flex;
3327 flex-flow: row wrap;
3328 align-content: flex-start;
3329 justify-content: flex-start;
3330 }
3331
3332 .wc-action-button {
3333 margin: 0 0 0 -1px !important;
3334 border: 1px solid #ccc;
3335 padding: 0 10px !important;
3336 border-radius: 0 !important;
3337 float: none;
3338 line-height: 28px;
3339 height: auto;
3340 z-index: 1;
3341 position: relative;
3342 overflow: hidden;
3343 text-overflow: ellipsis;
3344 flex: 1 0 auto;
3345 box-sizing: border-box;
3346 text-align: center;
3347 white-space: nowrap;
3348 }
3349
3350 .wc-action-button:hover,
3351 .wc-action-button:focus {
3352 border: 1px solid #999;
3353 z-index: 2;
3354 }
3355
3356 .wc-action-button:first-child {
3357 margin-left: 0 !important;
3358 border-top-left-radius: 3px !important;
3359 border-bottom-left-radius: 3px !important;
3360 }
3361
3362 .wc-action-button:last-child {
3363 border-top-right-radius: 3px !important;
3364 border-bottom-right-radius: 3px !important;
3365 }
3366 }
3367
3368 @media screen and (max-width: 782px) {
3369 .woocommerce_page_wc-orders #order-search-filter {
3370 display: none;
3371 }
3372
3373 .wc-order-preview footer {
3374 .wc-action-button-group .wc-action-button-group__items {
3375 display: flex;
3376 }
3377
3378 .wc-action-button-group {
3379 float: none;
3380 display: block;
3381 margin-bottom: 4px;
3382 }
3383
3384 .button.button-large {
3385 width: 100%;
3386 float: none;
3387 text-align: center;
3388 margin: 0;
3389 display: block;
3390 }
3391 }
3392
3393 .woocommerce_page_wc-orders .wc-orders-list-table.wp-list-table,
3394 .post-type-shop_order .wp-list-table {
3395 .check-column {
3396 width: 1em;
3397 vertical-align: top;
3398 }
3399
3400 thead th.column-order_number {
3401 width: 100%;
3402 }
3403
3404 td.column-order_number {
3405 .toggle-row {
3406 height: 20px;
3407 }
3408
3409 .order-preview {
3410 margin-top: 13px;
3411 }
3412 }
3413
3414 td.column-order_total,
3415 td.column-wc_actions {
3416 text-align: left;
3417 }
3418
3419 td.column-wc_actions {
3420 min-height: 2.0em !important;
3421 }
3422
3423 tr:not(.is-expanded) {
3424 td.column-order_number {
3425 vertical-align: top;
3426
3427 a.order-view {
3428 display: inline-block;
3429 width: calc(100% - 48px - 10ch - 20ch);
3430 overflow: hidden;
3431 text-overflow: ellipsis;
3432 white-space: nowrap;
3433 }
3434 }
3435
3436 td.column-order_date {
3437 width: 10ch !important;
3438 top: 1em;
3439 right: calc(20ch + 48px);
3440 }
3441
3442 td.column-order_status {
3443 top: -1em;
3444 right: 48px;
3445 }
3446
3447 td.column-order_status,
3448 td.column-order_date {
3449 padding: 0 !important;
3450 display: block !important;
3451 float: right;
3452
3453 &::before {
3454 display: none !important;
3455 }
3456 }
3457 }
3458
3459 }
3460 }
3461
3462 .column-customer_message .note-on {
3463 @include ir();
3464 margin: 0 auto;
3465 color: #999;
3466
3467 &::after {
3468 @include icon("\e026");
3469 line-height: 16px;
3470 }
3471 }
3472
3473 .column-order_notes .note-on {
3474 @include ir();
3475 margin: 0 auto;
3476 color: #999;
3477
3478 &::after {
3479 @include icon("\e027");
3480 line-height: 16px;
3481 }
3482 }
3483
3484 .attributes-table {
3485 td,
3486 th {
3487 width: 15%;
3488 vertical-align: top;
3489 }
3490
3491 .attribute-terms {
3492 width: 32%;
3493 }
3494
3495 .attribute-actions {
3496 width: 2em;
3497
3498 .configure-terms {
3499 @include ir();
3500 padding: 0 !important;
3501 height: 2em !important;
3502 width: 2em;
3503
3504 &::after {
3505 @include icon("\f111");
3506 font-family: "Dashicons";
3507 line-height: 1.85;
3508 }
3509 }
3510 }
3511 }
3512
3513 /* Order notes */
3514 ul.order_notes {
3515 padding: 2px 0 0;
3516
3517 li {
3518 .note_content {
3519 padding: 10px;
3520 background: #efefef;
3521 position: relative;
3522
3523 p {
3524 margin: 0;
3525 padding: 0;
3526 word-wrap: break-word;
3527 }
3528 }
3529
3530 p.meta {
3531 padding: 10px;
3532 color: #999;
3533 margin: 0;
3534 font-size: 11px;
3535
3536 .exact-date {
3537 border-bottom: 1px dotted #999;
3538 }
3539 }
3540
3541 a.delete_note {
3542 color: $red;
3543 }
3544
3545 .note_content::after {
3546 content: "";
3547 display: block;
3548 position: absolute;
3549 bottom: -10px;
3550 left: 20px;
3551 width: 0;
3552 height: 0;
3553 border-width: 10px 10px 0 0;
3554 border-style: solid;
3555 border-color: #efefef transparent;
3556 }
3557 }
3558
3559 li.system-note {
3560 .note_content {
3561 background: #d7cad2;
3562 }
3563
3564 .note_content::after {
3565 border-color: #d7cad2 transparent;
3566 }
3567 }
3568
3569 li.customer-note {
3570 .note_content {
3571 background: #a7cedc;
3572 }
3573
3574 .note_content::after {
3575 border-color: #a7cedc transparent;
3576 }
3577 }
3578 }
3579
3580 .add_note {
3581 border-top: 1px solid #ddd;
3582 padding: 10px 10px 0;
3583
3584 h4 {
3585 margin-top: 5px !important;
3586 }
3587
3588 #add_order_note {
3589 width: 100%;
3590 height: 50px;
3591 }
3592 }
3593
3594 table.wp-list-table {
3595 .column-thumb {
3596 width: 52px;
3597 text-align: center;
3598 white-space: nowrap;
3599 }
3600
3601 .column-handle {
3602 width: 17px;
3603 display: none;
3604 }
3605
3606 tbody {
3607 td.column-handle {
3608 cursor: move;
3609 width: 17px;
3610 text-align: center;
3611 vertical-align: text-top;
3612
3613 &::before {
3614 content: "\f333";
3615 font-family: "Dashicons";
3616 text-align: center;
3617 line-height: 1;
3618 color: #999;
3619 display: block;
3620 width: 17px;
3621 height: 100%;
3622 margin: 4px 0 0 0;
3623 }
3624 }
3625 }
3626
3627 .column-name {
3628 width: 22%;
3629 }
3630
3631 .column-product_cat,
3632 .column-product_tag {
3633 width: 11% !important;
3634 }
3635
3636 .column-featured,
3637 .column-product_type {
3638 width: 48px;
3639 text-align: left !important;
3640 }
3641
3642 .column-customer_message,
3643 .column-order_notes {
3644 width: 48px;
3645 text-align: center;
3646
3647 img {
3648 margin: 0 auto;
3649 padding-top: 0 !important;
3650 }
3651 }
3652
3653 .manage-column.column-featured img,
3654 .manage-column.column-product_type img {
3655 padding-left: 2px;
3656 }
3657
3658 .column-price .woocommerce-price-suffix {
3659 display: none;
3660 }
3661
3662 .row-actions {
3663 color: #999;
3664 }
3665
3666 .row-actions span.id {
3667 padding-top: 8px;
3668 }
3669
3670 td.column-thumb img {
3671 margin: 0;
3672 width: auto;
3673 height: auto;
3674 max-width: 40px;
3675 max-height: 40px;
3676 vertical-align: middle;
3677 }
3678
3679 span.na {
3680 color: #999;
3681 }
3682
3683 .column-sku {
3684 width: 10%;
3685 }
3686
3687 .column-price {
3688 width: 10ch;
3689 }
3690
3691 .column-is_in_stock {
3692 text-align: left !important;
3693 width: 12ch;
3694 }
3695
3696 span.wc-image,
3697 span.wc-featured {
3698 @include ir();
3699 margin: 0 auto;
3700
3701 &::before {
3702 @include icon_dashicons("\f128");
3703 }
3704 }
3705
3706 span.wc-featured {
3707 &::before {
3708 content: "\f155";
3709 }
3710
3711 &.not-featured::before {
3712 content: "\f154";
3713 }
3714 }
3715
3716 td.column-featured span.wc-featured {
3717 font-size: 1.6em;
3718 cursor: pointer;
3719 }
3720
3721 mark {
3722 &.instock,
3723 &.outofstock,
3724 &.onbackorder {
3725 font-weight: 700;
3726 background: transparent none;
3727 line-height: 1;
3728 }
3729
3730 &.instock {
3731 color: $green;
3732 }
3733
3734 &.outofstock {
3735 color: #a44;
3736 }
3737
3738 &.onbackorder {
3739 color: #eaa600;
3740 }
3741 }
3742
3743 .order-notes_head,
3744 .notes_head,
3745 .status_head {
3746 @include ir();
3747 margin: 0 auto;
3748
3749 &::after {
3750 @include icon;
3751 }
3752 }
3753
3754 .order-notes_head::after {
3755 content: "\e028";
3756 }
3757
3758 .notes_head::after {
3759 content: "\e026";
3760 }
3761
3762 .status_head::after {
3763 content: "\e011";
3764 }
3765
3766 .column-order_items {
3767 width: 12%;
3768
3769 table.order_items {
3770 width: 100%;
3771 margin: 3px 0 0;
3772 padding: 0;
3773 display: none;
3774
3775 td {
3776 border: 0;
3777 margin: 0;
3778 padding: 0 0 3px;
3779 }
3780
3781 td.qty {
3782 color: #999;
3783 padding-right: 6px;
3784 text-align: left;
3785 }
3786 }
3787 }
3788 }
3789
3790 mark.notice {
3791 background: #fff;
3792 color: $red;
3793 margin: 0 0 0 10px;
3794 }
3795
3796 a.export_rates,
3797 a.import_rates {
3798 float: right;
3799 margin-left: 9px;
3800 margin-top: -2px;
3801 margin-bottom: 0;
3802 }
3803
3804 #rates-search {
3805 float: right;
3806
3807 input.wc-tax-rates-search-field {
3808 padding: 4px 8px;
3809 font-size: 1.2em;
3810 }
3811 }
3812
3813 #rates-pagination {
3814 float: right;
3815 margin-right: 0.5em;
3816
3817 .tablenav {
3818 margin: 0;
3819 }
3820 }
3821
3822 .wc_input_table_wrapper {
3823 overflow-x: auto;
3824 display: block;
3825 }
3826
3827 table.wc_tax_rates,
3828 table.wc_input_table {
3829 width: 100%;
3830
3831 th,
3832 td {
3833 display: table-cell !important;
3834 }
3835
3836 span.tips {
3837 color: $blue;
3838 }
3839
3840 th {
3841 white-space: nowrap;
3842 padding: 10px;
3843 }
3844
3845 td {
3846 padding: 0;
3847 border-right: 1px solid #dfdfdf;
3848 border-bottom: 1px solid #dfdfdf;
3849 border-top: 0;
3850 background: #fff;
3851 cursor: default;
3852
3853 input[type="text"]="text""],
3854 input[type="number"]="number""] {
3855 width: 100% !important;
3856 min-width: 100px;
3857 padding: 8px 10px;
3858 margin: 0;
3859 border: 0;
3860 outline: 0;
3861 background: transparent none;
3862
3863 &:focus {
3864 outline: 0;
3865 box-shadow: none;
3866 }
3867 }
3868
3869 &.compound,
3870 &.apply_to_shipping {
3871 padding: 5px 7px;
3872 vertical-align: middle;
3873
3874 input {
3875 padding: 0;
3876 }
3877 }
3878 }
3879
3880 td:last-child {
3881 border-right: 0;
3882 }
3883
3884 tr.current td {
3885 background-color: #fefbcc;
3886 }
3887
3888 .item_cost,
3889 .cost {
3890 text-align: right;
3891
3892 input {
3893 text-align: right;
3894 }
3895 }
3896
3897 th.sort {
3898 width: 17px;
3899 padding: 0 4px;
3900 }
3901
3902 td.sort {
3903 padding: 0 4px;
3904 }
3905
3906 .ui-sortable:not(.ui-sortable-disabled) td.sort {
3907 cursor: move;
3908 font-size: 15px;
3909 background: #f9f9f9;
3910 text-align: center;
3911 vertical-align: middle;
3912
3913 &::before {
3914 content: "\f333";
3915 font-family: "Dashicons";
3916 text-align: center;
3917 line-height: 1;
3918 color: #999;
3919 display: block;
3920 width: 17px;
3921 float: left;
3922 height: 100%;
3923 }
3924
3925 &:hover::before {
3926 color: #333;
3927 }
3928 }
3929
3930 .button {
3931 float: left;
3932 margin-right: 5px;
3933 }
3934
3935 .export,
3936 .import {
3937 float: right;
3938 margin-right: 0;
3939 margin-left: 5px;
3940 }
3941
3942 span.tips {
3943 padding: 0 3px;
3944 }
3945
3946 .pagination {
3947 float: right;
3948
3949 .button {
3950 margin-left: 5px;
3951 margin-right: 0;
3952 }
3953
3954 .current {
3955 background: #bbb;
3956 text-shadow: none;
3957 }
3958 }
3959
3960 tr:last-child td {
3961 border-bottom: 0;
3962 }
3963 }
3964
3965 table.wc_tax_rates {
3966 td.country {
3967 position: relative;
3968 }
3969 }
3970
3971 table.wc_gateways,
3972 table.wc_emails,
3973 table.wc_shipping {
3974 position: relative;
3975
3976 th,
3977 td {
3978 display: table-cell !important;
3979 padding: 1em !important;
3980 vertical-align: top;
3981 line-height: 1.75em;
3982 }
3983
3984 &.wc_emails td {
3985 vertical-align: middle;
3986 }
3987
3988 tr:nth-child(odd) td {
3989 background: #f9f9f9;
3990 }
3991
3992 td.name {
3993 font-weight: 700;
3994 }
3995
3996 .settings {
3997 text-align: right;
3998 }
3999
4000 .radio,
4001 .default,
4002 .status {
4003 text-align: center;
4004
4005 .tips {
4006 margin: 0 auto;
4007 }
4008
4009 input {
4010 margin: 0;
4011 }
4012 }
4013
4014 td.sort {
4015 font-size: 15px;
4016 text-align: center;
4017
4018 .wc-item-reorder-nav {
4019 white-space: nowrap;
4020 width: 72px;
4021
4022 &::before {
4023 content: "\f333";
4024 font-family: "Dashicons";
4025 text-align: center;
4026 line-height: 1;
4027 color: #999;
4028 display: block;
4029 width: 24px;
4030 float: left;
4031 height: 100%;
4032 line-height: 24px;
4033 cursor: move;
4034 }
4035
4036 button {
4037 position: relative;
4038 overflow: hidden;
4039 float: left;
4040 display: block;
4041 width: 24px;
4042 height: 24px;
4043 margin: 0;
4044 background: transparent;
4045 border: none;
4046 box-shadow: none;
4047 color: #82878c;
4048 text-indent: -9999px;
4049 cursor: pointer;
4050 outline: none;
4051 }
4052
4053 button::before {
4054 display: inline-block;
4055 position: absolute;
4056 top: 0;
4057 right: 0;
4058 width: 100%;
4059 height: 100%;
4060 font: normal 20px/23px dashicons;
4061 text-align: center;
4062 text-indent: 0;
4063 -webkit-font-smoothing: antialiased;
4064 -moz-osx-font-smoothing: grayscale;
4065 }
4066
4067 button:hover,
4068 button:focus {
4069 color: #191e23;
4070 }
4071
4072 .wc-move-down::before {
4073 content: "\f347";
4074 }
4075
4076 .wc-move-up::before {
4077 content: "\f343";
4078 }
4079
4080 .wc-move-disabled {
4081 color: #d5d5d5 !important;
4082 cursor: default;
4083 pointer-events: none;
4084 }
4085 }
4086 }
4087
4088 .wc-payment-gateway-method-name {
4089 font-weight: normal;
4090 }
4091
4092 .wc-email-settings-table-name {
4093 font-weight: 700;
4094
4095 span {
4096 font-weight: normal;
4097 color: #999;
4098 margin: 0 0 0 4px !important;
4099 }
4100 }
4101
4102 .wc-payment-gateway-method-toggle-enabled,
4103 .wc-payment-gateway-method-toggle-disabled {
4104 padding-top: 1px;
4105 display: block;
4106 outline: 0;
4107 box-shadow: none;
4108 }
4109
4110 .wc-email-settings-table-status {
4111 text-align: center;
4112 width: 1em;
4113
4114 .tips {
4115 margin: 0 auto;
4116 }
4117 }
4118 }
4119
4120 .wc-shipping-zone-settings {
4121 #zone_name {
4122 width: 600px;
4123 padding: 2px 8px;
4124 }
4125
4126 th {
4127 padding: 24px 24px 24px 0;
4128 }
4129
4130 td.forminp {
4131 input,
4132 textarea {
4133 padding: 8px;
4134 max-width: 100% !important;
4135 }
4136
4137 .wc-shipping-zone-region-select {
4138 width: 448px;
4139 max-width: 100% !important;
4140
4141 .select2-choices {
4142 padding: 8px 8px 4px;
4143 border-color: #ddd;
4144 min-height: 0;
4145 line-height: 1;
4146
4147 input {
4148 padding: 0;
4149 }
4150
4151 li {
4152 margin: 0 4px 4px 0;
4153 }
4154 }
4155 }
4156 }
4157
4158 .wc-shipping-zone-postcodes-toggle {
4159 margin: 0.5em 0 0;
4160 text-decoration: underline;
4161 display: block;
4162 font-size: 13px;
4163 font-weight: 400;
4164 line-height: 16px;
4165 }
4166
4167 .wc-shipping-zone-postcodes-toggle + .wc-shipping-zone-postcodes {
4168 display: none;
4169 }
4170
4171 .wc-shipping-zone-postcodes {
4172 width: 100%;
4173 max-width: 600px;
4174
4175 #zone_postcodes {
4176 margin: 10px 0;
4177 padding: 8px;
4178 width: 100%;
4179 }
4180
4181 .description {
4182 font-size: 13px;
4183 font-weight: 400;
4184 line-height: 18px;
4185 color: #3C434A;
4186 }
4187 }
4188
4189 #wc-shipping-zone-region-picker-root {
4190 width: 100%;
4191 max-width: 600px;
4192 }
4193 }
4194
4195 .wc-shipping-zone-settings + p.submit {
4196 margin-top: 0;
4197 }
4198
4199 .wc-shipping-zone-settings tbody {
4200 display: table-row-group;
4201 }
4202
4203 /**
4204 * New Shipping Settings Refresh Modal Styles
4205 **/
4206
4207 .wc-backbone-modal-add-shipping-method,
4208 .wc-backbone-modal-shipping-method-settings,
4209 .wc-shipping-class-modal {
4210 font-family: $font-sf-pro-text;
4211 font-size: 13px;
4212 font-weight: 400;
4213 line-height: 16px;
4214 color: #1e1e1e;
4215
4216 &.wc-backbone-modal .wc-backbone-modal-content {
4217 border-radius: 8px;
4218 border-top: 8px solid transparent;
4219 border-bottom: 8px solid transparent;
4220 max-width: 600px;
4221
4222 @media screen and (max-width: 782px) {
4223 border-radius: none;
4224 border-top: none;
4225 border-bottom: none;
4226 }
4227 }
4228
4229 .wc-backbone-modal-main article {
4230 padding: 0 32px 32px 32px;
4231 }
4232
4233 .wc-backbone-modal-main header{
4234 padding: 20px 32px;
4235 }
4236
4237 .wc-backbone-modal-main footer {
4238 padding: 20px 32px 12px 32px;
4239 }
4240
4241 .wc-backbone-modal-main .wc-backbone-modal-header h1 {
4242 font-weight: 400;
4243 }
4244
4245 .wc-backbone-modal-main .wc-backbone-modal-header {
4246 background-color: #fff;
4247 border-bottom: none;
4248 font-size: 20px;
4249 line-height: 28px;
4250
4251 .modal-close-link {
4252 border-left: none;
4253
4254 &:hover {
4255 background-color: #fff;
4256 }
4257 }
4258 }
4259 .wc-backbone-modal-main footer {
4260 box-shadow: none;
4261 border-top: 1px solid #E0E0E0;
4262 background-color: #fff;
4263
4264 .inner {
4265 display: flex;
4266 justify-content: space-between;
4267 flex-direction: row-reverse;
4268 }
4269
4270 .wc-shipping-zone-method-modal-info {
4271 display: flex;
4272 align-items: center;
4273 font-size: 11px;
4274 font-weight: 500;
4275 line-height: 16px;
4276 color: #787C82;
4277
4278 &.wc-shipping-zone-method-modal-info-inactive {
4279 display: none;
4280 }
4281 }
4282 }
4283
4284 .wc-shipping-method-add-class-costs {
4285 margin-top: -24px;
4286 text-decoration: none;
4287 color: #3858E9;
4288 font-size: 12px;
4289 line-height: 16px;
4290 }
4291
4292 .wc-shipping-zone-method-input {
4293 input {
4294 clip: rect(0 0 0 0);
4295 clip-path: inset(100%);
4296 height: 1px;
4297 overflow: hidden;
4298 position: absolute;
4299 white-space: nowrap;
4300 width: 1px;
4301
4302 &:checked + label {
4303 outline: 2px solid var(--wp-admin-theme-color);
4304
4305 .dashicons-yes {
4306 display: block;
4307 }
4308 }
4309 }
4310
4311 label {
4312 display: block;
4313 width: 100%;
4314 padding: 20px 16px;
4315 outline: 1px solid #DDDDDD;
4316 margin: 12px 0;
4317 border-radius: 4px;
4318 }
4319 }
4320
4321 .wc-shipping-legacy-local-pickup-help-text-container {
4322 margin: 1.5em 0;
4323 }
4324
4325 .wc-shipping-zone-method-input-help-text {
4326 display: none;
4327 }
4328
4329 .wc-shipping-zone-method-selector {
4330 position: relative;
4331 }
4332
4333 .dashicons-yes {
4334 display: none;
4335 color: #949494;
4336 float: right;
4337 }
4338
4339 .woocommerce-help-tip {
4340 color: #949494;
4341
4342 &:after {
4343 top: -6px;
4344 font-size: 24px;
4345 }
4346 }
4347
4348 .wc-shipping-zone-method-fields {
4349
4350 & > label {
4351 font-size: 12px;
4352 font-weight: 500;
4353 line-height: 16px;
4354
4355 & > .woocommerce-help-tip {
4356 display: none;
4357 }
4358
4359 & > .woocommerce-help-tip.wc-shipping-visible-help-text {
4360 display: inline-block;
4361 }
4362 }
4363
4364 fieldset {
4365 margin-bottom: 24px;
4366 position: relative;
4367
4368 input,
4369 select {
4370 margin: 6px 0;
4371 padding: 12px;
4372 font-size: 13px;
4373 line-height: 16px;
4374
4375 &:not([type="checkbox"]) {
4376 width: 100%;
4377 max-width: 100%;
4378 }
4379 &[type="checkbox"]="checkbox""] {
4380 border-radius: 2px;
4381 margin: 4px 8px 6px 0;
4382
4383 & + .woocommerce-help-tip {
4384 margin: 6px 0 4px 8px;
4385 }
4386 }
4387
4388 &.wc-shipping-modal-price {
4389 &.wc-shipping-currency-position-left,
4390 &.wc-shipping-currency-position-left_space {
4391
4392 &.wc-shipping-currency-size-1 {
4393 padding-left: 28px;
4394 }
4395 &.wc-shipping-currency-size-2 {
4396 padding-left: 33px;
4397 }
4398 &.wc-shipping-currency-size-3 {
4399 padding-left: 38px;
4400 }
4401 &.wc-shipping-currency-size-4 {
4402 padding-left: 43px;
4403 }
4404 &.wc-shipping-currency-size-5 {
4405 padding-left: 48px;
4406 }
4407 }
4408
4409 &.wc-shipping-currency-position-right,
4410 &.wc-shipping-currency-position-right_space {
4411 padding-left: 12px;
4412 }
4413 }
4414 }
4415 }
4416
4417 .wc-shipping-zone-method-currency {
4418 position: absolute;
4419 top: 19px;
4420 color: #757575;
4421
4422 &.wc-shipping-currency-position-left,
4423 &.wc-shipping-currency-position-left_space {
4424 left: 12px;
4425 }
4426
4427 &.wc-shipping-currency-position-right,
4428 &.wc-shipping-currency-position-right_space {
4429 right: 12px;
4430 }
4431 }
4432 }
4433
4434 .wc-backbone-modal-action-inactive {
4435 display: none;
4436 }
4437
4438 .wc-shipping-zone-method-fields-help-text,
4439 .wc-shipping-class-modal-help-text {
4440 font-size: 12px;
4441 font-weight: 400;
4442 line-height: 16px;
4443 color: #757575;
4444 }
4445
4446 .wc-backbone-modal-back-inactive {
4447 display: none;
4448 }
4449
4450 #btn-next.is-busy {
4451 background-image: linear-gradient(-45deg, #fafafa 33%, #e0e0e0 33%, #e0e0e0 70%, #fafafa 70%);
4452 animation-duration: 2.5s;
4453 animation-timing-function: linear;
4454 animation-delay: 0s;
4455 animation-iteration-count: infinite;
4456 animation-direction: normal;
4457 animation-fill-mode: none;
4458 animation-play-state: running;
4459 animation-name: components-button__busy-animation;
4460 animation-timeline: auto;
4461 animation-range-start: normal;
4462 color: #757575;
4463 }
4464 }
4465
4466 .wc-backbone-modal-add-shipping-method .wc-backbone-modal-main article {
4467 padding: 0 32px 50px 32px;
4468 }
4469
4470 table {
4471 tr,
4472 tr:hover {
4473 table.wc-shipping-zone-methods {
4474 tr .row-actions {
4475 position: relative;
4476 }
4477
4478 tr:hover .row-actions {
4479 position: static;
4480 }
4481 }
4482 }
4483 }
4484
4485 .wc-shipping-class-modal {
4486 .edit {
4487 margin: 5px 0;
4488 }
4489
4490 .edit > input,
4491 .edit > select {
4492 width: 100%;
4493 max-width: 100%;
4494 padding: 12px;
4495 }
4496
4497 .view {
4498 font-size: 12px;
4499 font-weight: 500;
4500 line-height: 16px;
4501 }
4502
4503 .wc-shipping-class-modal-input {
4504 padding: 0 0 24px 0;
4505
4506 input {
4507 font-size: 13px;
4508 line-height: 16px;
4509 }
4510 }
4511
4512 .wc-shipping-class-count {
4513 display: none;
4514 }
4515 }
4516
4517 .wc-shipping-class-hide-sibling-view + .view {
4518 display: none;
4519 }
4520
4521 .wc-shipping-zones-heading {
4522 display: flex;
4523 align-items: center;
4524
4525 .page-title-action {
4526 margin: 0 12px;
4527 }
4528 }
4529
4530 .wc-shipping-zone-heading-help-text {
4531 max-width: 800px;
4532 }
4533
4534 .wc-shipping-zone-heading-help-text {
4535 color: #3C434A;
4536 font-size: 13px;
4537 font-style: normal;
4538 font-weight: 400;
4539 line-height: 19px;
4540 }
4541
4542 .wc-shipping-zone-help-text {
4543 color: #3C434A;
4544 font-size: 12px;
4545 font-style: normal;
4546 font-weight: 400;
4547 line-height: 17px;
4548 }
4549
4550 #wc-shipping-zone-region-picker-root .woocommerce-tree-select-control .components-base-control {
4551 padding: 2px 8px;
4552 border-radius: 4px;
4553
4554 .woocommerce-tree-select-control__control-input {
4555 font-size: 14px;
4556 }
4557 }
4558
4559 table.wc-shipping-zones,
4560 table.wc-shipping-zone-methods,
4561 table.wc-shipping-classes {
4562 font-size: 14px;
4563
4564 thead tr th {
4565 vertical-align: middle;
4566 padding: 1em;
4567 font-weight: 600;
4568 }
4569
4570 tbody tr td {
4571 padding: 24px 12px;
4572
4573 &:last-child {
4574 padding: 24px 32px 24px 12px;
4575 }
4576 }
4577
4578 tfoot tr td {
4579 padding: 24px 12px;
4580 vertical-align: top;
4581
4582 &:last-child {
4583 padding: 24px 32px 24px 12px;
4584 }
4585 }
4586
4587 td,
4588 th {
4589 display: table-cell !important;
4590 font-size: 14px;
4591 vertical-align: middle;
4592 padding: 24px 12px;
4593
4594 li {
4595 line-height: 24px;
4596 font-size: 14px;
4597 }
4598
4599 .woocommerce-help-tip {
4600 margin: 0 !important;
4601 }
4602 }
4603
4604 thead {
4605 .wc-shipping-zone-sort {
4606 text-align: center;
4607 }
4608 }
4609
4610 .wc-shipping-zone-rows,
4611 .wc-shipping-zone-method-rows,
4612 .wc-shipping-class-rows {
4613 tr:nth-child(even) td {
4614 background: #f9f9f9;
4615 }
4616 }
4617
4618 .wc-shipping-zone-rows-tfoot .even td {
4619 background: #f9f9f9;
4620 }
4621
4622 td.wc-shipping-zones-blank-state,
4623 td.wc-shipping-zone-method-blank-state {
4624 overflow: hidden;
4625 position: relative;
4626 padding: 7.5em 7.5% !important;
4627
4628 &.wc-shipping-zone-method-blank-state {
4629 padding: 2em !important;
4630
4631 p {
4632 margin-bottom: 0;
4633 }
4634 }
4635
4636 p,
4637 li {
4638 color: var(--wc-secondary-text, $woocommerce);
4639 font-size: 1.2em;
4640 line-height: 1.2em;
4641 margin: 0 0 1.5em;
4642 position: relative;
4643 z-index: 1;
4644 text-shadow: 1px 1px 1px white;
4645
4646 &.main {
4647 font-size: 1.6em;
4648 }
4649 }
4650
4651 li {
4652 margin-left: 1em;
4653 list-style: circle inside;
4654 }
4655
4656 &::before {
4657 content: "\e01b";
4658 font-family: "WooCommerce";
4659 text-align: center;
4660 line-height: 1;
4661 color: #e9e9e9;
4662 display: block;
4663 width: 1em;
4664 font-size: 40em;
4665 top: 50%;
4666 right: -3.75%;
4667 margin-top: -0.1875em;
4668 position: absolute;
4669 }
4670
4671 .button-primary {
4672 font-size: 1.2em;
4673 padding: 0.75em 1.5em;
4674 margin: 0 0.25em;
4675 height: auto;
4676 position: relative;
4677 z-index: 1;
4678 }
4679 }
4680
4681 tbody.wc-shipping-tables-tbody {
4682 .wc-shipping-zone-name,
4683 .wc-shipping-zone-method-title,
4684 .wc-shipping-class-name {
4685 font-weight: 500;
4686 }
4687
4688 }
4689
4690 tr.wc-shipping-zone-worldwide {
4691 td {
4692 background: #f9f9f9;
4693 border-top: 2px solid #e1e1e1;
4694 }
4695 }
4696
4697 ul,
4698 p {
4699 margin: 0;
4700 }
4701
4702 td.wc-shipping-zone-sort,
4703 td.wc-shipping-zone-method-sort {
4704 cursor: move;
4705 font-size: 15px;
4706 text-align: center;
4707
4708 &::before {
4709 content: "";
4710 mask: url(../images/icons/move-icon.svg);
4711 mask-image: url(../images/icons/move-icon.svg);
4712 -webkit-mask-image: url(../images/icons/move-icon.svg);
4713 background-color: #1E1E1E;
4714 display: block;
4715 width: 17px;
4716 float: left;
4717 height: 24px;
4718 }
4719
4720 &:hover::before {
4721 background-color: #999;
4722 }
4723 }
4724
4725 td.wc-shipping-zone-worldwide {
4726 text-align: center;
4727
4728 &::before {
4729 content: "\f319";
4730 font-family: "dashicons";
4731 text-align: center;
4732 line-height: 1;
4733 color: #000;
4734 display: block;
4735 width: 17px;
4736 float: left;
4737 height: 100%;
4738 line-height: 24px;
4739 }
4740 }
4741
4742 .wc-shipping-zone-name,
4743 .wc-shipping-zone-methods {
4744 width: 25%;
4745 }
4746
4747 .wc-shipping-zone-actions {
4748 width: 13%;
4749 text-align: right;
4750
4751 a.wc-shipping-zone-actions,
4752 a.wc-shipping-zone-actions:hover {
4753 color: var(--wc-red);
4754 }
4755 }
4756
4757 .wc-shipping-class-description,
4758 .wc-shipping-class-name,
4759 .wc-shipping-class-slug,
4760 .wc-shipping-zone-name,
4761 .wc-shipping-class-actions,
4762 .wc-shipping-zone-region {
4763 input,
4764 select,
4765 textarea {
4766 width: 100%;
4767 }
4768 }
4769
4770 .wc-shipping-class-count {
4771 text-align: center;
4772 }
4773
4774 td.wc-shipping-zone-methods {
4775 .method_disabled {
4776 text-decoration: line-through;
4777 }
4778
4779 ul {
4780 position: relative;
4781 padding-right: 32px;
4782 display: flex;
4783 flex-wrap: wrap;
4784
4785 li {
4786 color: #000;
4787 display: inline;
4788 margin: 0;
4789 }
4790 }
4791
4792 .wc-shipping-zone-method {
4793 background-color: #F0F0F0;
4794 margin: 0 3px 3px 0;
4795 padding: 5px 9px;
4796 border-radius: 5px;
4797 }
4798
4799 .add_shipping_method {
4800 display: block;
4801 width: 24px;
4802 padding: 24px 0 0;
4803 height: 0;
4804 overflow: hidden;
4805 cursor: pointer;
4806
4807 &::before {
4808 @include icon;
4809 font-family: "Dashicons";
4810 content: "\f502";
4811 color: #999;
4812 vertical-align: middle;
4813 line-height: 24px;
4814 font-size: 16px;
4815 margin: 0;
4816 }
4817
4818 &.disabled {
4819 cursor: not-allowed;
4820
4821 &::before {
4822 color: #ccc;
4823 }
4824 }
4825 }
4826 }
4827
4828 .wc-shipping-zone-method-title {
4829 width: 25%;
4830 }
4831
4832 .wc-shipping-zone-method-enabled {
4833 text-align: center;
4834
4835 a {
4836 float: left;
4837 }
4838
4839 .woocommerce-input-toggle {
4840 margin-top: 3px;
4841 }
4842 }
4843
4844 .wc-shipping-zone-method-type {
4845 display: block;
4846 }
4847
4848 tfoot {
4849 input,
4850 select {
4851 vertical-align: middle !important;
4852 }
4853
4854 .button-secondary {
4855 float: right;
4856 }
4857 }
4858
4859 .editing {
4860 .wc-shipping-zone-view,
4861 .wc-shipping-zone-edit {
4862 display: none;
4863 }
4864 }
4865 }
4866
4867 .woocommerce-input-toggle {
4868 height: 16px;
4869 width: 32px;
4870 border: 2px solid var(--wp-admin-theme-color, $woocommerce);
4871 background-color: var(--wp-admin-theme-color, $woocommerce);
4872 display: inline-block;
4873 text-indent: -9999px;
4874 border-radius: 10em;
4875 position: relative;
4876 margin-top: -1px;
4877 vertical-align: text-top;
4878
4879 &::before {
4880 content: "";
4881 display: block;
4882 width: 16px;
4883 height: 16px;
4884 background: #fff;
4885 position: absolute;
4886 top: 0;
4887 right: 0;
4888 border-radius: 100%;
4889 }
4890
4891 &.woocommerce-input-toggle--disabled {
4892 border-color: #999;
4893 background-color: #999;
4894
4895 &::before {
4896 right: auto;
4897 left: 0;
4898 }
4899 }
4900
4901 &.woocommerce-input-toggle--loading {
4902 opacity: 0.5;
4903 }
4904 }
4905
4906 .wc-modal-shipping-method-settings {
4907
4908 form .form-table {
4909 width: 100%;
4910 background: #fff;
4911 margin: 0 0 1.5em;
4912
4913 tr {
4914 th {
4915 width: 40%;
4916 position: relative;
4917
4918 .woocommerce-help-tip {
4919 float: right;
4920 margin: -8px -0.5em 0 0;
4921 vertical-align: middle;
4922 right: 0;
4923 top: 50%;
4924 position: absolute;
4925 }
4926 }
4927
4928 td {
4929 input,
4930 select,
4931 textarea {
4932 width: 50%;
4933 min-width: 250px;
4934 }
4935
4936 input[type="checkbox"]="checkbox""] {
4937 width: auto;
4938 min-width: 16px;
4939 }
4940 width: 40%;
4941 }
4942
4943 td,
4944 th {
4945 vertical-align: middle;
4946 margin: 0;
4947 line-height: 24px;
4948 padding: 1em;
4949 border-bottom: 1px solid #f8f8f8;
4950 }
4951 }
4952
4953 &:last-of-type {
4954 margin-bottom: 0;
4955 }
4956 }
4957 }
4958
4959 img.help_tip {
4960 margin: 0 0 0 9px;
4961 vertical-align: middle;
4962 }
4963
4964 .postbox img.help_tip {
4965 margin-top: 0;
4966 }
4967
4968 .postbox .woocommerce-help-tip {
4969 margin: 0 0 0 9px;
4970 }
4971
4972 .status-enabled,
4973 .status-manual,
4974 .status-disabled {
4975 font-size: 1.4em;
4976
4977 @include ir();
4978 }
4979
4980 .status-manual::before {
4981 @include icon("\e008");
4982 color: #999;
4983 }
4984
4985 .status-enabled::before {
4986 @include icon("\e015");
4987 color: var(--wp-admin-theme-color, $woocommerce);
4988 }
4989
4990 .status-disabled::before {
4991 @include icon("\e013");
4992 color: #ccc;
4993 }
4994
4995 .woocommerce {
4996 h2.woo-nav-tab-wrapper {
4997 margin-bottom: 1em;
4998 }
4999
5000 nav.woo-nav-tab-wrapper {
5001 margin: 1.5em 0 1em;
5002 }
5003
5004 .subsubsub:not(.list-table-filters) {
5005 margin: -8px 0 0;
5006 }
5007
5008 .wc-admin-breadcrumb {
5009 margin-left: 0.5em;
5010
5011 a {
5012 color: var(--wp-admin-theme-color, $woocommerce);
5013 }
5014 }
5015
5016 #template div {
5017 margin: 0;
5018
5019 p .button {
5020 float: right;
5021 margin-left: 10px;
5022 margin-top: -4px;
5023 }
5024
5025 .editor textarea {
5026 margin-bottom: 8px;
5027 }
5028 }
5029
5030 textarea[disabled="disabled"]="disabled""] {
5031 background: #dfdfdf !important;
5032 }
5033
5034 .settings-panel {
5035 ul.advice {
5036 list-style: square;
5037 list-style-position: inside;
5038 }
5039 }
5040
5041 table.form-table {
5042 margin: 0;
5043 position: relative;
5044 table-layout: fixed;
5045
5046 .forminp-radio ul {
5047 margin: 0;
5048
5049 li {
5050 line-height: 1.4em;
5051 }
5052 }
5053
5054 input[type="text"]="text""],
5055 input[type="number"]="number""],
5056 input[type="email"]="email""] {
5057 height: auto;
5058 }
5059
5060 textarea.input-text {
5061 height: 100%;
5062 min-width: 150px;
5063 display: block;
5064 }
5065
5066 // Give regular settings inputs a standard width and padding.
5067 textarea,
5068 input[type="text"]="text""],
5069 input[type="email"]="email""],
5070 input[type="number"]="number""],
5071 input[type="password"]="password""],
5072 input[type="datetime"]="datetime""],
5073 input[type="datetime-local"]="datetime-local""],
5074 input[type="date"]="date""],
5075 input[type="time"]="time""],
5076 input[type="week"]="week""],
5077 input[type="url"]="url""],
5078 input[type="tel"]="tel""],
5079 input.regular-input {
5080 width: 400px;
5081 margin: 0;
5082 padding: 6px;
5083 box-sizing: border-box;
5084 vertical-align: top;
5085 }
5086
5087 input[type="datetime-local"]="datetime-local""],
5088 input[type="date"]="date""],
5089 input[type="time"]="time""],
5090 input[type="week"]="week""],
5091 input[type="tel"]="tel""] {
5092 width: 200px;
5093 }
5094
5095 select {
5096 width: 400px;
5097 margin: 0;
5098 box-sizing: border-box;
5099 line-height: 32px;
5100 vertical-align: top;
5101 }
5102
5103 input[size]] {
5104 width: auto !important;
5105 }
5106
5107 // Ignore nested inputs.
5108 table {
5109 select,
5110 textarea,
5111 input[type="text"]="text""],
5112 input[type="email"]="email""],
5113 input[type="number"]="number""],
5114 input.regular-input {
5115 width: auto;
5116 }
5117 }
5118
5119 textarea.wide-input {
5120 width: 100%;
5121 }
5122
5123 img.help_tip,
5124 .woocommerce-help-tip {
5125 padding: 0;
5126 margin: -4px 0 0 5px;
5127 vertical-align: middle;
5128 cursor: help;
5129 line-height: 1;
5130 }
5131
5132 span.help_tip {
5133 cursor: help;
5134 color: $blue;
5135 }
5136
5137 th {
5138 position: relative;
5139 padding-right: 24px;
5140 }
5141
5142 th label {
5143 position: relative;
5144 display: block;
5145
5146 img.help_tip,
5147 .woocommerce-help-tip {
5148 margin: -8px -24px 0 0;
5149 position: absolute;
5150 right: 0;
5151 top: 50%;
5152 }
5153 }
5154
5155 th label + .woocommerce-help-tip {
5156 margin: 0 0 0 0;
5157 position: absolute;
5158 right: 0;
5159 top: 20px;
5160 }
5161
5162 .select2-container {
5163 vertical-align: top;
5164 margin-bottom: 3px;
5165 }
5166
5167 .select2-container + span.description {
5168 display: block;
5169 margin-top: 8px;
5170 }
5171
5172 .wp-list-table .woocommerce-help-tip {
5173 float: none;
5174 }
5175
5176 fieldset {
5177 margin-top: 4px;
5178
5179 img.help_tip,
5180 .woocommerce-help-tip {
5181 margin: -3px 0 0 5px;
5182 }
5183
5184 p.description {
5185 margin-bottom: 8px;
5186
5187 &.is-error, span.is-error {
5188 color: $red;
5189 }
5190 }
5191
5192 &:first-child {
5193 margin-top: 0;
5194 }
5195 }
5196
5197 td.with-tooltip {
5198 > fieldset {
5199 margin-top: 0;
5200 }
5201 span.help-tooltip {
5202 position: absolute;
5203 margin-left: -30px;
5204 margin-top: 7px;
5205 }
5206 }
5207
5208 .iris-picker {
5209 z-index: 100;
5210 display: none;
5211 position: absolute;
5212 border: 1px solid #ccc;
5213 border-radius: 3px;
5214 box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
5215
5216 .ui-slider {
5217 border: 0 !important;
5218 margin: 0 !important;
5219 width: auto !important;
5220 height: auto !important;
5221 background: none transparent !important;
5222
5223 .ui-slider-handle {
5224 margin-bottom: 0 !important;
5225 }
5226 }
5227 }
5228
5229 .iris-error {
5230 background-color: #ffafaf;
5231 }
5232
5233 .colorpickpreview {
5234 padding: 7px 0;
5235 line-height: 1em;
5236 display: inline-block;
5237 width: 26px;
5238 border: 1px solid #ddd;
5239 font-size: 14px;
5240 }
5241
5242 .image_width_settings {
5243 vertical-align: middle;
5244
5245 label {
5246 margin-left: 10px;
5247 }
5248
5249 input {
5250 width: auto;
5251 }
5252 }
5253
5254 .wc_payment_gateways_wrapper,
5255 .wc_emails_wrapper {
5256 padding: 0 15px 10px 0;
5257 }
5258 }
5259
5260 .wc-shipping-zone-settings {
5261 td.forminp {
5262 input,
5263 textarea {
5264 width: 448px;
5265 padding: 6px 11px;
5266 }
5267
5268 .select2-search input {
5269 padding: 6px;
5270 }
5271 }
5272 }
5273 }
5274
5275 .wc-wp-version-gte-53 {
5276 .woocommerce {
5277 h2.wc-table-list-header {
5278 margin: 1em 0 0.35em 0;
5279 }
5280
5281 input + .subsubsub {
5282 margin: 8px 0 0;
5283 }
5284
5285 table.form-table {
5286 // Give regular settings inputs a standard width and padding.
5287 textarea,
5288 input[type="text"]="text""],
5289 input[type="email"]="email""],
5290 input[type="number"]="number""],
5291 input[type="password"]="password""],
5292 input[type="datetime"]="datetime""],
5293 input[type="datetime-local"]="datetime-local""],
5294 input[type="date"]="date""],
5295 input[type="time"]="time""],
5296 input[type="week"]="week""],
5297 input[type="url"]="url""],
5298 input[type="tel"]="tel""],
5299 input.regular-input {
5300 padding: 0 8px;
5301
5302 @media only screen and (max-width: 782px) {
5303 width: 100%;
5304 }
5305 }
5306
5307 select {
5308 @media only screen and (max-width: 782px) {
5309 width: 100%;
5310 }
5311 }
5312
5313 th label {
5314 img.help_tip,
5315 .woocommerce-help-tip {
5316 margin: -7px -24px 0 0;
5317
5318 @media only screen and (max-width: 782px) {
5319 right: auto;
5320 margin-left: 5px;
5321 }
5322 }
5323 }
5324
5325 .forminp-color {
5326 font-size: 0;
5327 }
5328
5329 .colorpickpreview {
5330 padding: 0;
5331 width: 30px;
5332 height: 30px;
5333 box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.2);
5334 font-size: 16px;
5335 border-radius: 4px;
5336 margin-right: 3px;
5337
5338 @media only screen and (max-width: 782px) {
5339 float: left;
5340 width: 40px;
5341 height: 40px;
5342 }
5343 }
5344 }
5345 }
5346 }
5347
5348 .woocommerce #tabs-wrap table a.remove {
5349 margin-left: 4px;
5350 }
5351
5352 .woocommerce #tabs-wrap table p {
5353 margin: 0 0 4px !important;
5354 overflow: hidden;
5355 zoom: 1;
5356 }
5357
5358 .woocommerce #tabs-wrap table p a.add {
5359 float: left;
5360 }
5361
5362 #wp-excerpt-editor-container {
5363 background: #fff;
5364 }
5365
5366 #product_variation-parent #parent_id {
5367 width: 100%;
5368 }
5369
5370 #postimagediv {
5371 .inside {
5372 padding: 0;
5373 margin: 0;
5374 }
5375
5376 p {
5377 margin: 0;
5378 padding: 10px;
5379 }
5380
5381 .image-added-detail {
5382 border-top: 1px solid #dcdcde;
5383 background-color: #f6f7f7;
5384 color: #7f8388;
5385 font-size: 12px;
5386 margin-top: 4px;
5387
5388 .dashicons {
5389 font-size: 13px;
5390 width: 13px;
5391 height: 13px;
5392 margin: 3px 3px 0 0;
5393 }
5394
5395 a {
5396 text-decoration: none;
5397 }
5398 }
5399
5400 img {
5401 border: 1px solid #d5d5d5;
5402 max-width: 100%;
5403 }
5404 }
5405
5406 #woocommerce-product-images .inside {
5407 margin: 0;
5408 padding: 0;
5409
5410 .add_product_images {
5411 padding: 0 12px 12px;
5412 }
5413
5414 #product_images_container {
5415 padding: 0 0 0 9px;
5416
5417 ul {
5418 @include clearfix();
5419 margin: 0;
5420 padding: 0;
5421
5422 li.image,
5423 li.add,
5424 li.wc-metabox-sortable-placeholder {
5425 width: 80px;
5426 float: left;
5427 cursor: move;
5428 border: 1px solid #d5d5d5;
5429 margin: 9px 9px 0 0;
5430 background: #f7f7f7;
5431
5432 @include border-radius(2px);
5433 position: relative;
5434 box-sizing: border-box;
5435
5436 img {
5437 width: 100%;
5438 height: auto;
5439 display: block;
5440 }
5441 }
5442
5443 li.wc-metabox-sortable-placeholder {
5444 border: 3px dashed #ddd;
5445 position: relative;
5446
5447 &::after {
5448 @include icon_dashicons("\f161");
5449 font-size: 2.618em;
5450 line-height: 72px;
5451 color: #ddd;
5452 }
5453 }
5454
5455 ul.actions {
5456 position: absolute;
5457 top: -8px;
5458 right: -8px;
5459 padding: 2px;
5460 display: none;
5461
5462 @media (max-width: 768px) {
5463 display: block;
5464 }
5465
5466 li {
5467 float: right;
5468 margin: 0 0 0 2px;
5469
5470 a {
5471 width: 1em;
5472 height: 1em;
5473 margin: 0;
5474 height: 0;
5475 display: block;
5476 overflow: hidden;
5477
5478 &.tips {
5479 cursor: pointer;
5480 }
5481 }
5482
5483 a.delete {
5484 @include ir();
5485 font-size: 1.4em;
5486
5487 &::before {
5488 @include icon_dashicons("\f153");
5489 color: #999;
5490 background: #fff;
5491 border-radius: 50%;
5492 height: 1em;
5493 width: 1em;
5494 line-height: 1em;
5495 }
5496
5497 &:hover::before {
5498 color: $red;
5499 }
5500 }
5501 }
5502 }
5503
5504 li:hover ul.actions {
5505 display: block;
5506 }
5507 }
5508 }
5509 }
5510
5511 #woocommerce-product-data {
5512 .hndle {
5513 padding: 10px;
5514
5515 span {
5516 display: block;
5517 line-height: 24px;
5518 }
5519
5520 .product-data-wrapper {
5521 label > * {
5522 display: inline-block;
5523 }
5524
5525 .woocommerce-product-type-tip {
5526 font-size: 1.4em;
5527 margin-left: 9px;
5528 }
5529 }
5530
5531 .type_box {
5532 display: inline;
5533 line-height: inherit;
5534 vertical-align: baseline;
5535 }
5536
5537 select {
5538 margin: 0;
5539 }
5540
5541 label {
5542 padding-right: 1em;
5543 font-size: 12px;
5544 vertical-align: baseline;
5545 }
5546
5547 label:first-child {
5548 margin-right: 1em;
5549 border-right: 1px solid #dfdfdf;
5550 }
5551
5552 input,
5553 select {
5554 margin-top: -3px 0 0;
5555 vertical-align: middle;
5556 }
5557
5558 select {
5559 margin-left: 0.5em;
5560 }
5561 }
5562
5563 > .handlediv {
5564 margin-top: 4px;
5565 }
5566
5567 .wrap {
5568 margin: 0;
5569 }
5570 }
5571
5572 #woocommerce-coupon-description {
5573 padding: 3px 8px;
5574 font-size: 1.7em;
5575 line-height: 1.42em;
5576 height: auto;
5577 width: 100%;
5578 outline: 0;
5579 margin: 10px 0;
5580 display: block;
5581
5582 &::-webkit-input-placeholder {
5583 line-height: 1.42em;
5584 color: #bbb;
5585 }
5586
5587 &::-moz-placeholder {
5588 line-height: 1.42em;
5589 color: #bbb;
5590 }
5591
5592 &:-ms-input-placeholder {
5593 line-height: 1.42em;
5594 color: #bbb;
5595 }
5596
5597 &:-moz-placeholder {
5598 line-height: 1.42em;
5599 color: #bbb;
5600 }
5601 }
5602
5603 #woocommerce-product-data,
5604 #woocommerce-coupon-data {
5605 .panel-wrap {
5606 background: #fff;
5607 }
5608
5609 .woocommerce_options_panel,
5610 .wc-metaboxes-wrapper {
5611 float: left;
5612 width: 80%;
5613
5614 ._backorders_field .wc-radios li {
5615 display: block;
5616 padding: 0 0 2px;
5617 }
5618
5619 .wc-radios {
5620 display: block;
5621 float: left;
5622 margin: 0;
5623
5624 li {
5625 display: block;
5626 padding: 0 0 10px;
5627
5628 input {
5629 width: auto;
5630 }
5631 }
5632 }
5633 }
5634 }
5635
5636 #woocommerce-product-data,
5637 #woocommerce-coupon-data,
5638 .woocommerce {
5639 .panel-wrap {
5640 overflow: hidden;
5641 }
5642
5643 ul.wc-tabs {
5644 margin: 0;
5645 width: 20%;
5646 float: left;
5647 line-height: 1em;
5648 padding: 0 0 10px;
5649 position: relative;
5650 background-color: #fafafa;
5651 border-right: 1px solid #eee;
5652 box-sizing: border-box;
5653
5654 &::after {
5655 content: "";
5656 display: block;
5657 width: 100%;
5658 height: 9999em;
5659 position: absolute;
5660 bottom: -9999em;
5661 left: 0;
5662 background-color: #fafafa;
5663 border-right: 1px solid #eee;
5664 }
5665
5666 li {
5667 margin: 0;
5668 padding: 0;
5669 display: block;
5670 position: relative;
5671
5672 a {
5673 margin: 0;
5674 padding: 10px;
5675 display: block;
5676 box-shadow: none;
5677 text-decoration: none;
5678 line-height: 20px !important;
5679 border-bottom: 1px solid #eee;
5680
5681 span {
5682 margin-left: 0.618em;
5683 margin-right: 0.618em;
5684 }
5685
5686 &::before {
5687 @include iconbeforedashicons("\f107");
5688 }
5689 }
5690
5691 &.general_options a::before {
5692 content: "\f107";
5693 }
5694
5695 &.inventory_options a::before {
5696 content: "\f481";
5697 }
5698
5699 &.shipping_options a::before {
5700 font-family: "WooCommerce";
5701 content: "\e01a";
5702 }
5703
5704 &.linked_product_options a::before {
5705 content: "\f103";
5706 }
5707
5708 &.attribute_options a::before {
5709 content: "\f175";
5710 }
5711
5712 &.advanced_options a::before {
5713 font-family: "Dashicons";
5714 content: "\f111";
5715 }
5716
5717 &.marketplace-suggestions_options a::before {
5718 content: none;
5719 }
5720
5721 &.variations_options a::before {
5722 content: "\f509";
5723 }
5724
5725 &.usage_restriction_options a::before {
5726 font-family: "WooCommerce";
5727 content: "\e602";
5728 }
5729
5730 &.usage_limit_options a::before {
5731 font-family: "WooCommerce";
5732 content: "\e601";
5733 }
5734
5735 &.general_coupon_data a::before {
5736 font-family: "WooCommerce";
5737 content: "\e600";
5738 }
5739
5740 &.active a {
5741 color: #555;
5742 position: relative;
5743 background-color: #eee;
5744 }
5745 }
5746 }
5747 }
5748
5749 /**
5750 * Settings / Advanced / Features
5751 */
5752 .woocommerce_page_wc-settings {
5753 .wc-settings-row-woocommerce_custom_orders_table_enabled td.forminp {
5754 padding-bottom: 0;
5755 }
5756
5757 .wc-settings-row-woocommerce_custom_orders_table_data_sync_enabled td.forminp {
5758 padding-top: 0;
5759 }
5760 }
5761
5762 /**
5763 * Shipping
5764 */
5765 .woocommerce_page_wc-settings {
5766 input[type="url"]="url""],
5767 input[type="email"]="email""] {
5768 direction: ltr;
5769 }
5770
5771 .shippingrows {
5772 th.check-column {
5773 padding-top: 20px;
5774 }
5775
5776 tfoot th {
5777 padding-left: 10px;
5778 }
5779
5780 .add.button::before {
5781 @include iconbefore("\e007");
5782 }
5783 }
5784
5785 h3.wc-settings-sub-title {
5786 font-size: 1.2em;
5787 }
5788 }
5789
5790 #woocommerce-product-data,
5791 #woocommerce-product-type-options,
5792 #woocommerce-order-data,
5793 #woocommerce-order-downloads,
5794 #woocommerce-coupon-data {
5795 .inside {
5796 margin: 0;
5797 padding: 0;
5798 }
5799 }
5800
5801 .woocommerce_options_panel,
5802 .panel {
5803 padding: 9px;
5804 color: #555;
5805
5806 .form-field .woocommerce-help-tip {
5807 font-size: 1.4em;
5808 }
5809 }
5810
5811 .woocommerce_page_settings .woocommerce_options_panel,
5812 .panel {
5813 padding: 0;
5814 }
5815
5816 #woocommerce-product-type-options .panel,
5817 #woocommerce-product-specs .inside {
5818 margin: 0;
5819 padding: 9px;
5820 }
5821
5822 .woocommerce_options_panel p,
5823 #woocommerce-product-type-options .panel p,
5824 .woocommerce_options_panel fieldset.form-field {
5825 margin: 0 0 9px;
5826 font-size: 12px;
5827 padding: 5px 9px;
5828 line-height: 24px;
5829
5830 &::after {
5831 content: ".";
5832 display: block;
5833 height: 0;
5834 clear: both;
5835 visibility: hidden;
5836 }
5837 }
5838
5839 .woocommerce_options_panel .checkbox,
5840 .woocommerce_variable_attributes .checkbox {
5841 margin: 4px 0 !important;
5842 vertical-align: middle;
5843 float: left;
5844 }
5845
5846 .woocommerce_variations,
5847 .woocommerce_options_panel {
5848 .downloadable_files table {
5849 width: 100%;
5850 padding: 0 !important;
5851
5852 th {
5853 padding: 7px 0 7px 7px !important;
5854
5855 &.sort {
5856 width: 17px;
5857 padding: 7px !important;
5858 }
5859
5860 .woocommerce-help-tip {
5861 font-size: 1.1em;
5862 margin-left: 0;
5863 }
5864 }
5865
5866 td {
5867 vertical-align: middle !important;
5868 padding: 4px 0 4px 7px !important;
5869 position: relative;
5870
5871 &:last-child {
5872 padding-right: 7px !important;
5873 }
5874
5875 input.input_text {
5876 width: 100%;
5877 float: none;
5878 min-width: 0;
5879 margin: 1px 0;
5880 }
5881
5882 &.file_url {
5883 /* Reduce the size of this field to make space for a warning asterisk. */
5884 input {
5885 display: inline-block;
5886 width: 96%;
5887 }
5888 }
5889
5890 .upload_file_button {
5891 width: auto;
5892 float: right;
5893 cursor: pointer;
5894 }
5895
5896 .delete {
5897 @include ir();
5898 font-size: 1.2em;
5899
5900 &::before {
5901 @include icon_dashicons("\f153");
5902 color: #999;
5903 }
5904
5905 &:hover {
5906 &::before {
5907 color: $red;
5908 }
5909 }
5910 }
5911 }
5912
5913 td.sort {
5914 width: 17px;
5915 cursor: move;
5916 font-size: 15px;
5917 text-align: center;
5918 background: #f9f9f9;
5919 padding-right: 7px !important;
5920
5921 &::before {
5922 content: "\f333";
5923 font-family: "Dashicons";
5924 text-align: center;
5925 line-height: 1;
5926 color: #999;
5927 display: block;
5928 width: 17px;
5929 float: left;
5930 height: 100%;
5931 }
5932
5933 &:hover::before {
5934 color: #333;
5935 }
5936 }
5937
5938 /* Warning asterisk (indicates if there is a problem with a downloadable file). */
5939 span.disabled {
5940 color: var(--wc-red);
5941 }
5942 }
5943 }
5944
5945 .woocommerce_attribute,
5946 .woocommerce_variation {
5947 h3 .sort {
5948 width: 17px;
5949 height: 26px;
5950 cursor: move;
5951 float: right;
5952 font-size: 15px;
5953 font-weight: 400;
5954 margin-right: 0.5em;
5955 text-align: center;
5956 vertical-align: middle;
5957
5958 &::before {
5959 content: "\f333";
5960 font-family: "Dashicons";
5961 text-align: center;
5962 line-height: 28px;
5963 color: #999;
5964 display: block;
5965 width: 17px;
5966 float: left;
5967 height: 100%;
5968 }
5969
5970 &:hover::before {
5971 color: #777;
5972 }
5973 }
5974 .edit_variation {
5975 margin-left: 0.5em;
5976 }
5977
5978 h3:hover,
5979 &.ui-sortable-helper {
5980 .sort {
5981 visibility: visible;
5982 }
5983 }
5984
5985 &.wc-metabox {
5986 &.postbox {
5987 border-top: 0px;
5988 border-left: 0px;
5989 border-right: 0px;
5990 }
5991 }
5992 }
5993
5994 .woocommerce_options_panel {
5995 min-height: 175px;
5996 box-sizing: border-box;
5997
5998 .downloadable_files {
5999 padding: 0 9px 0 162px;
6000 position: relative;
6001 margin: 9px 0;
6002
6003 label {
6004 position: absolute;
6005 left: 0;
6006 margin: 0 0 0 12px;
6007 line-height: 24px;
6008 }
6009 }
6010
6011 p {
6012 margin: 9px 0;
6013 }
6014
6015 p.form-field,
6016 fieldset.form-field {
6017 padding: 5px 20px 5px 162px !important;
6018
6019 /** Padding for aligning labels left - 12px + 150 label width **/
6020 &._sold_individually_field {
6021 padding-right: 0px !important;
6022 }
6023 }
6024
6025 .sale_price_dates_fields {
6026 .short:first-of-type {
6027 margin-bottom: 1em;
6028 }
6029
6030 .short:nth-of-type(2) {
6031 clear: left;
6032 }
6033 }
6034
6035 label,
6036 legend {
6037 float: left;
6038 width: 150px;
6039 padding: 0;
6040 margin: 0 0 0 -150px;
6041
6042 .req {
6043 font-weight: 700;
6044 font-style: normal;
6045 color: $red;
6046 }
6047 }
6048
6049 .description,
6050 input[type="checkbox"]="checkbox""] + .description,
6051 input[type="radio"]="radio""] + .description {
6052 padding: 0;
6053 margin: 0 0 0 7px;
6054 clear: none;
6055 display: inline;
6056 }
6057
6058 input:not([type="checkbox"]):not([type="radio"]) + .description {
6059 display: block;
6060 clear: both;
6061 margin-left: 0;
6062 }
6063
6064 .description-block {
6065 margin-left: 0;
6066 display: block;
6067 }
6068
6069 textarea,
6070 input,
6071 select {
6072 margin: 0;
6073 }
6074
6075 textarea {
6076 float: left;
6077 height: 3.5em;
6078 line-height: 1.5em;
6079 vertical-align: top;
6080 }
6081
6082 input[type="text"]="text""],
6083 input[type="email"]="email""],
6084 input[type="number"]="number""],
6085 input[type="password"]="password""] {
6086 width: 50%;
6087 float: left;
6088 }
6089
6090 input.button {
6091 width: auto;
6092 margin-left: 8px;
6093 }
6094
6095 select {
6096 float: left;
6097 }
6098
6099 input[type="text"]="text""].short,
6100 input[type="email"]="email""].short,
6101 input[type="number"]="number""].short,
6102 input[type="password"]="password""].short,
6103 .short {
6104 width: 50%;
6105 }
6106
6107 .sized {
6108 width: auto !important;
6109 margin-right: 6px;
6110 }
6111
6112 .options_group {
6113 border-top: 1px solid white;
6114 border-bottom: 1px solid #eee;
6115
6116 &:first-child {
6117 border-top: 0;
6118 }
6119
6120 &:last-child {
6121 border-bottom: 0;
6122 }
6123
6124 fieldset {
6125 margin: 9px 0;
6126 font-size: 12px;
6127 padding: 5px 9px;
6128 line-height: 24px;
6129
6130 label {
6131 width: auto;
6132 float: none;
6133 }
6134
6135 ul {
6136 float: left;
6137 width: 50%;
6138 margin: 0;
6139 padding: 0;
6140
6141 li {
6142 margin: 0;
6143 width: auto;
6144
6145 input {
6146 width: auto;
6147 float: none;
6148 margin-right: 4px;
6149 }
6150 }
6151 }
6152
6153 ul.wc-radios label {
6154 margin-left: 0;
6155 }
6156 }
6157 }
6158
6159 .dimensions_field .wrap {
6160 display: block;
6161 width: 50%;
6162
6163 input {
6164 width: 30.75%;
6165 margin-right: 3.8%;
6166 }
6167
6168 .last {
6169 margin-right: 0;
6170 }
6171 }
6172
6173 &.padded {
6174 padding: 1em;
6175 }
6176
6177 .select2-container {
6178 float: left;
6179 }
6180
6181 .inventory_sold_individually {
6182 display: flex;
6183
6184 .woocommerce-help-tip {
6185 align-self: center;
6186 }
6187 }
6188 }
6189
6190 #woocommerce-product-data input.dp-applied {
6191 float: left;
6192 }
6193
6194 #grouped_product_options,
6195 #virtual_product_options,
6196 #simple_product_options {
6197 padding: 12px;
6198 font-style: italic;
6199 color: #666;
6200 }
6201
6202 /**
6203 * WooCommerce meta boxes
6204 */
6205 .wc-metaboxes-wrapper {
6206 :not(#variable_product_options_inner),
6207 &#product_attributes {
6208 .toolbar:not(.expand-close-hidden) {
6209 border-bottom: 1px solid #eee;
6210 }
6211 }
6212 .toolbar {
6213 margin: 0 !important;
6214 border-top: 1px solid white;
6215 padding: 9px 12px !important;
6216
6217 &:first-child {
6218 border-top: 0;
6219 }
6220
6221 &:last-child {
6222 border-bottom: 0;
6223 }
6224
6225 .add_variation {
6226 float: right;
6227 margin-left: 5px;
6228 }
6229
6230 .save-variation-changes,
6231 .cancel-variation-changes {
6232 float: left;
6233 margin-right: 5px;
6234 }
6235 }
6236
6237 p.toolbar {
6238 overflow: hidden;
6239 zoom: 1;
6240 }
6241
6242 .expand-close {
6243 margin-right: 2px;
6244 color: #777;
6245 font-size: 12px;
6246 font-style: italic;
6247
6248 a {
6249 background: none;
6250 padding: 0;
6251 font-size: 12px;
6252 text-decoration: none;
6253 }
6254 }
6255
6256 &#product_attributes .expand-close {
6257 float: right;
6258 line-height: 28px;
6259 }
6260
6261 button.add_variable_attribute,
6262 .fr {
6263 float: right;
6264 margin: 0 0 0 6px;
6265 }
6266
6267 .wc-metaboxes {
6268 border-bottom: 1px solid #eee;
6269 }
6270
6271 .wc-metabox-sortable-placeholder {
6272 border-color: #bbb;
6273 background-color: #f5f5f5;
6274 margin-bottom: 9px;
6275 border-width: 1px;
6276 border-style: dashed;
6277 }
6278
6279 .wc-metabox {
6280 background: #fff;
6281 border-bottom: 1px solid #eee;
6282 margin: 0 !important;
6283
6284 select {
6285 font-weight: 400;
6286 }
6287
6288 &:last-of-type {
6289 border-bottom: 0;
6290 }
6291
6292 .handlediv {
6293 width: 27px;
6294 float: right;
6295
6296 &::before {
6297 content: "\f142" !important;
6298 cursor: pointer;
6299 display: inline-block;
6300 font: 400 20px/1 "Dashicons";
6301 line-height: 0.5 !important;
6302 padding: 8px 10px;
6303 position: relative;
6304 right: 12px;
6305 top: 0;
6306 }
6307 }
6308
6309 &.closed {
6310 @include border-radius(3px);
6311
6312 .handlediv::before {
6313 content: "\f140" !important;
6314 }
6315
6316 h3 {
6317 border: 0;
6318 }
6319 }
6320
6321 h3 {
6322 margin: 0 !important;
6323 padding: 0.75em 0.75em 0.75em 1em !important;
6324 font-size: 1em !important;
6325 overflow: hidden;
6326 zoom: 1;
6327 cursor: move;
6328
6329 button,
6330 a.delete,
6331 a.edit {
6332 float: right;
6333 margin-right: 12px;
6334 }
6335
6336 a.delete {
6337 color: red;
6338 font-weight: normal;
6339 line-height: 26px;
6340 text-decoration: none;
6341 position: relative;
6342 }
6343
6344 a.edit {
6345 font-weight: normal;
6346 line-height: 26px;
6347 text-decoration: none;
6348 position: relative;
6349 }
6350
6351 a.remove_variation {
6352 margin: 0 0.5em;
6353 }
6354
6355 strong {
6356 font-weight: normal;
6357 line-height: 26px;
6358 font-weight: 700;
6359 }
6360
6361 select {
6362 font-family: sans-serif;
6363 max-width: 20%;
6364 margin: 0.25em 0.25em 0.25em 0;
6365 }
6366
6367 .handlediv {
6368 background-position: 6px 5px !important;
6369 margin: 4px 0 -1px !important;
6370 height: 26px;
6371 }
6372
6373 &.fixed {
6374 cursor: pointer !important;
6375 }
6376 }
6377
6378 &.woocommerce_attribute h3,
6379 &.woocommerce_variation h3 {
6380 cursor: pointer;
6381 padding: 0.5em 0.75em 0.5em 1em !important;
6382
6383 a.delete,
6384 a.edit,
6385 .sort {
6386 margin-top: 0.25em;
6387 }
6388 }
6389 &.woocommerce_variation h3 {
6390 a.delete,
6391 a.edit,
6392 .sort {
6393 margin-top: 0.45em;
6394 }
6395 }
6396
6397 table {
6398 width: 100%;
6399 position: relative;
6400 background-color: #fdfdfd;
6401 padding: 1em;
6402 border-top: 1px solid #eee;
6403
6404 td {
6405 text-align: left;
6406 padding: 0 6px 1em 0;
6407 vertical-align: top;
6408 border: 0;
6409
6410 label {
6411 text-align: left;
6412 display: block;
6413 line-height: 21px;
6414 }
6415
6416 input {
6417 float: left;
6418 min-width: 200px;
6419 }
6420
6421 input,
6422 textarea {
6423 width: 100%;
6424 margin: 0;
6425 display: block;
6426 font-size: 14px;
6427 padding: 4px;
6428 color: #555;
6429 }
6430
6431 select,
6432 .select2-container {
6433 width: 100% !important;
6434 }
6435
6436 input.short {
6437 width: 200px;
6438 }
6439
6440 input.checkbox {
6441 width: 16px;
6442 min-width: inherit;
6443 vertical-align: text-bottom;
6444 display: inline-block;
6445 float: none;
6446 }
6447 }
6448
6449 td.attribute_name {
6450 width: 200px;
6451 }
6452
6453 .plus,
6454 .minus {
6455 margin-top: 6px;
6456 }
6457
6458 .fl {
6459 float: left;
6460 }
6461
6462 .fr {
6463 float: right;
6464 }
6465 }
6466 .placeholder {
6467 opacity: 0.4;
6468 }
6469 }
6470 }
6471
6472 .variations-pagenav {
6473 float: right;
6474 line-height: 24px;
6475
6476 .displaying-num {
6477 color: #777;
6478 font-size: 12px;
6479 font-style: italic;
6480 }
6481
6482 a {
6483 padding: 0 10px 3px;
6484 background: rgba(0, 0, 0, 0.05);
6485 font-size: 16px;
6486 font-weight: 400;
6487 text-decoration: none;
6488 }
6489
6490 a.disabled,
6491 a.disabled:active,
6492 a.disabled:focus,
6493 a.disabled:hover {
6494 color: #a0a5aa;
6495 background: rgba(0, 0, 0, 0.05);
6496 }
6497 }
6498
6499 .variations-defaults {
6500 float: left;
6501
6502 select {
6503 margin: 0.25em 0.25em 0.25em 0;
6504 }
6505 }
6506
6507 .woocommerce_variable_attributes {
6508 background-color: #fdfdfd;
6509 border-top: 1px solid #eee;
6510
6511 .data {
6512 @include clearfix;
6513 padding: 1em 2em;
6514 }
6515
6516 .upload_image_button {
6517 display: block;
6518 width: 64px;
6519 height: 64px;
6520 float: left;
6521 margin-right: 20px;
6522 position: relative;
6523 cursor: pointer;
6524
6525 img {
6526 width: 100%;
6527 height: auto;
6528 display: none;
6529 }
6530
6531 &::before {
6532 content: "\f128";
6533 font-family: "Dashicons";
6534 position: absolute;
6535 top: 0;
6536 left: 0;
6537 right: 0;
6538 bottom: 0;
6539 text-align: center;
6540 line-height: 64px;
6541 font-size: 64px;
6542 font-weight: 400;
6543 -webkit-font-smoothing: antialiased;
6544 }
6545
6546 &.remove {
6547 img {
6548 display: block;
6549 }
6550
6551 &::before {
6552 content: "\f335";
6553 display: none;
6554 }
6555
6556 &:hover::before {
6557 display: block;
6558 }
6559 }
6560 }
6561
6562 .options {
6563 border: 1px solid #eee;
6564 border-width: 1px 0;
6565 padding: 0.25em 0;
6566
6567 label {
6568 display: inline-block;
6569 padding: 4px 1em 2px 0;
6570 }
6571
6572 input[type="checkbox"]="checkbox""] {
6573 margin: 0 5px 0 0.5em !important;
6574 vertical-align: middle;
6575 }
6576 }
6577 }
6578
6579 .form-row {
6580 label {
6581 display: inline-block;
6582 }
6583
6584 .woocommerce-help-tip {
6585 float: right;
6586 }
6587
6588 input[type="text"]="text""],
6589 input[type="number"]="number""],
6590 input[type="password"]="password""],
6591 input[type="color"]="color""],
6592 input[type="date"]="date""],
6593 input[type="datetime"]="datetime""],
6594 input[type="datetime-local"]="datetime-local""],
6595 input[type="email"]="email""],
6596 input[type="month"]="month""],
6597 input[type="search"]="search""],
6598 input[type="tel"]="tel""],
6599 input[type="time"]="time""],
6600 input[type="url"]="url""],
6601 input[type="week"]="week""],
6602 select,
6603 textarea {
6604 width: 100%;
6605 vertical-align: middle;
6606 margin: 2px 0 0;
6607 padding: 5px;
6608 }
6609
6610 select {
6611 height: 40px;
6612 }
6613
6614 &.dimensions_field {
6615 .wrap {
6616 clear: left;
6617 display: block;
6618 }
6619
6620 input {
6621 width: 33%;
6622 float: left;
6623 vertical-align: middle;
6624
6625 &:last-of-type {
6626 margin-right: 0;
6627 width: 34%;
6628 }
6629 }
6630 }
6631
6632 &.form-row-first,
6633 &.form-row-last {
6634 width: 48%;
6635 float: right;
6636 }
6637
6638 &.form-row-first {
6639 clear: both;
6640 float: left;
6641 }
6642
6643 &.form-row-full {
6644 clear: both;
6645 }
6646 }
6647
6648 /**
6649 * Tooltips
6650 */
6651 .tips {
6652 cursor: help;
6653 text-decoration: none;
6654 }
6655
6656 img.tips {
6657 padding: 5px 0 0;
6658 }
6659
6660 #tiptip_holder {
6661 display: none;
6662 z-index: 8675309;
6663 position: absolute;
6664 top: 0;
6665 pointer-events: none;
6666
6667 /*rtl:ignore*/
6668 left: 0;
6669
6670 &.tip_top {
6671 padding-bottom: 5px;
6672
6673 #tiptip_arrow_inner {
6674 margin-top: -7px;
6675 margin-left: -6px;
6676 border-top-color: #333;
6677 }
6678 }
6679
6680 &.tip_bottom {
6681 padding-top: 5px;
6682
6683 #tiptip_arrow_inner {
6684 margin-top: -5px;
6685 margin-left: -6px;
6686 border-bottom-color: #333;
6687 }
6688 }
6689
6690 &.tip_right {
6691 padding-left: 5px;
6692
6693 #tiptip_arrow_inner {
6694 margin-top: -6px;
6695 margin-left: -5px;
6696 border-right-color: #333;
6697 }
6698 }
6699
6700 &.tip_left {
6701 padding-right: 5px;
6702
6703 #tiptip_arrow_inner {
6704 margin-top: -6px;
6705 margin-left: -7px;
6706 border-left-color: #333;
6707 }
6708 }
6709 }
6710
6711 #tiptip_content,
6712 .chart-tooltip,
6713 .wc_error_tip {
6714 color: #fff;
6715 font-size: 0.8em;
6716 max-width: 150px;
6717 background: #333;
6718 text-align: center;
6719 border-radius: 3px;
6720 padding: 0.618em 1em;
6721 box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
6722
6723 code {
6724 padding: 1px;
6725 background: #888;
6726 }
6727 }
6728
6729 #tiptip_arrow,
6730 #tiptip_arrow_inner {
6731 position: absolute;
6732 border-color: transparent;
6733 border-style: solid;
6734 border-width: 6px;
6735 height: 0;
6736 width: 0;
6737 }
6738
6739 /*rtl:raw:
6740 #tiptip_arrow {
6741 right: 50%;
6742 margin-right: -6px;
6743 }
6744 */
6745
6746 .wc_error_tip {
6747 max-width: 20em;
6748 line-height: 1.8em;
6749 position: absolute;
6750 white-space: normal;
6751 background: #d82223;
6752 margin: 1.5em 1px 0 -1em;
6753 z-index: 9999999;
6754
6755 &::after {
6756 content: "";
6757 display: block;
6758 border: 8px solid #d82223;
6759 border-right-color: transparent;
6760 border-left-color: transparent;
6761 border-top-color: transparent;
6762 position: absolute;
6763 top: -3px;
6764 left: 50%;
6765 margin: -1em 0 0 -3px;
6766 }
6767 }
6768
6769 /**
6770 * Date picker
6771 */
6772 img.ui-datepicker-trigger {
6773 vertical-align: middle;
6774 margin-top: -1px;
6775 cursor: pointer;
6776 }
6777
6778 .woocommerce_options_panel img.ui-datepicker-trigger,
6779 .wc-metabox-content img.ui-datepicker-trigger {
6780 float: left;
6781 margin-right: 8px;
6782 margin-top: 4px;
6783 margin-left: 4px;
6784 }
6785
6786 #ui-datepicker-div {
6787 display: none;
6788 }
6789
6790 /**
6791 * Reports
6792 */
6793 .woocommerce-reports-remove-filter {
6794 color: red;
6795 text-decoration: none;
6796 }
6797
6798 .woocommerce-reports-wrap,
6799 .woocommerce-reports-wide {
6800 &.woocommerce-reports-wrap {
6801 margin-left: 300px;
6802 padding-top: 18px;
6803 }
6804
6805 &.halved {
6806 margin: 0;
6807 overflow: hidden;
6808 zoom: 1;
6809 }
6810
6811 .widefat th {
6812 padding: 7px;
6813 }
6814
6815 .widefat td {
6816 vertical-align: top;
6817 padding: 7px;
6818
6819 .description {
6820 margin: 4px 0 0;
6821 }
6822 }
6823
6824 .postbox {
6825 &::after {
6826 content: ".";
6827 display: block;
6828 height: 0;
6829 clear: both;
6830 visibility: hidden;
6831 }
6832
6833 h3 {
6834 cursor: default !important;
6835 }
6836
6837 .inside {
6838 padding: 10px;
6839 margin: 0 !important;
6840 }
6841
6842 div.stats_range,
6843 h3.stats_range {
6844 border-bottom-color: #dfdfdf;
6845 margin: 0;
6846 padding: 0 !important;
6847
6848 .export_csv {
6849 float: right;
6850 line-height: 26px;
6851 border-left: 1px solid #dfdfdf;
6852 padding: 10px;
6853 display: block;
6854 text-decoration: none;
6855
6856 &::before {
6857 @include iconbeforedashicons("\f346");
6858 margin-right: 4px;
6859 }
6860 }
6861
6862 ul {
6863 list-style: none outside;
6864 margin: 0;
6865 padding: 0;
6866 zoom: 1;
6867 background: #f5f5f5;
6868 border-bottom: 1px solid #ccc;
6869
6870 &::before,
6871 &::after {
6872 content: " ";
6873 display: table;
6874 }
6875
6876 &::after {
6877 clear: both;
6878 }
6879
6880 li {
6881 float: left;
6882 margin: 0;
6883 padding: 0;
6884 line-height: 26px;
6885 font-weight: bold;
6886 font-size: 14px;
6887
6888 a {
6889 border-right: 1px solid #dfdfdf;
6890 padding: 10px;
6891 display: block;
6892 text-decoration: none;
6893 }
6894
6895 &.active {
6896 background: #fff;
6897 box-shadow: 0 4px 0 0 #fff;
6898
6899 a {
6900 color: #777;
6901 }
6902 }
6903
6904 &.custom {
6905 padding: 9px 10px;
6906 vertical-align: middle;
6907
6908 form,
6909 div {
6910 display: inline;
6911 margin: 0;
6912
6913 input.range_datepicker {
6914 padding: 0;
6915 margin: 0 10px 0 0;
6916 background: transparent;
6917 border: 0;
6918 color: #777;
6919 text-align: center;
6920 box-shadow: none;
6921
6922 &.from {
6923 margin-right: 0;
6924 }
6925 }
6926 }
6927 }
6928 }
6929 }
6930 }
6931
6932 .chart-with-sidebar {
6933 padding: 12px 12px 12px 249px;
6934 margin: 0 !important;
6935
6936 .chart-sidebar {
6937 width: 225px;
6938 margin-left: -237px;
6939 float: left;
6940 }
6941 }
6942
6943 .chart-widgets {
6944 margin: 0;
6945 padding: 0;
6946
6947 li.chart-widget {
6948 margin: 0 0 1em;
6949 background: #fafafa;
6950 border: 1px solid #dfdfdf;
6951
6952 &::after {
6953 content: ".";
6954 display: block;
6955 height: 0;
6956 clear: both;
6957 visibility: hidden;
6958 }
6959
6960 h4 {
6961 background: #fff;
6962 border: 1px solid #dfdfdf;
6963 border-left-width: 0;
6964 border-right-width: 0;
6965 padding: 10px;
6966 margin: 0;
6967 color: $blue;
6968 border-top-width: 0;
6969 background-image: linear-gradient(to top, #ececec, #f9f9f9);
6970
6971 &.section_title:hover {
6972 color: $red;
6973 }
6974 }
6975
6976 .section_title {
6977 cursor: pointer;
6978
6979 span {
6980 display: block;
6981
6982 &::after {
6983 @include iconafter("\e035");
6984 float: right;
6985 font-size: 0.9em;
6986 line-height: 1.618;
6987 }
6988 }
6989
6990 &.open {
6991 color: #333;
6992
6993 span::after {
6994 display: none;
6995 }
6996 }
6997 }
6998
6999 .section {
7000 border-bottom: 1px solid #dfdfdf;
7001
7002 .select2-container {
7003 width: 100% !important;
7004 }
7005
7006 &:last-of-type {
7007 border-radius: 0 0 3px 3px;
7008 }
7009 }
7010
7011 table {
7012 width: 100%;
7013
7014 td {
7015 padding: 7px 10px;
7016 vertical-align: top;
7017 border-top: 1px solid #e5e5e5;
7018 line-height: 1.4em;
7019 }
7020
7021 tr:first-child td {
7022 border-top: 0;
7023 }
7024
7025 td.count {
7026 background: #f5f5f5;
7027 }
7028
7029 td.name {
7030 max-width: 175px;
7031
7032 a {
7033 word-wrap: break-word;
7034 }
7035 }
7036
7037 td.sparkline {
7038 vertical-align: middle;
7039 }
7040
7041 .wc_sparkline {
7042 width: 32px;
7043 height: 1em;
7044 display: block;
7045 float: right;
7046 }
7047
7048 tr.active td {
7049 background: #f5f5f5;
7050 }
7051 }
7052
7053 form,
7054 p {
7055 margin: 0;
7056 padding: 10px;
7057
7058 .submit {
7059 margin-top: 10px;
7060 }
7061 }
7062
7063 #product_ids {
7064 width: 100%;
7065 }
7066
7067 .select_all,
7068 .select_none {
7069 float: right;
7070 color: #999;
7071 margin-left: 4px;
7072 margin-top: 10px;
7073 }
7074
7075 .description {
7076 margin-left: 0.5em;
7077 font-weight: normal;
7078 opacity: 0.8;
7079 }
7080 }
7081 }
7082
7083 .chart-legend {
7084 list-style: none outside;
7085 margin: 0 0 1em;
7086 padding: 0;
7087 border: 1px solid #dfdfdf;
7088 border-right-width: 0;
7089 border-bottom-width: 0;
7090 background: #fff;
7091
7092 li {
7093 border-right: 5px solid #aaa;
7094 color: #aaa;
7095 padding: 1em;
7096 display: block;
7097 margin: 0;
7098 transition: all ease 0.5s;
7099 box-shadow: inset 0 -1px 0 0 #dfdfdf;
7100
7101 strong {
7102 font-size: 1.618em;
7103 line-height: 1.2em;
7104 color: #464646;
7105 font-weight: normal;
7106 display: block;
7107 font-family: "HelveticaNeue-Light", "Helvetica Neue Light",
7108 "Helvetica Neue", sans-serif;
7109
7110 del {
7111 color: #e74c3c;
7112 font-weight: normal;
7113 }
7114 }
7115
7116 &:hover {
7117 box-shadow: inset 0 -1px 0 0 #dfdfdf,
7118 inset 300px 0 0 #f7edf7;
7119 border-right: 5px solid var(--wc-primary) !important;
7120 padding-left: 1.5em;
7121 color: var(--wc-primary);
7122 }
7123 }
7124 }
7125
7126 .pie-chart-legend {
7127 margin: 12px 0 0;
7128 overflow: hidden;
7129
7130 li {
7131 float: left;
7132 margin: 0;
7133 padding: 6px 0 0;
7134 border-top: 4px solid #999;
7135 text-align: center;
7136 box-sizing: border-box;
7137 width: 50%;
7138 }
7139 }
7140
7141 .stat {
7142 font-size: 1.5em !important;
7143 font-weight: 700;
7144 text-align: center;
7145 }
7146
7147 .chart-placeholder {
7148 width: 100%;
7149 height: 650px;
7150 overflow: hidden;
7151 position: relative;
7152 }
7153
7154 .chart-prompt {
7155 line-height: 650px;
7156 margin: 0;
7157 color: #999;
7158 font-size: 1.2em;
7159 font-style: italic;
7160 text-align: center;
7161 }
7162
7163 .chart-container {
7164 background: #fff;
7165 padding: 12px;
7166 position: relative;
7167 border: 1px solid #dfdfdf;
7168 border-radius: 3px;
7169 }
7170
7171 .main .chart-legend {
7172 margin-top: 12px;
7173
7174 li {
7175 border-right: 0;
7176 margin: 0 8px 0 0;
7177 float: left;
7178 border-top: 4px solid #aaa;
7179 }
7180 }
7181 }
7182
7183 .woocommerce-reports-main {
7184 float: left;
7185 min-width: 100%;
7186
7187 table td {
7188 padding: 9px;
7189 }
7190 }
7191
7192 .woocommerce-reports-sidebar {
7193 display: inline;
7194 width: 281px;
7195 margin-left: -300px;
7196 clear: both;
7197 float: left;
7198 }
7199
7200 .woocommerce-reports-left {
7201 width: 49.5%;
7202 float: left;
7203 }
7204
7205 .woocommerce-reports-right {
7206 width: 49.5%;
7207 float: right;
7208 }
7209 }
7210
7211 .woocommerce-wide-reports-wrap {
7212 padding-bottom: 11px;
7213
7214 .widefat {
7215 .export-data {
7216 float: right;
7217 }
7218
7219 th,
7220 td {
7221 vertical-align: middle;
7222 padding: 7px;
7223 }
7224 }
7225 }
7226
7227 form.report_filters {
7228 p {
7229 vertical-align: middle;
7230 }
7231
7232 label,
7233 input,
7234 div {
7235 vertical-align: middle;
7236 }
7237 }
7238
7239 .chart-tooltip {
7240 position: absolute;
7241 display: none;
7242 line-height: 1;
7243 }
7244
7245 table.bar_chart {
7246 width: 100%;
7247
7248 thead th {
7249 text-align: left;
7250 color: #ccc;
7251 padding: 6px 0;
7252 }
7253
7254 tbody {
7255 th {
7256 padding: 6px 0;
7257 width: 25%;
7258 text-align: left !important;
7259 font-weight: normal !important;
7260 border-bottom: 1px solid #fee;
7261 }
7262
7263 td {
7264 text-align: right;
7265 line-height: 24px;
7266 padding: 6px 6px 6px 0;
7267 border-bottom: 1px solid #fee;
7268
7269 span {
7270 color: #8a4b75;
7271 display: block;
7272 }
7273
7274 span.alt {
7275 color: #47a03e;
7276 margin-top: 6px;
7277 }
7278 }
7279
7280 td.bars {
7281 position: relative;
7282 text-align: left;
7283 padding: 6px 6px 6px 0;
7284 border-bottom: 1px solid #fee;
7285
7286 span,
7287 a {
7288 text-decoration: none;
7289 clear: both;
7290 background: #8a4b75;
7291 float: left;
7292 display: block;
7293 line-height: 24px;
7294 height: 24px;
7295 border-radius: 3px;
7296 }
7297
7298 span.alt {
7299 clear: both;
7300 background: #47a03e;
7301
7302 span {
7303 margin: 0;
7304 color: #c5dec2 !important;
7305 text-shadow: 0 1px 0 #47a03e;
7306 background: transparent;
7307 }
7308 }
7309 }
7310 }
7311 }
7312
7313 .woocommerce_page_wc-orders,
7314 .post-type-shop_order {
7315 .woocommerce-BlankState-message::before {
7316 @include icon("\e01d");
7317 }
7318 }
7319
7320 .post-type-shop_coupon .woocommerce-BlankState-message::before {
7321 @include icon("\e600");
7322 }
7323
7324 .post-type-product .woocommerce-BlankState-message::before {
7325 @include icon("\e006");
7326 }
7327
7328 .woocommerce-BlankState--api .woocommerce-BlankState-message::before {
7329 @include icon("\e01c");
7330 }
7331
7332 .woocommerce-BlankState--webhooks .woocommerce-BlankState-message::before {
7333 @include icon("\e01b");
7334 }
7335
7336 .woocommerce-BlankState {
7337 text-align: center;
7338 padding: 5em 0 0;
7339
7340 .woocommerce-BlankState-message {
7341 color: #aaa;
7342 margin: 0 auto 1.5em;
7343 line-height: 1.5em;
7344 font-size: 1.2em;
7345 max-width: 500px;
7346
7347 &::before {
7348 color: #ddd;
7349 text-shadow: 0 -1px 1px rgba(0, 0, 0, 0.2),
7350 0 1px 0 rgba(255, 255, 255, 0.8);
7351 font-size: 8em;
7352 display: block;
7353 position: relative !important;
7354 top: auto;
7355 left: auto;
7356 line-height: 1em;
7357 margin: 0 0 0.1875em;
7358 }
7359 }
7360
7361 .woocommerce-BlankState-cta {
7362 font-size: 1.2em;
7363 padding: 0.75em 1.5em;
7364 margin: 0 0.25em;
7365 height: auto;
7366 display: inline-block !important;
7367 }
7368 }
7369
7370 .woocommerce_page_wc-orders .woocommerce-BlankState,
7371 .post-type-product .woocommerce-BlankState,
7372 .post-type-shop_order .woocommerce-BlankState {
7373 max-width: 764px;
7374 text-align: center;
7375 margin: auto;
7376
7377 .woocommerce-BlankState-message {
7378 color: #444;
7379 font-size: 1.5em;
7380 margin: 0 auto 1em;
7381 }
7382
7383 .woocommerce-BlankState-message::before {
7384 font-size: 120px;
7385 }
7386
7387 .woocommerce-BlankState-buttons {
7388 margin-bottom: 4em;
7389 }
7390 }
7391
7392 .post-type-product {
7393 #wp-pointer-2 .wp-pointer-arrow {
7394 left: 240px;
7395 }
7396
7397 #wp-pointer-3 .wp-pointer-arrow,
7398 #wp-pointer-4 .wp-pointer-arrow {
7399 left: 46%;
7400 }
7401 }
7402
7403 /**
7404 * Small screen optimisation
7405 */
7406 @media only screen and (max-width: 1280px) {
7407 #order_data {
7408 .order_data_column {
7409 width: 48%;
7410
7411 &:first-child {
7412 width: 100%;
7413 }
7414 }
7415 }
7416
7417 .woocommerce_options_panel {
7418 .description {
7419 display: block;
7420 clear: both;
7421 margin-left: 0;
7422 }
7423
7424 .short,
7425 input[type="text"]="text""].short,
7426 input[type="email"]="email""].short,
7427 input[type="number"]="number""].short,
7428 input[type="password"]="password""].short,
7429 .dimensions_field .wrap {
7430 width: 80%;
7431 }
7432 }
7433
7434 .woocommerce_variations,
7435 .woocommerce_options_panel {
7436 .downloadable_files {
7437 padding: 0;
7438 clear: both;
7439
7440 label {
7441 position: static;
7442 }
7443
7444 table {
7445 margin: 0 12px 24px;
7446 width: 94%;
7447
7448 .sort {
7449 visibility: hidden;
7450 }
7451 }
7452 }
7453
7454 .woocommerce_variable_attributes .downloadable_files table {
7455 margin: 0 0 1em;
7456 width: 100%;
7457 }
7458 }
7459 }
7460
7461 /**
7462 * Optimisation for screens 900px and smaller
7463 */
7464 @media only screen and (max-width: 900px) {
7465 #woocommerce-coupon-data ul.coupon_data_tabs,
7466 #woocommerce-product-data ul.product_data_tabs,
7467 #woocommerce-product-data .wc-tabs-back {
7468 width: 10%;
7469 }
7470
7471 #woocommerce-coupon-data .wc-metaboxes-wrapper,
7472 #woocommerce-coupon-data .woocommerce_options_panel,
7473 #woocommerce-product-data .wc-metaboxes-wrapper,
7474 #woocommerce-product-data .woocommerce_options_panel {
7475 width: 90%;
7476 }
7477
7478 #woocommerce-coupon-data ul.coupon_data_tabs li a,
7479 #woocommerce-product-data ul.product_data_tabs li a {
7480 position: relative;
7481 text-indent: -999px;
7482 padding: 10px;
7483
7484 &::before {
7485 position: absolute;
7486 top: 0;
7487 right: 0;
7488 bottom: 0;
7489 left: 0;
7490 text-indent: 0;
7491 text-align: center;
7492 line-height: 40px;
7493 width: 100%;
7494 height: 40px;
7495 }
7496 }
7497 }
7498
7499 /**
7500 * Optimisation for screens 782px and smaller
7501 */
7502 @media only screen and (max-width: 782px) {
7503 #wp-excerpt-media-buttons a {
7504 font-size: 16px;
7505 line-height: 37px;
7506 height: 39px;
7507 padding: 0 20px 0 15px;
7508 }
7509
7510 #wp-excerpt-editor-tools {
7511 padding-top: 20px;
7512 padding-right: 15px;
7513 overflow: hidden;
7514 margin-bottom: -1px;
7515 }
7516
7517 #woocommerce-product-data .checkbox {
7518 width: 25px;
7519 }
7520
7521 .variations-pagenav {
7522 float: none;
7523 text-align: center;
7524 font-size: 18px;
7525
7526 .displaying-num {
7527 font-size: 16px;
7528 }
7529
7530 a {
7531 padding: 8px 20px 11px;
7532 font-size: 18px;
7533 }
7534
7535 select {
7536 padding: 0 20px;
7537 }
7538 }
7539
7540 .variations-defaults {
7541 float: none;
7542 text-align: center;
7543 margin-top: 10px;
7544 }
7545
7546 .post-type-product {
7547 .wp-list-table {
7548 .column-thumb {
7549 display: none;
7550 text-align: left;
7551 padding-bottom: 0;
7552
7553 &::before {
7554 display: none !important;
7555 }
7556
7557 img {
7558 max-width: 32px;
7559 }
7560 }
7561
7562 .is-expanded td:not(.hidden) {
7563 overflow: visible;
7564 }
7565
7566 .is-expanded .toggle-row {
7567 top: -28px;
7568 }
7569 }
7570 }
7571
7572 .post-type-shop_order {
7573 .wp-list-table {
7574 .column-customer_message,
7575 .column-order_notes {
7576 text-align: inherit;
7577 }
7578
7579 .column-order_notes .note-on {
7580 font-size: 1.3em;
7581 margin: 0;
7582 }
7583
7584 .is-expanded td:not(.hidden) {
7585 overflow: visible;
7586 }
7587 }
7588 }
7589 }
7590
7591 @media only screen and (max-width: 500px) {
7592 .woocommerce_options_panel label,
7593 .woocommerce_options_panel legend {
7594 float: none;
7595 width: auto;
7596 display: block;
7597 margin: 0;
7598 }
7599
7600 .woocommerce_options_panel fieldset.form-field,
7601 .woocommerce_options_panel p.form-field {
7602 padding: 5px 20px !important;
7603 }
7604
7605 .addons-wcs-banner-block {
7606 flex-direction: column;
7607 }
7608
7609 .wc-addons-wrap {
7610 .addons-wcs-banner-block {
7611 padding: 40px;
7612 }
7613
7614 .addons-wcs-banner-block-image {
7615 padding: 1em;
7616 text-align: center;
7617 width: 100%;
7618 padding: 2em 0;
7619 margin: 0;
7620
7621 .addons-img {
7622 margin: 0;
7623 }
7624 }
7625 }
7626 }
7627
7628 /**
7629 * Backbone modal dialog
7630 */
7631 .wc-backbone-modal {
7632 * {
7633 box-sizing: border-box;
7634 }
7635
7636 .wc-backbone-modal-content {
7637 position: fixed;
7638 background: #fff;
7639 z-index: 100000;
7640 left: 50%;
7641 top: 50%;
7642 transform: translate(-50%, -50%);
7643 width: 50%;
7644 max-width: 100%;
7645 min-width: 500px;
7646
7647 article {
7648 overflow: auto;
7649 }
7650 }
7651
7652 &.wc-backbone-modal-shipping-method-settings .wc-backbone-modal-content {
7653 min-width: 500px;
7654 }
7655
7656 &.wc-backbone-modal-add-shipping-method .wc-backbone-modal-content article {
7657 min-height: 180px
7658 }
7659
7660 .select2-container {
7661 width: 100% !important;
7662 }
7663 }
7664
7665 @media screen and (max-width: 782px) {
7666 .wc-backbone-modal .wc-backbone-modal-content {
7667 width: 100%;
7668 height: 100%;
7669 min-width: 100%;
7670 }
7671 }
7672
7673 .wc-backbone-modal-backdrop {
7674 position: fixed;
7675 top: 0;
7676 left: 0;
7677 right: 0;
7678 bottom: 0;
7679 min-height: 360px;
7680 background: #000;
7681 opacity: 0.7;
7682 z-index: 99900;
7683 }
7684
7685 .wc-backbone-modal-main {
7686 padding-bottom: 55px;
7687
7688 header,
7689 article {
7690 display: block;
7691 position: relative;
7692 }
7693
7694 .wc-backbone-modal-header {
7695 height: auto;
7696 background: #fcfcfc;
7697 padding: 1em 1.5em;
7698 border-bottom: 1px solid #ddd;
7699
7700 h1 {
7701 margin: 0;
7702 font-size: 18px;
7703 font-weight: 700;
7704 line-height: 1.5em;
7705 }
7706
7707 .modal-close-link {
7708 cursor: pointer;
7709 color: #777;
7710 height: 54px;
7711 width: 54px;
7712 padding: 0;
7713 position: absolute;
7714 top: 0;
7715 right: 0;
7716 text-align: center;
7717 border: 0;
7718 border-left: 1px solid #ddd;
7719 background-color: transparent;
7720 transition: color 0.1s ease-in-out, background 0.1s ease-in-out;
7721
7722 &::before {
7723 font: normal 22px/50px "dashicons" !important;
7724 color: #666;
7725 display: block;
7726 content: "\f335";
7727 font-weight: 300;
7728 }
7729
7730 &:hover,
7731 &:focus {
7732 background: #ddd;
7733 border-color: #ccc;
7734 color: #000;
7735 }
7736
7737 &:focus {
7738 outline: none;
7739 }
7740 }
7741 }
7742
7743 article {
7744 padding: 1.5em;
7745
7746 p {
7747 margin: 1.5em 0;
7748 }
7749
7750 p:first-child {
7751 margin-top: 0;
7752 }
7753
7754 p:last-child {
7755 margin-bottom: 0;
7756 }
7757
7758 .pagination {
7759 padding: 10px 0 0;
7760 text-align: center;
7761 }
7762
7763 table.widefat {
7764 margin: 0;
7765 width: 100%;
7766 border: 0;
7767 box-shadow: none;
7768
7769 thead th {
7770 padding: 0 1em 1em 1em;
7771 text-align: left;
7772
7773 &:first-child {
7774 padding-left: 0;
7775 }
7776
7777 &:last-child {
7778 padding-right: 0;
7779 text-align: right;
7780 }
7781 }
7782
7783 tbody td,
7784 tbody th {
7785 padding: 1em;
7786 text-align: left;
7787 vertical-align: middle;
7788
7789 &:first-child {
7790 padding-left: 0;
7791 }
7792
7793 &:last-child {
7794 padding-right: 0;
7795 text-align: right;
7796 }
7797
7798 select,
7799 .select2-container {
7800 width: 100%;
7801 }
7802 }
7803 }
7804 }
7805
7806 footer {
7807 position: absolute;
7808 left: 0;
7809 right: 0;
7810 bottom: 0;
7811 z-index: 100;
7812 padding: 1em 1.5em;
7813 background: #fcfcfc;
7814 border-top: 1px solid #dfdfdf;
7815 box-shadow: 0 -4px 4px -4px rgba(0, 0, 0, 0.1);
7816
7817 .inner {
7818 text-align: right;
7819 line-height: 23px;
7820
7821 .button {
7822 margin-bottom: 0;
7823 }
7824 }
7825 }
7826 }
7827
7828 /**
7829 * Select2 elements.
7830 */
7831 .select2-drop,
7832 .select2-dropdown {
7833 z-index: 999999 !important;
7834 }
7835
7836 .select2-results {
7837 line-height: 1.5em;
7838
7839 .select2-results__option,
7840 .select2-results__group {
7841 margin: 0;
7842 padding: 8px;
7843 }
7844
7845 .description {
7846 display: block;
7847 color: #999;
7848 padding-top: 4px;
7849 }
7850 }
7851
7852 .select2-dropdown {
7853 border-color: #ddd;
7854 }
7855
7856 .select2-dropdown--below {
7857 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
7858 }
7859
7860 .select2-dropdown--above {
7861 box-shadow: 0 -1px 1px rgba(0, 0, 0, 0.1);
7862 }
7863
7864 .select2-container {
7865 .select2-selection__rendered.ui-sortable li {
7866 cursor: move;
7867 }
7868
7869 .select2-selection {
7870 border-color: #ddd;
7871 }
7872
7873 .select2-search__field {
7874 min-width: 150px;
7875 }
7876
7877 .select2-selection--single {
7878 height: 40px;
7879
7880 .select2-selection__rendered {
7881 line-height: 40px;
7882 padding-right: 24px;
7883 }
7884
7885 .select2-selection__arrow {
7886 right: 3px;
7887 height: 36px;
7888 }
7889 }
7890
7891 .select2-selection--multiple {
7892 min-height: 28px;
7893 border-radius: 0;
7894 line-height: 1.5;
7895
7896 li {
7897 margin: 0;
7898 }
7899
7900 .select2-selection__choice {
7901 padding: 2px 6px;
7902
7903 .description {
7904 display: none;
7905 }
7906 }
7907 }
7908
7909 .select2-selection__clear {
7910 color: #999;
7911 margin-top: -1px;
7912 z-index: 1;
7913 }
7914
7915 .select2-search--inline .select2-search__field {
7916 font-family: inherit;
7917 font-size: inherit;
7918 font-weight: inherit;
7919 padding: 3px 0;
7920 }
7921 }
7922
7923 .woocommerce table.form-table .select2-container {
7924 min-width: 400px !important;
7925 }
7926
7927 .wc-wp-version-gte-53 {
7928 .select2-results {
7929 .select2-results__option,
7930 .select2-results__group {
7931 &:focus {
7932 outline: none;
7933 }
7934 }
7935 }
7936
7937 .select2-dropdown {
7938 border-color: var(--wp-admin-theme-color, #007cba);
7939
7940 &::after {
7941 position: absolute;
7942 left: 0;
7943 right: 0;
7944 height: 1px;
7945 background: #fff;
7946 content: "";
7947 }
7948 }
7949
7950 .select2-dropdown--below {
7951 box-shadow: 0 0 0 1px var(--wp-admin-theme-color, #007cba), 0 2px 1px rgba(0, 0, 0, 0.1);
7952
7953 &::after {
7954 top: -1px;
7955 }
7956 }
7957
7958 .select2-dropdown--above {
7959 box-shadow: 0 0 0 1px var(--wp-admin-theme-color, #007cba), 0 -2px 1px rgba(0, 0, 0, 0.1);
7960
7961 &::after {
7962 bottom: -1px;
7963 }
7964 }
7965
7966 .select2-container {
7967 @media only screen and (max-width: 782px) {
7968 font-size: 16px;
7969 }
7970
7971 &:focus {
7972 outline: none;
7973 }
7974
7975 .select2-selection--single {
7976 height: 30px;
7977 border-color: #7e8993;
7978
7979 @media only screen and (max-width: 782px) {
7980 height: 40px;
7981 }
7982
7983 &:focus {
7984 outline: none;
7985 }
7986
7987 .select2-selection__rendered {
7988 line-height: 28px;
7989
7990 @media only screen and (max-width: 782px) {
7991 line-height: 38px;
7992 }
7993
7994 &:hover {
7995 color: var(--wp-admin-theme-color, #007cba);
7996 }
7997 }
7998
7999 .select2-selection__arrow {
8000 right: 1px;
8001 height: 28px;
8002 width: 23px;
8003 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")
8004 no-repeat right 5px top 55%;
8005 background-size: 16px 16px;
8006
8007 @media only screen and (max-width: 782px) {
8008 height: 38px;
8009 }
8010
8011 b {
8012 display: none;
8013 }
8014 }
8015 }
8016
8017 &.select2-container--focus .select2-selection--single,
8018 &.select2-container--open .select2-selection--single,
8019 &.select2-container--open .select2-selection--multiple {
8020 border-color: var(--wp-admin-theme-color, #007cba);
8021 box-shadow: 0 0 0 1px var(--wp-admin-theme-color, #007cba);
8022 }
8023
8024 .select2-selection--multiple {
8025 min-height: 30px;
8026 border-color: #7e8993;
8027 border-radius: 4px;
8028 }
8029
8030 .select2-search--inline .select2-search__field {
8031 padding: 0 0 0 3px;
8032 min-height: 28px;
8033 }
8034 }
8035
8036 .woocommerce table.form-table .select2-container {
8037 @media only screen and (max-width: 782px) {
8038 min-width: 100% !important;
8039 }
8040 }
8041 }
8042
8043 .wc-wp-version-gte-55 {
8044 #woocommerce-product-data {
8045 .hndle {
8046 display: block;
8047 line-height: 24px;
8048
8049 .type_box {
8050 display: inline;
8051 line-height: inherit;
8052 vertical-align: baseline;
8053 }
8054 }
8055 }
8056 }
8057
8058 /**
8059 * Select2 colors for built-in admin color themes.
8060 */
8061 .wp-admin {
8062 &.wc-wp-version-gte-53 {
8063 .select2-dropdown {
8064 border-color: var(--wp-admin-theme-color, #007cba);
8065 }
8066
8067 .select2-dropdown--below {
8068 box-shadow: 0 0 0 1px var(--wp-admin-theme-color, #007cba), 0 2px 1px rgba(0, 0, 0, 0.1);
8069 }
8070
8071 .select2-dropdown--above {
8072 box-shadow: 0 0 0 1px var(--wp-admin-theme-color, #007cba), 0 -2px 1px rgba(0, 0, 0, 0.1);
8073 }
8074
8075 .select2-selection--single .select2-selection__rendered:hover {
8076 color: var(--wp-admin-theme-color, #007cba);
8077 }
8078
8079 .select2-container.select2-container--focus .select2-selection--single,
8080 .select2-container.select2-container--open .select2-selection--single,
8081 .select2-container.select2-container--open
8082 .select2-selection--single,
8083 .select2-container.select2-container--open
8084 .select2-selection--multiple {
8085 border-color: var(--wp-admin-theme-color, #007cba);
8086 box-shadow: 0 0 0 1px var(--wp-admin-theme-color, #007cba);
8087 }
8088
8089 .select2-container--default
8090 .select2-results__option--highlighted[aria-selected]],
8091 .select2-container--default
8092 .select2-results__option--highlighted[data-selected]] {
8093 background-color: var(--wp-admin-theme-color, #007cba);
8094 }
8095 }
8096 }
8097
8098 .woocommerce_page_wc-orders .tablenav,
8099 .post-type-product .tablenav,
8100 .post-type-shop_order .tablenav {
8101 .actions {
8102 overflow: visible;
8103 }
8104
8105 select,
8106 input {
8107 height: 32px;
8108 }
8109
8110 .select2-container {
8111 float: left;
8112 width: 240px !important;
8113 font-size: 14px;
8114 vertical-align: middle;
8115 margin: 1px 6px 4px 1px;
8116 }
8117 }
8118
8119 .woocommerce-progress-form-wrapper,
8120 .woocommerce-exporter-wrapper,
8121 .woocommerce-importer-wrapper {
8122 text-align: center;
8123 max-width: 700px;
8124 margin: 40px auto;
8125
8126 .error {
8127 text-align: left;
8128 }
8129
8130 .wc-progress-steps {
8131 padding: 0 0 24px;
8132 margin: 0;
8133 list-style: none outside;
8134 overflow: hidden;
8135 color: #ccc;
8136 width: 100%;
8137 display: -webkit-inline-flex;
8138 display: -ms-inline-flexbox;
8139 display: inline-flex;
8140
8141 li {
8142 width: 25%;
8143 float: left;
8144 padding: 0 0 0.8em;
8145 margin: 0;
8146 text-align: center;
8147 position: relative;
8148 border-bottom: 4px solid #ccc;
8149 line-height: 1.4em;
8150 }
8151
8152 li::before {
8153 content: "";
8154 border: 4px solid #ccc;
8155 border-radius: 100%;
8156 width: 4px;
8157 height: 4px;
8158 position: absolute;
8159 bottom: 0;
8160 left: 50%;
8161 margin-left: -6px;
8162 margin-bottom: -8px;
8163 background: #fff;
8164 }
8165
8166 li.active {
8167 border-color: var(--wp-admin-theme-color, $woocommerce);
8168 color: var(--wp-admin-theme-color, $woocommerce);
8169
8170 &::before {
8171 border-color: var(--wp-admin-theme-color, $woocommerce);
8172 }
8173 }
8174
8175 li.done {
8176 border-color: var(--wp-admin-theme-color, $woocommerce);
8177 color: var(--wp-admin-theme-color, $woocommerce);
8178
8179 &::before {
8180 border-color: var(--wp-admin-theme-color, $woocommerce);
8181 background: var(--wp-admin-theme-color, $woocommerce);
8182 }
8183 }
8184 }
8185
8186 .button {
8187 font-size: 1.25em;
8188 padding: 0.5em 1em !important;
8189 line-height: 1.5em !important;
8190 border-radius: 4px;
8191 }
8192
8193 .error .button {
8194 font-size: 1em;
8195 }
8196
8197 .wc-actions {
8198 overflow: hidden;
8199 border-top: 1px solid #eee;
8200 margin: 0;
8201 padding: 23px 24px 24px;
8202 line-height: 3em;
8203
8204 .button {
8205 float: right;
8206 }
8207
8208 .woocommerce-importer-toggle-advanced-options {
8209 color: #999;
8210 }
8211 }
8212
8213 .woocommerce-exporter,
8214 .woocommerce-importer,
8215 .wc-progress-form-content {
8216 background: #fff;
8217 overflow: hidden;
8218 padding: 0;
8219 margin: 0 0 16px;
8220 box-shadow: 0 1px 3px rgba(0, 0, 0, 0.13);
8221 color: #555;
8222 text-align: left;
8223
8224 header {
8225 border-bottom: 1px solid #eee;
8226 margin: 0;
8227 padding: 24px 24px 0;
8228 }
8229
8230 section {
8231 padding: 24px 24px 0;
8232 }
8233
8234 h2 {
8235 margin: 0 0 24px;
8236 color: #555;
8237 font-size: 24px;
8238 font-weight: normal;
8239 line-height: 1em;
8240 }
8241
8242 p {
8243 font-size: 1em;
8244 line-height: 1.75em;
8245 font-size: 16px;
8246 color: #555;
8247 margin: 0 0 24px;
8248 }
8249
8250 .form-row {
8251 margin-top: 24px;
8252 }
8253
8254 .spinner {
8255 display: none;
8256 }
8257
8258 .woocommerce-importer-options th,
8259 .woocommerce-importer-options td,
8260 .woocommerce-exporter-options th,
8261 .woocommerce-exporter-options td {
8262 vertical-align: top;
8263 line-height: 1.75em;
8264 padding: 0 0 24px 0;
8265
8266 label {
8267 color: #555;
8268 font-weight: normal;
8269 }
8270
8271 input[type="checkbox"]="checkbox""] {
8272 margin: 0 4px 0 0;
8273 padding: 7px;
8274 }
8275
8276 input[type="text"]="text""],
8277 input[type="number"]="number""] {
8278 padding: 7px;
8279 height: auto;
8280 margin: 0;
8281 }
8282
8283 .woocommerce-importer-file-url-field-wrapper {
8284 border: 1px solid #ddd;
8285 -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.07);
8286 box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.07);
8287 background-color: #fff;
8288 color: #32373c;
8289 outline: 0;
8290 line-height: 1;
8291 display: block;
8292
8293 code {
8294 background: none;
8295 font-size: smaller;
8296 padding: 0;
8297 margin: 0;
8298 color: #999;
8299 padding: 7px 0 0 7px;
8300 display: inline-block;
8301 }
8302
8303 input {
8304 font-family: Consolas, Monaco, monospace;
8305 border: 0;
8306 margin: 0;
8307 outline: 0;
8308 box-shadow: none;
8309 display: inline-block;
8310 min-width: 100%;
8311 }
8312 }
8313 }
8314
8315 .woocommerce-exporter-options th,
8316 .woocommerce-importer-options th {
8317 width: 35%;
8318 padding-right: 20px;
8319 }
8320
8321 progress {
8322 width: 100%;
8323 height: 42px;
8324 margin: 0 auto 24px;
8325 display: block;
8326 -webkit-appearance: none;
8327 border: none;
8328 display: none;
8329 background: #f5f5f5;
8330 border: 2px solid #eee;
8331 border-radius: 4px;
8332 padding: 0;
8333 box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.2);
8334 }
8335
8336 progress::-webkit-progress-bar {
8337 background: transparent none;
8338 border: 0;
8339 border-radius: 4px;
8340 padding: 0;
8341 box-shadow: none;
8342 }
8343
8344 progress::-webkit-progress-value {
8345 border-radius: 3px;
8346 box-shadow: inset 0 1px 1px 0 rgba(255, 255, 255, 0.4);
8347 background: var(--wp-admin-theme-color, $woocommerce);
8348 transition: width 1s ease;
8349 }
8350
8351 progress::-moz-progress-bar {
8352 border-radius: 3px;
8353 box-shadow: inset 0 1px 1px 0 rgba(255, 255, 255, 0.4);
8354 background: var(--wp-admin-theme-color, $woocommerce);
8355 transition: width 1s ease;
8356 }
8357
8358 progress::-ms-fill {
8359 border-radius: 3px;
8360 box-shadow: inset 0 1px 1px 0 rgba(255, 255, 255, 0.4);
8361 background: var(--wp-admin-theme-color, $woocommerce);
8362 transition: width 1s ease;
8363 }
8364
8365 &.woocommerce-exporter__exporting,
8366 &.woocommerce-importer__importing {
8367 .spinner {
8368 display: block;
8369 }
8370
8371 progress {
8372 display: block;
8373 }
8374
8375 .wc-actions,
8376 .woocommerce-exporter-options {
8377 display: none;
8378 }
8379 }
8380
8381 .wc-importer-mapping-table-wrapper,
8382 .wc-importer-error-log {
8383 padding: 0;
8384 }
8385
8386 .wc-importer-mapping-table,
8387 .wc-importer-error-log-table {
8388 margin: 0;
8389 border: 0;
8390 box-shadow: none;
8391 width: 100%;
8392 table-layout: fixed;
8393
8394 td,
8395 th {
8396 border: 0;
8397 padding: 12px;
8398 vertical-align: middle;
8399 word-wrap: break-word;
8400
8401 select {
8402 width: 100%;
8403 }
8404 }
8405
8406 tbody tr:nth-child(odd) td,
8407 tbody tr:nth-child(odd) th {
8408 background: #fbfbfb;
8409 }
8410
8411 th {
8412 font-weight: bold;
8413 }
8414
8415 td:first-child,
8416 th:first-child {
8417 padding-left: 24px;
8418 }
8419
8420 td:last-child,
8421 th:last-child {
8422 padding-right: 24px;
8423 }
8424
8425 .wc-importer-mapping-table-name {
8426 width: 50%;
8427
8428 .description {
8429 color: #999;
8430 margin-top: 4px;
8431 display: block;
8432
8433 code {
8434 background: none;
8435 padding: 0;
8436 white-space: pre-line;
8437 /* CSS 3 (and 2.1 as well, actually) */
8438 word-wrap: break-word;
8439 /* IE */
8440 word-break: break-all;
8441 }
8442 }
8443 }
8444 }
8445
8446 .woocommerce-importer-done {
8447 text-align: center;
8448 padding: 48px 24px;
8449 font-size: 1.5em;
8450 line-height: 1.75em;
8451
8452 &::before {
8453 @include icon("\e015");
8454 color: var(--wp-admin-theme-color, $woocommerce);
8455 position: static;
8456 font-size: 100px;
8457 display: block;
8458 float: none;
8459 margin: 0 0 24px;
8460 }
8461 }
8462 }
8463 }
8464
8465 .wc-pointer {
8466 .wc-pointer-buttons {
8467 .close {
8468 float: left;
8469 margin: 6px 0 0 15px;
8470 }
8471 }
8472 }
8473
8474 .wc-quick-edit-warning {
8475 color: darkred;
8476 font-weight: bold;
8477 }
8478
8479 .wc-addons__empty {
8480 margin: 48px auto;
8481 max-width: 640px;
8482
8483 h2 {
8484 font-size: 20px;
8485 font-weight: 400;
8486 line-height: 1.2;
8487 }
8488
8489 p {
8490 font-size: 16px;
8491 line-height: 1.5;
8492 }
8493 }
8494
8495 @media screen and (min-width: 600px) {
8496 .wc-addons-wrap {
8497 .marketplace-header {
8498 padding-left: 84px;
8499 }
8500
8501 .storefront {
8502 h2 {
8503 margin-top: 0;
8504 }
8505
8506 img {
8507 float: left;
8508 margin: 0 16px 0 auto;
8509 width: 278px;
8510 }
8511 }
8512 }
8513
8514 .marketplace-header__tab {
8515 flex: none;
8516 }
8517 }
8518
8519 @media screen and (min-width: 961px) {
8520 .marketplace-header__tabs {
8521 margin-left: 84px;
8522 }
8523 }
8524
8525 @media screen and (min-width: 1024px) {
8526 .current-section-name {
8527 display: none;
8528 }
8529
8530 .wc-addons-wrap {
8531 .current-section-dropdown__title {
8532 display: block;
8533 font-size: 20px;
8534 font-weight: 400;
8535 line-height: 24px;
8536 margin: 0 0 16px;
8537 }
8538
8539 .current-section-dropdown {
8540 background: none;
8541 border: none;
8542 margin-bottom: 32px;
8543 width: 100%;
8544
8545 ul {
8546 background: none;
8547 border: none;
8548 display: flex;
8549 flex-direction: row;
8550 flex-wrap: wrap;
8551 justify-content: flex-start;
8552 margin-top: -12px;
8553 padding: 0;
8554 position: static;
8555
8556 li {
8557 background: #fff;
8558 border: 1px solid #ccc;
8559 border-radius: 32px;
8560 font-size: 14px;
8561 line-height: 20px;
8562 margin: 12px 12px 0 0;
8563
8564 &.current {
8565 background: var(--wp-admin-theme-color, #007cba);
8566 border: 1px solid var(--wp-admin-theme-color, #007cba);
8567
8568 a {
8569 color: #fff;
8570 }
8571
8572 a::after {
8573 background: none;
8574 }
8575 }
8576 }
8577
8578 a,
8579 a:visited,
8580 a:hover,
8581 a:active {
8582 color: #2c3338;
8583 padding: 10px 16px !important;
8584 }
8585 }
8586
8587 li:last-child {
8588 a::after {
8589 display: none;
8590 }
8591 }
8592 }
8593 }
8594 }
8595
8596 /**
8597 * Product Reviews
8598 */
8599 .wp-list-table.product-reviews {
8600 .column-author {
8601 width: 20%;
8602 }
8603
8604 th.column-type {
8605 width: 10%;
8606 }
8607
8608 @media screen and (max-width: 782px) {
8609 th.column-type,
8610 td.column-type,
8611 th.column-author,
8612 td.column-author,
8613 th.column-rating,
8614 td.column-rating {
8615 display: none !important;
8616 }
8617
8618 .toggle-row {
8619 top: 10px;
8620 }
8621 }
8622 }
8623
8624 #wp-content-media-buttons {
8625 display: flex;
8626 align-items: center;
8627
8628 > .woocommerce-help-tip {
8629 margin: 0 5px 4px 5px;
8630 }
8631 }
8632
8633 #postexcerpt {
8634 > .postbox-header {
8635 > .hndle {
8636 justify-content: flex-start;
8637
8638 > .woocommerce-help-tip {
8639 margin: 0 10px;
8640 }
8641 }
8642 }
8643 }
8644
8645 #postdivrich.woocommerce-product-description {
8646 margin-top: 20px;
8647 margin-bottom: 0px;
8648
8649 .wp-editor-tools {
8650 background: none;
8651 padding-top: 0px;
8652 width: 100%;
8653 }
8654 .wp-editor-wrap {
8655 margin: 6px 12px 0;
8656 }
8657 #post-status-info {
8658 margin: 0px 12px 12px;
8659 width: calc(100% - 24px);
8660 }
8661 }
8662
8663 .order-attribution-metabox {
8664 h4 {
8665 margin-bottom: .1em;
8666 }
8667
8668 .woocommerce-order-attribution-origin-container {
8669 display: flex;
8670 justify-content: space-between;
8671 align-items: start;
8672 }
8673
8674 .order-attribution-origin {
8675 flex-grow: 1;
8676 }
8677
8678 .woocommerce-order-attribution-details-toggle {
8679 white-space: nowrap;
8680 }
8681
8682 .woocommerce-order-attribution-details-container {
8683 display: none;
8684 }
8685
8686 .woocommerce-order-attribution-details-toggle {
8687 display: block;
8688 text-decoration: none;
8689 vertical-align: middle;
8690 margin-top: -7px;
8691 position: relative;
8692 top: 5px;
8693
8694 .toggle-text {
8695 text-decoration: underline;
8696
8697 &.hide {
8698 display: none;
8699 }
8700 }
8701
8702 .toggle-indicator {
8703 font-family: dashicons;
8704 font-size: 1.2em;
8705 line-height: 1.6;
8706 vertical-align: middle;
8707 }
8708
8709 &[aria-expanded="false"]="false""] {
8710 .toggle-indicator::before {
8711 content: "\f140";
8712 }
8713 }
8714
8715 &[aria-expanded="true"]="true""] {
8716 .toggle-indicator::before {
8717 content: "\f142";
8718 }
8719 }
8720 }
8721 }
8722
8723 html:has(#status-table-templates){
8724 scroll-padding-top: 80px;
8725 }
8726