PluginProbe
Better Payment – Instant Payments, Donations, Fundraising with Subscriptions & More / 2.4.1
Better Payment – Instant Payments, Donations, Fundraising with Subscriptions & More v2.4.1
2.4.1 2.4.0 2.3.4 2.3.3 2.3.2 2.3.1 2.3.0 2.2.2 2.2.1 2.2.0 2.1.2 2.1.1 trunk 0.0.1 0.0.2 0.0.3 0.0.4 0.0.5 0.0.6 0.0.7 1.0.0 1.0.1 1.0.2 1.0.3 1.0.4 All 68 releases
← All changes | assets/css/common.css +2979 -1038 0.0.3 → 2.4.1 View file →
@@ -1,1802 +1,3743 @@
1 -.better-payment .bp-radio-box input[type=radio]:checked{
2 - border: 2px solid #006AFF;
1 +/*!****************************************************************************************************************************************************************************************************************!*\
2 + !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[6].use[1]!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[6].use[3]!./src/css/common.scss ***!
3 + \****************************************************************************************************************************************************************************************************************/
4 +.better-payment .width-100 {
5 + display: inline-block;
6 + width: 100%;
7 + max-height: 465px;
8 + min-height: 465px;
9 + overflow: hidden;
10 + border-radius: 16px;
3 11 }
12 +.better-payment .width-100.height-auto {
13 + min-height: auto;
14 +}
15 +.better-payment .width-100 img {
16 + object-fit: cover;
17 + height: 100%;
18 +}
19 +.better-payment .payment-form-layout-1 .field-payment_method .bp-radio-box,
20 +.better-payment .payment-form-layout-1 .field-payment_method .bp-radio-box label,
21 +.better-payment .payment-form-layout-2 .field-payment_method .bp-radio-box,
22 +.better-payment .payment-form-layout-2 .field-payment_method .bp-radio-box label {
23 + display: flex;
24 + align-items: center;
25 +}
26 +.better-payment .payment-form-layout-1 .bp-three-items-enabled-wrap.field-payment_method .bp-radio-box,
27 +.better-payment .payment-form-layout-2 .bp-three-items-enabled-wrap.field-payment_method .bp-radio-box {
28 + display: flex;
29 + justify-content: space-between;
30 + align-items: center;
31 +}
32 +.better-payment .bp-three-items-enabled.pr-6 {
33 + padding-right: unset !important;
34 +}
4 35
36 +.better-payment .bp-radio-box input[type=radio]:checked {
37 + border: 2px solid #006aff;
38 +}
39 +
5 40 .better-payment .bp-radio-box input[type=radio] {
6 - width: 20px;
7 - height: 20px;
8 - outline: 0;
9 - border-radius: 50%;
10 - position: relative;
11 - border: 2px solid #CBC9DA;
12 - background: #fff;
13 - margin-bottom: -3px;
14 - margin-right: 10px;
41 + width: 20px;
42 + height: 20px;
43 + outline: 0;
44 + border-radius: 50%;
45 + position: relative;
46 + border: 2px solid #cbc9da;
47 + background: #fff;
48 + margin-bottom: -3px;
49 + margin-right: 10px;
15 50 }
16 51
17 52 .better-payment .bp-radio-box input[type=radio]:after {
18 - content: "";
19 - opacity: 0;
20 - display: block;
21 - left: 4px;
22 - top: 4px;
23 - position: absolute;
24 - width: 8px;
25 - height: 8px;
26 - border-radius: 50%;
27 - background: #006AFF;
53 + content: "";
54 + opacity: 0;
55 + display: block;
56 + left: 4px;
57 + top: 4px;
58 + position: absolute;
59 + width: 8px;
60 + height: 8px;
61 + border-radius: 50%;
62 + background: #006aff;
28 63 }
29 64
65 +.better-payment .form-content-section-fields .payment-method-checkbox input[type=radio]:after {
66 + width: 12px;
67 + height: 12px;
68 +}
69 +
30 70 .better-payment .bp-radio-box input[type=radio]:checked:after {
31 - opacity: 1;
71 + opacity: 1;
32 72 }
33 73
34 74 .better-payment .control {
35 - box-sizing: border-box;
36 - clear: both;
37 - font-size: 1rem;
38 - position: relative;
39 - text-align: inherit;
75 + box-sizing: border-box;
76 + clear: both;
77 + font-size: 1rem;
78 + position: relative;
79 + text-align: inherit;
40 80 }
41 81
42 -.better-payment .control.has-icons-right .input,
82 +.better-payment .control.has-icons-right .input,
43 83 .better-payment .control.has-icons-right .select select {
44 - padding-right: 2.5em;
84 + padding-right: 2.5em;
45 85 }
46 86
47 -.better-payment .control.has-icons-left .input,
87 +.better-payment .control.has-icons-left .input,
48 88 .better-payment .control.has-icons-left .select select {
49 - padding-left: 2.5em;
89 + padding-left: 2.5em;
50 90 }
51 91
52 -.better-payment .is-large.input,
92 +.better-payment .is-large.input,
53 93 .better-payment .is-large.textarea {
54 - font-size: 1.5rem;
94 + font-size: 1.5rem;
55 95 }
56 96
57 -
58 -
59 -.better-payment .control.has-icons-left .input.is-large~.icon,
60 -.better-payment .control.has-icons-left .select.is-large~.icon,
61 -.better-payment .control.has-icons-right .input.is-large~.icon,
62 -.better-payment .control.has-icons-right .select.is-large~.icon {
63 - font-size: 1.5rem;
97 +.better-payment .control.has-icons-left .input.is-large ~ .icon,
98 +.better-payment .control.has-icons-left .select.is-large ~ .icon,
99 +.better-payment .control.has-icons-right .input.is-large ~ .icon,
100 +.better-payment .control.has-icons-right .select.is-large ~ .icon {
101 + font-size: 1.5rem;
64 102 }
65 103
66 104 .better-payment .control.has-icons-left .icon.is-left {
67 - left: 0;
105 + left: 0;
68 106 }
69 107
70 -.better-payment .control.has-icons-left .icon,
108 +.better-payment .control.has-icons-left .icon,
71 109 .better-payment .control.has-icons-right .icon {
72 - color: #dbdbdb;
73 - height: 2.5em;
74 - pointer-events: none;
75 - position: absolute;
76 - top: 0;
77 - width: 2.5em;
78 - z-index: 4;
110 + color: #dbdbdb;
111 + height: 2.5em;
112 + pointer-events: none;
113 + position: absolute;
114 + top: 0;
115 + width: 2.5em;
116 + z-index: 4;
79 117 }
80 118
81 119 .better-payment .icon.is-medium {
82 - height: 2rem;
83 - width: 2rem;
120 + height: 2rem;
121 + width: 2rem;
84 122 }
85 123
86 124 .better-payment .icon {
87 - align-items: center;
88 - display: inline-flex;
89 - justify-content: center;
90 - height: 1.5rem;
91 - width: 1.5rem;
125 + align-items: center;
126 + display: inline-flex;
127 + justify-content: center;
128 + height: 1.5rem;
129 + width: 1.5rem;
92 130 }
93 131
94 132 .better-payment .control.has-icons-right .icon.is-right {
95 - right: 0;
133 + right: 0;
96 134 }
97 135
98 -.better-payment .control.has-icons-left .icon,
136 +.better-payment .control.has-icons-left .icon,
99 137 .better-payment .control.has-icons-right .icon {
100 - color: #dbdbdb;
101 - height: 2.5em;
102 - pointer-events: none;
103 - position: absolute;
104 - top: 0;
105 - width: 2.5em;
106 - z-index: 4;
138 + color: #dbdbdb;
139 + height: 2.5em;
140 + pointer-events: none;
141 + position: absolute;
142 + top: 0;
143 + width: 2.5em;
144 + z-index: 4;
107 145 }
108 146
109 -.better-payment .input:active,
110 -.better-payment .input:focus,
111 -.better-payment .is-active.input,
112 -.better-payment .is-active.textarea,
113 -.better-payment .is-focused.input,
114 -.better-payment .is-focused.textarea,
115 -.better-payment .select select.is-active,
116 -.better-payment .select select.is-focused,
117 -.better-payment .select select:active,
118 -.better-payment .select select:focus,
119 -.better-payment .textarea:active,
147 +.better-payment .input:active,
148 +.better-payment .input:focus,
149 +.better-payment .is-active.input,
150 +.better-payment .is-active.textarea,
151 +.better-payment .is-focused.input,
152 +.better-payment .is-focused.textarea,
153 +.better-payment .select select.is-active,
154 +.better-payment .select select.is-focused,
155 +.better-payment .select select:active,
156 +.better-payment .select select:focus,
157 +.better-payment .textarea:active,
120 158 .better-payment .textarea:focus {
121 - border-color: #485fc7;
122 - box-shadow: 0 0 0 0.125em rgb(72 95 199 / 25%);
159 + border-color: #485fc7;
160 + box-shadow: 0 0 0 0.125em rgba(72, 95, 199, 0.25);
123 161 }
124 162
125 -.better-payment .input:hover,
126 -.better-payment .is-hovered.input,
127 -.better-payment .is-hovered.textarea,
128 -.better-payment .select select.is-hovered,
129 -.better-payment .select select:hover,
163 +.better-payment .input:hover,
164 +.better-payment .is-hovered.input,
165 +.better-payment .is-hovered.textarea,
166 +.better-payment .select select.is-hovered,
167 +.better-payment .select select:hover,
130 168 .better-payment .textarea:hover {
131 - border-color: #b5b5b5;
169 + border-color: #b5b5b5;
132 170 }
133 171
134 -.better-payment .input,
172 +.better-payment .input,
135 173 .better-payment .textarea {
136 - box-shadow: inset 0 0.0625em 0.125em rgb(10 10 10 / 5%);
137 - max-width: 100%;
138 - width: 100%;
174 + box-shadow: inset 0 0.0625em 0.125em rgba(10, 10, 10, 0.05);
175 + max-width: 100%;
176 + width: 100%;
139 177 }
140 178
141 -.better-payment .is-medium.input,
179 +.better-payment .is-medium.input,
142 180 .better-payment .is-medium.textarea {
143 - font-size: 1.25rem;
181 + font-size: 1.25rem;
144 182 }
145 183
146 -.better-payment .control.has-icons-left .input.is-medium~.icon,
147 -.better-payment .control.has-icons-left .select.is-medium~.icon,
148 -.better-payment .control.has-icons-right .input.is-medium~.icon,
149 -.better-payment .control.has-icons-right .select.is-medium~.icon {
150 - font-size: 1.25rem;
184 +.better-payment .control.has-icons-left .input.is-medium ~ .icon,
185 +.better-payment .control.has-icons-left .select.is-medium ~ .icon,
186 +.better-payment .control.has-icons-right .input.is-medium ~ .icon,
187 +.better-payment .control.has-icons-right .select.is-medium ~ .icon {
188 + font-size: 1.25rem;
151 189 }
152 190
191 +/* FontAwesome icon styling to match BP custom icons */
192 +.better-payment .control.has-icons-left .icon svg,
193 +.better-payment .control.has-icons-right .icon svg {
194 + width: 20px;
195 +}
196 +
197 +.better-payment .control.has-icons-left .icon svg path,
198 +.better-payment .control.has-icons-right .icon svg path {
199 + fill: #b0b7d6;
200 + stroke: #b0b7d6;
201 +}
202 +
153 203 /* Helper Classes */
154 204 .better-payment .columns.is-mobile {
155 - display: flex;
205 + display: flex;
156 206 }
157 207
158 208 .better-payment .columns:not(:last-child) {
159 - margin-bottom: calc(1.5rem - 0.75rem);
209 + margin-bottom: 0.75rem;
160 210 }
161 211
162 212 .better-payment .columns {
163 - margin-left: -0.75rem;
164 - margin-right: -0.75rem;
165 - margin-top: -0.75rem;
213 + margin-left: -0.75rem;
214 + margin-right: -0.75rem;
215 + margin-top: -0.75rem;
166 216 }
167 217
168 218 .better-payment .column {
169 - display: block;
170 - flex-basis: 0;
171 - flex-grow: 1;
172 - flex-shrink: 1;
173 - padding: 0.75rem;
219 + display: block;
220 + flex-basis: 0;
221 + flex-grow: 1;
222 + flex-shrink: 1;
223 + padding: 0.75rem;
174 224 }
175 225
176 226 .better-payment .is-size-1 {
177 - font-size: 3rem!important;
227 + font-size: 3rem !important;
178 228 }
179 229
180 230 .better-payment .is-size-1-fix {
181 - font-size: 3rem;
231 + font-size: 3rem;
182 232 }
183 233
184 234 .better-payment .is-size-2 {
185 - font-size: 2.5rem!important;
235 + font-size: 2.5rem !important;
186 236 }
187 237
188 238 .better-payment .is-size-2-fix {
189 - font-size: 2.5rem;
239 + font-size: 2.5rem;
190 240 }
191 241
192 242 .better-payment .is-size-3 {
193 - font-size: 2rem!important;
243 + font-size: 2rem !important;
194 244 }
195 245
196 246 .better-payment .is-size-3-fix {
197 - font-size: 2rem;
247 + font-size: 2rem;
198 248 }
199 249
200 250 .better-payment .is-size-4 {
201 - font-size: 1.5rem!important;
251 + font-size: 1.5rem !important;
202 252 }
203 253
204 254 .better-payment .is-size-4-fix {
205 - font-size: 1.5rem;
255 + font-size: 1.5rem;
206 256 }
207 257
208 258 .better-payment .is-size-5 {
209 - font-size: 1.25rem!important;
259 + font-size: 1.25rem !important;
210 260 }
211 261
212 262 .better-payment .is-size-5-fix {
213 - font-size: 1.25rem;
263 + font-size: 1.25rem;
214 264 }
215 265
216 266 .better-payment .is-size-6 {
217 - font-size: 1rem!important;
267 + font-size: 1rem !important;
218 268 }
219 269
220 270 .better-payment .is-size-6-fix {
221 - font-size: 1rem;
271 + font-size: 1rem;
222 272 }
223 273
224 274 .better-payment .is-size-7 {
225 - font-size: .75rem!important;
275 + font-size: 0.75rem !important;
226 276 }
227 277
228 278 .better-payment .is-size-7-fix {
229 - font-size: .75rem;
279 + font-size: 0.75rem;
230 280 }
231 281
232 -.better-payment .has-text-white {
233 - color: #fff!important;
282 +.better-payment .has-text-white {
283 + color: #fff !important;
234 284 }
235 285
286 +.better-payment .has-text-white-fix {
287 + color: #fff;
288 +}
289 +
236 290 .better-payment .has-text-black {
237 - color: #000!important;
291 + color: #000 !important;
238 292 }
239 293
294 +.better-payment .has-text-black-fix {
295 + color: #000;
296 +}
297 +
240 298 .better-payment .has-text-light {
241 - color: #f5f5f5!important;
299 + color: #f5f5f5 !important;
242 300 }
243 301
302 +.better-payment .has-text-light-fix {
303 + color: #f5f5f5;
304 +}
305 +
244 306 .better-payment .has-text-dark {
245 - color: #363636!important;
307 + color: #363636 !important;
246 308 }
247 309
310 +.better-payment .has-text-dark-fix {
311 + color: #363636;
312 +}
313 +
248 314 .better-payment .has-text-primary {
249 - color: #00d1b2!important;
315 + color: #00d1b2 !important;
250 316 }
251 317
318 +.better-payment .has-text-primary-fix {
319 + color: #00d1b2;
320 +}
321 +
252 322 .better-payment .has-text-link {
253 - color: #485fc7!important;
323 + color: #485fc7 !important;
254 324 }
255 325
326 +.better-payment .has-text-link-fix {
327 + color: #485fc7;
328 +}
329 +
256 330 .better-payment .has-text-info {
257 - color: #3e8ed0!important;
331 + color: #3e8ed0 !important;
258 332 }
259 333
334 +.better-payment .has-text-info-fix {
335 + color: #3e8ed0;
336 +}
337 +
260 338 .better-payment .has-text-success {
261 - color: #48c78e!important;
339 + color: #48c78e !important;
262 340 }
263 341
342 +.better-payment .has-text-success-fix {
343 + color: #48c78e;
344 +}
345 +
264 346 .better-payment .has-text-warning {
265 - color: #ffe08a!important;
347 + color: #ffe08a !important;
266 348 }
267 349
350 +.better-payment .has-text-warning-fix {
351 + color: #ffe08a;
352 +}
353 +
268 354 .better-payment .has-text-danger {
269 - color: #f14668!important;
355 + color: #f14668 !important;
270 356 }
271 357
358 +.better-payment .has-text-danger-fix {
359 + color: #f14668;
360 +}
361 +
272 362 .better-payment .m-0 {
273 - margin: 0!important;
363 + margin: 0 !important;
274 364 }
275 365
276 366 .better-payment .mt-0 {
277 - margin-top: 0!important;
367 + margin-top: 0 !important;
278 368 }
279 369
280 370 .better-payment .mr-0 {
281 - margin-right: 0!important;
371 + margin-right: 0 !important;
282 372 }
283 373
284 374 .better-payment .mb-0 {
285 - margin-bottom: 0!important;
375 + margin-bottom: 0 !important;
286 376 }
287 377
288 378 .better-payment .ml-0 {
289 - margin-left: 0!important;
379 + margin-left: 0 !important;
290 380 }
291 381
292 382 .better-payment .mx-0 {
293 - margin-left: 0!important;
294 - margin-right: 0!important;
383 + margin-left: 0 !important;
384 + margin-right: 0 !important;
295 385 }
296 386
297 387 .better-payment .my-0 {
298 - margin-top: 0!important;
299 - margin-bottom: 0!important;
388 + margin-top: 0 !important;
389 + margin-bottom: 0 !important;
300 390 }
301 391
302 392 .better-payment .m-1 {
303 - margin: 0.25rem !important;
393 + margin: 0.25rem !important;
304 394 }
305 395
306 396 .better-payment .mt-1 {
307 - margin-top: 0.25rem !important;
397 + margin-top: 0.25rem !important;
308 398 }
309 399
310 400 .better-payment .mr-1 {
311 - margin-right: 0.25rem !important;
401 + margin-right: 0.25rem !important;
312 402 }
313 403
314 404 .better-payment .mb-1 {
315 - margin-bottom: 0.25rem !important;
405 + margin-bottom: 0.25rem !important;
316 406 }
317 407
318 408 .better-payment .ml-1 {
319 - margin-left: 0.25rem !important;
409 + margin-left: 0.25rem !important;
320 410 }
321 411
322 412 .better-payment .mx-1 {
323 - margin-left: 0.25rem !important;
324 - margin-right: 0.25rem !important;
413 + margin-left: 0.25rem !important;
414 + margin-right: 0.25rem !important;
325 415 }
326 416
327 417 .better-payment .my-1 {
328 - margin-top: 0.25rem !important;
329 - margin-bottom: 0.25rem !important;
418 + margin-top: 0.25rem !important;
419 + margin-bottom: 0.25rem !important;
330 420 }
331 421
332 422 .better-payment .m-2 {
333 - margin: 0.5rem !important;
423 + margin: 0.5rem !important;
334 424 }
335 425
336 426 .better-payment .mt-2 {
337 - margin-top: 0.5rem !important;
427 + margin-top: 0.5rem !important;
338 428 }
339 429
340 430 .better-payment .mr-2 {
341 - margin-right: 0.5rem !important;
431 + margin-right: 0.5rem !important;
342 432 }
343 433
344 434 .better-payment .mb-2 {
345 - margin-bottom: 0.5rem !important;
435 + margin-bottom: 0.5rem !important;
346 436 }
347 437
348 438 .better-payment .ml-2 {
349 - margin-left: 0.5rem !important;
439 + margin-left: 0.5rem !important;
350 440 }
351 441
352 442 .better-payment .mx-2 {
353 - margin-left: 0.5rem !important;
354 - margin-right: 0.5rem !important;
443 + margin-left: 0.5rem !important;
444 + margin-right: 0.5rem !important;
355 445 }
356 446
357 447 .better-payment .my-2 {
358 - margin-top: 0.5rem !important;
359 - margin-bottom: 0.5rem !important;
448 + margin-top: 0.5rem !important;
449 + margin-bottom: 0.5rem !important;
360 450 }
361 451
362 452 .better-payment .m-3 {
363 - margin: 0.75rem !important;
453 + margin: 0.75rem !important;
364 454 }
365 455
366 456 .better-payment .mt-3 {
367 - margin-top: 0.75rem !important;
457 + margin-top: 0.75rem !important;
368 458 }
369 459
370 460 .better-payment .mr-3 {
371 - margin-right: 0.75rem !important;
461 + margin-right: 0.75rem !important;
372 462 }
373 463
374 464 .better-payment .mb-3 {
375 - margin-bottom: 0.75rem !important;
465 + margin-bottom: 0.75rem !important;
376 466 }
377 467
378 468 .better-payment .ml-3 {
379 - margin-left: 0.75rem !important;
469 + margin-left: 0.75rem !important;
380 470 }
381 471
382 472 .better-payment .mx-3 {
383 - margin-left: 0.75rem !important;
384 - margin-right: 0.75rem !important;
473 + margin-left: 0.75rem !important;
474 + margin-right: 0.75rem !important;
385 475 }
386 476
387 477 .better-payment .my-3 {
388 - margin-top: 0.75rem !important;
389 - margin-bottom: 0.75rem !important;
478 + margin-top: 0.75rem !important;
479 + margin-bottom: 0.75rem !important;
390 480 }
391 481
392 482 .better-payment .m-4 {
393 - margin: 1rem !important;
483 + margin: 1rem !important;
394 484 }
395 485
396 486 .better-payment .mt-4 {
397 - margin-top: 1rem !important;
487 + margin-top: 1rem !important;
398 488 }
399 489
400 490 .better-payment .mr-4 {
401 - margin-right: 1rem !important;
491 + margin-right: 1rem !important;
402 492 }
403 493
404 494 .better-payment .mb-4 {
405 - margin-bottom: 1rem !important;
495 + margin-bottom: 1rem !important;
406 496 }
407 497
408 498 .better-payment .ml-4 {
409 - margin-left: 1rem !important;
499 + margin-left: 1rem !important;
410 500 }
411 501
412 502 .better-payment .mx-4 {
413 - margin-left: 1rem !important;
414 - margin-right: 1rem !important;
503 + margin-left: 1rem !important;
504 + margin-right: 1rem !important;
415 505 }
416 506
417 507 .better-payment .my-4 {
418 - margin-top: 1rem !important;
419 - margin-bottom: 1rem !important;
508 + margin-top: 1rem !important;
509 + margin-bottom: 1rem !important;
420 510 }
421 511
422 512 .better-payment .m-5 {
423 - margin: 1.5rem !important;
513 + margin: 1.5rem !important;
424 514 }
425 515
426 516 .better-payment .mt-5 {
427 - margin-top: 1.5rem !important;
517 + margin-top: 1.5rem !important;
428 518 }
429 519
430 520 .better-payment .mr-5 {
431 - margin-right: 1.5rem !important;
521 + margin-right: 1.5rem !important;
432 522 }
433 523
434 524 .better-payment .mb-5 {
435 - margin-bottom: 1.5rem !important;
525 + margin-bottom: 1.5rem !important;
436 526 }
437 527
438 528 .better-payment .ml-5 {
439 - margin-left: 1.5rem !important;
529 + margin-left: 1.5rem !important;
440 530 }
441 531
442 532 .better-payment .mx-5 {
443 - margin-left: 1.5rem !important;
444 - margin-right: 1.5rem !important;
533 + margin-left: 1.5rem !important;
534 + margin-right: 1.5rem !important;
445 535 }
446 536
447 537 .better-payment .my-5 {
448 - margin-top: 1.5rem !important;
449 - margin-bottom: 1.5rem !important;
538 + margin-top: 1.5rem !important;
539 + margin-bottom: 1.5rem !important;
450 540 }
451 541
452 542 .better-payment .m-6 {
453 - margin: 3rem !important;
543 + margin: 3rem !important;
454 544 }
455 545
456 546 .better-payment .mt-6 {
457 - margin-top: 3rem !important;
547 + margin-top: 3rem !important;
458 548 }
459 549
460 550 .better-payment .mr-6 {
461 - margin-right: 3rem !important;
551 + margin-right: 3rem !important;
462 552 }
463 553
464 554 .better-payment .mb-6 {
465 - margin-bottom: 3rem !important;
555 + margin-bottom: 3rem !important;
466 556 }
467 557
468 558 .better-payment .ml-6 {
469 - margin-left: 3rem !important;
559 + margin-left: 3rem !important;
470 560 }
471 561
472 562 .better-payment .mx-6 {
473 - margin-left: 3rem !important;
474 - margin-right: 3rem !important;
563 + margin-left: 3rem !important;
564 + margin-right: 3rem !important;
475 565 }
476 566
477 567 .better-payment .my-6 {
478 - margin-top: 3rem !important;
479 - margin-bottom: 3rem !important;
568 + margin-top: 3rem !important;
569 + margin-bottom: 3rem !important;
480 570 }
481 571
482 572 .better-payment .p-0 {
483 - padding: 0!important;
573 + padding: 0 !important;
484 574 }
485 575
486 576 .better-payment .pt-0 {
487 - padding-top: 0!important;
577 + padding-top: 0 !important;
488 578 }
489 579
490 580 .better-payment .pr-0 {
491 - padding-right: 0!important;
581 + padding-right: 0 !important;
492 582 }
493 583
494 584 .better-payment .pb-0 {
495 - padding-bottom: 0!important;
585 + padding-bottom: 0 !important;
496 586 }
497 587
498 588 .better-payment .pl-0 {
499 - padding-left: 0!important;
589 + padding-left: 0 !important;
500 590 }
501 591
502 592 .better-payment .px-0 {
503 - padding-left: 0!important;
504 - padding-right: 0!important;
593 + padding-left: 0 !important;
594 + padding-right: 0 !important;
505 595 }
506 596
507 597 .better-payment .py-0 {
508 - padding-top: 0!important;
509 - padding-bottom: 0!important;
598 + padding-top: 0 !important;
599 + padding-bottom: 0 !important;
510 600 }
511 601
512 602 .better-payment .p-1 {
513 - padding: 0.25rem !important;
603 + padding: 0.25rem !important;
514 604 }
515 605
516 606 .better-payment .pt-1 {
517 - padding-top: 0.25rem !important;
607 + padding-top: 0.25rem !important;
518 608 }
519 609
520 610 .better-payment .pr-1 {
521 - padding-right: 0.25rem !important;
611 + padding-right: 0.25rem !important;
522 612 }
523 613
524 614 .better-payment .pb-1 {
525 - padding-bottom: 0.25rem !important;
615 + padding-bottom: 0.25rem !important;
526 616 }
527 617
528 618 .better-payment .pl-1 {
529 - padding-left: 0.25rem !important;
619 + padding-left: 0.25rem !important;
530 620 }
531 621
532 622 .better-payment .px-1 {
533 - padding-left: 0.25rem !important;
534 - padding-right: 0.25rem !important;
623 + padding-left: 0.25rem !important;
624 + padding-right: 0.25rem !important;
535 625 }
536 626
537 627 .better-payment .py-1 {
538 - padding-top: 0.25rem !important;
539 - padding-bottom: 0.25rem !important;
628 + padding-top: 0.25rem !important;
629 + padding-bottom: 0.25rem !important;
540 630 }
541 631
542 632 .better-payment .p-2 {
543 - padding: 0.5rem !important;
633 + padding: 0.5rem !important;
544 634 }
545 635
546 636 .better-payment .pt-2 {
547 - padding-top: 0.5rem !important;
637 + padding-top: 0.5rem !important;
548 638 }
549 639
550 640 .better-payment .pr-2 {
551 - padding-right: 0.5rem !important;
641 + padding-right: 0.5rem !important;
552 642 }
553 643
554 644 .better-payment .pb-2 {
555 - padding-bottom: 0.5rem !important;
645 + padding-bottom: 0.5rem !important;
556 646 }
557 647
558 648 .better-payment .pl-2 {
559 - padding-left: 0.5rem !important;
649 + padding-left: 0.5rem !important;
560 650 }
561 651
562 652 .better-payment .px-2 {
563 - padding-left: 0.5rem !important;
564 - padding-right: 0.5rem !important;
653 + padding-left: 0.5rem !important;
654 + padding-right: 0.5rem !important;
565 655 }
566 656
567 657 .better-payment .py-2 {
568 - padding-top: 0.5rem !important;
569 - padding-bottom: 0.5rem !important;
658 + padding-top: 0.5rem !important;
659 + padding-bottom: 0.5rem !important;
570 660 }
571 661
572 662 .better-payment .p-3 {
573 - padding: 0.75rem !important;
663 + padding: 0.75rem !important;
574 664 }
575 665
576 666 .better-payment .pt-3 {
577 - padding-top: 0.75rem !important;
667 + padding-top: 0.75rem !important;
578 668 }
579 669
580 670 .better-payment .pr-3 {
581 - padding-right: 0.75rem !important;
671 + padding-right: 0.75rem !important;
582 672 }
583 673
584 674 .better-payment .pb-3 {
585 - padding-bottom: 0.75rem !important;
675 + padding-bottom: 0.75rem !important;
586 676 }
587 677
588 678 .better-payment .pl-3 {
589 - padding-left: 0.75rem !important;
679 + padding-left: 0.75rem !important;
590 680 }
591 681
592 682 .better-payment .px-3 {
593 - padding-left: 0.75rem !important;
594 - padding-right: 0.75rem !important;
683 + padding-left: 0.75rem !important;
684 + padding-right: 0.75rem !important;
595 685 }
596 686
597 687 .better-payment .py-3 {
598 - padding-top: 0.75rem !important;
599 - padding-bottom: 0.75rem !important;
688 + padding-top: 0.75rem !important;
689 + padding-bottom: 0.75rem !important;
600 690 }
601 691
602 692 .better-payment .p-4 {
603 - padding: 1rem !important;
693 + padding: 1rem !important;
604 694 }
605 695
606 696 .better-payment .pt-4 {
607 - padding-top: 1rem !important;
697 + padding-top: 1rem !important;
608 698 }
609 699
610 700 .better-payment .pr-4 {
611 - padding-right: 1rem !important;
701 + padding-right: 1rem !important;
612 702 }
613 703
614 704 .better-payment .pb-4 {
615 - padding-bottom: 1rem !important;
705 + padding-bottom: 1rem !important;
616 706 }
617 707
618 708 .better-payment .pl-4 {
619 - padding-left: 1rem !important;
709 + padding-left: 1rem !important;
620 710 }
621 711
622 712 .better-payment .px-4 {
623 - padding-left: 1rem !important;
624 - padding-right: 1rem !important;
713 + padding-left: 1rem !important;
714 + padding-right: 1rem !important;
625 715 }
626 716
627 717 .better-payment .py-4 {
628 - padding-top: 1rem !important;
629 - padding-bottom: 1rem !important;
718 + padding-top: 1rem !important;
719 + padding-bottom: 1rem !important;
630 720 }
631 721
632 722 .better-payment .p-5 {
633 - padding: 1.5rem !important;
723 + padding: 1.5rem !important;
634 724 }
635 725
636 726 .better-payment .pt-5 {
637 - padding-top: 1.5rem !important;
727 + padding-top: 1.5rem !important;
638 728 }
639 729
640 730 .better-payment .pr-5 {
641 - padding-right: 1.5rem !important;
731 + padding-right: 1.5rem !important;
642 732 }
643 733
644 734 .better-payment .pb-5 {
645 - padding-bottom: 1.5rem !important;
735 + padding-bottom: 1.5rem !important;
646 736 }
647 737
648 738 .better-payment .pl-5 {
649 - padding-left: 1.5rem !important;
739 + padding-left: 1.5rem !important;
650 740 }
651 741
652 742 .better-payment .px-5 {
653 - padding-left: 1.5rem !important;
654 - padding-right: 1.5rem !important;
743 + padding-left: 1.5rem !important;
744 + padding-right: 1.5rem !important;
655 745 }
656 746
657 747 .better-payment .py-5 {
658 - padding-top: 1.5rem !important;
659 - padding-bottom: 1.5rem !important;
748 + padding-top: 1.5rem !important;
749 + padding-bottom: 1.5rem !important;
660 750 }
661 751
662 752 .better-payment .p-6 {
663 - padding: 3rem !important;
753 + padding: 3rem !important;
664 754 }
665 755
666 756 .better-payment .pt-6 {
667 - padding-top: 3rem !important;
757 + padding-top: 3rem !important;
668 758 }
669 759
670 760 .better-payment .pr-6 {
671 - padding-right: 3rem !important;
761 + padding-right: 3rem !important;
672 762 }
673 763
674 764 .better-payment .pb-6 {
675 - padding-bottom: 3rem !important;
765 + padding-bottom: 3rem !important;
676 766 }
677 767
678 768 .better-payment .pl-6 {
679 - padding-left: 3rem !important;
769 + padding-left: 3rem !important;
680 770 }
681 771
682 772 .better-payment .px-6 {
683 - padding-left: 3rem !important;
684 - padding-right: 3rem !important;
773 + padding-left: 3rem !important;
774 + padding-right: 3rem !important;
685 775 }
686 776
687 777 .better-payment .py-6 {
688 - padding-top: 3rem !important;
689 - padding-bottom: 3rem !important;
778 + padding-top: 3rem !important;
779 + padding-bottom: 3rem !important;
690 780 }
691 781
692 782 .better-payment .columns.is-gapless:not(:last-child) {
693 - margin-bottom: 1.5rem;
783 + margin-bottom: 1.5rem;
694 784 }
695 785
696 786 .better-payment .columns.is-gapless {
697 - margin-left: 0;
698 - margin-right: 0;
699 - margin-top: 0;
787 + margin-left: 0;
788 + margin-right: 0;
789 + margin-top: 0;
700 790 }
701 791
702 792 .better-payment .tile.is-ancestor:not(:last-child) {
703 - margin-bottom: 0.75rem;
793 + margin-bottom: 0.75rem;
704 794 }
705 795
706 796 .better-payment .tile.is-ancestor {
707 - margin-left: -0.75rem;
708 - margin-right: -0.75rem;
709 - margin-top: -0.75rem;
797 + margin-left: -0.75rem;
798 + margin-right: -0.75rem;
799 + margin-top: -0.75rem;
710 800 }
711 801
712 802 .better-payment .tile {
713 - align-items: stretch;
714 - display: block;
715 - flex-basis: 0;
716 - flex-grow: 1;
717 - flex-shrink: 1;
718 - min-height: -webkit-min-content;
719 - min-height: -moz-min-content;
720 - min-height: min-content;
803 + align-items: stretch;
804 + display: block;
805 + flex-basis: 0;
806 + flex-grow: 1;
807 + flex-shrink: 1;
808 + min-height: -webkit-min-content;
809 + min-height: -moz-min-content;
810 + min-height: min-content;
721 811 }
722 812
723 -.better-payment .tile.is-vertical>.tile.is-child:not(:last-child) {
724 - margin-bottom: 1.5rem!important;
813 +.better-payment .tile.is-vertical > .tile.is-child:not(:last-child) {
814 + margin-bottom: 1.5rem !important;
725 815 }
726 816
727 817 .better-payment .tile.is-child {
728 - margin: 0!important;
818 + margin: 0 !important;
729 819 }
730 820
731 821 .better-payment .notification.is-primary {
732 - background-color: #00d1b2;
733 - color: #fff;
822 + background-color: #00d1b2;
823 + color: #fff;
734 824 }
735 825
736 826 .better-payment .notification.is-warning {
737 - background-color: #ffe08a;
738 - color: rgba(0,0,0,.7);
827 + background-color: #ffe08a;
828 + color: rgba(0, 0, 0, 0.7);
739 829 }
740 830
741 831 .better-payment .notification.is-info {
742 - background-color: #3e8ed0;
743 - color: #fff;
832 + background-color: #3e8ed0;
833 + color: #fff;
744 834 }
745 835
746 836 .better-payment .has-background-white {
747 - background-color: #ffffff!important;
837 + background-color: #ffffff !important;
748 838 }
749 839
750 840 .better-payment .has-background-white-fix {
751 - background-color: #ffffff;
841 + background-color: #ffffff;
752 842 }
753 843
754 844 .better-payment .has-background-black {
755 - background-color: #0a0a0a!important;
845 + background-color: #0a0a0a !important;
756 846 }
757 847
758 848 .better-payment .has-background-black-fix {
759 - background-color: #0a0a0a;
849 + background-color: #0a0a0a;
760 850 }
761 851
762 852 .better-payment .has-background-light {
763 - background-color: #f5f5f5!important;
853 + background-color: #f5f5f5 !important;
764 854 }
765 855
766 856 .better-payment .has-background-light-fix {
767 - background-color: #f5f5f5;
857 + background-color: #f5f5f5;
768 858 }
769 859
770 860 .better-payment .has-background-dark {
771 - background-color: #363636!important;
861 + background-color: #363636 !important;
772 862 }
773 863
774 864 .better-payment .has-background-dark-fix {
775 - background-color: #363636;
865 + background-color: #363636;
776 866 }
777 867
778 868 .better-payment .has-background-primary {
779 - background-color: #00d1b2!important;
869 + background-color: #00d1b2 !important;
780 870 }
781 871
782 872 .better-payment .has-background-primary-fix {
783 - background-color: #00d1b2;
873 + background-color: #00d1b2;
784 874 }
785 875
786 876 .better-payment .has-background-link {
787 - background-color: #485fc7!important;
877 + background-color: #485fc7 !important;
788 878 }
789 879
790 880 .better-payment .has-background-link-fix {
791 - background-color: #485fc7;
881 + background-color: #485fc7;
792 882 }
793 883
794 884 .better-payment .has-background-info {
795 - background-color: #3e8ed0!important;
885 + background-color: #3e8ed0 !important;
796 886 }
797 887
798 888 .better-payment .has-background-info-fix {
799 - background-color: #3e8ed0;
889 + background-color: #3e8ed0;
800 890 }
801 891
802 892 .better-payment .has-background-success {
803 - background-color: #48c78e!important;
893 + background-color: #48c78e !important;
804 894 }
805 895
806 896 .better-payment .has-background-success-fix {
807 - background-color: #48c78e;
897 + background-color: #48c78e;
808 898 }
809 899
810 900 .better-payment .has-background-warning {
811 - background-color: #ffe08a!important;
901 + background-color: #ffe08a !important;
812 902 }
813 903
814 904 .better-payment .has-background-warning-fix {
815 - background-color: #ffe08a;
905 + background-color: #ffe08a;
816 906 }
817 907
818 908 .better-payment .has-background-danger {
819 - background-color: #f14668!important;
909 + background-color: #f14668 !important;
820 910 }
821 911
822 912 .better-payment .has-background-danger-fix {
823 - background-color: #f14668;
913 + background-color: #f14668;
824 914 }
825 915
826 916 .better-payment .has-text-centered {
827 - text-align: center!important;
917 + text-align: center !important;
828 918 }
829 919
830 920 .better-payment .has-text-justified {
831 - text-align: justify!important;
921 + text-align: justify !important;
832 922 }
833 923
834 924 .better-payment .has-text-left {
835 - text-align: left!important;
925 + text-align: left !important;
836 926 }
837 927
838 928 .better-payment .has-text-right {
839 - text-align: right!important;
929 + text-align: right !important;
840 930 }
841 931
842 932 .better-payment .has-text-weight-light {
843 - font-weight: 300!important;
933 + font-weight: 300 !important;
844 934 }
935 +
845 936 .better-payment .has-text-weight-normal {
846 - font-weight: 400!important;
937 + font-weight: 400 !important;
847 938 }
939 +
848 940 .better-payment .has-text-weight-medium {
849 - font-weight: 500!important;
941 + font-weight: 500 !important;
850 942 }
943 +
851 944 .better-payment .has-text-weight-semibold {
852 - font-weight: 600!important;
945 + font-weight: 600 !important;
853 946 }
947 +
854 948 .better-payment .has-text-weight-bold {
855 - font-weight: 700!important;
949 + font-weight: 700 !important;
856 950 }
857 951
858 -.better-payment .bulma-control-extend,
859 -.better-payment .file-cta,
860 -.better-payment .file-name,
861 -.better-payment .input,
862 -.better-payment .pagination-ellipsis,
863 -.better-payment .pagination-link,
864 -.better-payment .pagination-next,
865 -.better-payment .pagination-previous,
866 -.better-payment .select select,
952 +.better-payment .bulma-control-extend,
953 +.better-payment .file-cta,
954 +.better-payment .file-name,
955 +.better-payment .input,
956 +.better-payment .pagination-ellipsis,
957 +.better-payment .pagination-link,
958 +.better-payment .pagination-next,
959 +.better-payment .pagination-previous,
960 +.better-payment .select select,
867 961 .better-payment .textarea {
868 - -moz-appearance: none;
869 - -webkit-appearance: none;
870 - align-items: center;
871 - border: 1px solid transparent;
872 - border-radius: 0.375em;
873 - box-shadow: none;
874 - display: inline-flex;
875 - font-size: 1rem;
876 - height: 2.5em;
877 - justify-content: flex-start;
878 - line-height: 1.5;
879 - padding-bottom: calc(0.5em - 1px);
880 - padding-left: calc(0.75em - 1px);
881 - padding-right: calc(0.75em - 1px);
882 - padding-top: calc(0.5em - 1px);
883 - position: relative;
884 - vertical-align: top;
962 + -moz-appearance: none;
963 + -webkit-appearance: none;
964 + align-items: center;
965 + border: 1px solid transparent;
966 + border-radius: 0.375em;
967 + box-shadow: none;
968 + display: inline-flex;
969 + font-size: 1rem;
970 + height: 2.5em;
971 + justify-content: flex-start;
972 + line-height: 1.5;
973 + padding-bottom: calc(0.5em - 1px);
974 + padding-left: calc(0.75em - 1px);
975 + padding-right: calc(0.75em - 1px);
976 + padding-top: calc(0.5em - 1px);
977 + position: relative;
978 + vertical-align: top;
885 979 }
886 980
887 -.better-payment .input,
888 -.better-payment .select select,
981 +.better-payment .input,
982 +.better-payment .select select,
889 983 .better-payment .textarea {
890 - background-color: #fff;
891 - border-color: #dbdbdb;
892 - border-radius: 0.375em;
893 - color: #363636;
984 + background-color: #fff;
985 + border-color: #dbdbdb;
986 + border-radius: 0.375em;
987 + color: #363636;
894 988 }
895 989
896 -.better-payment .bulma-control-extend:active,
897 -.better-payment .bulma-control-extend:focus,
898 -.better-payment .file-cta:active,
899 -.better-payment .file-cta:focus,
900 -.better-payment .file-name:active,
901 -.better-payment .file-name:focus,
902 -.better-payment .input:active,
903 -.better-payment .input:focus,
904 -.better-payment .is-active.bulma-control-extend,
905 -.better-payment .is-active.file-cta,
906 -.better-payment .is-active.file-name,
907 -.better-payment .is-active.input,
908 -.better-payment .is-active.pagination-ellipsis,
909 -.better-payment .is-active.pagination-link,
910 -.better-payment .is-active.pagination-next,
911 -.better-payment .is-active.pagination-previous,
912 -.better-payment .is-active.textarea,
913 -.better-payment .is-focused.bulma-control-extend,
914 -.better-payment .is-focused.file-cta,
915 -.better-payment .is-focused.file-name,
916 -.better-payment .is-focused.input,
917 -.better-payment .is-focused.pagination-ellipsis,
918 -.better-payment .is-focused.pagination-link,
919 -.better-payment .is-focused.pagination-next,
920 -.better-payment .is-focused.pagination-previous,
921 -.better-payment .is-focused.textarea,
922 -.better-payment .pagination-ellipsis:active,
923 -.better-payment .pagination-ellipsis:focus,
924 -.better-payment .pagination-link:active,
925 -.better-payment .pagination-link:focus,
926 -.better-payment .pagination-next:active,
927 -.better-payment .pagination-next:focus,
928 -.better-payment .pagination-previous:active,
929 -.better-payment .pagination-previous:focus,
930 -.better-payment .select select.is-active,
931 -.better-payment .select select.is-focused,
932 -.better-payment .select select:active,
933 -.better-payment .select select:focus,
934 -.better-payment .textarea:active,
990 +.better-payment .bulma-control-extend:active,
991 +.better-payment .bulma-control-extend:focus,
992 +.better-payment .file-cta:active,
993 +.better-payment .file-cta:focus,
994 +.better-payment .file-name:active,
995 +.better-payment .file-name:focus,
996 +.better-payment .input:active,
997 +.better-payment .input:focus,
998 +.better-payment .is-active.bulma-control-extend,
999 +.better-payment .is-active.file-cta,
1000 +.better-payment .is-active.file-name,
1001 +.better-payment .is-active.input,
1002 +.better-payment .is-active.pagination-ellipsis,
1003 +.better-payment .is-active.pagination-link,
1004 +.better-payment .is-active.pagination-next,
1005 +.better-payment .is-active.pagination-previous,
1006 +.better-payment .is-active.textarea,
1007 +.better-payment .is-focused.bulma-control-extend,
1008 +.better-payment .is-focused.file-cta,
1009 +.better-payment .is-focused.file-name,
1010 +.better-payment .is-focused.input,
1011 +.better-payment .is-focused.pagination-ellipsis,
1012 +.better-payment .is-focused.pagination-link,
1013 +.better-payment .is-focused.pagination-next,
1014 +.better-payment .is-focused.pagination-previous,
1015 +.better-payment .is-focused.textarea,
1016 +.better-payment .pagination-ellipsis:active,
1017 +.better-payment .pagination-ellipsis:focus,
1018 +.better-payment .pagination-link:active,
1019 +.better-payment .pagination-link:focus,
1020 +.better-payment .pagination-next:active,
1021 +.better-payment .pagination-next:focus,
1022 +.better-payment .pagination-previous:active,
1023 +.better-payment .pagination-previous:focus,
1024 +.better-payment .select select.is-active,
1025 +.better-payment .select select.is-focused,
1026 +.better-payment .select select:active,
1027 +.better-payment .select select:focus,
1028 +.better-payment .textarea:active,
935 1029 .better-payment.textarea:focus {
936 - outline: 0;
1030 + outline: 0;
937 1031 }
1032 +
938 1033 .better-payment .better-payment-notice.notification.is-danger.is-light {
939 - background-color: rgb(242, 222, 222);
940 - color: rgb(169, 68, 66);
941 - font-size: 85%;
942 - padding: 15px;
943 - border-radius: 3px;
944 -}
945 -.better-payment .better-payment-notice.notification.is-danger.is-light a{
946 - color: rgb(169, 68, 66) !important;
1034 + background-color: rgb(242, 222, 222);
1035 + color: rgb(169, 68, 66);
1036 + font-size: 85%;
1037 + padding: 15px;
1038 + border-radius: 3px;
947 1039 }
1040 +
1041 +.better-payment .better-payment-notice.notification.is-danger.is-light a {
1042 + color: rgb(169, 68, 66) !important;
1043 +}
1044 +
948 1045 .better-payment .notification {
949 - background-color: #f5f5f5;
950 - border-radius: 0.375em;
951 - position: relative;
952 - padding: 1.25rem 2.5rem 1.25rem 1.5rem;
1046 + background-color: #f5f5f5;
1047 + border-radius: 0.375em;
1048 + position: relative;
1049 + padding: 1.25rem 2.5rem 1.25rem 1.5rem;
953 1050 }
954 1051
955 1052 .better-payment .notification.is-light {
956 - background-color: #f5f5f5;
957 - color: rgba(0,0,0,.7);
1053 + background-color: #f5f5f5;
1054 + color: rgba(0, 0, 0, 0.7);
958 1055 }
959 1056
960 1057 .better-payment .notification.is-danger {
961 - background-color: #f14668;
962 - color: #fff;
1058 + background-color: #f14668;
1059 + color: #fff;
963 1060 }
964 1061
965 1062 .better-payment .notification.is-danger.is-light {
966 - background-color: #feecf0;
967 - color: #cc0f35;
1063 + background-color: #feecf0;
1064 + color: #cc0f35;
968 1065 }
969 1066
970 1067 .better-payment .notification.is-warning {
971 - background-color: #ffe08a;
972 - color: rgba(0,0,0,.7);
1068 + background-color: #ffe08a;
1069 + color: rgba(0, 0, 0, 0.7);
973 1070 }
974 1071
975 1072 .better-payment .notification.is-warning.is-light {
976 - background-color: #fffaeb;
977 - color: #946c00;
1073 + background-color: #fffaeb;
1074 + color: #946c00;
978 1075 }
979 1076
980 1077 .better-payment .notification.is-success {
981 - background-color: #48c78e;
982 - color: #fff;
1078 + background-color: #48c78e;
1079 + color: #fff;
983 1080 }
984 1081
985 1082 .better-payment .notification.is-success.is-light {
986 - background-color: #effaf5;
987 - color: #257953;
1083 + background-color: #effaf5;
1084 + color: #257953;
988 1085 }
989 1086
990 1087 .better-payment .notification.is-info {
991 - background-color: #3e8ed0;
992 - color: #fff;
1088 + background-color: #3e8ed0;
1089 + color: #fff;
993 1090 }
994 1091
995 1092 .better-payment .notification.is-info.is-light {
996 - background-color: #eff5fb;
997 - color: #296fa8;
1093 + background-color: #eff5fb;
1094 + color: #296fa8;
998 1095 }
999 1096
1000 1097 .better-payment .notification.is-link {
1001 - background-color: #485fc7;
1002 - color: #fff;
1098 + background-color: #485fc7;
1099 + color: #fff;
1003 1100 }
1004 1101
1005 1102 .better-payment .notification.is-link.is-light {
1006 - background-color: #eff1fa;
1007 - color: #3850b7;
1103 + background-color: #eff1fa;
1104 + color: #3850b7;
1008 1105 }
1009 1106
1010 1107 .better-payment .notification.is-primary {
1011 - background-color: #00d1b2;
1012 - color: #fff;
1108 + background-color: #00d1b2;
1109 + color: #fff;
1013 1110 }
1014 1111
1015 1112 .better-payment .notification.is-primary.is-light {
1016 - background-color: #ebfffc;
1017 - color: #00947e;
1113 + background-color: #ebfffc;
1114 + color: #00947e;
1018 1115 }
1019 1116
1020 1117 .better-payment .box {
1021 - background-color: #fff;
1022 - border-radius: 6px;
1023 - box-shadow: 0 0.5em 1em -0.125em rgb(10 10 10 / 10%), 0 0 0 1px rgb(10 10 10 / 2%);
1024 - color: #4a4a4a;
1025 - display: block;
1026 - padding: 0.75rem;
1118 + background-color: #fff;
1119 + border-radius: 6px;
1120 + box-shadow: 0 0.5em 1em -0.125em rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.02);
1121 + color: #4a4a4a;
1122 + display: block;
1123 + padding: 0.75rem;
1027 1124 }
1028 1125
1029 1126 /* Layout 2 */
1030 1127 .better-payment .payment-form-layout-1,
1031 1128 .better-payment .payment-form-layout-2 {
1032 - font-family: "DM Sans", sans-serif;
1033 - box-shadow: 0px 40px 75px rgba(0, 1, 35, 0.08);
1129 + font-family: "DM Sans", sans-serif;
1130 + box-shadow: 0px 40px 75px rgba(0, 1, 35, 0.08);
1034 1131 }
1035 1132
1036 1133 .better-payment .payment-form-layout-1 .dynamic-amount-section,
1037 1134 .better-payment .payment-form-layout-2 .dynamic-amount-section {
1038 - background: url('../img/bg-blue-2.svg') no-repeat center;
1039 - background-size: cover;
1040 - border-top-left-radius: 10px;
1041 - border-bottom-left-radius: 10px;
1135 + position: relative;
1136 + background-color: #006aff;
1137 + background-image: url("../img/bg-blue-2.svg");
1138 + background-repeat: no-repeat;
1139 + background-position: center;
1140 + background-size: cover;
1141 + border-top-left-radius: 10px;
1142 + border-bottom-left-radius: 10px;
1042 1143 }
1043 1144
1044 1145 .better-payment .payment-form-layout-2 .dynamic-amount-section-subtitle {
1045 - color: #98B9F2;
1146 + color: #98b9f2;
1046 1147 }
1047 1148
1048 1149 .better-payment .payment-form-layout-3 .dynamic-amount-section-amount {
1049 - color: #0042BD;
1150 + color: #0042bd;
1050 1151 }
1051 1152
1052 1153 .better-payment .payment-form-layout.payment-form-layout-3 .button {
1053 - background-color: #0042BD !important;
1154 + background-color: #0042bd !important;
1054 1155 }
1055 1156
1056 1157 .better-payment .payment-form-layout-3 .dynamic-amount-section-title {
1057 - color: #000;
1158 + color: #000;
1058 1159 }
1059 1160
1060 1161 .better-payment .payment-form-layout-3 .dynamic-amount-section-subtitle {
1061 - color: #666;
1162 + color: #666;
1062 1163 }
1063 1164
1064 1165 .better-payment .payment-form-layout-3 .dynamic-amount-section-icon {
1065 - color: #C6CDE4;
1166 + color: #c6cde4;
1066 1167 }
1067 1168
1068 1169 .better-payment .payment-form-layout-3 .payment-method-checkbox {
1069 - border-bottom: 1px solid #E9ECFF;
1070 - cursor: pointer;
1170 + border-bottom: 1px solid #e9ecff;
1171 + cursor: pointer;
1172 + display: flex;
1173 + align-items: center;
1174 + justify-content: center;
1071 1175 }
1072 1176
1177 +.better-payment .payment-form-layout-3 .payment-method-checkbox input {
1178 + display: none;
1179 +}
1180 +
1181 +.better-payment .payment-form-layout-3 .payment-method-checkbox img {
1182 + object-fit: contain;
1183 + height: 25px;
1184 +}
1185 +
1073 1186 .better-payment .payment-form-layout-3 .payment-method-checkbox input,
1074 1187 .better-payment .payment-form-layout-2 .payment-method-checkbox.single-item input,
1075 -.better-payment .payment-form-layout-1 .payment-method-checkbox.single-item input{
1076 - visibility: hidden;
1188 +.better-payment .payment-form-layout-1 .payment-method-checkbox.single-item input {
1189 + visibility: hidden;
1077 1190 }
1078 1191
1079 1192 .better-payment .payment-form-layout-3 .payment-method-checkbox.active,
1080 1193 .better-payment .payment-form-layout-1 .payment-method-checkbox.single-item.active,
1081 1194 .better-payment .payment-form-layout-2 .payment-method-checkbox.single-item.active {
1082 - border-bottom: 1px solid #0042BD;
1195 + border-bottom: 1px solid #0042bd;
1083 1196 }
1084 1197
1085 1198 .better-payment .payment-form-layout-1 .form-content-section,
1086 1199 .better-payment .payment-form-layout-2 .form-content-section {
1087 - border-top-right-radius: 10px;
1088 - border-bottom-right-radius: 10px;
1200 + border-top-right-radius: 10px;
1201 + border-bottom-right-radius: 10px;
1089 1202 }
1090 1203
1091 1204 .better-payment .payment-form-layout-2 .dynamic-amount-section,
1092 1205 .better-payment .payment-form-layout-2 .form-content-section {
1093 - border-radius: 10px;
1206 + border-radius: 10px;
1094 1207 }
1095 1208
1096 1209 .better-payment .payment-form-layout-2 .dynamic-amount-section {
1097 - background: linear-gradient(180deg, #006AFF 0%, #004CBF 100%);
1210 + background-color: #006aff;
1211 + background-image: linear-gradient(180deg, #006aff 0%, #004cbf 100%);
1098 1212 }
1099 1213
1100 1214 .better-payment .payment-form-layout-3 .dynamic-amount-section {
1101 - background: #FBFCFF;
1215 + background: #fbfcff;
1102 1216 }
1103 -
1104 -.better-payment .payment-form-layout .button{
1105 - background-color: #006AFF !important;
1106 - color: #fff !important;
1217 +
1218 +.better-payment .payment-form-layout .button {
1219 + background-color: #006aff !important;
1220 + color: #fff !important;
1107 1221 }
1108 1222
1109 1223 .better-payment .button {
1110 - -moz-appearance: none;
1111 - -webkit-appearance: none;
1112 - align-items: center;
1113 - border: 1px solid transparent;
1114 - border-radius: 0.375em;
1115 - box-shadow: none;
1116 - display: inline-flex;
1117 - font-size: 1rem;
1118 - height: 2.5em;
1119 - justify-content: flex-start;
1120 - line-height: 1.5;
1121 - padding-bottom: calc(0.5em - 1px);
1122 - padding-left: calc(0.75em - 1px);
1123 - padding-right: calc(0.75em - 1px);
1124 - padding-top: calc(0.5em - 1px);
1125 - position: relative;
1126 - vertical-align: top;
1224 + -moz-appearance: none;
1225 + -webkit-appearance: none;
1226 + align-items: center;
1227 + border: 1px solid transparent;
1228 + border-radius: 0.375em;
1229 + box-shadow: none;
1230 + display: inline-flex;
1231 + font-size: 1rem;
1232 + height: 2.5em;
1233 + justify-content: flex-start;
1234 + line-height: 1.5;
1235 + padding-bottom: calc(0.5em - 1px);
1236 + padding-left: calc(0.75em - 1px);
1237 + padding-right: calc(0.75em - 1px);
1238 + padding-top: calc(0.5em - 1px);
1239 + position: relative;
1240 + vertical-align: top;
1127 1241 }
1128 1242
1129 1243 .better-payment .button.fix-common {
1130 - -moz-appearance: none;
1131 - -webkit-appearance: none;
1132 - align-items: center;
1133 - border: 1px solid transparent;
1134 - border-radius: 0.375em;
1135 - box-shadow: none;
1136 - display: inline-flex;
1137 - font-size: unset;
1138 - height: 2.5em;
1139 - justify-content: flex-start;
1140 - line-height: 1.5;
1141 - padding-bottom: calc(0.5em - 1px);
1142 - padding-left: calc(0.75em - 1px);
1143 - padding-right: calc(0.75em - 1px);
1144 - padding-top: calc(0.5em - 1px);
1145 - position: relative;
1146 - vertical-align: top;
1244 + -moz-appearance: none;
1245 + -webkit-appearance: none;
1246 + align-items: center;
1247 + border: 1px solid transparent;
1248 + border-radius: 0.375em;
1249 + box-shadow: none;
1250 + display: inline-flex;
1251 + font-size: unset;
1252 + height: 2.5em;
1253 + justify-content: flex-start;
1254 + line-height: 1.5;
1255 + padding-bottom: calc(0.5em - 1px);
1256 + padding-left: calc(0.75em - 1px);
1257 + padding-right: calc(0.75em - 1px);
1258 + padding-top: calc(0.5em - 1px);
1259 + position: relative;
1260 + vertical-align: top;
1147 1261 }
1148 1262
1149 -.better-payment .button:active,
1150 -.better-payment .button:focus,
1151 -.better-payment .is-active.button,
1263 +.better-payment .button:active,
1264 +.better-payment .button:focus,
1265 +.better-payment .is-active.button,
1152 1266 .better-payment .is-focused.button {
1153 - outline: 0;
1267 + outline: 0;
1154 1268 }
1155 1269
1156 1270 .better-payment .buttons .button {
1157 - margin-bottom: 0.5rem;
1271 + margin-bottom: 0.5rem;
1158 1272 }
1159 1273
1160 1274 .better-payment .button.is-fullwidth {
1161 - display: flex;
1162 - width: 100%;
1275 + display: flex;
1276 + width: 100%;
1163 1277 }
1164 1278
1165 1279 .better-payment .button.is-medium {
1166 - font-size: 1.25rem;
1280 + font-size: 1.25rem;
1167 1281 }
1168 1282
1169 1283 .better-payment .button {
1170 - background-color: #fff;
1171 - border-color: #dbdbdb;
1172 - border-width: 1px;
1173 - color: #363636;
1174 - cursor: pointer;
1175 - justify-content: center;
1176 - padding-bottom: calc(0.5em - 1px);
1177 - padding-left: 1em;
1178 - padding-right: 1em;
1179 - padding-top: calc(0.5em - 1px);
1180 - text-align: center;
1181 - white-space: nowrap;
1284 + background-color: #fff;
1285 + border-color: #dbdbdb;
1286 + border-width: 1px;
1287 + color: #363636;
1288 + cursor: pointer;
1289 + justify-content: center;
1290 + padding-bottom: calc(0.5em - 1px);
1291 + padding-left: 1em;
1292 + padding-right: 1em;
1293 + padding-top: calc(0.5em - 1px);
1294 + text-align: center;
1295 + white-space: nowrap;
1182 1296 }
1183 1297
1184 -.better-payment .button.is-hovered,
1298 +.better-payment .button.is-hovered,
1185 1299 .better-payment .button:hover {
1186 - border-color: #b5b5b5;
1187 - color: #363636;
1300 + border-color: #b5b5b5;
1301 + color: #363636;
1188 1302 }
1189 1303
1190 1304 .better-payment .is-hidden {
1191 - display: none!important;
1305 + display: none !important;
1192 1306 }
1193 1307
1194 1308 .better-payment .control .bp-currency-symbol {
1195 - color: #b0b7d6;
1196 - font-size: 1.5rem;
1309 + color: #b0b7d6;
1310 + font-size: 1.5rem;
1197 1311 }
1198 1312
1199 -/* Tablet */
1200 -@media screen and (min-width: 769px){
1201 - .better-payment .columns:not(.is-desktop) {
1202 - display: flex;
1203 - }
1313 +.better-payment .is-full-width,
1314 +.better-payment.is-full-width {
1315 + width: 100%;
1316 +}
1204 1317
1205 - .better-payment .column.is-three-quarters,
1206 - .better-payment .column.is-three-quarters-tablet {
1207 - flex: none;
1208 - width: 75%;
1209 - }
1318 +.better-payment .is-medium.bp-custom-payment-amount-el-integration {
1319 + font-size: unset;
1320 + border-color: unset;
1321 + border-radius: 3px;
1322 +}
1210 1323
1211 - .better-payment .column.is-two-thirds,
1212 - .better-payment .column.is-two-thirds-tablet {
1213 - flex: none;
1214 - width: 66.6666%;
1215 - }
1216 - .better-payment .tile:not(.is-child) {
1217 - display: flex;
1218 - }
1219 - .better-payment .tile.is-8 {
1220 - flex: none;
1221 - width: 66.66667%;
1222 - }
1223 - .better-payment .column.is-1,
1224 - .better-payment .column.is-1-tablet {
1225 - flex: none;
1226 - width: 8.33333%;
1227 - }
1228 - .better-payment .column.is-2,
1229 - .better-payment .column.is-2-tablet {
1230 - flex: none;
1231 - width: 16.66667%;
1232 - }
1233 - .better-payment .column.is-3,
1234 - .better-payment .column.is-3-tablet {
1235 - flex: none;
1236 - width: 25%;
1237 - }
1238 - .better-payment .column.is-4,
1239 - .better-payment .column.is-4-tablet {
1240 - flex: none;
1241 - width: 33.33333%;
1242 - }
1243 - .better-payment .column.is-5,
1244 - .better-payment .column.is-5-tablet {
1245 - flex: none;
1246 - width: 41.66667%;
1247 - }
1248 - .better-payment .column.is-6,
1249 - .better-payment .column.is-6-tablet {
1250 - flex: none;
1251 - width: 50%;
1252 - }
1253 - .better-payment .column.is-7,
1254 - .better-payment .column.is-7-tablet {
1255 - flex: none;
1256 - width: 58.33333%;
1257 - }
1258 - .better-payment .column.is-8,
1259 - .better-payment .column.is-8-tablet {
1260 - flex: none;
1261 - width: 66.66667%;
1262 - }
1263 - .better-payment .column.is-9,
1264 - .better-payment .column.is-9-tablet {
1265 - flex: none;
1266 - width: 75%;
1267 - }
1268 - .better-payment .column.is-10,
1269 - .better-payment .column.is-10-tablet {
1270 - flex: none;
1271 - width: 83.33333%;
1272 - }
1273 - .better-payment .column.is-11,
1274 - .better-payment .column.is-11-tablet {
1275 - flex: none;
1276 - width: 91.66667%;
1277 - }
1278 - .better-payment .column.is-12,
1279 - .better-payment .column.is-12-tablet {
1280 - flex: none;
1281 - width: 100%;
1282 - }
1283 - .better-payment .column.is-full,
1284 - .better-payment .column.is-full-tablet {
1285 - flex: none;
1286 - width: 100%;
1287 - }
1288 - .better-payment .column.is-four-fifths,
1289 - .better-payment .column.is-four-fifths-tablet {
1290 - flex: none;
1291 - width: 80%;
1292 - }
1293 - .better-payment .column.is-three-quarters,
1294 - .better-payment .column.is-three-quarters-tablet {
1295 - flex: none;
1296 - width: 75%;
1297 - }
1298 - .better-payment .column.is-two-thirds,
1299 - .better-payment .column.is-two-thirds-tablet {
1300 - flex: none;
1301 - width: 66.6666%;
1302 - }
1303 - .better-payment .column.is-three-fifths,
1304 - .better-payment .column.is-three-fifths-tablet {
1305 - flex: none;
1306 - width: 60%;
1307 - }
1308 - .better-payment .column.is-half,
1309 - .better-payment .column.is-half-tablet {
1310 - flex: none;
1311 - width: 50%;
1312 - }
1313 - .better-payment .column.is-two-fifths,
1314 - .better-payment .column.is-two-fifths-tablet {
1315 - flex: none;
1316 - width: 40%;
1317 - }
1318 - .better-payment .column.is-one-third,
1319 - .better-payment .column.is-one-third-tablet {
1320 - flex: none;
1321 - width: 33.3333%;
1322 - }
1323 - .better-payment .column.is-one-quarter,
1324 - .better-payment .column.is-one-quarter-tablet {
1325 - flex: none;
1326 - width: 25%;
1327 - }
1328 - .better-payment .column.is-one-fifth,
1329 - .better-payment .column.is-one-fifth-tablet {
1330 - flex: none;
1331 - width: 20%;
1332 - }
1333 - .better-payment .tile.is-vertical {
1334 - flex-direction: column;
1335 - }
1336 - .better-payment .tile.is-parent {
1337 - padding: 0.75rem;
1338 - }
1339 - .better-payment .column.is-offset-1,
1340 - .better-payment .column.is-offset-1-tablet {
1341 - margin-left: 8.33333%;
1342 - }
1343 - .better-payment .column.is-offset-2,
1344 - .better-payment .column.is-offset-2-tablet {
1345 - margin-left: 16.66667%;
1346 - }
1347 - .better-payment .column.is-offset-3,
1348 - .better-payment .column.is-offset-3-tablet {
1349 - margin-left: 25%;
1350 - }
1351 - .better-payment .column.is-offset-4,
1352 - .better-payment .column.is-offset-4-tablet {
1353 - margin-left: 33.33333%;
1354 - }
1355 - .better-payment .column.is-offset-5,
1356 - .better-payment .column.is-offset-5-tablet {
1357 - margin-left: 41.66667%;
1358 - }
1359 - .better-payment .column.is-offset-6,
1360 - .better-payment .column.is-offset-6-tablet {
1361 - margin-left: 50%;
1362 - }
1363 - .better-payment .column.is-offset-7,
1364 - .better-payment .column.is-offset-7-tablet {
1365 - margin-left: 58.33333%;
1366 - }
1367 - .better-payment .column.is-offset-8,
1368 - .better-payment .column.is-offset-8-tablet {
1369 - margin-left: 66.66667%;
1370 - }
1371 - .better-payment .column.is-offset-9,
1372 - .better-payment .column.is-offset-9-tablet {
1373 - margin-left: 75%;
1374 - }
1375 - .better-payment .column.is-offset-10,
1376 - .better-payment .column.is-offset-10-tablet {
1377 - margin-left: 83.33333%;
1378 - }
1379 - .better-payment .column.is-offset-11,
1380 - .better-payment .column.is-offset-11-tablet {
1381 - margin-left: 91.66667%;
1382 - }
1383 - .better-payment .column.is-offset-12,
1384 - .better-payment .column.is-offset-12-tablet {
1385 - margin-left: 100%;
1386 - }
1387 - .better-payment .tile.is-offset-2,
1388 - .better-payment .tile.is-offset-2-tablet {
1389 - margin-left: 16.66667%;
1390 - }
1391 - .better-payment .bp-modal .modal-card,
1392 - .better-payment .bp-modal .modal-content {
1393 - width: 740px;
1394 - }
1324 +.better-payment .control.has-icons-left .is-medium.bp-custom-payment-amount-el-integration ~ .icon {
1325 + font-size: unset;
1395 1326 }
1396 1327
1328 +.better-payment .is-medium.bp-custom-payment-amount-el-integration:focus {
1329 + box-shadow: unset;
1330 +}
1331 +
1332 +/* Mobile */
1333 +@media screen and (max-width: 768px) {
1334 + .better-payment .payment-form-layout-3 .payment-method-checkbox img {
1335 + margin-left: -35px;
1336 + }
1337 + .better-payment .payment-form-layout-1 .bp-three-items-enabled-wrap.field-payment_method .bp-radio-box,
1338 + .better-payment .payment-form-layout-2 .bp-three-items-enabled-wrap.field-payment_method .bp-radio-box {
1339 + display: unset;
1340 + }
1341 + .better-payment .payment-form-layout .button,
1342 + .better-payment .form-content-section input,
1343 + .better-payment .is-medium.input,
1344 + .better-payment .is-medium.textarea,
1345 + .better-payment .control.has-icons-left .input.is-medium ~ .icon,
1346 + .better-payment .control.has-icons-left .select.is-medium ~ .icon,
1347 + .better-payment .control.has-icons-right .input.is-medium ~ .icon,
1348 + .better-payment .control.has-icons-right .select.is-medium ~ .icon {
1349 + font-size: 16px;
1350 + }
1351 +}
1352 +/* Tablet */
1353 +@media screen and (min-width: 769px) {
1354 + .better-payment .columns:not(.is-desktop) {
1355 + display: flex;
1356 + }
1357 + .better-payment .column.is-three-quarters,
1358 + .better-payment .column.is-three-quarters-tablet {
1359 + flex: none;
1360 + width: 75%;
1361 + }
1362 + .better-payment .column.is-two-thirds,
1363 + .better-payment .column.is-two-thirds-tablet {
1364 + flex: none;
1365 + width: 66.6666%;
1366 + }
1367 + .better-payment .tile:not(.is-child) {
1368 + display: flex;
1369 + }
1370 + .better-payment .tile.is-8 {
1371 + flex: none;
1372 + width: 66.66667%;
1373 + }
1374 + .better-payment .column.is-1,
1375 + .better-payment .column.is-1-tablet {
1376 + flex: none;
1377 + width: 8.33333%;
1378 + }
1379 + .better-payment .column.is-2,
1380 + .better-payment .column.is-2-tablet {
1381 + flex: none;
1382 + width: 16.66667%;
1383 + }
1384 + .better-payment .column.is-3,
1385 + .better-payment .column.is-3-tablet {
1386 + flex: none;
1387 + width: 25%;
1388 + }
1389 + .better-payment .column.is-4,
1390 + .better-payment .column.is-4-tablet {
1391 + flex: none;
1392 + width: 33.33333%;
1393 + }
1394 + .better-payment .column.is-5,
1395 + .better-payment .column.is-5-tablet {
1396 + flex: none;
1397 + width: 41.66667%;
1398 + }
1399 + .better-payment .column.is-6,
1400 + .better-payment .column.is-6-tablet {
1401 + flex: none;
1402 + width: 50%;
1403 + }
1404 + .better-payment .column.is-7,
1405 + .better-payment .column.is-7-tablet {
1406 + flex: none;
1407 + width: 58.33333%;
1408 + }
1409 + .better-payment .column.is-8,
1410 + .better-payment .column.is-8-tablet {
1411 + flex: none;
1412 + width: 66.66667%;
1413 + }
1414 + .better-payment .column.is-9,
1415 + .better-payment .column.is-9-tablet {
1416 + flex: none;
1417 + width: 75%;
1418 + }
1419 + .better-payment .column.is-10,
1420 + .better-payment .column.is-10-tablet {
1421 + flex: none;
1422 + width: 83.33333%;
1423 + }
1424 + .better-payment .column.is-11,
1425 + .better-payment .column.is-11-tablet {
1426 + flex: none;
1427 + width: 91.66667%;
1428 + }
1429 + .better-payment .column.is-12,
1430 + .better-payment .column.is-12-tablet {
1431 + flex: none;
1432 + width: 100%;
1433 + }
1434 + .better-payment .column.is-full,
1435 + .better-payment .column.is-full-tablet {
1436 + flex: none;
1437 + width: 100%;
1438 + }
1439 + .better-payment .column.is-four-fifths,
1440 + .better-payment .column.is-four-fifths-tablet {
1441 + flex: none;
1442 + width: 80%;
1443 + }
1444 + .better-payment .column.is-three-quarters,
1445 + .better-payment .column.is-three-quarters-tablet {
1446 + flex: none;
1447 + width: 75%;
1448 + }
1449 + .better-payment .column.is-two-thirds,
1450 + .better-payment .column.is-two-thirds-tablet {
1451 + flex: none;
1452 + width: 66.6666%;
1453 + }
1454 + .better-payment .column.is-three-fifths,
1455 + .better-payment .column.is-three-fifths-tablet {
1456 + flex: none;
1457 + width: 60%;
1458 + }
1459 + .better-payment .column.is-half,
1460 + .better-payment .column.is-half-tablet {
1461 + flex: none;
1462 + width: 50%;
1463 + }
1464 + .better-payment .column.is-two-fifths,
1465 + .better-payment .column.is-two-fifths-tablet {
1466 + flex: none;
1467 + width: 40%;
1468 + }
1469 + .better-payment .column.is-one-third,
1470 + .better-payment .column.is-one-third-tablet {
1471 + flex: none;
1472 + width: 33.3333%;
1473 + }
1474 + .better-payment .column.is-one-quarter,
1475 + .better-payment .column.is-one-quarter-tablet {
1476 + flex: none;
1477 + width: 25%;
1478 + }
1479 + .better-payment .column.is-one-fifth,
1480 + .better-payment .column.is-one-fifth-tablet {
1481 + flex: none;
1482 + width: 20%;
1483 + }
1484 + .better-payment .tile.is-vertical {
1485 + flex-direction: column;
1486 + }
1487 + .better-payment .tile.is-parent {
1488 + padding: 0.75rem;
1489 + }
1490 + .better-payment .column.is-offset-1,
1491 + .better-payment .column.is-offset-1-tablet {
1492 + margin-left: 8.33333%;
1493 + }
1494 + .better-payment .column.is-offset-2,
1495 + .better-payment .column.is-offset-2-tablet {
1496 + margin-left: 16.66667%;
1497 + }
1498 + .better-payment .column.is-offset-3,
1499 + .better-payment .column.is-offset-3-tablet {
1500 + margin-left: 25%;
1501 + }
1502 + .better-payment .column.is-offset-4,
1503 + .better-payment .column.is-offset-4-tablet {
1504 + margin-left: 33.33333%;
1505 + }
1506 + .better-payment .column.is-offset-5,
1507 + .better-payment .column.is-offset-5-tablet {
1508 + margin-left: 41.66667%;
1509 + }
1510 + .better-payment .column.is-offset-6,
1511 + .better-payment .column.is-offset-6-tablet {
1512 + margin-left: 50%;
1513 + }
1514 + .better-payment .column.is-offset-7,
1515 + .better-payment .column.is-offset-7-tablet {
1516 + margin-left: 58.33333%;
1517 + }
1518 + .better-payment .column.is-offset-8,
1519 + .better-payment .column.is-offset-8-tablet {
1520 + margin-left: 66.66667%;
1521 + }
1522 + .better-payment .column.is-offset-9,
1523 + .better-payment .column.is-offset-9-tablet {
1524 + margin-left: 75%;
1525 + }
1526 + .better-payment .column.is-offset-10,
1527 + .better-payment .column.is-offset-10-tablet {
1528 + margin-left: 83.33333%;
1529 + }
1530 + .better-payment .column.is-offset-11,
1531 + .better-payment .column.is-offset-11-tablet {
1532 + margin-left: 91.66667%;
1533 + }
1534 + .better-payment .column.is-offset-12,
1535 + .better-payment .column.is-offset-12-tablet {
1536 + margin-left: 100%;
1537 + }
1538 + .better-payment .tile.is-offset-2,
1539 + .better-payment .tile.is-offset-2-tablet {
1540 + margin-left: 16.66667%;
1541 + }
1542 + .better-payment .bp-modal .modal-card,
1543 + .better-payment .bp-modal .modal-content {
1544 + width: 740px;
1545 + }
1546 +}
1397 1547 /* Desktop */
1398 -@media screen and (min-width: 992px){
1399 - .better-payment .columns:not(.is-desktop) {
1400 - display: flex;
1401 - }
1402 - .better-payment .column.is-1-desktop {
1403 - flex: none;
1404 - width: 8.33333%;
1405 - }
1406 - .better-payment .column.is-2-desktop {
1407 - flex: none;
1408 - width: 16.66667%;
1409 - }
1410 - .better-payment .column.is-3-desktop {
1411 - flex: none;
1412 - width: 25%;
1413 - }
1414 - .better-payment .column.is-4-desktop {
1415 - flex: none;
1416 - width: 33.33333%;
1417 - }
1418 - .better-payment .column.is-5-desktop {
1419 - flex: none;
1420 - width: 41.66667%;
1421 - }
1422 - .better-payment .column.is-6-desktop {
1423 - flex: none;
1424 - width: 50%;
1425 - }
1426 - .better-payment .column.is-7-desktop {
1427 - flex: none;
1428 - width: 58.33333%;
1429 - }
1430 - .better-payment .column.is-8-desktop {
1431 - flex: none;
1432 - width: 66.66667%;
1433 - }
1434 - .better-payment .column.is-9-desktop {
1435 - flex: none;
1436 - width: 75%;
1437 - }
1438 - .better-payment .column.is-10-desktop {
1439 - flex: none;
1440 - width: 83.33333%;
1441 - }
1442 - .better-payment .column.is-11-desktop {
1443 - flex: none;
1444 - width: 91.66667%;
1445 - }
1446 - .better-payment .column.is-12-desktop {
1447 - flex: none;
1448 - width: 100%;
1449 - }
1450 -
1451 - .better-payment .bp-modal .modal-card,
1452 - .better-payment .bp-modal .modal-content {
1453 - width: 950px !important;
1454 - }
1455 -
1456 - .better-payment .bp-modal .is-small .modal-card,
1457 - .better-payment .bp-modal .is-small .modal-content {
1458 - width: 550px;
1459 - }
1548 +@media screen and (min-width: 992px) {
1549 + .better-payment .columns:not(.is-desktop) {
1550 + display: flex;
1551 + }
1552 + .better-payment .column.is-1-desktop {
1553 + flex: none;
1554 + width: 8.33333%;
1555 + }
1556 + .better-payment .column.is-2-desktop {
1557 + flex: none;
1558 + width: 16.66667%;
1559 + }
1560 + .better-payment .column.is-3-desktop {
1561 + flex: none;
1562 + width: 25%;
1563 + }
1564 + .better-payment .column.is-4-desktop {
1565 + flex: none;
1566 + width: 33.33333%;
1567 + }
1568 + .better-payment .column.is-5-desktop {
1569 + flex: none;
1570 + width: 41.66667%;
1571 + }
1572 + .better-payment .column.is-6-desktop {
1573 + flex: none;
1574 + width: 50%;
1575 + }
1576 + .better-payment .column.is-7-desktop {
1577 + flex: none;
1578 + width: 58.33333%;
1579 + }
1580 + .better-payment .column.is-8-desktop {
1581 + flex: none;
1582 + width: 66.66667%;
1583 + }
1584 + .better-payment .column.is-9-desktop {
1585 + flex: none;
1586 + width: 75%;
1587 + }
1588 + .better-payment .column.is-10-desktop {
1589 + flex: none;
1590 + width: 83.33333%;
1591 + }
1592 + .better-payment .column.is-11-desktop {
1593 + flex: none;
1594 + width: 91.66667%;
1595 + }
1596 + .better-payment .column.is-12-desktop {
1597 + flex: none;
1598 + width: 100%;
1599 + }
1600 + .better-payment .bp-modal .modal-card,
1601 + .better-payment .bp-modal .modal-content {
1602 + width: 950px !important;
1603 + }
1604 + .better-payment .bp-modal .is-small .modal-card,
1605 + .better-payment .bp-modal .is-small .modal-content {
1606 + width: 550px;
1607 + }
1460 1608 }
1461 -
1462 1609 /* Large Desktop : widescreen */
1463 -@media screen and (min-width: 1200px){
1464 - .better-payment .column.is-1-widescreen {
1465 - flex: none;
1466 - width: 8.33333%;
1467 - }
1468 - .better-payment .column.is-2-widescreen {
1469 - flex: none;
1470 - width: 16.66667%;
1471 - }
1472 - .better-payment .column.is-3-widescreen {
1473 - flex: none;
1474 - width: 25%;
1475 - }
1476 - .better-payment .column.is-4-widescreen {
1477 - flex: none;
1478 - width: 33.33333%;
1479 - }
1480 - .better-payment .column.is-5-widescreen {
1481 - flex: none;
1482 - width: 41.66667%;
1483 - }
1484 - .better-payment .column.is-6-widescreen {
1485 - flex: none;
1486 - width: 50%;
1487 - }
1488 - .better-payment .column.is-7-widescreen {
1489 - flex: none;
1490 - width: 58.33333%;
1491 - }
1492 - .better-payment .column.is-8-widescreen {
1493 - flex: none;
1494 - width: 66.66667%;
1495 - }
1496 - .better-payment .column.is-9-widescreen {
1497 - flex: none;
1498 - width: 75%;
1499 - }
1500 - .better-payment .column.is-10-widescreen {
1501 - flex: none;
1502 - width: 83.33333%;
1503 - }
1504 - .better-payment .column.is-11-widescreen {
1505 - flex: none;
1506 - width: 91.66667%;
1507 - }
1508 - .better-payment .column.is-12-widescreen {
1509 - flex: none;
1510 - width: 100%;
1511 - }
1610 +@media screen and (min-width: 1200px) {
1611 + .better-payment .column.is-1-widescreen {
1612 + flex: none;
1613 + width: 8.33333%;
1614 + }
1615 + .better-payment .column.is-2-widescreen {
1616 + flex: none;
1617 + width: 16.66667%;
1618 + }
1619 + .better-payment .column.is-3-widescreen {
1620 + flex: none;
1621 + width: 25%;
1622 + }
1623 + .better-payment .column.is-4-widescreen {
1624 + flex: none;
1625 + width: 33.33333%;
1626 + }
1627 + .better-payment .column.is-5-widescreen {
1628 + flex: none;
1629 + width: 41.66667%;
1630 + }
1631 + .better-payment .column.is-6-widescreen {
1632 + flex: none;
1633 + width: 50%;
1634 + }
1635 + .better-payment .column.is-7-widescreen {
1636 + flex: none;
1637 + width: 58.33333%;
1638 + }
1639 + .better-payment .column.is-8-widescreen {
1640 + flex: none;
1641 + width: 66.66667%;
1642 + }
1643 + .better-payment .column.is-9-widescreen {
1644 + flex: none;
1645 + width: 75%;
1646 + }
1647 + .better-payment .column.is-10-widescreen {
1648 + flex: none;
1649 + width: 83.33333%;
1650 + }
1651 + .better-payment .column.is-11-widescreen {
1652 + flex: none;
1653 + width: 91.66667%;
1654 + }
1655 + .better-payment .column.is-12-widescreen {
1656 + flex: none;
1657 + width: 100%;
1658 + }
1512 1659 }
1513 -
1514 1660 /* Larger Desktop : fullhd */
1515 -@media screen and (min-width: 1400px){
1516 - .better-payment .column.is-1-fullhd {
1517 - flex: none;
1518 - width: 8.33333%;
1519 - }
1520 - .better-payment .column.is-2-fullhd {
1521 - flex: none;
1522 - width: 16.66667%;
1523 - }
1524 - .better-payment .column.is-3-fullhd {
1525 - flex: none;
1526 - width: 25%;
1527 - }
1528 - .better-payment .column.is-4-fullhd {
1529 - flex: none;
1530 - width: 33.33333%;
1531 - }
1532 - .better-payment .column.is-5-fullhd {
1533 - flex: none;
1534 - width: 41.66667%;
1535 - }
1536 - .better-payment .column.is-6-fullhd {
1537 - flex: none;
1538 - width: 50%;
1539 - }
1540 - .better-payment .column.is-7-fullhd {
1541 - flex: none;
1542 - width: 58.33333%;
1543 - }
1544 - .better-payment .column.is-8-fullhd {
1545 - flex: none;
1546 - width: 66.66667%;
1547 - }
1548 - .better-payment .column.is-9-fullhd {
1549 - flex: none;
1550 - width: 75%;
1551 - }
1552 - .better-payment .column.is-10-fullhd {
1553 - flex: none;
1554 - width: 83.33333%;
1555 - }
1556 - .better-payment .column.is-11-fullhd {
1557 - flex: none;
1558 - width: 91.66667%;
1559 - }
1560 - .better-payment .column.is-12-fullhd {
1561 - flex: none;
1562 - width: 100%;
1563 - }
1661 +@media screen and (min-width: 1400px) {
1662 + .better-payment .column.is-1-fullhd {
1663 + flex: none;
1664 + width: 8.33333%;
1665 + }
1666 + .better-payment .column.is-2-fullhd {
1667 + flex: none;
1668 + width: 16.66667%;
1669 + }
1670 + .better-payment .column.is-3-fullhd {
1671 + flex: none;
1672 + width: 25%;
1673 + }
1674 + .better-payment .column.is-4-fullhd {
1675 + flex: none;
1676 + width: 33.33333%;
1677 + }
1678 + .better-payment .column.is-5-fullhd {
1679 + flex: none;
1680 + width: 41.66667%;
1681 + }
1682 + .better-payment .column.is-6-fullhd {
1683 + flex: none;
1684 + width: 50%;
1685 + }
1686 + .better-payment .column.is-7-fullhd {
1687 + flex: none;
1688 + width: 58.33333%;
1689 + }
1690 + .better-payment .column.is-8-fullhd {
1691 + flex: none;
1692 + width: 66.66667%;
1693 + }
1694 + .better-payment .column.is-9-fullhd {
1695 + flex: none;
1696 + width: 75%;
1697 + }
1698 + .better-payment .column.is-10-fullhd {
1699 + flex: none;
1700 + width: 83.33333%;
1701 + }
1702 + .better-payment .column.is-11-fullhd {
1703 + flex: none;
1704 + width: 91.66667%;
1705 + }
1706 + .better-payment .column.is-12-fullhd {
1707 + flex: none;
1708 + width: 100%;
1709 + }
1564 1710 }
1565 -
1566 1711 /* Larger Desktop Custom : fullhd-custom */
1567 -@media screen and (min-width: 1500px){
1568 - .better-payment .column.is-1-fullhd-custom {
1569 - flex: none;
1570 - width: 8.33333%;
1571 - }
1572 - .better-payment .column.is-2-fullhd-custom {
1573 - flex: none;
1574 - width: 16.66667%;
1575 - }
1576 - .better-payment .column.is-3-fullhd-custom {
1577 - flex: none;
1578 - width: 25%;
1579 - }
1580 - .better-payment .column.is-4-fullhd-custom {
1581 - flex: none;
1582 - width: 33.33333%;
1583 - }
1584 - .better-payment .column.is-5-fullhd-custom {
1585 - flex: none;
1586 - width: 41.66667%;
1587 - }
1588 - .better-payment .column.is-6-fullhd-custom {
1589 - flex: none;
1590 - width: 50%;
1591 - }
1592 - .better-payment .column.is-7-fullhd-custom {
1593 - flex: none;
1594 - width: 58.33333%;
1595 - }
1596 - .better-payment .column.is-8-fullhd-custom {
1597 - flex: none;
1598 - width: 66.66667%;
1599 - }
1600 - .better-payment .column.is-9-fullhd-custom {
1601 - flex: none;
1602 - width: 75%;
1603 - }
1604 - .better-payment .column.is-10-fullhd-custom {
1605 - flex: none;
1606 - width: 83.33333%;
1607 - }
1608 - .better-payment .column.is-11-fullhd-custom {
1609 - flex: none;
1610 - width: 91.66667%;
1611 - }
1612 - .better-payment .column.is-12-fullhd-custom {
1613 - flex: none;
1614 - width: 100%;
1615 - }
1712 +@media screen and (min-width: 1500px) {
1713 + .better-payment .column.is-1-fullhd-custom {
1714 + flex: none;
1715 + width: 8.33333%;
1716 + }
1717 + .better-payment .column.is-2-fullhd-custom {
1718 + flex: none;
1719 + width: 16.66667%;
1720 + }
1721 + .better-payment .column.is-3-fullhd-custom {
1722 + flex: none;
1723 + width: 25%;
1724 + }
1725 + .better-payment .column.is-4-fullhd-custom {
1726 + flex: none;
1727 + width: 33.33333%;
1728 + }
1729 + .better-payment .column.is-5-fullhd-custom {
1730 + flex: none;
1731 + width: 41.66667%;
1732 + }
1733 + .better-payment .column.is-6-fullhd-custom {
1734 + flex: none;
1735 + width: 50%;
1736 + }
1737 + .better-payment .column.is-7-fullhd-custom {
1738 + flex: none;
1739 + width: 58.33333%;
1740 + }
1741 + .better-payment .column.is-8-fullhd-custom {
1742 + flex: none;
1743 + width: 66.66667%;
1744 + }
1745 + .better-payment .column.is-9-fullhd-custom {
1746 + flex: none;
1747 + width: 75%;
1748 + }
1749 + .better-payment .column.is-10-fullhd-custom {
1750 + flex: none;
1751 + width: 83.33333%;
1752 + }
1753 + .better-payment .column.is-11-fullhd-custom {
1754 + flex: none;
1755 + width: 91.66667%;
1756 + }
1757 + .better-payment .column.is-12-fullhd-custom {
1758 + flex: none;
1759 + width: 100%;
1760 + }
1616 1761 }
1617 -
1618 -
1619 1762 /* BP Modal : Starts */
1620 -.better-payment .bp-modal .modal,
1763 +.better-payment .bp-modal .modal,
1621 1764 .better-payment .bp-modal .modal-background {
1622 - bottom: 0;
1623 - left: 0;
1624 - position: absolute;
1625 - right: 0;
1626 - top: 0;
1765 + bottom: 0;
1766 + left: 0;
1767 + position: absolute;
1768 + right: 0;
1769 + top: 0;
1627 1770 }
1628 1771
1629 1772 .better-payment .bp-modal .modal {
1630 - align-items: center;
1631 - display: none;
1632 - flex-direction: column;
1633 - justify-content: center;
1634 - overflow: hidden;
1635 - position: fixed;
1636 - z-index: 40;
1773 + align-items: center;
1774 + display: none;
1775 + flex-direction: column;
1776 + justify-content: center;
1777 + overflow: hidden;
1778 + position: fixed;
1779 + z-index: 40;
1637 1780 }
1638 1781
1639 1782 .better-payment .bp-modal .modal-background {
1640 - background-color: rgba(10,10,10,.86);
1783 + background-color: rgba(10, 10, 10, 0.86);
1641 1784 }
1642 1785
1643 -.better-payment .bp-modal .modal-card,
1786 +.better-payment .bp-modal .modal-card,
1644 1787 .better-payment .bp-modal .modal-content {
1645 - margin: 0 20px;
1646 - max-height: calc(100vh - 160px);
1647 - overflow: auto;
1648 - position: relative;
1649 - width: 100%;
1788 + margin: 0 20px;
1789 + max-height: calc(100vh - 160px);
1790 + overflow: auto;
1791 + position: relative;
1792 + width: 100%;
1650 1793 }
1651 1794
1652 1795 .better-payment .bp-modal .modal-card {
1653 - display: flex;
1654 - flex-direction: column;
1655 - max-height: calc(100vh - 40px);
1656 - overflow: hidden;
1796 + display: flex;
1797 + flex-direction: column;
1798 + max-height: calc(100vh - 40px);
1799 + overflow: hidden;
1657 1800 }
1658 1801
1659 1802 .better-payment .bp-modal .modal-card-head {
1660 - border-bottom: 1px solid #dbdbdb;
1661 - border-top-left-radius: 6px;
1662 - border-top-right-radius: 6px;
1803 + border-bottom: 1px solid #dbdbdb;
1804 + border-top-left-radius: 6px;
1805 + border-top-right-radius: 6px;
1663 1806 }
1664 1807
1665 -.better-payment .bp-modal .modal-card-foot,
1808 +.better-payment .bp-modal .modal-card-foot,
1666 1809 .better-payment .bp-modal .modal-card-head {
1667 - align-items: center;
1668 - background-color: #f5f5f5;
1669 - display: flex;
1670 - flex-shrink: 0;
1671 - justify-content: flex-end;
1672 - padding: 15px 20px;
1673 - position: relative;
1810 + align-items: center;
1811 + background-color: #f5f5f5;
1812 + display: flex;
1813 + flex-shrink: 0;
1814 + justify-content: flex-end;
1815 + padding: 15px 20px;
1816 + position: relative;
1674 1817 }
1675 1818
1676 1819 .better-payment .bp-modal .modal-card-body {
1677 - -webkit-overflow-scrolling: touch;
1678 - background-color: #fff;
1679 - flex-grow: 1;
1680 - flex-shrink: 1;
1681 - overflow: auto;
1682 - padding: 20px;
1820 + -webkit-overflow-scrolling: touch;
1821 + background-color: #fff;
1822 + flex-grow: 1;
1823 + flex-shrink: 1;
1824 + overflow: auto;
1825 + padding: 20px;
1683 1826 }
1684 1827
1685 1828 .better-payment .bp-modal .modal-card-foot {
1686 - border-bottom-left-radius: 6px;
1687 - border-bottom-right-radius: 6px;
1688 - border-top: 1px solid #dbdbdb;
1829 + border-bottom-left-radius: 6px;
1830 + border-bottom-right-radius: 6px;
1831 + border-top: 1px solid #dbdbdb;
1689 1832 }
1690 1833
1691 1834 .better-payment .bp-modal .modal-card-title {
1692 - color: #363636;
1693 - flex-grow: 1;
1694 - flex-shrink: 0;
1695 - font-size: 1.5rem;
1696 - line-height: 1;
1835 + color: #363636;
1836 + flex-grow: 1;
1837 + flex-shrink: 0;
1838 + font-size: 1.5rem;
1839 + line-height: 1;
1697 1840 }
1698 1841
1699 1842 .better-payment .bp-modal .button,
1700 1843 .better-payment .bp-modal .button:focus {
1701 - outline: 0 !important;
1702 - border-color: transparent !important;
1844 + outline: 0 !important;
1845 + border-color: transparent !important;
1703 1846 }
1847 +
1704 1848 .better-payment .bp-modal .modal.is-active {
1705 - display: flex;
1849 + display: flex;
1706 1850 }
1707 1851
1708 1852 .better-payment .bp-modal .is-large.modal-close {
1709 - height: 32px;
1710 - max-height: 32px;
1711 - max-width: 32px;
1712 - min-height: 32px;
1713 - min-width: 32px;
1714 - width: 32px;
1853 + height: 32px;
1854 + max-height: 32px;
1855 + max-width: 32px;
1856 + min-height: 32px;
1857 + min-width: 32px;
1858 + width: 32px;
1715 1859 }
1716 1860
1717 1861 .better-payment .bp-modal .delete,
1718 1862 .better-payment .bp-modal .modal-close {
1719 - -webkit-touch-callout: none;
1720 - -webkit-user-select: none;
1721 - -moz-user-select: none;
1722 - -ms-user-select: none;
1723 - user-select: none;
1724 - -moz-appearance: none;
1725 - -webkit-appearance: none;
1726 - background-color: rgba(10,10,10,.2);
1727 - border: none;
1728 - border-radius: 9999px;
1729 - cursor: pointer;
1730 - pointer-events: auto;
1731 - display: inline-block;
1732 - flex-grow: 0;
1733 - flex-shrink: 0;
1734 - font-size: 0;
1735 - height: 20px;
1736 - max-height: 20px;
1737 - max-width: 20px;
1738 - min-height: 20px;
1739 - min-width: 20px;
1740 - outline: 0;
1741 - position: relative;
1742 - vertical-align: top;
1743 - width: 20px;
1863 + -webkit-touch-callout: none;
1864 + -webkit-user-select: none;
1865 + -moz-user-select: none;
1866 + -ms-user-select: none;
1867 + user-select: none;
1868 + -moz-appearance: none;
1869 + -webkit-appearance: none;
1870 + background-color: rgba(10, 10, 10, 0.2);
1871 + border: none;
1872 + border-radius: 9999px;
1873 + cursor: pointer;
1874 + pointer-events: auto;
1875 + display: inline-block;
1876 + flex-grow: 0;
1877 + flex-shrink: 0;
1878 + font-size: 0;
1879 + height: 20px;
1880 + max-height: 20px;
1881 + max-width: 20px;
1882 + min-height: 20px;
1883 + min-width: 20px;
1884 + outline: 0;
1885 + position: relative;
1886 + vertical-align: top;
1887 + width: 20px;
1744 1888 }
1745 1889
1746 1890 .better-payment .bp-modal .modal-close {
1747 - background: 0 0;
1748 - height: 40px;
1749 - position: fixed;
1750 - right: 20px;
1751 - top: 52px;
1752 - width: 40px;
1891 + background: 0 0;
1892 + height: 40px;
1893 + position: fixed;
1894 + right: 20px;
1895 + top: 52px;
1896 + width: 40px;
1753 1897 }
1754 1898
1755 1899 .better-payment .bp-modal .delete::before,
1756 1900 .better-payment .bp-modal .modal-close::before {
1757 - height: 2px;
1758 - width: 50%;
1901 + height: 2px;
1902 + width: 50%;
1759 1903 }
1760 1904
1761 1905 .better-payment .bp-modal .delete::after,
1762 1906 .better-payment .bp-modal .modal-close::after {
1763 - height: 50%;
1764 - width: 2px;
1907 + height: 50%;
1908 + width: 2px;
1765 1909 }
1766 1910
1767 -.better-payment .bp-modal .delete::after,
1768 -.better-payment .bp-modal .delete::before,
1769 -.better-payment .bp-modal .modal-close::after,
1911 +.better-payment .bp-modal .delete::after,
1912 +.better-payment .bp-modal .delete::before,
1913 +.better-payment .bp-modal .modal-close::after,
1770 1914 .better-payment .bp-modal .modal-close::before {
1771 - background-color: #fff;
1772 - content: "";
1773 - display: block;
1774 - left: 50%;
1775 - position: absolute;
1776 - top: 50%;
1777 - transform: translateX(-50%) translateY(-50%) rotate(45deg);
1778 - transform-origin: center center;
1915 + background-color: #fff;
1916 + content: "";
1917 + display: block;
1918 + left: 50%;
1919 + position: absolute;
1920 + top: 50%;
1921 + transform: translateX(-50%) translateY(-50%) rotate(45deg);
1922 + transform-origin: center center;
1779 1923 }
1780 1924
1781 1925 .better-payment .bp-modal .box {
1782 - background-color: #fff;
1783 - border-radius: 6px;
1784 - box-shadow: 0 0.5em 1em -0.125em rgb(10 10 10 / 10%), 0 0 0 1px rgb(10 10 10 / 2%);
1785 - color: #4a4a4a;
1786 - display: block;
1787 - padding: 1.25rem;
1926 + background-color: #fff;
1927 + border-radius: 6px;
1928 + box-shadow: 0 0.5em 1em -0.125em rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.02);
1929 + color: #4a4a4a;
1930 + display: block;
1931 + padding: 1.25rem;
1788 1932 }
1789 1933
1790 -.better-payment .bp-modal .delete:focus,
1791 -.better-payment .bp-modal .delete:hover,
1792 -.better-payment .bp-modal .modal-close:focus,
1934 +.better-payment .bp-modal .delete:focus,
1935 +.better-payment .bp-modal .delete:hover,
1936 +.better-payment .bp-modal .modal-close:focus,
1793 1937 .better-payment .bp-modal .modal-close:hover {
1794 - background-color: rgba(10,10,10,.3);
1938 + background-color: rgba(10, 10, 10, 0.3);
1795 1939 }
1796 1940
1797 -.better-payment .bp-modal .modal-card,
1941 +.better-payment .bp-modal .modal-card,
1798 1942 .better-payment .bp-modal .modal-content {
1799 - margin: 0 auto;
1800 - max-height: calc(100vh - 40px);
1943 + margin: 0 auto;
1944 + max-height: calc(100vh - 40px);
1801 1945 }
1802 -/* BP Modal : Ends */
1946 +
1947 +/* BP Modal : Ends */
1948 +/* BP Transactions Page */
1949 +.better-payment .file {
1950 + align-items: stretch;
1951 + display: flex;
1952 + justify-content: flex-start;
1953 + position: relative;
1954 +}
1955 +.better-payment .file.is-white .file-cta {
1956 + background-color: #fff;
1957 + border-color: transparent;
1958 + color: #0a0a0a;
1959 +}
1960 +.better-payment .file.is-white.is-hovered .file-cta,
1961 +.better-payment .file.is-white:hover .file-cta {
1962 + background-color: #f9f9f9;
1963 + border-color: transparent;
1964 + color: #0a0a0a;
1965 +}
1966 +.better-payment .file.is-white.is-focused .file-cta,
1967 +.better-payment .file.is-white:focus .file-cta {
1968 + border-color: transparent;
1969 + box-shadow: 0 0 0.5em rgba(255, 255, 255, 0.25);
1970 + color: #0a0a0a;
1971 +}
1972 +.better-payment .file.is-white.is-active .file-cta,
1973 +.better-payment .file.is-white:active .file-cta {
1974 + background-color: #f2f2f2;
1975 + border-color: transparent;
1976 + color: #0a0a0a;
1977 +}
1978 +.better-payment .file.is-black .file-cta {
1979 + background-color: #0a0a0a;
1980 + border-color: transparent;
1981 + color: #fff;
1982 +}
1983 +.better-payment .file.is-black.is-hovered .file-cta,
1984 +.better-payment .file.is-black:hover .file-cta {
1985 + background-color: #040404;
1986 + border-color: transparent;
1987 + color: #fff;
1988 +}
1989 +.better-payment .file.is-black.is-focused .file-cta,
1990 +.better-payment .file.is-black:focus .file-cta {
1991 + border-color: transparent;
1992 + box-shadow: 0 0 0.5em rgba(10, 10, 10, 0.25);
1993 + color: #fff;
1994 +}
1995 +.better-payment .file.is-black.is-active .file-cta,
1996 +.better-payment .file.is-black:active .file-cta {
1997 + background-color: #000;
1998 + border-color: transparent;
1999 + color: #fff;
2000 +}
2001 +.better-payment .file.is-light .file-cta {
2002 + background-color: #f4f4f4;
2003 + border-color: transparent;
2004 + color: rgba(0, 0, 0, 0.7);
2005 +}
2006 +.better-payment .file.is-light.is-hovered .file-cta,
2007 +.better-payment .file.is-light:hover .file-cta {
2008 + background-color: #eee;
2009 + border-color: transparent;
2010 + color: rgba(0, 0, 0, 0.7);
2011 +}
2012 +.better-payment .file.is-light.is-focused .file-cta,
2013 +.better-payment .file.is-light:focus .file-cta {
2014 + border-color: transparent;
2015 + box-shadow: 0 0 0.5em rgba(245, 245, 245, 0.25);
2016 + color: rgba(0, 0, 0, 0.7);
2017 +}
2018 +.better-payment .file.is-light.is-active .file-cta,
2019 +.better-payment .file.is-light:active .file-cta {
2020 + background-color: #e8e8e8;
2021 + border-color: transparent;
2022 + color: rgba(0, 0, 0, 0.7);
2023 +}
2024 +.better-payment .file.is-dark .file-cta {
2025 + background-color: #353535;
2026 + border-color: transparent;
2027 + color: #fff;
2028 +}
2029 +.better-payment .file.is-dark.is-hovered .file-cta,
2030 +.better-payment .file.is-dark:hover .file-cta {
2031 + background-color: #2f2f2f;
2032 + border-color: transparent;
2033 + color: #fff;
2034 +}
2035 +.better-payment .file.is-dark.is-focused .file-cta,
2036 +.better-payment .file.is-dark:focus .file-cta {
2037 + border-color: transparent;
2038 + box-shadow: 0 0 0.5em rgba(54, 54, 54, 0.25);
2039 + color: #fff;
2040 +}
2041 +.better-payment .file.is-dark.is-active .file-cta,
2042 +.better-payment .file.is-dark:active .file-cta {
2043 + background-color: #292929;
2044 + border-color: transparent;
2045 + color: #fff;
2046 +}
2047 +.better-payment .file.is-primary .file-cta {
2048 + background-color: #00d1b1;
2049 + border-color: transparent;
2050 + color: #fff;
2051 +}
2052 +.better-payment .file.is-primary.is-hovered .file-cta,
2053 +.better-payment .file.is-primary:hover .file-cta {
2054 + background-color: #00c4a7;
2055 + border-color: transparent;
2056 + color: #fff;
2057 +}
2058 +.better-payment .file.is-primary.is-focused .file-cta,
2059 +.better-payment .file.is-primary:focus .file-cta {
2060 + border-color: transparent;
2061 + box-shadow: 0 0 0.5em rgba(0, 209, 178, 0.25);
2062 + color: #fff;
2063 +}
2064 +.better-payment .file.is-primary.is-active .file-cta,
2065 +.better-payment .file.is-primary:active .file-cta {
2066 + background-color: #00b89c;
2067 + border-color: transparent;
2068 + color: #fff;
2069 +}
2070 +.better-payment .file.is-link .file-cta {
2071 + background-color: #475ec6;
2072 + border-color: transparent;
2073 + color: #fff;
2074 +}
2075 +.better-payment .file.is-link.is-hovered .file-cta,
2076 +.better-payment .file.is-link:hover .file-cta {
2077 + background-color: #3e56c4;
2078 + border-color: transparent;
2079 + color: #fff;
2080 +}
2081 +.better-payment .file.is-link.is-focused .file-cta,
2082 +.better-payment .file.is-link:focus .file-cta {
2083 + border-color: transparent;
2084 + box-shadow: 0 0 0.5em rgba(72, 95, 199, 0.25);
2085 + color: #fff;
2086 +}
2087 +.better-payment .file.is-link.is-active .file-cta,
2088 +.better-payment .file.is-link:active .file-cta {
2089 + background-color: #3a51bb;
2090 + border-color: transparent;
2091 + color: #fff;
2092 +}
2093 +.better-payment .file.is-info .file-cta {
2094 + background-color: #3e8ed0;
2095 + border-color: transparent;
2096 + color: #fff;
2097 +}
2098 +.better-payment .file.is-info.is-hovered .file-cta,
2099 +.better-payment .file.is-info:hover .file-cta {
2100 + background-color: #3488ce;
2101 + border-color: transparent;
2102 + color: #fff;
2103 +}
2104 +.better-payment .file.is-info.is-focused .file-cta,
2105 +.better-payment .file.is-info:focus .file-cta {
2106 + border-color: transparent;
2107 + box-shadow: 0 0 0.5em rgba(62, 142, 208, 0.25);
2108 + color: #fff;
2109 +}
2110 +.better-payment .file.is-info.is-active .file-cta,
2111 +.better-payment .file.is-info:active .file-cta {
2112 + background-color: #3082c5;
2113 + border-color: transparent;
2114 + color: #fff;
2115 +}
2116 +.better-payment .file.is-success .file-cta {
2117 + background-color: #47c68d;
2118 + border-color: transparent;
2119 + color: #fff;
2120 +}
2121 +.better-payment .file.is-success.is-hovered .file-cta,
2122 +.better-payment .file.is-success:hover .file-cta {
2123 + background-color: #3ec487;
2124 + border-color: transparent;
2125 + color: #fff;
2126 +}
2127 +.better-payment .file.is-success.is-focused .file-cta,
2128 +.better-payment .file.is-success:focus .file-cta {
2129 + border-color: transparent;
2130 + box-shadow: 0 0 0.5em rgba(72, 199, 142, 0.25);
2131 + color: #fff;
2132 +}
2133 +.better-payment .file.is-success.is-active .file-cta,
2134 +.better-payment .file.is-success:active .file-cta {
2135 + background-color: #3abb81;
2136 + border-color: transparent;
2137 + color: #fff;
2138 +}
2139 +.better-payment .file.is-warning .file-cta {
2140 + background-color: #ffdf89;
2141 + border-color: transparent;
2142 + color: rgba(0, 0, 0, 0.7);
2143 +}
2144 +.better-payment .file.is-warning.is-hovered .file-cta,
2145 +.better-payment .file.is-warning:hover .file-cta {
2146 + background-color: #ffdc7d;
2147 + border-color: transparent;
2148 + color: rgba(0, 0, 0, 0.7);
2149 +}
2150 +.better-payment .file.is-warning.is-focused .file-cta,
2151 +.better-payment .file.is-warning:focus .file-cta {
2152 + border-color: transparent;
2153 + box-shadow: 0 0 0.5em rgba(255, 224, 138, 0.25);
2154 + color: rgba(0, 0, 0, 0.7);
2155 +}
2156 +.better-payment .file.is-warning.is-active .file-cta,
2157 +.better-payment .file.is-warning:active .file-cta {
2158 + background-color: #ffd970;
2159 + border-color: transparent;
2160 + color: rgba(0, 0, 0, 0.7);
2161 +}
2162 +.better-payment .file.is-danger .file-cta {
2163 + background-color: #f14668;
2164 + border-color: transparent;
2165 + color: #fff;
2166 +}
2167 +.better-payment .file.is-danger.is-hovered .file-cta,
2168 +.better-payment .file.is-danger:hover .file-cta {
2169 + background-color: #f03a5f;
2170 + border-color: transparent;
2171 + color: #fff;
2172 +}
2173 +.better-payment .file.is-danger.is-focused .file-cta,
2174 +.better-payment .file.is-danger:focus .file-cta {
2175 + border-color: transparent;
2176 + box-shadow: 0 0 0.5em rgba(241, 70, 104, 0.25);
2177 + color: #fff;
2178 +}
2179 +.better-payment .file.is-danger.is-active .file-cta,
2180 +.better-payment .file.is-danger:active .file-cta {
2181 + background-color: #ef2e55;
2182 + border-color: transparent;
2183 + color: #fff;
2184 +}
2185 +.better-payment .file.is-expo .file-cta {
2186 + background-color: #ffd257;
2187 + border-color: transparent;
2188 + color: #fff;
2189 +}
2190 +.better-payment .file.is-expo.is-hovered .file-cta,
2191 +.better-payment .file.is-expo:hover .file-cta {
2192 + background-color: #ffcf4a;
2193 + border-color: transparent;
2194 + color: #fff;
2195 +}
2196 +.better-payment .file.is-expo.is-focused .file-cta,
2197 +.better-payment .file.is-expo:focus .file-cta {
2198 + border-color: transparent;
2199 + box-shadow: 0 0 0.5em rgba(255, 210, 87, 0.25);
2200 + color: #fff;
2201 +}
2202 +.better-payment .file.is-expo.is-active .file-cta,
2203 +.better-payment .file.is-expo:active .file-cta {
2204 + background-color: #ffcb3e;
2205 + border-color: transparent;
2206 + color: #fff;
2207 +}
2208 +.better-payment .file.is-love .file-cta {
2209 + background-color: #f14668;
2210 + border-color: transparent;
2211 + color: #fff;
2212 +}
2213 +.better-payment .file.is-love.is-hovered .file-cta,
2214 +.better-payment .file.is-love:hover .file-cta {
2215 + background-color: #f03a5f;
2216 + border-color: transparent;
2217 + color: #fff;
2218 +}
2219 +.better-payment .file.is-love.is-focused .file-cta,
2220 +.better-payment .file.is-love:focus .file-cta {
2221 + border-color: transparent;
2222 + box-shadow: 0 0 0.5em rgba(241, 70, 104, 0.25);
2223 + color: #fff;
2224 +}
2225 +.better-payment .file.is-love.is-active .file-cta,
2226 +.better-payment .file.is-love:active .file-cta {
2227 + background-color: #ef2e55;
2228 + border-color: transparent;
2229 + color: #fff;
2230 +}
2231 +.better-payment .file.is-patreon .file-cta {
2232 + background-color: #f96854;
2233 + border-color: transparent;
2234 + color: #fff;
2235 +}
2236 +.better-payment .file.is-patreon.is-hovered .file-cta,
2237 +.better-payment .file.is-patreon:hover .file-cta {
2238 + background-color: #f95d48;
2239 + border-color: transparent;
2240 + color: #fff;
2241 +}
2242 +.better-payment .file.is-patreon.is-focused .file-cta,
2243 +.better-payment .file.is-patreon:focus .file-cta {
2244 + border-color: transparent;
2245 + box-shadow: 0 0 0.5em rgba(249, 104, 84, 0.25);
2246 + color: #fff;
2247 +}
2248 +.better-payment .file.is-patreon.is-active .file-cta,
2249 +.better-payment .file.is-patreon:active .file-cta {
2250 + background-color: #f8523b;
2251 + border-color: transparent;
2252 + color: #fff;
2253 +}
2254 +.better-payment .file.is-rss .file-cta {
2255 + background-color: #f26522;
2256 + border-color: transparent;
2257 + color: #fff;
2258 +}
2259 +.better-payment .file.is-rss.is-hovered .file-cta,
2260 +.better-payment .file.is-rss:hover .file-cta {
2261 + background-color: #f15d16;
2262 + border-color: transparent;
2263 + color: #fff;
2264 +}
2265 +.better-payment .file.is-rss.is-focused .file-cta,
2266 +.better-payment .file.is-rss:focus .file-cta {
2267 + border-color: transparent;
2268 + box-shadow: 0 0 0.5em rgba(242, 101, 34, 0.25);
2269 + color: #fff;
2270 +}
2271 +.better-payment .file.is-rss.is-active .file-cta,
2272 +.better-payment .file.is-rss:active .file-cta {
2273 + background-color: #ed560e;
2274 + border-color: transparent;
2275 + color: #fff;
2276 +}
2277 +.better-payment .file.is-bleeding .file-cta {
2278 + background-color: #abf47c;
2279 + border-color: transparent;
2280 + color: rgba(0, 0, 0, 0.7);
2281 +}
2282 +.better-payment .file.is-bleeding.is-hovered .file-cta,
2283 +.better-payment .file.is-bleeding:hover .file-cta {
2284 + background-color: #a3f370;
2285 + border-color: transparent;
2286 + color: rgba(0, 0, 0, 0.7);
2287 +}
2288 +.better-payment .file.is-bleeding.is-focused .file-cta,
2289 +.better-payment .file.is-bleeding:focus .file-cta {
2290 + border-color: transparent;
2291 + box-shadow: 0 0 0.5em rgba(171, 244, 124, 0.25);
2292 + color: rgba(0, 0, 0, 0.7);
2293 +}
2294 +.better-payment .file.is-bleeding.is-active .file-cta,
2295 +.better-payment .file.is-bleeding:active .file-cta {
2296 + background-color: #9cf264;
2297 + border-color: transparent;
2298 + color: rgba(0, 0, 0, 0.7);
2299 +}
2300 +.better-payment .file.is-sass .file-cta {
2301 + background-color: #bf4080;
2302 + border-color: transparent;
2303 + color: #fff;
2304 +}
2305 +.better-payment .file.is-sass.is-hovered .file-cta,
2306 +.better-payment .file.is-sass:hover .file-cta {
2307 + background-color: #b53d7a;
2308 + border-color: transparent;
2309 + color: #fff;
2310 +}
2311 +.better-payment .file.is-sass.is-focused .file-cta,
2312 +.better-payment .file.is-sass:focus .file-cta {
2313 + border-color: transparent;
2314 + box-shadow: 0 0 0.5em rgba(191, 64, 128, 0.25);
2315 + color: #fff;
2316 +}
2317 +.better-payment .file.is-sass.is-active .file-cta,
2318 +.better-payment .file.is-sass:active .file-cta {
2319 + background-color: #ac3a73;
2320 + border-color: transparent;
2321 + color: #fff;
2322 +}
2323 +.better-payment .file.is-amazon .file-cta {
2324 + background-color: #ffd863;
2325 + border-color: transparent;
2326 + color: rgba(0, 0, 0, 0.7);
2327 +}
2328 +.better-payment .file.is-amazon.is-hovered .file-cta,
2329 +.better-payment .file.is-amazon:hover .file-cta {
2330 + background-color: #ffd556;
2331 + border-color: transparent;
2332 + color: rgba(0, 0, 0, 0.7);
2333 +}
2334 +.better-payment .file.is-amazon.is-focused .file-cta,
2335 +.better-payment .file.is-amazon:focus .file-cta {
2336 + border-color: transparent;
2337 + box-shadow: 0 0 0.5em rgba(255, 216, 99, 0.25);
2338 + color: rgba(0, 0, 0, 0.7);
2339 +}
2340 +.better-payment .file.is-amazon.is-active .file-cta,
2341 +.better-payment .file.is-amazon:active .file-cta {
2342 + background-color: #ffd24a;
2343 + border-color: transparent;
2344 + color: rgba(0, 0, 0, 0.7);
2345 +}
2346 +.better-payment .file.is-sponsor .file-cta {
2347 + background-color: #ea4aaa;
2348 + border-color: transparent;
2349 + color: #fff;
2350 +}
2351 +.better-payment .file.is-sponsor.is-hovered .file-cta,
2352 +.better-payment .file.is-sponsor:hover .file-cta {
2353 + background-color: #e93fa5;
2354 + border-color: transparent;
2355 + color: #fff;
2356 +}
2357 +.better-payment .file.is-sponsor.is-focused .file-cta,
2358 +.better-payment .file.is-sponsor:focus .file-cta {
2359 + border-color: transparent;
2360 + box-shadow: 0 0 0.5em rgba(234, 74, 170, 0.25);
2361 + color: #fff;
2362 +}
2363 +.better-payment .file.is-sponsor.is-active .file-cta,
2364 +.better-payment .file.is-sponsor:active .file-cta {
2365 + background-color: #e7339f;
2366 + border-color: transparent;
2367 + color: #fff;
2368 +}
2369 +.better-payment .file.is-twitter .file-cta {
2370 + background-color: #55acee;
2371 + border-color: transparent;
2372 + color: #fff;
2373 +}
2374 +.better-payment .file.is-twitter.is-hovered .file-cta,
2375 +.better-payment .file.is-twitter:hover .file-cta {
2376 + background-color: #49a6ed;
2377 + border-color: transparent;
2378 + color: #fff;
2379 +}
2380 +.better-payment .file.is-twitter.is-focused .file-cta,
2381 +.better-payment .file.is-twitter:focus .file-cta {
2382 + border-color: transparent;
2383 + box-shadow: 0 0 0.5em rgba(85, 172, 238, 0.25);
2384 + color: #fff;
2385 +}
2386 +.better-payment .file.is-twitter.is-active .file-cta,
2387 +.better-payment .file.is-twitter:active .file-cta {
2388 + background-color: #3ea1ec;
2389 + border-color: transparent;
2390 + color: #fff;
2391 +}
2392 +.better-payment .file.is-videos .file-cta {
2393 + background-color: #47c68d;
2394 + border-color: transparent;
2395 + color: #fff;
2396 +}
2397 +.better-payment .file.is-videos.is-hovered .file-cta,
2398 +.better-payment .file.is-videos:hover .file-cta {
2399 + background-color: #3ec487;
2400 + border-color: transparent;
2401 + color: #fff;
2402 +}
2403 +.better-payment .file.is-videos.is-focused .file-cta,
2404 +.better-payment .file.is-videos:focus .file-cta {
2405 + border-color: transparent;
2406 + box-shadow: 0 0 0.5em rgba(72, 199, 142, 0.25);
2407 + color: #fff;
2408 +}
2409 +.better-payment .file.is-videos.is-active .file-cta,
2410 +.better-payment .file.is-videos:active .file-cta {
2411 + background-color: #3abb81;
2412 + border-color: transparent;
2413 + color: #fff;
2414 +}
2415 +.better-payment .file.is-extensions .file-cta {
2416 + background-color: #3e8ed0;
2417 + border-color: transparent;
2418 + color: #fff;
2419 +}
2420 +.better-payment .file.is-extensions.is-hovered .file-cta,
2421 +.better-payment .file.is-extensions:hover .file-cta {
2422 + background-color: #3488ce;
2423 + border-color: transparent;
2424 + color: #fff;
2425 +}
2426 +.better-payment .file.is-extensions.is-focused .file-cta,
2427 +.better-payment .file.is-extensions:focus .file-cta {
2428 + border-color: transparent;
2429 + box-shadow: 0 0 0.5em rgba(62, 142, 208, 0.25);
2430 + color: #fff;
2431 +}
2432 +.better-payment .file.is-extensions.is-active .file-cta,
2433 +.better-payment .file.is-extensions:active .file-cta {
2434 + background-color: #3082c5;
2435 + border-color: transparent;
2436 + color: #fff;
2437 +}
2438 +.better-payment .file.is-bootstrap .file-cta {
2439 + background-color: #6f5499;
2440 + border-color: transparent;
2441 + color: #fff;
2442 +}
2443 +.better-payment .file.is-bootstrap.is-hovered .file-cta,
2444 +.better-payment .file.is-bootstrap:hover .file-cta {
2445 + background-color: #694f91;
2446 + border-color: transparent;
2447 + color: #fff;
2448 +}
2449 +.better-payment .file.is-bootstrap.is-focused .file-cta,
2450 +.better-payment .file.is-bootstrap:focus .file-cta {
2451 + border-color: transparent;
2452 + box-shadow: 0 0 0.5em rgba(111, 84, 153, 0.25);
2453 + color: #fff;
2454 +}
2455 +.better-payment .file.is-bootstrap.is-active .file-cta,
2456 +.better-payment .file.is-bootstrap:active .file-cta {
2457 + background-color: #634b89;
2458 + border-color: transparent;
2459 + color: #fff;
2460 +}
2461 +.better-payment .file.is-small {
2462 + font-size: 0.75rem;
2463 +}
2464 +.better-payment .file.is-normal {
2465 + font-size: 1rem;
2466 +}
2467 +.better-payment .file.is-medium {
2468 + font-size: 1.25rem;
2469 +}
2470 +.better-payment .file.is-medium .file-icon .fa {
2471 + font-size: 21px;
2472 +}
2473 +.better-payment .file.is-large {
2474 + font-size: 1.5rem;
2475 +}
2476 +.better-payment .file.is-large .file-icon .fa {
2477 + font-size: 28px;
2478 +}
2479 +.better-payment .file.has-name .file-cta {
2480 + border-bottom-right-radius: 0;
2481 + border-top-right-radius: 0;
2482 +}
2483 +.better-payment .file.has-name .file-name {
2484 + border-bottom-left-radius: 0;
2485 + border-top-left-radius: 0;
2486 +}
2487 +.better-payment .file.has-name.is-empty .file-cta {
2488 + border-radius: 0.375em;
2489 +}
2490 +.better-payment .file.has-name.is-empty .file-name {
2491 + display: none;
2492 +}
2493 +.better-payment .file.is-boxed .file-label {
2494 + flex-direction: column;
2495 +}
2496 +.better-payment .file.is-boxed .file-cta {
2497 + flex-direction: column;
2498 + height: auto;
2499 + padding: 1em 3em;
2500 +}
2501 +.better-payment .file.is-boxed .file-name {
2502 + border-width: 0 1px 1px;
2503 +}
2504 +.better-payment .file.is-boxed .file-icon {
2505 + height: 1.5em;
2506 + width: 1.5em;
2507 +}
2508 +.better-payment .file.is-boxed .file-icon .fa {
2509 + font-size: 21px;
2510 +}
2511 +.better-payment .file.is-boxed.is-small .file-icon .fa {
2512 + font-size: 14px;
2513 +}
2514 +.better-payment .file.is-boxed.is-medium .file-icon .fa {
2515 + font-size: 28px;
2516 +}
2517 +.better-payment .file.is-boxed.is-large .file-icon .fa {
2518 + font-size: 35px;
2519 +}
2520 +.better-payment .file.is-boxed.has-name .file-cta {
2521 + border-radius: 0.375em 0.375em 0 0;
2522 +}
2523 +.better-payment .file.is-boxed.has-name .file-name {
2524 + border-radius: 0 0 0.375em 0.375em;
2525 + border-width: 0 1px 1px;
2526 +}
2527 +.better-payment .file.is-centered {
2528 + justify-content: center;
2529 +}
2530 +.better-payment .file.is-fullwidth .file-label {
2531 + width: 100%;
2532 +}
2533 +.better-payment .file.is-fullwidth .file-name {
2534 + flex-grow: 1;
2535 + max-width: none;
2536 +}
2537 +.better-payment .file.is-right {
2538 + justify-content: flex-end;
2539 +}
2540 +.better-payment .file.is-right .file-cta {
2541 + border-radius: 0 0.375em 0.375em 0;
2542 +}
2543 +.better-payment .file.is-right .file-name {
2544 + border-radius: 0.375em 0 0 0.375em;
2545 + border-width: 1px 0 1px 1px;
2546 + order: -1;
2547 +}
2548 +.better-payment .file-label {
2549 + align-items: stretch;
2550 + display: flex;
2551 + cursor: pointer;
2552 + justify-content: flex-start;
2553 + overflow: hidden;
2554 + position: relative;
2555 +}
2556 +.better-payment .file-label:hover .file-cta {
2557 + background-color: #eee;
2558 + color: #353535;
2559 +}
2560 +.better-payment .file-label:hover .file-name {
2561 + border-color: #d5d5d5;
2562 +}
2563 +.better-payment .file-label:active .file-cta {
2564 + background-color: #e8e8e8;
2565 + color: #353535;
2566 +}
2567 +.better-payment .file-label:active .file-name {
2568 + border-color: #cfcfcf;
2569 +}
2570 +.better-payment .file-input {
2571 + height: 100%;
2572 + left: 0;
2573 + opacity: 0;
2574 + outline: 0;
2575 + position: absolute;
2576 + top: 0;
2577 + width: 100%;
2578 +}
2579 +.better-payment .file-cta,
2580 +.better-payment .file-name {
2581 + border-color: #dbdbdb;
2582 + border-radius: 0.375em;
2583 + font-size: 1em;
2584 + padding-left: 1em;
2585 + padding-right: 1em;
2586 + white-space: nowrap;
2587 +}
2588 +.better-payment .file-cta {
2589 + background-color: #f4f4f4;
2590 + color: #494949;
2591 +}
2592 +.better-payment .file-name {
2593 + border-color: #dbdbdb;
2594 + border-style: solid;
2595 + border-width: 1px 1px 1px 0;
2596 + display: block;
2597 + max-width: 16em;
2598 + overflow: hidden;
2599 + text-align: inherit;
2600 + text-overflow: ellipsis;
2601 +}
2602 +.better-payment .file-icon {
2603 + align-items: center;
2604 + display: flex;
2605 + height: 1em;
2606 + justify-content: center;
2607 + margin-right: 0.5em;
2608 + width: 1em;
2609 +}
2610 +.better-payment .file-icon .fa {
2611 + font-size: 14px;
2612 +}
2613 +.better-payment .is-flex {
2614 + display: flex !important;
2615 +}
2616 +.better-payment .is-flex-direction-row {
2617 + flex-direction: row !important;
2618 +}
2619 +.better-payment .is-flex-direction-row-reverse {
2620 + flex-direction: row-reverse !important;
2621 +}
2622 +.better-payment .is-flex-direction-column {
2623 + flex-direction: column !important;
2624 +}
2625 +.better-payment .is-flex-direction-column-reverse {
2626 + flex-direction: column-reverse !important;
2627 +}
2628 +.better-payment .is-flex-wrap-nowrap {
2629 + flex-wrap: nowrap !important;
2630 +}
2631 +.better-payment .is-flex-wrap-wrap {
2632 + flex-wrap: wrap !important;
2633 +}
2634 +.better-payment .is-flex-wrap-wrap-reverse {
2635 + flex-wrap: wrap-reverse !important;
2636 +}
2637 +.better-payment .is-justify-content-flex-start {
2638 + justify-content: flex-start !important;
2639 +}
2640 +.better-payment .is-justify-content-flex-end {
2641 + justify-content: flex-end !important;
2642 +}
2643 +.better-payment .is-justify-content-center {
2644 + justify-content: center !important;
2645 +}
2646 +.better-payment .is-justify-content-space-between {
2647 + justify-content: space-between !important;
2648 +}
2649 +.better-payment .is-justify-content-space-around {
2650 + justify-content: space-around !important;
2651 +}
2652 +.better-payment .is-justify-content-space-evenly {
2653 + justify-content: space-evenly !important;
2654 +}
2655 +.better-payment .is-justify-content-start {
2656 + justify-content: start !important;
2657 +}
2658 +.better-payment .is-justify-content-end {
2659 + justify-content: end !important;
2660 +}
2661 +.better-payment .is-justify-content-left {
2662 + justify-content: left !important;
2663 +}
2664 +.better-payment .is-justify-content-right {
2665 + justify-content: right !important;
2666 +}
2667 +.better-payment .is-align-content-flex-start {
2668 + align-content: flex-start !important;
2669 +}
2670 +.better-payment .is-align-content-flex-end {
2671 + align-content: flex-end !important;
2672 +}
2673 +.better-payment .is-align-content-center {
2674 + align-content: center !important;
2675 +}
2676 +.better-payment .is-align-content-space-between {
2677 + align-content: space-between !important;
2678 +}
2679 +.better-payment .is-align-content-space-around {
2680 + align-content: space-around !important;
2681 +}
2682 +.better-payment .is-align-content-space-evenly {
2683 + align-content: space-evenly !important;
2684 +}
2685 +.better-payment .is-align-content-stretch {
2686 + align-content: stretch !important;
2687 +}
2688 +.better-payment .is-align-content-start {
2689 + align-content: start !important;
2690 +}
2691 +.better-payment .is-align-content-end {
2692 + align-content: end !important;
2693 +}
2694 +.better-payment .is-align-content-baseline {
2695 + align-content: baseline !important;
2696 +}
2697 +.better-payment .is-align-items-stretch {
2698 + align-items: stretch !important;
2699 +}
2700 +.better-payment .is-align-items-flex-start {
2701 + align-items: flex-start !important;
2702 +}
2703 +.better-payment .is-align-items-flex-end {
2704 + align-items: flex-end !important;
2705 +}
2706 +.better-payment .is-align-items-center {
2707 + align-items: center !important;
2708 +}
2709 +.better-payment .is-align-items-baseline {
2710 + align-items: baseline !important;
2711 +}
2712 +.better-payment .is-align-items-start {
2713 + align-items: start !important;
2714 +}
2715 +.better-payment .is-align-items-end {
2716 + align-items: end !important;
2717 +}
2718 +.better-payment .is-align-items-self-start {
2719 + align-items: self-start !important;
2720 +}
2721 +.better-payment .is-align-items-self-end {
2722 + align-items: self-end !important;
2723 +}
2724 +.better-payment .is-align-self-auto {
2725 + align-self: auto !important;
2726 +}
2727 +.better-payment .is-align-self-flex-start {
2728 + align-self: flex-start !important;
2729 +}
2730 +.better-payment .is-align-self-flex-end {
2731 + align-self: flex-end !important;
2732 +}
2733 +.better-payment .is-align-self-center {
2734 + align-self: center !important;
2735 +}
2736 +.better-payment .is-align-self-baseline {
2737 + align-self: baseline !important;
2738 +}
2739 +.better-payment .is-align-self-stretch {
2740 + align-self: stretch !important;
2741 +}
2742 +.better-payment .is-flex-grow-0 {
2743 + flex-grow: 0 !important;
2744 +}
2745 +.better-payment .is-flex-grow-1 {
2746 + flex-grow: 1 !important;
2747 +}
2748 +.better-payment .is-flex-grow-2 {
2749 + flex-grow: 2 !important;
2750 +}
2751 +.better-payment .is-flex-grow-3 {
2752 + flex-grow: 3 !important;
2753 +}
2754 +.better-payment .is-flex-grow-4 {
2755 + flex-grow: 4 !important;
2756 +}
2757 +.better-payment .is-flex-grow-5 {
2758 + flex-grow: 5 !important;
2759 +}
2760 +.better-payment .is-flex-shrink-0 {
2761 + flex-shrink: 0 !important;
2762 +}
2763 +.better-payment .is-flex-shrink-1 {
2764 + flex-shrink: 1 !important;
2765 +}
2766 +.better-payment .is-flex-shrink-2 {
2767 + flex-shrink: 2 !important;
2768 +}
2769 +.better-payment .is-flex-shrink-3 {
2770 + flex-shrink: 3 !important;
2771 +}
2772 +.better-payment .is-flex-shrink-4 {
2773 + flex-shrink: 4 !important;
2774 +}
2775 +.better-payment .is-flex-shrink-5 {
2776 + flex-shrink: 5 !important;
2777 +}
2778 +.better-payment .is-clearfix::after {
2779 + clear: both;
2780 + content: " ";
2781 + display: table;
2782 +}
2783 +.better-payment .is-pulled-left {
2784 + float: left !important;
2785 +}
2786 +.better-payment .is-pulled-right {
2787 + float: right !important;
2788 +}
2789 +.better-payment .is-radiusless {
2790 + border-radius: 0 !important;
2791 +}
2792 +.better-payment .is-shadowless {
2793 + box-shadow: none !important;
2794 +}
2795 +.better-payment .is-clickable {
2796 + cursor: pointer !important;
2797 + pointer-events: all !important;
2798 +}
2799 +.better-payment .is-clipped {
2800 + overflow: hidden !important;
2801 +}
2802 +.better-payment .is-relative {
2803 + position: relative !important;
2804 +}
2805 +.better-payment .file.no-file-name .file-cta {
2806 + border-radius: 0.375em;
2807 +}
2808 +.better-payment .button.is-success {
2809 + background-color: #47c68d;
2810 + border-color: transparent;
2811 + color: #fff;
2812 +}
2813 +@media screen and (max-width: 768px) {
2814 + .better-payment .is-flex-mobile {
2815 + display: flex !important;
2816 + }
2817 +}
2818 +@media screen and (min-width: 769px), print {
2819 + .better-payment .is-flex-tablet {
2820 + display: flex !important;
2821 + }
2822 +}
2823 +@media screen and (min-width: 769px) and (max-width: 1023px) {
2824 + .better-payment .is-flex-tablet-only {
2825 + display: flex !important;
2826 + }
2827 +}
2828 +@media screen and (max-width: 1023px) {
2829 + .better-payment .is-flex-touch {
2830 + display: flex !important;
2831 + }
2832 +}
2833 +@media screen and (min-width: 1024px) {
2834 + .better-payment .is-flex-desktop {
2835 + display: flex !important;
2836 + }
2837 +}
2838 +@media screen and (min-width: 1024px) and (max-width: 1215px) {
2839 + .better-payment .is-flex-desktop-only {
2840 + display: flex !important;
2841 + }
2842 +}
2843 +@media screen and (min-width: 1216px) {
2844 + .better-payment .is-flex-widescreen {
2845 + display: flex !important;
2846 + }
2847 +}
2848 +@media screen and (min-width: 1216px) and (max-width: 1407px) {
2849 + .better-payment .is-flex-widescreen-only {
2850 + display: flex !important;
2851 + }
2852 +}
2853 +@media screen and (min-width: 1408px) {
2854 + .better-payment .is-flex-fullhd {
2855 + display: flex !important;
2856 + }
2857 +}
2858 +
2859 +.field-display-inline:nth-child(odd) {
2860 + margin-right: 1%;
2861 +}
2862 +
2863 +.field-display-inline:nth-child(even) {
2864 + margin-left: 1%;
2865 +}
2866 +
2867 +.better-payment .d-none {
2868 + display: none !important;
2869 +}
2870 +.better-payment .flex {
2871 + display: flex;
2872 +}
2873 +.better-payment .flex-col {
2874 + flex-direction: column;
2875 +}
2876 +.better-payment .flex-1 {
2877 + flex: 1;
2878 +}
2879 +.better-payment .justify-between {
2880 + justify-content: space-between;
2881 +}
2882 +.better-payment .justify-center {
2883 + justify-content: center;
2884 +}
2885 +.better-payment .justify-end {
2886 + justify-content: flex-end;
2887 +}
2888 +.better-payment .items-start {
2889 + align-items: flex-start;
2890 +}
2891 +.better-payment .items-center {
2892 + align-items: center;
2893 +}
2894 +.better-payment .items-end {
2895 + align-items: flex-end;
2896 +}
2897 +.better-payment .min-h-full {
2898 + min-height: 100vh;
2899 +}
2900 +.better-payment .gap-1 {
2901 + gap: 4px;
2902 +}
2903 +.better-payment .gap-2 {
2904 + gap: 8px;
2905 +}
2906 +.better-payment .gap-3 {
2907 + gap: 12px;
2908 +}
2909 +.better-payment .gap-4 {
2910 + gap: 16px;
2911 +}
2912 +.better-payment .gap-5 {
2913 + gap: 20px;
2914 +}
2915 +.better-payment .gap-6 {
2916 + gap: 24px;
2917 +}
2918 +.better-payment .gap-10 {
2919 + gap: 40px;
2920 +}
2921 +.better-payment .min-w-300 {
2922 + min-width: 300px !important;
2923 +}
2924 +.better-payment .max-w-300 {
2925 + max-width: 300px !important;
2926 +}
2927 +.better-payment .pointer {
2928 + cursor: pointer;
2929 +}
2930 +.better-payment h2 {
2931 + font-size: 26px;
2932 + line-height: 1.2em;
2933 + font-weight: 700;
2934 + font-family: "IBM Plex Sans", sans-serif;
2935 + color: #2b2748;
2936 +}
2937 +.better-payment .bp-dashboard-header h2 {
2938 + font-weight: 400;
2939 +}
2940 +.better-payment button {
2941 + font-size: 14px;
2942 + line-height: 1.1em;
2943 + color: #6859fa;
2944 + display: inline-flex;
2945 + align-items: center;
2946 + justify-content: center;
2947 + padding: 8px 16px;
2948 + background: #f0eefe;
2949 + border-radius: 20px;
2950 + border: none;
2951 + transition: all 0.25s ease-in-out;
2952 + cursor: pointer;
2953 +}
2954 +.better-payment button.primary-btn {
2955 + font-size: 16px;
2956 + font-weight: 500;
2957 + padding: 12px 18px;
2958 + border-radius: 8px;
2959 + color: #6859fa;
2960 +}
2961 +.better-payment button.complete {
2962 + color: #ffffff;
2963 + background: #0eca86;
2964 +}
2965 +.better-payment button.incomplete {
2966 + color: #ffffff;
2967 + background: #ffda15;
2968 +}
2969 +.better-payment button.active {
2970 + color: #00c679;
2971 + background: rgba(0, 198, 123, 0.1019607843);
2972 + border-radius: 20px;
2973 +}
2974 +.better-payment button.inactive {
2975 + color: #edaa00;
2976 + background: rgba(255, 209, 0, 0.1019607843);
2977 +}
2978 +.better-payment button.cancel {
2979 + color: #ff0000;
2980 + background: rgba(255, 0, 0, 0.1490196078);
2981 +}
2982 +.better-payment .bp--sidebar-wrapper {
2983 + padding: 24px;
2984 + background: #fff;
2985 + min-width: 270px;
2986 + min-height: 100vh;
2987 + border: 1px solid #f1f1f1;
2988 +}
2989 +.better-payment .bp--author {
2990 + display: flex;
2991 + align-items: center;
2992 + gap: 16px;
2993 + margin-bottom: 40px;
2994 +}
2995 +.better-payment .bp--author img {
2996 + width: 32px !important;
2997 + height: 32px !important;
2998 + min-width: 32px;
2999 + border-radius: 50%;
3000 + object-fit: cover;
3001 + flex-shrink: 0;
3002 + display: block;
3003 +}
3004 +.better-payment .bp--author h5 {
3005 + font-size: 20px;
3006 + font-weight: 500;
3007 + line-height: 1.1em;
3008 + color: #48506d;
3009 +}
3010 +.better-payment .bp--sidebar-nav-list {
3011 + display: flex;
3012 + flex-direction: column;
3013 + gap: 12px;
3014 +}
3015 +.better-payment .bp--sidebar-nav {
3016 + display: flex;
3017 + align-items: center;
3018 + gap: 12px;
3019 + padding: 4px 8px;
3020 + cursor: pointer;
3021 +}
3022 +.better-payment .bp--nav-icon {
3023 + display: inline-flex;
3024 +}
3025 +.better-payment span.bp--nav-icon svg {
3026 + width: 20px;
3027 + height: 20px;
3028 +}
3029 +.better-payment .bp--sidebar-nav.active span.bp--nav-icon svg path {
3030 + stroke: #000000;
3031 +}
3032 +.better-payment .bp--sidebar-nav .bp--nav-text {
3033 + color: #48506d;
3034 + font-size: 16px;
3035 + font-weight: 500;
3036 + transition: ease-in-out 0.25s;
3037 +}
3038 +.better-payment .bp--sidebar-nav.active .bp--nav-text {
3039 + color: #000000;
3040 +}
3041 +.better-payment .bp--sidebar-nav:hover .bp--nav-text {
3042 + color: #2b2748;
3043 +}
3044 +.better-payment .bp--sidebar-nav.active {
3045 + color: #2b2748;
3046 +}
3047 +.better-payment .bp--db-main-wrapper {
3048 + padding-right: 24px;
3049 + flex-basis: calc(100% - 294px);
3050 + max-width: calc(100% - 294px);
3051 +}
3052 +.better-payment .bp--db-header {
3053 + display: flex;
3054 + justify-content: space-between;
3055 + align-items: center;
3056 + padding: 16px 24px;
3057 + background: #fff;
3058 + margin-bottom: 24px;
3059 + border: 1px solid #f1f1f1;
3060 +}
3061 +.better-payment .bp--db-header img {
3062 + max-width: 200px;
3063 +}
3064 +.better-payment .bp--table-wrapper {
3065 + display: flex;
3066 + flex-direction: column;
3067 + overflow: auto;
3068 +}
3069 +.better-payment .bp--table-header {
3070 + background: rgba(110, 88, 247, 0.1);
3071 + border: none;
3072 + padding: 10px 24px;
3073 + min-width: 1442px;
3074 +}
3075 +.better-payment .bp--table-header .th,
3076 +.better-payment .bp--table-header .th h5 {
3077 + font-size: 16px;
3078 + line-height: 1.2em;
3079 + font-weight: 500;
3080 + color: #2a3256;
3081 +}
3082 +.better-payment .bp--table-body {
3083 + padding: 10px 24px;
3084 + min-width: 1442px;
3085 + background: #ffffff;
3086 + border-left: 1px solid #f1f1f1;
3087 + border-right: 1px solid #f1f1f1;
3088 +}
3089 +.better-payment .bp--table-body {
3090 + border-bottom: 1px solid rgba(110, 88, 247, 0.1);
3091 +}
3092 +.better-payment .bp--table-body .td h5,
3093 +.better-payment .bp--table-body .td h5 span {
3094 + font-size: 16px;
3095 + font-weight: 400;
3096 + line-height: 1.2em;
3097 + color: #2a3256;
3098 +}
3099 +.better-payment .bp--table-body .td p {
3100 + font-size: 14px;
3101 + color: #48506d;
3102 + display: inline-flex;
3103 +}
3104 +.better-payment .bp--table-body .td span {
3105 + font-size: 13px;
3106 + color: #797e90;
3107 +}
3108 +.better-payment .bp--table-body .price {
3109 + font-size: 18px;
3110 + line-height: 1em;
3111 + font-weight: 500;
3112 + color: #2b2748;
3113 + padding-right: 4px;
3114 +}
3115 +.better-payment .td.details i {
3116 + font-size: 16px;
3117 + color: #48506d;
3118 +}
3119 +.better-payment .td.details .product--img {
3120 + max-width: 24px;
3121 +}
3122 +.better-payment .td.details .source--img {
3123 + max-width: 80px;
3124 +}
3125 +.better-payment .th.details,
3126 +.better-payment .td.details {
3127 + min-width: 130px;
3128 + max-width: 130px;
3129 + flex: 1;
3130 +}
3131 +.better-payment .th.details.user-name,
3132 +.better-payment .td.details.user-name {
3133 + max-width: 200px;
3134 +}
3135 +.better-payment .transactions .th.details:first-child,
3136 +.better-payment .transactions .td.details:first-child {
3137 + min-width: 170px;
3138 +}
3139 +.better-payment .transactions .th.details:nth-child(2),
3140 +.better-payment .transactions .td.details:nth-child(2) {
3141 + min-width: 220px;
3142 + max-width: 220px;
3143 +}
3144 +.better-payment .transactions .th.details:nth-child(4),
3145 +.better-payment .transactions .td.details:nth-child(4) {
3146 + min-width: 220px;
3147 + max-width: 220px;
3148 +}
3149 +.better-payment .bp--table-body .td .action-icon {
3150 + border-radius: 4px;
3151 + display: flex;
3152 + align-items: center;
3153 + justify-content: center;
3154 + width: 48px;
3155 + height: 36px;
3156 + background: rgba(110, 88, 247, 0.1);
3157 +}
3158 +.better-payment .bp--table-body .td span.action-icon i {
3159 + font-size: 20px;
3160 + line-height: 1.2em;
3161 + color: #6e58f7;
3162 +}
3163 +.better-payment .bp-flexbox-container {
3164 + display: flex;
3165 + align-items: center;
3166 + gap: 5px;
3167 +}
3168 +.better-payment .bp-shortend-text {
3169 + width: 200px;
3170 + white-space: nowrap;
3171 + overflow: hidden;
3172 + text-overflow: ellipsis;
3173 +}
3174 +.better-payment .bp--table-wrapper .bp--table-header {
3175 + min-width: 1640px;
3176 +}
3177 +.better-payment .bp--table-wrapper .bp--table-header.bp-min_width-1300 {
3178 + min-width: 1300px;
3179 + padding-left: 14px;
3180 + padding-right: 14px;
3181 +}
3182 +.better-payment .bp--table-wrapper .bp--table-header .th.details.email {
3183 + max-width: 200px;
3184 + min-width: 200px;
3185 +}
3186 +.better-payment .bp--table-wrapper .bp--table-header .th.details.transaction {
3187 + max-width: 200px;
3188 + min-width: 200px;
3189 +}
3190 +.better-payment .bp--table-wrapper .bp--table-header .th.user-name {
3191 + max-width: 200px;
3192 + min-width: 200px;
3193 +}
3194 +.better-payment .bp--table-wrapper .bp--table-body {
3195 + min-width: 1640px;
3196 +}
3197 +.better-payment .bp--table-wrapper .bp--table-body.bp-min_width-1300 {
3198 + min-width: 1300px;
3199 + padding-left: 14px;
3200 + padding-right: 14px;
3201 +}
3202 +.better-payment .bp--table-wrapper .bp--table-body .td p {
3203 + align-items: center;
3204 + gap: 4px;
3205 +}
3206 +.better-payment .bp--table-wrapper .bp--table-body .td span {
3207 + font-size: 14px;
3208 + color: #48506d;
3209 +}
3210 +.better-payment .bp--table-wrapper .bp--table-body .td.details.email {
3211 + max-width: 200px;
3212 + min-width: 200px;
3213 +}
3214 +.better-payment .bp--table-wrapper .bp--table-body .td.details.email p span:first-child {
3215 + max-width: 170px;
3216 + white-space: nowrap;
3217 + overflow: hidden;
3218 + text-overflow: ellipsis;
3219 +}
3220 +.better-payment .bp--table-wrapper .bp--table-body .td.details.transaction {
3221 + max-width: 200px;
3222 + min-width: 200px;
3223 +}
3224 +.better-payment .bp--table-wrapper .bp--table-body .td.details.transaction p span:first-child {
3225 + max-width: 170px;
3226 + white-space: nowrap;
3227 + overflow: hidden;
3228 + text-overflow: ellipsis;
3229 +}
3230 +.better-payment .bp-copy-clipboard-info,
3231 +.better-payment .bp-email-copy-clipboard-info {
3232 + color: rgb(110, 88, 247) !important;
3233 +}
3234 +.better-payment .better-payment-user-dashboard-container h1,
3235 +.better-payment .better-payment-user-dashboard-container h2,
3236 +.better-payment .better-payment-user-dashboard-container h3,
3237 +.better-payment .better-payment-user-dashboard-container h4,
3238 +.better-payment .better-payment-user-dashboard-container h5,
3239 +.better-payment .better-payment-user-dashboard-container h6,
3240 +.better-payment .better-payment-user-dashboard-container p {
3241 + margin: 0;
3242 + padding: 0;
3243 +}
3244 +.better-payment .bp-logo {
3245 + margin-bottom: 55px;
3246 + text-align: center;
3247 +}
3248 +.better-payment .bp-logo img {
3249 + max-height: 36px;
3250 + width: auto;
3251 +}
3252 +.better-payment .bp-row {
3253 + display: flex;
3254 + flex-wrap: wrap;
3255 + margin-left: -12px;
3256 + margin-right: -12px;
3257 +}
3258 +.better-payment .bp-col {
3259 + position: relative;
3260 + width: 100%;
3261 + min-height: 1px;
3262 + padding-left: 12px;
3263 + padding-right: 12px;
3264 +}
3265 +.better-payment .bp-col1 {
3266 + width: 8.333333333%;
3267 +}
3268 +.better-payment .bp-col_2 {
3269 + width: 16.66666666%;
3270 +}
3271 +.better-payment .bp-col_3 {
3272 + width: 20%;
3273 +}
3274 +.better-payment .bp-col_4 {
3275 + width: 25%;
3276 +}
3277 +.better-payment .bp-col_5 {
3278 + width: 33.333333333%;
3279 +}
3280 +.better-payment .bp-col_6 {
3281 + width: 41.3333333%;
3282 +}
3283 +.better-payment .bp-col_7 {
3284 + width: 50%;
3285 +}
3286 +.better-payment .bp-col_8 {
3287 + width: 58.333333333%;
3288 +}
3289 +.better-payment .bp-col_9 {
3290 + width: 66.666666666%;
3291 +}
3292 +.better-payment .bp-col_10 {
3293 + width: 75%;
3294 +}
3295 +.better-payment .bp-col_11 {
3296 + width: 83.333333333%;
3297 +}
3298 +.better-payment .bp-col_12 {
3299 + width: 91.666666666%;
3300 +}
3301 +.better-payment .bp-col_13 {
3302 + width: 100%;
3303 +}
3304 +.better-payment .w-80 {
3305 + width: 80px;
3306 + text-align: left;
3307 +}
3308 +.better-payment .w-195 {
3309 + flex-basis: 195px;
3310 +}
3311 +.better-payment .bp-amount_wrapper {
3312 + margin-bottom: 24px;
3313 +}
3314 +.better-payment .td-product_logo {
3315 + line-height: 0;
3316 + max-width: 90px;
3317 +}
3318 +.better-payment .td-product_logo img {
3319 + object-fit: contain;
3320 + height: 20px;
3321 + width: 100%;
3322 +}
3323 +.better-payment .bp-dashboard_wrapper {
3324 + width: 100%;
3325 + background-color: #ffffff;
3326 +}
3327 +.better-payment .bp-dashboard_wrapper .bp-dashboard_title {
3328 + font-size: 32px;
3329 + font-weight: 600;
3330 + text-align: left;
3331 + color: #2a3256;
3332 + margin-bottom: 36px;
3333 +}
3334 +.better-payment .bp-amount {
3335 + width: 100%;
3336 + height: auto;
3337 + padding: 0px;
3338 + border-radius: 12px;
3339 + border: 1px solid #eaecf0;
3340 + overflow: hidden;
3341 +}
3342 +.better-payment .bp-amount h4 {
3343 + margin: 16px;
3344 + font-size: 16px;
3345 + font-weight: 500;
3346 + color: #667085;
3347 +}
3348 +.better-payment .bp-amount_price {
3349 + font-size: 30px;
3350 + font-weight: 600;
3351 + text-align: left;
3352 + color: #2a3256;
3353 + padding: 16px;
3354 +}
3355 +.better-payment .bp-transaction {
3356 + padding: 10px 16px;
3357 + background-color: #fafafc;
3358 + width: 100%;
3359 + font-size: 13px;
3360 + font-weight: 400;
3361 + color: #667085;
3362 +}
3363 +@media (min-width: 1500px) {
3364 + .better-payment .bp-amount_price {
3365 + font-size: 40px;
3366 + }
3367 + .better-payment .bp-amount h4 {
3368 + font-size: 18px;
3369 + }
3370 + .better-payment .bp-transaction {
3371 + font-size: 16px;
3372 + }
3373 +}
3374 +.better-payment .bp-transaction_number {
3375 + font-weight: 500;
3376 + color: #6e58f7;
3377 +}
3378 +.better-payment .bp-analytics_chart-wrapper {
3379 + margin-bottom: 24px;
3380 +}
3381 +.better-payment .bp-form_control {
3382 + border: 1px solid #d9e1f4;
3383 + border-radius: 8px;
3384 + padding: 11px 16px;
3385 +}
3386 +.better-payment .bp-form_control option {
3387 + font-size: 14px;
3388 + font-weight: 500;
3389 + color: #48506d;
3390 +}
3391 +.better-payment .filter-btn {
3392 + padding: 8px 16px 8px 16px;
3393 + border-radius: 8px;
3394 +}
3395 +.better-payment .bp-recent_box {
3396 + background-color: #ffffff;
3397 + border: 1px solid #eaecf0;
3398 + border-radius: 16px;
3399 + padding: 0 16px;
3400 +}
3401 +.better-payment .bp-recent_header {
3402 + padding: 16px 0;
3403 + border-bottom: 1px solid #eaecf0;
3404 + margin-bottom: 16px;
3405 +}
3406 +.better-payment .bp-recent_header span {
3407 + line-height: 0;
3408 +}
3409 +.better-payment .bp-view_all-btn {
3410 + font-size: 14px;
3411 + font-weight: 500;
3412 + color: #48506d;
3413 + border: 1px solid #d9e1f4;
3414 + border-radius: 4px;
3415 + padding: 6px 16px;
3416 + text-decoration: none;
3417 +}
3418 +.better-payment .bp-recent_header-title {
3419 + color: #2a3256;
3420 + font-size: 16px;
3421 + font-weight: 600;
3422 +}
3423 +.better-payment .bp-th {
3424 + background-color: #fafafc;
3425 + border-radius: 4px;
3426 + padding: 9px 12px 9px 12px;
3427 + margin-bottom: 4px;
3428 +}
3429 +.better-payment .bp-th h5 {
3430 + font-size: 14px;
3431 + font-weight: 500;
3432 + color: #667085;
3433 +}
3434 +.better-payment .bp-recent_body {
3435 + padding-bottom: 16px;
3436 +}
3437 +.better-payment .bp-product_scroll {
3438 + min-height: 334px;
3439 + max-height: 334px;
3440 + overflow: auto;
3441 +}
3442 +.better-payment .td-product {
3443 + gap: 6px;
3444 + padding: 9px 11px;
3445 +}
3446 +.better-payment .td-product_name {
3447 + font-size: 12px;
3448 + font-weight: 500;
3449 + color: #2a3256;
3450 + margin-bottom: 4px;
3451 +}
3452 +.better-payment .td-details {
3453 + font-size: 10px;
3454 + font-weight: 400;
3455 + color: #667085;
3456 +}
3457 +.better-payment .p-0 {
3458 + padding: 0 !important;
3459 +}
3460 +.better-payment .mb-0 {
3461 + margin-bottom: 0 !important;
3462 +}
3463 +.better-payment .pb-0 {
3464 + padding-bottom: 0 !important;
3465 +}
3466 +.better-payment .pl-0 {
3467 + padding-left: 0 !important;
3468 +}
3469 +.better-payment .w-auto {
3470 + min-width: auto !important;
3471 + width: auto !important;
3472 +}
3473 +.better-payment .line-height-0 {
3474 + line-height: 0;
3475 +}
3476 +.better-payment .better-payment-transaction-import {
3477 + margin-bottom: 5px;
3478 +}
3479 +@media only screen and (max-width: 1200px) {
3480 + .better-payment .bp-amount h4,
3481 + .better-payment .bp-transaction {
3482 + font-size: 14px;
3483 + }
3484 + .better-payment .bp-amount_price {
3485 + font-size: 32px;
3486 + }
3487 + .better-payment .bp-subscription_wrapper .bp-col_7 {
3488 + width: 100%;
3489 + }
3490 + .better-payment .bp-analytics_chart-wrapper .bp-col_10,
3491 + .better-payment .bp-analytics_chart-wrapper .bp-col_4 {
3492 + width: 100%;
3493 + }
3494 +}
3495 +@media only screen and (max-width: 1024px) {
3496 + .better-payment .bp-logo {
3497 + margin-bottom: 45px;
3498 + }
3499 + .better-payment .bp-amount_wrapper .bp-col_4 {
3500 + width: 50%;
3501 + }
3502 + .better-payment .bp-amount {
3503 + margin-bottom: 24px;
3504 + }
3505 + .better-payment .bp-th,
3506 + .better-payment .bp-td {
3507 + justify-content: space-between;
3508 + }
3509 + .better-payment .bp-th {
3510 + padding: 9px 0px 9px 12px;
3511 + }
3512 +}
3513 +@media only screen and (max-width: 800px) {
3514 + .better-payment .flex-wrap {
3515 + flex-wrap: wrap !important;
3516 + }
3517 + .better-payment .bp-amount_wrapper .bp-col_4 {
3518 + width: 100% !important;
3519 + }
3520 +}
3521 +@media only screen and (max-width: 1024px) {
3522 + .better-payment .gap-2 {
3523 + gap: 4px;
3524 + }
3525 + .better-payment .gap-3 {
3526 + gap: 6px;
3527 + }
3528 + .better-payment .gap-4 {
3529 + gap: 8px;
3530 + }
3531 + .better-payment .gap-5 {
3532 + gap: 12px;
3533 + }
3534 + .better-payment .gap-6 {
3535 + gap: 16px;
3536 + }
3537 + .better-payment .gap-10 {
3538 + gap: 24px;
3539 + }
3540 + .better-payment h2 {
3541 + font-size: 20px;
3542 + }
3543 + .better-payment button {
3544 + font-size: 12px;
3545 + padding: 7px 12px;
3546 + }
3547 + .better-payment button.primary-btn {
3548 + font-size: 14px;
3549 + padding: 10px 16px;
3550 + }
3551 + .better-payment .bp--sidebar-wrapper {
3552 + min-width: 200px;
3553 + }
3554 + .better-payment .bp--sidebar-nav-list {
3555 + gap: 10px;
3556 + }
3557 + .better-payment .bp--sidebar-nav {
3558 + gap: 8px;
3559 + }
3560 + .better-payment .bp--author {
3561 + gap: 12px;
3562 + margin-bottom: 40px;
3563 + }
3564 + .better-payment span.bp--nav-icon svg {
3565 + width: 20px;
3566 + height: 20px;
3567 + }
3568 + .better-payment .bp--sidebar-nav .bp--nav-text {
3569 + font-size: 14px;
3570 + }
3571 + .better-payment .bp--db-main-wrapper {
3572 + padding-right: 16px;
3573 + flex-basis: calc(100% - 216px);
3574 + max-width: calc(100% - 216px);
3575 + }
3576 + .better-payment .bp--db-header {
3577 + padding: 12px 20px;
3578 + margin-bottom: 16px;
3579 + }
3580 + .better-payment .bp--table-body {
3581 + padding: 10px 20px;
3582 + }
3583 + .better-payment .bp--table-body .td .action-icon {
3584 + width: 36px;
3585 + height: 30px;
3586 + }
3587 + .better-payment .bp--table-header .th {
3588 + font-size: 14px;
3589 + }
3590 + .better-payment .bp--table-body .td p {
3591 + font-size: 12px;
3592 + }
3593 + .better-payment .bp--table-body .td span.action-icon i {
3594 + font-size: 16px;
3595 + }
3596 +}
3597 +.better-payment .bp-no_subscription-text {
3598 + font-size: 14px;
3599 + color: #48506d;
3600 + font-weight: 400;
3601 +}
3602 +.better-payment .td-product_price span {
3603 + font-size: 13px;
3604 + font-weight: 600;
3605 + color: #2a3256;
3606 +}
3607 +.better-payment .padding-0 {
3608 + padding: 0px;
3609 +}
3610 +.better-payment .bp-hidden-xs {
3611 + display: block;
3612 +}
3613 +.better-payment .bp-visible-xs {
3614 + display: none;
3615 +}
3616 +.better-payment {
3617 + /* Media Queries : Start */
3618 +}
3619 +@media (max-width: 767.98px) {
3620 + .better-payment .bp-hidden-xs {
3621 + display: none;
3622 + }
3623 + .better-payment .bp-visible-xs {
3624 + display: block;
3625 + }
3626 + .better-payment .bp--db-main-wrapper {
3627 + width: 100%;
3628 + max-width: 100%;
3629 + flex-basis: 100%;
3630 + padding-right: 0px;
3631 + }
3632 + .better-payment .better-payment-user-dashboard-sidebar {
3633 + position: absolute;
3634 + top: 0;
3635 + left: 0;
3636 + z-index: 999;
3637 + height: 100%;
3638 + }
3639 + .better-payment .bp-overlay {
3640 + position: absolute;
3641 + top: 0;
3642 + bottom: 0;
3643 + left: 0;
3644 + right: 0;
3645 + background-color: rgba(0, 0, 0, 0.5);
3646 + z-index: 1;
3647 + display: none;
3648 + }
3649 + .better-payment .bp-dashboard-hamburger {
3650 + background: transparent;
3651 + cursor: pointer;
3652 + display: flex;
3653 + align-items: center;
3654 + }
3655 +}
3656 +.better-payment {
3657 + /* Media Queries : End */
3658 +}
3659 +
3660 +.better-payment-warning {
3661 + font-size: 13px;
3662 + line-height: 18px;
3663 + background-color: #f3f0ca;
3664 + color: #886726;
3665 + padding: 10px;
3666 + border-radius: 3px;
3667 +}
3668 +
3669 +.better-payment-dynamic-value-info {
3670 + word-break: break-word;
3671 +}
3672 +
3673 +div.bp-thank_page-custom-logo_wrapper-error svg {
3674 + width: 70px;
3675 + height: 70px;
3676 + background: rgba(238, 96, 89, 0.1019607843);
3677 + padding: 10px;
3678 + border-radius: 16px;
3679 +}
3680 +div.bp-thank_page-custom-logo_wrapper-error svg path {
3681 + stroke: #f44336;
3682 + fill: #f44336;
3683 +}
3684 +
3685 +.bp-thank_page div.bp-thank_page-custom-logo_wrapper-success svg {
3686 + width: 70px;
3687 + height: 70px;
3688 + background: rgba(107, 89, 238, 0.1019607843);
3689 + padding: 10px;
3690 + border-radius: 16px;
3691 +}
3692 +.bp-thank_page div.bp-thank_page-custom-logo_wrapper-success svg path {
3693 + stroke: #6b59ee;
3694 + fill: #6b59ee;
3695 +}
3696 +
3697 +.bp-thank_page-logo {
3698 + display: flex;
3699 + align-items: center;
3700 + justify-content: center;
3701 +}
3702 +
3703 +div.bp-thank_page-custom-logo_wrapper-success.pf-block {
3704 + display: flex;
3705 + align-items: center;
3706 + justify-content: center;
3707 + line-height: 0;
3708 + width: 70px;
3709 + height: 70px;
3710 + background: rgba(107, 89, 238, 0.1019607843);
3711 + padding: 10px;
3712 + border-radius: 16px;
3713 +}
3714 +div.bp-thank_page-custom-logo_wrapper-success.pf-block span,
3715 +div.bp-thank_page-custom-logo_wrapper-success.pf-block i {
3716 + font-size: 42px;
3717 + color: #6b59ee;
3718 + height: auto;
3719 + width: auto;
3720 +}
3721 +
3722 +div.bp-thank_page-custom-logo_wrapper-error.pf-block {
3723 + display: flex;
3724 + align-items: center;
3725 + justify-content: center;
3726 + line-height: 0;
3727 + width: 70px;
3728 + height: 70px;
3729 + background: rgba(238, 96, 89, 0.1019607843);
3730 + padding: 10px;
3731 + border-radius: 16px;
3732 +}
3733 +div.bp-thank_page-custom-logo_wrapper-error.pf-block span,
3734 +div.bp-thank_page-custom-logo_wrapper-error.pf-block i {
3735 + font-size: 42px;
3736 + color: #f44336;
3737 + height: auto;
3738 + width: auto;
3739 +}
3740 +
3741 +.better-payment a {
3742 + text-decoration: none;
3743 +}