PluginProbe
MailerLite – WooCommerce integration / trunk
MailerLite – WooCommerce integration vtrunk
3.1.25 3.1.26 3.1.24 3.1.23 3.1.22 3.1.21 3.1.20 3.1.19 3.1.18 3.1.17 3.1.16 3.1.15 1.8.7 1.8.8 2.0 2.0.1 2.0.2 2.0.3 2.0.4 2.0.5 2.0.6 2.0.7 2.0.8 2.0.9 2.1.0 All 147 releases
woo-mailerlite / admin / assets / css / admin.css

admin.css in MailerLite – WooCommerce integration trunk, at admin/assets/css/admin.css

1,434 lines 37.7 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 input[type=checkbox].woo-ml-form-checkbox, input[type=checkbox].woo-ml-form-checkbox:focus {
2 border-color: #d1d5db !important;
3 box-shadow: none;
4 }
5 input[type=checkbox].woo-ml-form-checkbox:checked::before {
6 content: url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 16 16' fill='%23fff' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.207 4.793a1 1 0 0 1 0 1.414l-5 5a1 1 0 0 1-1.414 0l-2-2a1 1 0 0 1 1.414-1.414L6.5 9.086l4.293-4.293a1 1 0 0 1 1.414 0z'/%3E%3C/svg%3E");
7 margin: -0.05rem 0 0 -0.05rem;
8 height: 1rem;
9 width: 1rem;
10 border-radius: 0.25rem;
11 background-color: #09c269;
12 }
13 input[type=checkbox].woo-ml-form-checkbox:focus {
14 border-color: transparent;
15 box-shadow: none;
16 }
17 /* Tooltip container */
18 .tooltip-ml {
19 position: relative;
20 display: inline-block;
21 margin-left: 6px;
22 width: 14px;
23 height: 14px;
24 background-image: url("data:image/svg+xml,%3Csvg data-v-ec5c43b2='' width='14' height='14' viewBox='0 0 20 20' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' class='fill-current'%3E%3Cpath data-v-ec5c43b2='' d='M10,0 C15.5228475,0 20,4.4771525 20,10 C20,15.5228475 15.5228475,20 10,20 C4.4771525,20 0,15.5228475 0,10 C0,4.4771525 4.4771525,0 10,0 Z M10,2 C5.581722,2 2,5.581722 2,10 C2,14.418278 5.581722,18 10,18 C14.418278,18 18,14.418278 18,10 C18,5.581722 14.418278,2 10,2 Z M10,13.4 C10.5128358,13.4 10.9355072,13.7860402 10.9932723,14.2833789 L11,14.4 L11,14.5 C11,15.0522847 10.5522847,15.5 10,15.5 C9.48716416,15.5 9.06449284,15.1139598 9.00672773,14.6166211 L9,14.5 L9,14.4 C9,13.8477153 9.44771525,13.4 10,13.4 Z M10.5535163,4.54923473 C12.3317262,4.854245 13.6306856,6.39731006 13.6280154,8.2 C13.6280154,9.39222524 12.926064,10.3281429 11.8327013,11.0570506 C11.2400318,11.4521631 10.6587584,11.7105066 10.2442274,11.8486834 C9.72028407,12.023331 9.15396419,11.7401708 8.9793166,11.2162274 C8.81714383,10.7297086 9.04971348,10.2066508 9.50326352,9.99457788 L9.77443179,9.88965209 L9.94373739,9.81743828 C10.2116844,9.69835088 10.4792578,9.55564518 10.7233018,9.39294942 C11.317441,8.99685706 11.628003,8.58277476 11.6280041,8.1985125 C11.6292372,7.36956413 11.0324169,6.660587 10.215401,6.52044706 C9.44944865,6.38906586 8.69935706,6.79355516 8.38192794,7.48895692 L8.32433444,7.63184353 C8.14106232,8.15283276 7.5701457,8.42660656 7.04915647,8.24333444 C6.52816724,8.06006232 6.25439344,7.4891457 6.43766556,6.96815647 C7.03637104,5.26621128 8.77530536,4.24422427 10.5535163,4.54923473 Z'%3E%3C/path%3E%3C/svg%3E");
25 }
26
27 /* Tooltip text */
28 .tooltip-ml .tooltiptext-ml {
29 visibility: hidden;
30 width: 180px;
31 background-color: black;
32 color: #fff;
33 font-size: 12px;
34 font-weight: 400;
35 text-align: left;
36 padding: 6px 8px;
37 border-radius: 6px;
38
39 /* Position the tooltip text - see examples below! */
40 position: absolute;
41 z-index: 1;
42 }
43
44 /* Show the tooltip text when you mouse over the tooltip container */
45 .tooltip-ml:hover .tooltiptext-ml {
46 visibility: visible;
47 }
48 a.body-link-ml {
49 color: #000000 !important;
50 text-decoration: underline;
51 }
52 a.body-link-ml:hover {
53 text-decoration: none;
54 }
55 .woo-ml-icon {
56 display: inline-block;
57 height: 16px;
58 width: 16px;
59 background-repeat: no-repeat;
60 background-image: url('../img/icon-mailerlite.svg');
61 background-size: 16px 16px;
62 background-position: center;
63 vertical-align: middle;
64 }
65 .woo-ml-icon-refresh {
66 display: inline-block;
67 height: 16px;
68 width: 16px;
69 margin-top: 8px;
70 margin-left: 10px;
71 background-repeat: no-repeat;
72 background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAMAAABEpIrGAAABIFBMVEUAAAAiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiJf1cGbAAAAX3RSTlMAAQIDBAUGBwgJCgsMDQ4QERITFBYXGBobHB0eHyAhIyYqLi86PkBCQ0RHSkxOVFZhYmZnaGxwdXd4gIWGi4yRlZuepq+0wcXHyMrR19rc3uDi5Obo6evt7/H19/n7/bWOYmEAAAE8SURBVBgZzcHpIhtRAIbh92QRjdTW2qq1d0WCllJVLUGCLqRtMOK7/7twzmQmc0b473lIyRWH+vM8ILvwrSnn/85chi65tSsl/n4wWOO/V4jMNJR2/hJeBGrRtqpu5alrSYQ2FPt51FAKzrJCN1tjBjBj6y11YI0odPCEWM93xbDqcj7h+6oIMC9nG99EoAhQl3Vo8EwEikFJziSewUAdsCirju+tOv7AQMV6hs+8r0TKgzwOmWzEkJa1gG3Fguf4NmXNghKv8eRasp6COvYMnrKsE0CxfYOn71rWMqBI1eDJHstqZgBFakUSvUdylrAUu3hnaDNvLuVUcZQ4W58e6C1Nr50r9K+AI+vXjbo1+glJquVHz3TXSYm2pmp5yO8q7XOGyKuPOZzhH0rsDHOPwsKXw2ZwerA130PiFqnGov3b75WUAAAAAElFTkSuQmCC');
73 background-size: 16px 16px;
74 background-position: center;
75 cursor: pointer;
76 vertical-align: middle;
77 }
78 .woo-ml-icon-refresh.running {
79 background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAMAAABEpIrGAAABIFBMVEUAAABcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxcuFxvZxGWAAAAX3RSTlMAAQIDBAUGBwgJCgsMDQ4QERITFBYXGBobHB0eHyAhIyYqLi86PkBCQ0RHSkxOVFZhYmZnaGxwdXd4gIWGi4yRlZuepq+0wcXHyMrR19rc3uDi5Obo6evt7/H19/n7/bWOYmEAAAE8SURBVBgZzcHpIhtRAIbh92QRjdTW2qq1d0WCllJVLUGCLqRtMOK7/7twzmQmc0b473lIyRWH+vM8ILvwrSnn/85chi65tSsl/n4wWOO/V4jMNJR2/hJeBGrRtqpu5alrSYQ2FPt51FAKzrJCN1tjBjBj6y11YI0odPCEWM93xbDqcj7h+6oIMC9nG99EoAhQl3Vo8EwEikFJziSewUAdsCirju+tOv7AQMV6hs+8r0TKgzwOmWzEkJa1gG3Fguf4NmXNghKv8eRasp6COvYMnrKsE0CxfYOn71rWMqBI1eDJHstqZgBFakUSvUdylrAUu3hnaDNvLuVUcZQ4W58e6C1Nr50r9K+AI+vXjbo1+glJquVHz3TXSYm2pmp5yO8q7XOGyKuPOZzhH0rsDHOPwsKXw2ZwerA130PiFqnGov3b75WUAAAAAElFTkSuQmCC');
80 }
81 .woo-ml-icon-refresh.error {
82 background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAMAAABEpIrGAAABIFBMVEUAAADZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZU0/ZHZidAAAAX3RSTlMAAQIDBAUGBwgJCgsMDQ4QERITFBYXGBobHB0eHyAhIyYqLi86PkBCQ0RHSkxOVFZhYmZnaGxwdXd4gIWGi4yRlZuepq+0wcXHyMrR19rc3uDi5Obo6evt7/H19/n7/bWOYmEAAAE8SURBVBgZzcHpIhtRAIbh92QRjdTW2qq1d0WCllJVLUGCLqRtMOK7/7twzmQmc0b473lIyRWH+vM8ILvwrSnn/85chi65tSsl/n4wWOO/V4jMNJR2/hJeBGrRtqpu5alrSYQ2FPt51FAKzrJCN1tjBjBj6y11YI0odPCEWM93xbDqcj7h+6oIMC9nG99EoAhQl3Vo8EwEikFJziSewUAdsCirju+tOv7AQMV6hs+8r0TKgzwOmWzEkJa1gG3Fguf4NmXNghKv8eRasp6COvYMnrKsE0CxfYOn71rWMqBI1eDJHstqZgBFakUSvUdylrAUu3hnaDNvLuVUcZQ4W58e6C1Nr50r9K+AI+vXjbo1+glJquVHz3TXSYm2pmp5yO8q7XOGyKuPOZzhH0rsDHOPwsKXw2ZwerA130PiFqnGov3b75WUAAAAAElFTkSuQmCC');
83 }
84 .woo-ml-progress-bar {
85 display: block;
86 margin: 10px 0;
87 width: 400px;
88 padding: 3px;
89 background-color: #e5e5e5;
90 border-radius: 6px;
91 }
92 .woo-ml-progress-bar > div {
93 background-color: #00a154;
94 border-radius: 6px;
95 transition: width 1s ease;
96 }
97
98 .section-description {
99 width: 1000px;
100 }
101
102 #woo-ml-validate-key {
103 margin-left: 5px;
104 }
105
106 #woo-ml-order .woocommerce-help-tip {
107 margin: 0px !important;
108 }
109
110 #woocommerce-product-data ul.wc-tabs li.woo-ml_options a::before {
111 content: " ";
112 background-image: url(../img/icon-mailerlite-modern.svg);
113 background-position: center;
114 background-size: 13px;
115 background-repeat: no-repeat;
116 white-space: pre;
117 }
118
119 .woo-ml-wizard {
120 background: #FFFFFF;
121 border: 1px solid rgba(229,231,235,0.75);
122 padding: 2.5rem;
123 border-radius: 0.25rem;
124 font-family: 'Inter', sans-serif;
125 margin-top: 1.5rem;
126 margin-right: 1.5rem;
127 }
128 .flex-ml {
129 display: flex !important;
130 }
131 .separator-bubble-ml {
132 height: 4px;
133 width: 4px;
134 border-radius: 100px;
135 background-color: #d1d5db;
136 margin-left: 1rem;
137 margin-right: 1rem;
138 }
139
140 .woo-ml-header {
141 display: flex;
142 justify-content: space-between;
143 margin-bottom: 2.5rem;
144 align-items: center;
145 }
146 .card-between {
147 display: flex;
148 justify-content: space-between;
149 align-items: center;
150 }
151 .header-title-ml h1 {
152 margin: 0;
153 font-weight: 600;
154 font-size: 20px;
155 line-height: 1.5rem;
156 color: #000000;
157 }
158 .header-title-ml h2 {
159 font-size: 1.3rem;
160 line-height: 1.5rem;
161 margin: 0;
162 font-weight: 600;
163 color: #000000;
164 }
165 .settings-block {
166 border-top: 1px solid #e5e7eb;
167 margin-top: 2rem;
168 }
169 .settings-block-fixed {
170 max-width: 37rem;
171 }
172 .w-100-ml {
173 width: 100%;
174 }
175 .input-mailerlite input.woo-ml-form-checkbox.text-input {
176 border-color: #d1d5db;
177 height: 38px;
178 width: 100%;
179 padding-left: 12px;
180 }
181 .checkbox-text-ml {
182 display: flex;
183 align-items: center;
184 }
185 .checkbox-text-ml label {
186 margin-left: 4px;
187 margin-bottom: 3px;
188 }
189 h2.settings-block-header {
190 margin-top: 2rem;
191 margin-bottom: 1.5rem;
192 font-size: 20px;
193 }
194 .mb-0-ml {
195 margin-bottom: 0!important;
196 }
197 .mb-3-ml {
198 margin-bottom: 0.5rem !important;
199 }
200 .mb-2-ml {
201 margin-bottom: 0.4rem !important;
202 }
203 .mt-0-ml {
204 margin-top: 0 !important;
205 }
206 .mt-6-ml {
207 margin-top: 1.5rem !important;
208 }
209 .settings-label {
210 font-size: 0.875rem !important;
211 color: #000000 !important;
212 font-weight: 600 !important;
213 cursor: default;
214 }
215 .settings-label-medium {
216 font-size: 0.875rem!important;
217 color: rgba(0,0,0,0.75)!important;
218 font-weight: 500;
219 }
220 .settings-label-medium a {
221 color: rgba(0,0,0,0.75);
222 text-decoration: underline;
223 }
224 .settings-label-medium a:hover {
225 text-decoration: none;
226 }
227 .settings-label-small {
228 font-size: 0.8125rem;
229 color: rgba(0,0,0,0.75);
230 font-weight: 400;
231 cursor: default;
232 }
233 .settings-label-small a {
234 color: rgba(0,0,0,0.75);
235 text-decoration: underline;
236 }
237 .settings-label-small a:hover {
238 text-decoration: none;
239 }
240 .form-group-ml {
241 display: flex;
242 margin-bottom: 1.5rem;
243 }
244 .vertical {
245 flex-direction: column;
246 }
247 .align-items-center-ml {
248 align-items: center;
249 }
250 .flex-start-ml {
251 align-self: flex-start;
252 }
253 ol.instructions-list {
254 margin: 1rem 0 0 1rem;
255 font-size: 14px;
256 color: rgba(0,0,0,0.75);
257 line-height: 24px;
258 }
259
260 ol li {
261 margin-bottom: 0.5rem;
262 }
263
264 .signup-link-ml {
265 color: rgba(0,0,0,0.75);
266 margin-top: 2rem;
267 }
268 .signup-link-ml p {
269 margin-top: 0;
270 color: rgba(0,0,0,0.75);
271 }
272 .signup-link-ml p a {
273 text-decoration: underline;
274 color: #000000;
275 font-weight: 500;
276 }
277 .signup-link-ml p a:hover {
278 cursor: pointer;
279 text-decoration: none;
280 }
281
282 .border-top-ml {
283 border-top: 1px solid #E5E7EB;
284 padding-top: 32px;
285 margin-top: 32px;
286 }
287 .header-title-ml p {
288 margin: 0;
289 margin-top: 0.5rem;
290 font-weight: 400;
291 color: rgba(0,0,0,0.75);
292 font-size: 14px;
293 line-height: 24px;
294 }
295 .header-title-ml {
296 margin-bottom: 24px;
297 width: 650px;
298 }
299 .input-block-ml {
300 width: 650px;
301 }
302 .api-key-input {
303 display: flex;
304 flex-direction: row;
305 width: 100%;
306 height: 38px;
307 position: relative;
308 }
309 .api-key-input input {
310 width: 100%;
311 border-color: #d1d5db;
312 margin-right: 0.5rem;
313 padding-left: 12px;
314 }
315 .wp-core-ui select[multiple] {
316 height: 38px;
317 }
318 .api-key-input input::placeholder {
319 color: rgba(0,0,0,0.25);
320 }
321 .api-key-input button {
322 width: auto;
323 text-wrap: nowrap;
324 white-space: nowrap;
325 }
326 .api-key-input input:focus {
327 border-color: #6f6f6f;
328 box-shadow: none;
329 }
330
331 #woo-ml-wizard-step-two {
332 width: 650px;
333 position: relative;
334 }
335
336 #woo-ml-wizard-step-two input {
337 height: 38px;
338 }
339
340 .woo-ml-wizard-content div label { display: block; margin:5px; margin-left:0; font-size: 13px; color: #000000;}
341
342 .woo-ml-wizard-footer{
343 margin-top: 1rem;
344 text-align: center;
345 }
346 .btn-link-ml {
347 padding: 0.5rem 0;
348 background-color: transparent;
349 color: rgba(0,0,0,0.75);
350 border: transparent;
351 font-size: 14px;
352 text-decoration: none;
353 height: 38px;
354 font-weight: 500;
355 }
356 .btn-link-ml:hover {
357 text-decoration: underline;
358 cursor: pointer;
359 }
360 .btn-secondary-ml {
361 position: relative;
362 padding: 0.5rem 1rem;
363 background-color: #e5ebe7;
364 color: rgba(0,0,0,0.75);
365 border-radius: 0.25rem;
366 border: transparent;
367 font-size: 14px;
368 text-decoration: none;
369 height: 38px;
370 font-weight: 500;
371 white-space: nowrap;
372 }
373 .btn-primary-ml {
374 position: relative;
375 padding: 0.5rem 1rem;
376 background-color: #09c269;
377 color: #FFFFFF;
378 border-radius: 0.25rem;
379 border: transparent;
380 font-size: 14px;
381 text-decoration: none;
382 height: 38px;
383 white-space: nowrap;
384 font-weight: 500;
385 }
386 .btn-danger-ml {
387 position: relative;
388 padding: 0.5rem 1rem;
389 background-color: #EF4444;
390 color: #FFFFFF;
391 border-radius: 0.25rem;
392 border: transparent;
393 font-size: 14px;
394 text-decoration: none;
395 height: 38px;
396 text-wrap: nowrap;
397 white-space: nowrap;
398 font-weight: 500;
399 }
400 .btn-primary-ml:hover {
401 cursor: pointer;
402 background-color: #079B54;
403 }
404 .btn-secondary-ml:hover {
405 cursor: pointer;
406 background-color: #EAECEF;
407 }
408 .btn-danger-ml:hover {
409 cursor: pointer;
410 background-color: #DC2626;
411 }
412
413 .woo-ml-wizard-btn-previous{
414 float: left;
415 }
416
417 .woo-ml-wizard-btn-next{
418 float: right;
419 }
420 .woo-ml-wizard-error {
421 display: block;
422 color: #ec5858;
423 margin-top: 0.4rem;
424 }
425 .woo-ml-wizard-ul {
426 display: flex;
427 align-items: center;
428 }
429 .woo-ml-wizard-ul > li{
430 display: inline-block;
431 margin-bottom: 0;
432 }
433 .chevron-ml {
434 display: inline-block;
435 width: 13px;
436 height: 13px;
437 margin-left: 12px;
438 margin-right: 12px;
439 background-image: url("data:image/svg+xml,%3Csvg width='13' height='13' viewBox='0 0 14 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4.66667 2.91683L8.75 7.00016L4.66667 11.0835' stroke='black' stroke-width='1.16667' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
440 }
441 .woo-ml-wizard-group-btn{
442 display: flex;
443 margin-top: 24px;
444 }
445 .woo-ml-wizard-group-btn > button{
446 margin-right: 20px;
447 }
448 .woo-ml-wizard-text-bold{
449 font-weight: bold;
450 }
451 .woo-ml-wizard-text-medium{
452 font-weight: 600;
453 color: #000000;
454 }
455
456 .woo-ml-wizard-modal {
457 z-index: 10000;
458 position: fixed;
459 top: 0;
460 bottom: 0;
461 left: 0;
462 right: 0;
463 background-color: rgba(0,0,0,.7);
464 font-family: 'Inter', sans-serif;
465 overflow: auto;
466 overflow-y: scroll;
467 overflow-x: auto;
468 }
469 .woo-ml-wizard-modal-parent {
470 display: table;
471 height: 100%;
472 table-layout: fixed;
473 width: 100%;
474 }
475 .woo-ml-wizard-modal-container {
476 display: table-cell;
477 text-align: center;
478 vertical-align: middle;
479 width: 100%;
480 }
481 .woo-ml-wizard-modal-header {
482 text-align: left;
483 }
484 .woo-ml-wizard-modal-header h2 {
485 margin-top: 0;
486 font-weight: 600;
487 font-size: 20px;
488 margin-bottom: 32px;
489 }
490 .woo-ml-wizard-modal-content {
491 width: 600px;
492 display: inline-block;
493 position: relative;
494 text-align: right;
495 background-color: #FFFFFF;
496 border-radius: 0.25rem;
497 padding: 40px;
498 }
499 .woo-ml-wizard-modal-body {
500 text-align: left;
501 display: flex;
502 flex-direction: column;
503 }
504
505 .modal-button-ml {
506 display: flex;
507 justify-content: flex-end;
508 margin-top: 2rem;
509 }
510 #wooMlCreateGroup::placeholder {
511 color: rgba(0,0,0,0.25);
512 margin-left: 12px;
513 }
514 .woo-ml-wizard-modal-text {
515 padding: 20px 25px;
516 font-family: 'Inter', sans-serif;
517 font-size: 12px;
518 display: block;
519 direction: rtl;
520 text-align: center;
521 line-height: 20px;
522 }
523 .close {
524 cursor: pointer;
525 }
526 .close:after, .close:before {
527 content: "";
528 height: 20px;
529 width: 20px;
530 border-top: 1px solid #000;
531 position: absolute;
532 top: 20px;
533 right: 6px;
534 -moz-transform: rotate(-45deg);
535 -ms-transform: rotate(-45deg);
536 -webkit-transform: rotate(-45deg);
537 transform: rotate(-45deg);
538 }
539 .close:before {
540 right: 20px;
541 -moz-transform: rotate(45deg);
542 -ms-transform: rotate(45deg);
543 -webkit-transform: rotate(45deg);
544 transform: rotate(45deg);
545 }
546 .close:hover {
547 filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=30);
548 }
549 .woo-ml-text-center{
550 text-align: center;
551 }
552 .progress-box {
553 padding: 24px;
554 background-color: rgba(157,231,195,0.25);
555 border: 1px dashed #09c269;
556 border-radius: 4px;
557 text-align: left;
558 }
559 #wooMlWizardProgress {
560 width: 0px;
561 height: 10px;
562 border-radius: 20px;
563 background: #09c269;
564 margin-bottom: 24px;
565 transition: width 2s ease;
566 }
567 .input-mailerlite .select2-container--default .select2-selection--single:focus {
568 border-color: #6f6f6f;
569 }
570 .input-mailerlite select {
571 border-color: #d1d5db;
572 height: 38px;
573 width: 100%;
574 max-width: 100%;
575 padding: 0 24px 0 12px;
576 background: #fff 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') no-repeat right 12px top 48%;
577 background-size: 14px 14px;
578 }
579 .input-mailerlite select:hover {
580 color: #000000;
581 }
582 .input-mailerlite select:focus {
583 border-color: #8c8f94;
584 color: #000000;
585 box-shadow: none;
586 }
587 .input-mailerlite .select2-container--default .select2-selection--single .select2-selection__arrow {
588 border-color: #d1d5db;
589 height: 38px;
590 width: 100%;
591 max-width: 100%;
592 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) no-repeat right 12px top 48%;
593 background-size: 14px 14px;
594 }
595 .input-mailerlite .select2-container--default .select2-selection--single .select2-selection__arrow b {
596 display: none;
597 }
598 .input-mailerlite .select2-container--default .select2-selection--single .select2-selection__rendered {
599 line-height: 38px;
600 font-size: 14px;
601 color: rgba(0,0,0,0.75);
602 padding-left: 12px;
603 }
604 .input-mailerlite input[type=text]:focus {
605 border-color: #6f6f6f;
606 box-shadow: none;
607 }
608 .create-group-input input {
609 width: 100%;
610 height: 38px;
611 border-color: #d1d5db;
612 }
613 .create-group-input input:focus {
614 border-color: #6f6f6f;
615 box-shadow: none;
616 }
617 body {
618 color: rgba(0,0,0,0.75);
619 }
620 @media only screen and (max-width: 768px) {
621 .woo-ml-wizard-breadcrumbs {
622 display: none;
623 }
624 .header-title-ml, .input-block-ml, #woo-ml-wizard-step-two {
625 width: 100%;
626 }
627 .woo-ml-wizard {
628 margin-right: 1rem;
629 margin-top: 1rem;
630 padding: 2rem;
631 }
632 .card-between {
633 align-items: start;
634 flex-direction: column;
635 }
636 .card-between button {
637 margin-top: 1.5rem;
638 }
639 .woo-ml-header .status .separator, .woo-ml-header .status h3, .woo-ml-header .status p {
640 display: none;
641 }
642 .api-key-input {
643 flex-direction: column;
644 height: auto;
645 }
646 .api-key-input button {
647 margin-top: 0.5rem;
648 }
649 }
650 @media only screen and (max-width: 782px) {
651 input[type=checkbox].woo-ml-form-checkbox {
652 height: 1rem;
653 width: 1rem;
654 }
655 }
656 /* The alert message box */
657 .woo-ml-alert {
658 padding: 12px 16px;
659 background-color: #FECACA; /* Red */
660 border-radius: 0.25rem;
661 color: #B91C1C;
662 margin-bottom: 40px;
663 }
664
665 /* The close button */
666 .woo-ml-closebtn {
667 margin-left: 15px;
668 color: #B91C1C;
669 float: right;
670 font-size: 20px;
671 line-height: 16px;
672 cursor: pointer;
673 transition: 0.3s;
674 }
675
676 .woo-ml-alert-success {
677 padding: 12px 16px;
678 background-color: #9DE7C3;
679 border-radius: 0.25rem;
680 color: #05743F;
681 margin-bottom: 40px;
682 }
683
684 .woo-ml-alert-warning-small {
685 margin-bottom: 0;
686 margin-top: 0.75rem;
687 padding: 8px 10px;
688 background-color: #FEF08A;
689 color: #A16207;
690 border-radius: 0.25rem;
691 }
692
693 .woo-ml-alert-warning-small svg {
694 margin-right: 6px;
695 fill: #A16207;
696 }
697
698 /* When moving the mouse over the close button */
699 .woo-ml-closebtn:hover {
700 color: #600c0c;
701 }
702
703 /* The close button */
704 .woo-ml-closebtn-success {
705 margin-left: 15px;
706 color: #05743F;
707 float: right;
708 font-size: 20px;
709 line-height: 16px;
710 cursor: pointer;
711 transition: 0.3s;
712 }
713
714 /* When moving the mouse over the close button */
715 .woo-ml-closebtn-success:hover {
716 color: #025B31;
717 }
718 .progress {
719 border-radius: 0.25rem;
720 background: rgba(157,231,195,0.5);
721 }
722
723 #woo_ml_loader {
724 position:fixed;
725 width:100%;
726 left:0;right:0;top:0;bottom:0;
727 background-color: rgba(255,255,255,0.7);
728 z-index:9999;
729 display:none;
730 }
731
732 @-webkit-keyframes spin {
733 from {-webkit-transform:rotate(0deg);}
734 to {-webkit-transform:rotate(360deg);}
735 }
736
737 @keyframes spin {
738 from {transform:rotate(0deg);}
739 to {transform:rotate(360deg);}
740 }
741
742 #woo_ml_loader::after {
743 content:'';
744 display:block;
745 position:absolute;
746 left:48%;top:40%;
747 width:40px;height:40px;
748 border-style:solid;
749 border-color:black;
750 border-top-color:transparent;
751 border-width: 4px;
752 border-radius:50%;
753 -webkit-animation: spin .8s linear infinite;
754 animation: spin .8s linear infinite;
755 }
756
757 .woo-ml-button-loading .woo-ml-button-text {
758 visibility: hidden;
759 opacity: 0;
760 }
761
762 .woo-ml-button-loading::after {
763 content: "";
764 position: absolute;
765 width: 16px;
766 height: 16px;
767 top: 0;
768 left: 0;
769 right: 0;
770 bottom: 0;
771 margin: auto;
772 border: 4px solid transparent;
773 border-top-color: #ffffff;
774 border-radius: 50%;
775 animation: woo-ml-button-loading-spinner 1s ease infinite;
776 }
777
778 @keyframes woo-ml-button-loading-spinner {
779 from {
780 transform: rotate(0turn);
781 }
782
783 to {
784 transform: rotate(1turn);
785 }
786 }
787
788 .no-icon-tooltip-ml {
789 position: relative;
790 display: inline-block;
791 }
792 .no-icon-tooltip-ml .no-icon-tooltip-ml-text {
793 display: none;
794 width: 120px;
795 background-color: black;
796 color: #fff;
797 font-size: 12px;
798 font-weight: 400;
799 padding: 6px;
800 border-radius: 6px;
801
802 /* Position the tooltip text - see examples below! */
803 position: absolute;
804 z-index: 1;
805 text-align: center;
806 bottom: 150%;
807 left: 50%;
808 margin-left: -60px;
809 }
810 .no-icon-tooltip-ml .no-icon-tooltip-ml-text::after {
811 content: "";
812 position: absolute;
813 top: 100%;
814 left: 50%;
815 margin-left: -5px;
816 border-width: 5px;
817 border-style: solid;
818 border-color: black transparent transparent transparent;
819 }
820
821 .ml-switch {
822 position: relative;
823 display: inline-block;
824 width: 60px;
825 height: 34px;
826 }
827
828 .ml-switch input {
829 opacity: 0;
830 width: 0;
831 height: 0;
832 }
833
834 .ml-slider {
835 position: absolute;
836 cursor: pointer;
837 top: 0;
838 left: 0;
839 right: 0;
840 bottom: 0;
841 background-color: #ccc;
842 -webkit-transition: .4s;
843 transition: .4s;
844 }
845
846 .ml-slider:before {
847 position: absolute;
848 content: "";
849 height: 26px;
850 width: 26px;
851 left: 4px;
852 bottom: 4px;
853 background-color: white;
854 -webkit-transition: .4s;
855 transition: .4s;
856 }
857
858 input:checked + .ml-slider {
859 background-color: #2196F3;
860 }
861
862 input:focus + .ml-slider {
863 box-shadow: 0 0 1px #2196F3;
864 }
865
866 input:checked + .ml-slider:before {
867 -webkit-transform: translateX(26px);
868 -ms-transform: translateX(26px);
869 transform: translateX(26px);
870 }
871
872 /* Rounded sliders */
873 .ml-slider.round {
874 border-radius: 34px;
875 }
876
877 .ml-slider.round:before {
878 border-radius: 50%;
879 }
880
881 .woo-mailerlite-input-error {
882 border: 2px solid red !important;
883 }
884
885 .woo-mailerlite-error-message {
886 font-size: 12px;
887 color: red;
888 margin-top: 5px;
889 }
890
891 .woo-mailerlite-loading .woo-ml-button-text {
892 visibility: hidden;
893 opacity: 0;
894 }
895
896 .woo-mailerlite-loading::after {
897 content: "";
898 position: absolute;
899 width: 16px;
900 height: 16px;
901 top: 0;
902 left: 0;
903 right: 0;
904 bottom: 0;
905 margin: auto;
906 border: 4px solid transparent;
907 border-top-color: #ffffff;
908 border-radius: 50%;
909 animation: woo-mailerlite-loading-spinner 1s ease infinite;
910 }
911
912 @keyframes woo-mailerlite-loading-spinner {
913 from {
914 transform: rotate(0turn);
915 }
916
917 to {
918 transform: rotate(1turn);
919 }
920 }
921
922 .loader {
923 border: 8px solid #b37d20;
924 border-top-width: 8px;
925 border-top-style: solid;
926 border-top-color: rgb(179, 125, 32);
927 border-top: 8px solid #656565;
928 border-radius: 50%;
929 width: 8px;
930 height: 8px;
931 animation: spin 2s linear infinite;
932 }
933
934 @keyframes spin {
935 0% { transform: rotate(0deg); }
936 100% { transform: rotate(360deg); }
937 }
938 .woo-mailerlite-log-container {
939 background-color: #2b2b2b;
940 padding: 20px;
941 border-radius: 5px;
942 overflow-y: auto;
943 max-height: 80vh;
944 white-space: pre-wrap;
945 word-wrap: break-word;
946 color: #a6e22e;
947 }
948
949 .woo-mailerlite-log-highlight {
950 background-color: #44475a;
951 color: #ff79c6;
952 font-weight: bold;
953 padding: 0 2px;
954 }
955
956 .select2-container--mailerlite .select2-selection--single {
957 border: 1px solid #d1d5db;
958 height: 38px;
959 width: 100%;
960 padding-left: 0;
961 border-radius: 0.25rem;}
962 .select2-dropdown {
963 border-color: #d1d5db;
964 }
965 .select2-container--mailerlite .select2-selection--single .select2-selection__rendered {
966 line-height: 38px !important;
967 font-size: 14px;
968 color: rgba(0,0,0,0.75);
969 padding-left: 12px;
970 border-color: #d1d5db;
971 height: 38px;
972 width: auto;
973 display: block;
974 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) no-repeat right 12px top 48%;
975 background-size: 14px 14px;
976 }
977 .select2-container--mailerlite .select2-selection--single .select2-selection__clear {
978 cursor: pointer;
979 float: right;
980 font-weight: bold;
981 height: 26px;
982 margin-right: 20px;
983 padding-right: 0px; }
984 .select2-container--mailerlite .select2-selection--single .select2-selection__placeholder {
985 color: #999; }
986 .select2-container--mailerlite .select2-selection--single .select2-selection__arrow {
987 display: none;}
988 .select2-container--mailerlite .select2-selection--single .select2-selection__arrow b {
989 border-color: #888 transparent transparent transparent;
990 border-style: solid;
991 border-width: 5px 4px 0 4px;
992 height: 0;
993 left: 50%;
994 margin-left: -4px;
995 margin-top: -2px;
996 position: absolute;
997 top: 50%;
998 width: 0; }
999
1000 .select2-container--mailerlite[dir="rtl"] .select2-selection--single .select2-selection__clear {
1001 float: left; }
1002
1003 .select2-container--mailerlite[dir="rtl"] .select2-selection--single .select2-selection__arrow {
1004 left: 1px;
1005 right: auto; }
1006
1007 .select2-container--mailerlite.select2-container--disabled .select2-selection--single {
1008 background-color: #eee;
1009 cursor: default; }
1010 .select2-container--mailerlite.select2-container--disabled .select2-selection--single .select2-selection__clear, .select2-container--default .select2-selection--multiple .select2-selection__clear {
1011 display: none; }
1012
1013 .select2-container--mailerlite.select2-container--open .select2-selection--single .select2-selection__arrow b {
1014 border-color: transparent transparent #888 transparent;
1015 border-width: 0 4px 5px 4px; }
1016
1017 .select2-container--mailerlite .select2-selection--multiple,.select2-container--default .select2-selection--multiple {
1018 background-color: white;
1019 border: 1px solid #d1d5db;
1020 border-radius: 4px;
1021 cursor: text;
1022 padding-bottom: 5px;
1023 padding-right: 5px;
1024 position: relative; }
1025 .select2-container--default.select2-container--focus .select2-selection--multiple {
1026 border-color: #d1d5db;
1027 }
1028 .select2-container--mailerlite .select2-selection--multiple.select2-selection--clearable {
1029 padding-right: 25px; }
1030 .select2-container--mailerlite .select2-selection--multiple .select2-selection__clear {
1031 display: none;
1032 }
1033 .select2-container--mailerlite .select2-selection--multiple .select2-selection__choice {
1034 background-color: #e4e4e4;
1035 border: 1px solid #d1d5db;
1036 border-radius: 4px;
1037 box-sizing: border-box;
1038 display: inline-block;
1039 margin-left: 5px;
1040 margin-top: 5px;
1041 padding: 0;
1042 padding-left: 20px;
1043 position: relative;
1044 max-width: 100%;
1045 overflow: hidden;
1046 text-overflow: ellipsis;
1047 vertical-align: bottom;
1048 white-space: nowrap; }
1049 .select2-container--mailerlite .select2-selection--multiple .select2-selection__choice__display {
1050 cursor: default;
1051 padding-left: 2px;
1052 padding-right: 5px; }
1053 .select2-container--mailerlite .select2-selection--multiple .select2-selection__choice__remove {
1054 background-color: transparent;
1055 border: none;
1056 border-right: 1px solid #aaa;
1057 border-top-left-radius: 4px;
1058 border-bottom-left-radius: 4px;
1059 color: #999;
1060 cursor: pointer;
1061 font-size: 1em;
1062 font-weight: bold;
1063 padding: 0 4px;
1064 position: absolute;
1065 left: 0;
1066 top: 0; }
1067 .select2-container--mailerlite .select2-selection--multiple .select2-selection__choice__remove:hover, .select2-container--mailerlite .select2-selection--multiple .select2-selection__choice__remove:focus {
1068 background-color: #f1f1f1;
1069 color: #333;
1070 outline: none; }
1071
1072 .select2-container--mailerlite[dir="rtl"] .select2-selection--multiple .select2-selection__choice {
1073 margin-left: 5px;
1074 margin-right: auto; }
1075
1076 .select2-container--mailerlite[dir="rtl"] .select2-selection--multiple .select2-selection__choice__display {
1077 padding-left: 5px;
1078 padding-right: 2px; }
1079
1080 .select2-container--mailerlite[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove {
1081 border-left: 1px solid #aaa;
1082 border-right: none;
1083 border-top-left-radius: 0;
1084 border-bottom-left-radius: 0;
1085 border-top-right-radius: 4px;
1086 border-bottom-right-radius: 4px; }
1087
1088 .select2-container--mailerlite[dir="rtl"] .select2-selection--multiple .select2-selection__clear {
1089 float: left;
1090 margin-left: 10px;
1091 margin-right: auto; }
1092
1093 .select2-container--mailerlite.select2-container--focus .select2-selection--multiple {
1094 border: solid black 1px;
1095 outline: 0; }
1096
1097 .select2-container--mailerlite.select2-container--disabled .select2-selection--multiple {
1098 background-color: #eee;
1099 cursor: default; }
1100
1101 .select2-container--mailerlite.select2-container--disabled .select2-selection__choice__remove {
1102 display: none; }
1103
1104 .select2-container--mailerlite.select2-container--open.select2-container--above .select2-selection--single, .select2-container--mailerlite.select2-container--open.select2-container--above .select2-selection--multiple {
1105 border-top-left-radius: 0;
1106 border-top-right-radius: 0; }
1107
1108 .select2-container--mailerlite.select2-container--open.select2-container--below .select2-selection--single, .select2-container--mailerlite.select2-container--open.select2-container--below .select2-selection--multiple {
1109 border-bottom-left-radius: 0;
1110 border-bottom-right-radius: 0; }
1111
1112 .select2-container--mailerlite .select2-search--dropdown .select2-search__field {
1113 border: 1px solid #aaa; }
1114
1115 .select2-container--mailerlite .select2-search--inline .select2-search__field {
1116 background: transparent;
1117 border: none;
1118 outline: 0;
1119 box-shadow: none;
1120 -webkit-appearance: textfield;
1121 }
1122
1123 .select2-container--mailerlite .select2-results > .select2-results__options {
1124 max-height: 200px;
1125 overflow-y: auto; }
1126
1127 .select2-container--mailerlite .select2-results__option .select2-results__option {
1128 padding-left: 1em; }
1129 .select2-container--mailerlite .select2-results__option .select2-results__option .select2-results__group {
1130 padding-left: 0; }
1131 .select2-container--mailerlite .select2-results__option .select2-results__option .select2-results__option {
1132 margin-left: -1em;
1133 padding-left: 2em; }
1134 .select2-container--mailerlite .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
1135 margin-left: -2em;
1136 padding-left: 3em; }
1137 .select2-container--mailerlite .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
1138 margin-left: -3em;
1139 padding-left: 4em; }
1140 .select2-container--mailerlite .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
1141 margin-left: -4em;
1142 padding-left: 5em; }
1143 .select2-container--mailerlite .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
1144 margin-left: -5em;
1145 padding-left: 6em; }
1146
1147 .select2-container--mailerlite .select2-results__option--group {
1148 padding: 0; }
1149
1150 .select2-container--mailerlite .select2-results__option--disabled {
1151 color: #999; }
1152
1153 .select2-container--mailerlite .select2-results__option--selected {
1154 background-color: #F9FAFB;
1155 color: rgba(0,0,0,0.75); }
1156
1157 .select2-container--mailerlite .select2-results__option--highlighted.select2-results__option--selectable {
1158 background-color: #F9FAFB;
1159 color: rgba(0,0,0,0.75); }
1160
1161 .select2-container--mailerlite .select2-results__group {
1162 cursor: default;
1163 display: block;
1164 padding: 6px; }
1165
1166 .select2-results__option {
1167 padding-right: 20px;
1168 vertical-align: middle;
1169 }
1170
1171 .select2-results__option:before {
1172 content: "";
1173 display: inline-block;
1174 position: relative;
1175 height: 10px;
1176 width: 10px;
1177 border: 2px solid #e9e9e9;
1178 border-radius: 4px;
1179 background-color: #fff;
1180 margin-right: 8px;
1181 vertical-align: middle;
1182 }
1183 .select2-container--mailerlite .select2-results__option {
1184 background-color: #fff;
1185 display: flex;
1186 align-items: center;
1187 }
1188 .select2-container--mailerlite .select2-results__option--highlighted[aria-selected] {
1189 background-color: #eaeaeb;
1190 color: #272727;
1191 }
1192 .select2-container--mailerlite .select2-selection--multiple {
1193 margin-bottom: 10px;
1194 }
1195 .select2-container--mailerlite.select2-container--open.select2-container--below .select2-selection--multiple {
1196 border-radius: 4px;
1197 }
1198 .select2-container--mailerlite.select2-container--focus .select2-selection--multiple {
1199 border-color: #d1d5db;
1200 border-width: 2px;
1201 }
1202 .select2-container--mailerlite .select2-selection--multiple {
1203 border-width: 2px;
1204 }
1205 .select2-container--open .select2-dropdown--below {
1206 border-color: transparent;
1207 border-radius: 6px;
1208 box-shadow: 0 0 10px rgba(0,0,0,0.5);
1209 overflow: hidden;
1210 }
1211
1212 .select2-selection .select2-selection--multiple:after {
1213 content: 'hhghgh';
1214 }
1215 .select2-container--mailerlite .select2-selection--multiple .select2-selection__choice {
1216 background-color: #e5e7eb;
1217 border: 0;
1218 border-radius: 2px;
1219 font-size: 13px;
1220 margin-bottom: 0;
1221 padding-top: 2px;
1222 padding-bottom: 2px;
1223 padding-left: 5px;
1224 padding-right: 14px;
1225 }
1226 .select2-container--mailerlite .select2-selection--multiple .select2-selection__choice__remove {
1227 border-right: 0;
1228 color: rgba(0,0,0,0.75);
1229 font-weight: normal;
1230 font-size: 1rem;
1231 padding-right: 5px;
1232 right: 0;
1233 left: auto;
1234 }
1235 .select2-container--mailerlite .select2-selection--multiple .select2-selection__choice__remove:hover {
1236 color: #9b9b9b;
1237 background-color: #e5e7eb;
1238 }
1239 .select2-container--mailerlite .select2-selection--multiple, .select2-container--default.select2-container--focus .select2-selection--multiple {
1240 border-width: 1px;
1241 border-color: #d1d5db;
1242 }
1243 .select2-results__option.select2-results__option--selected:before {
1244 color: #fff;
1245 background-color: #09c269;
1246 border: 0;
1247 display: inline-block;
1248 content: url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 16 16' fill='%23fff' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.207 4.793a1 1 0 0 1 0 1.414l-5 5a1 1 0 0 1-1.414 0l-2-2a1 1 0 0 1 1.414-1.414L6.5 9.086l4.293-4.293a1 1 0 0 1 1.414 0z'/%3E%3C/svg%3E");
1249 padding-left: 0;
1250 width: 14px;
1251 height: 14px;
1252 }
1253 .select2-results__option.select2-results__message:before {
1254 content: none;
1255 }
1256 .select2-container--mailerlite .ml-default-choice .select2-selection__choice__remove {
1257 display: none;
1258 }
1259 .select2-container--mailerlite .select2-selection__choice.ml-default-choice {
1260 padding: 2px 5px;
1261 }
1262 .select2-container--mailerlite .select2-search--inline {
1263 width: 100%;
1264 position: absolute;
1265 }
1266 .wc-wp-version-gte-53 .select2-container.select2-container--open .select2-selection--multiple {
1267 border-width: 1px;
1268 border-color: #d1d5db;
1269 }
1270
1271 .input-mailerlite .select2-container--default .select2-selection--single {
1272 border-color: #d1d5db;
1273 height: 38px;
1274 }
1275
1276 .woo-ml-sync-loading-container {
1277 position: relative;
1278 width: auto;
1279 background-color: #fffbe5; /* Light Yellow Warning */
1280 padding: 12px;
1281 border: 1px solid #ffdb58; /* Slightly Darker Yellow Border */
1282 border-radius: 8px;
1283 text-align: center;
1284 font-weight: bold;
1285 font-size: 14px;
1286 color: #856404; /* Darker Yellow for Warning Text */
1287 box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
1288 margin: 20px auto;
1289 }
1290
1291 .woo-ml-sync-loading-container p {
1292 margin: 0;
1293 font-size: 13px;
1294 font-weight: normal;
1295 color: #946c00; /* Slightly darker yellow */
1296 }
1297
1298 .woo-ml-sync-progress-bar {
1299 position: relative;
1300 width: 100%;
1301 height: 8px;
1302 background: #ffecb3; /* Light Yellow */
1303 border-radius: 4px;
1304 overflow: hidden;
1305 margin-top: 8px;
1306 }
1307
1308 .woo-ml-sync-progress-bar::after {
1309 content: "";
1310 position: absolute;
1311 width: 30%;
1312 height: 100%;
1313 background: #ffbf00; /* Moving Dark Yellow Indicator */
1314 border-radius: 4px;
1315 animation: wooMlLoadingAnimation 1.6s infinite ease-in-out;
1316 }
1317
1318 .wc-wp-version-gte-53 .select2-container .select2-selection--single {
1319 height: 38px !important;
1320 border-color: #d1d5db;
1321 }
1322
1323 .mr-2-ml{
1324 margin-right: 4px;
1325 }
1326
1327 .woo-ml-plugin-update-banner {
1328 background: #fff8e1;
1329 border: 1px solid #ffe082;
1330 padding: 12px 16px;
1331 border-radius: 6px;
1332 font-family: system-ui, sans-serif;
1333 font-size: 14px;
1334 color: #5d4037;
1335 margin: 16px 1.5rem 0 0;
1336 }
1337
1338 .woo-ml-plugin-update-banner a {
1339 color: #bf360c;
1340 text-decoration: underline;
1341 font-weight: 500;
1342 }
1343
1344 .woo-ml-plugin-update-banner a:hover {
1345 text-decoration: none;
1346 }
1347
1348 @keyframes wooMlLoadingAnimation {
1349 from {
1350 left: -30%;
1351 }
1352 to {
1353 left: 100%;
1354 }
1355 }
1356
1357 .woo-ml-survey-card {
1358 float: right;
1359 margin-left: 2rem;
1360 background: linear-gradient(to bottom, rgba(9, 194, 105, 0.12) 0%, #ffffff 100%);
1361 border: 1px solid #e5e7eb;
1362 border-radius: 0.5rem;
1363 padding: 1.5rem 2rem;
1364 width: 300px;
1365 margin-top: 2rem;
1366 }
1367
1368 .woo-ml-survey-title {
1369 font-size: 0.9375rem;
1370 font-weight: 500;
1371 color: #000;
1372 margin: 0 0 1.25rem;
1373 line-height: 1.4;
1374 text-align: left;
1375 white-space: nowrap;
1376 }
1377
1378 .woo-ml-survey-emojis {
1379 display: flex;
1380 justify-content: space-between;
1381 gap: 0.25rem;
1382 margin-bottom: 0.5rem;
1383 }
1384
1385 .woo-ml-survey-emoji {
1386 font-size: 1.75rem;
1387 line-height: 1;
1388 cursor: pointer;
1389 transition: transform 0.15s ease;
1390 display: inline-block;
1391 background: none;
1392 border: none;
1393 padding: 0;
1394 height: auto;
1395 }
1396
1397 .woo-ml-survey-emoji:hover {
1398 transform: scale(1.25);
1399 background: none;
1400 }
1401
1402 .woo-ml-survey-thanks-text {
1403 font-size: 0.875rem;
1404 color: rgba(0, 0, 0, 0.6);
1405 margin: 0;
1406 text-align: center;
1407 }
1408
1409 .woo-ml-survey-thanks-text a {
1410 color: rgba(0, 0, 0, 0.6);
1411 text-decoration: underline;
1412 }
1413
1414 .woo-ml-survey-thanks-text a:hover {
1415 text-decoration: none;
1416 }
1417
1418 .woo-ml-survey-labels {
1419 display: flex;
1420 justify-content: space-between;
1421 font-size: 0.75rem;
1422 color: rgba(0, 0, 0, 0.5);
1423 margin-top: 0.25rem;
1424 }
1425
1426 @media only screen and (max-width: 960px) {
1427 .woo-ml-survey-card {
1428 float: none;
1429 margin-left: 0;
1430 width: 100%;
1431 box-sizing: border-box;
1432 }
1433 }
1434