@truconsent/consent-notice 0.0.2 → 0.0.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/MarsConsentModal.css +133 -128
- package/dist/RightCenter.css +88 -94
- package/dist/banner-styles.css +46 -49
- package/dist/index.css +1 -1
- package/dist/index.css.map +1 -1
- package/dist/index.esm.js +1 -1
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +1 -1
- package/dist/index.js.map +1 -1
- package/dist/index.umd.js +1 -1
- package/dist/index.umd.js.map +1 -1
- package/dist/tailwind.css +1 -1
- package/dist/variables.css +52 -1
- package/package.json +1 -1
|
@@ -3,8 +3,9 @@
|
|
|
3
3
|
top: 0 !important;
|
|
4
4
|
left: 0 !important;
|
|
5
5
|
width: 100% !important;
|
|
6
|
+
width: 100% !important;
|
|
6
7
|
height: 100% !important;
|
|
7
|
-
background:
|
|
8
|
+
background: var(--banner-overlay);
|
|
8
9
|
display: flex !important;
|
|
9
10
|
align-items: center !important;
|
|
10
11
|
justify-content: center !important;
|
|
@@ -28,7 +29,7 @@
|
|
|
28
29
|
}
|
|
29
30
|
|
|
30
31
|
.mcm-container {
|
|
31
|
-
background:
|
|
32
|
+
background: var(--banner-bg);
|
|
32
33
|
border-radius: 16px;
|
|
33
34
|
width: 100%;
|
|
34
35
|
max-height: 85vh;
|
|
@@ -44,10 +45,11 @@
|
|
|
44
45
|
position: absolute;
|
|
45
46
|
top: -12px;
|
|
46
47
|
right: -12px;
|
|
48
|
+
right: -12px;
|
|
47
49
|
width: 32px;
|
|
48
50
|
height: 32px;
|
|
49
|
-
background:
|
|
50
|
-
border: 1px solid
|
|
51
|
+
background: var(--banner-bg);
|
|
52
|
+
border: 1px solid var(--banner-border);
|
|
51
53
|
border-radius: 50%;
|
|
52
54
|
display: flex !important;
|
|
53
55
|
align-items: center;
|
|
@@ -55,17 +57,17 @@
|
|
|
55
57
|
cursor: pointer;
|
|
56
58
|
font-size: 22px;
|
|
57
59
|
line-height: 1;
|
|
58
|
-
color:
|
|
60
|
+
color: var(--banner-text-muted);
|
|
59
61
|
z-index: 10005;
|
|
60
62
|
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
|
|
61
63
|
transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
|
|
62
64
|
}
|
|
63
65
|
|
|
64
66
|
.mcm-close-btn:hover {
|
|
65
|
-
background:
|
|
66
|
-
color:
|
|
67
|
+
background: var(--banner-card-bg);
|
|
68
|
+
color: var(--banner-text);
|
|
67
69
|
transform: scale(1.1) rotate(90deg);
|
|
68
|
-
border-color:
|
|
70
|
+
border-color: var(--banner-text-muted);
|
|
69
71
|
}
|
|
70
72
|
|
|
71
73
|
.mcm-header {
|
|
@@ -83,17 +85,18 @@
|
|
|
83
85
|
.mcm-header-text h1 {
|
|
84
86
|
margin: 0;
|
|
85
87
|
font-size: 1.25rem;
|
|
88
|
+
color: var(--banner-text);
|
|
86
89
|
}
|
|
87
90
|
|
|
88
91
|
.mcm-header-text p {
|
|
89
92
|
margin: 0;
|
|
90
93
|
font-size: 0.9rem;
|
|
91
|
-
color:
|
|
94
|
+
color: var(--banner-text-muted);
|
|
92
95
|
}
|
|
93
96
|
|
|
94
97
|
.mcm-separator {
|
|
95
98
|
height: 1px;
|
|
96
|
-
background:
|
|
99
|
+
background: var(--banner-border);
|
|
97
100
|
margin: 10px 0;
|
|
98
101
|
}
|
|
99
102
|
|
|
@@ -104,7 +107,7 @@
|
|
|
104
107
|
}
|
|
105
108
|
|
|
106
109
|
.mcm-card {
|
|
107
|
-
border: 1px solid
|
|
110
|
+
border: 1px solid var(--banner-border);
|
|
108
111
|
border-radius: 4px;
|
|
109
112
|
padding: 10px;
|
|
110
113
|
}
|
|
@@ -117,7 +120,7 @@
|
|
|
117
120
|
|
|
118
121
|
.mcm-purpose-desc {
|
|
119
122
|
font-size: 0.9rem;
|
|
120
|
-
color:
|
|
123
|
+
color: var(--banner-text-muted);
|
|
121
124
|
}
|
|
122
125
|
|
|
123
126
|
.badge {
|
|
@@ -125,18 +128,19 @@
|
|
|
125
128
|
padding: 2px 6px;
|
|
126
129
|
font-size: 0.75rem;
|
|
127
130
|
border-radius: 4px;
|
|
128
|
-
background:
|
|
131
|
+
background: var(--banner-border);
|
|
132
|
+
color: var(--banner-text);
|
|
129
133
|
margin-right: 5px;
|
|
130
134
|
}
|
|
131
135
|
|
|
132
136
|
.badge.mandatory {
|
|
133
|
-
background:
|
|
134
|
-
color:
|
|
137
|
+
background: var(--banner-danger-bg);
|
|
138
|
+
color: var(--banner-danger-text);
|
|
135
139
|
}
|
|
136
140
|
|
|
137
141
|
.badge.expiry {
|
|
138
|
-
background:
|
|
139
|
-
color:
|
|
142
|
+
background: var(--banner-info-bg);
|
|
143
|
+
color: var(--banner-primary-color);
|
|
140
144
|
}
|
|
141
145
|
|
|
142
146
|
.switch {
|
|
@@ -160,7 +164,7 @@
|
|
|
160
164
|
left: 0;
|
|
161
165
|
right: 0;
|
|
162
166
|
bottom: 0;
|
|
163
|
-
background:
|
|
167
|
+
background: var(--banner-border);
|
|
164
168
|
border-radius: 20px;
|
|
165
169
|
}
|
|
166
170
|
|
|
@@ -171,13 +175,13 @@
|
|
|
171
175
|
width: 16px;
|
|
172
176
|
left: 2px;
|
|
173
177
|
bottom: 2px;
|
|
174
|
-
background:
|
|
178
|
+
background: var(--banner-bg);
|
|
175
179
|
border-radius: 50%;
|
|
176
180
|
transition: .2s;
|
|
177
181
|
}
|
|
178
182
|
|
|
179
183
|
input:checked+.track {
|
|
180
|
-
background:
|
|
184
|
+
background: var(--banner-success-text);
|
|
181
185
|
}
|
|
182
186
|
|
|
183
187
|
input:checked+.track+.thumb {
|
|
@@ -192,6 +196,7 @@ input:checked+.track+.thumb {
|
|
|
192
196
|
width: 100%;
|
|
193
197
|
background: none;
|
|
194
198
|
border: none;
|
|
199
|
+
color: var(--banner-text);
|
|
195
200
|
text-align: left;
|
|
196
201
|
padding: 8px 0;
|
|
197
202
|
font-size: 1rem;
|
|
@@ -208,7 +213,8 @@ input:checked+.track+.thumb {
|
|
|
208
213
|
.pill {
|
|
209
214
|
display: inline-block;
|
|
210
215
|
padding: 4px 8px;
|
|
211
|
-
background:
|
|
216
|
+
background: var(--banner-info-bg);
|
|
217
|
+
color: var(--banner-primary-color);
|
|
212
218
|
border-radius: 12px;
|
|
213
219
|
margin: 2px;
|
|
214
220
|
font-size: 0.8rem;
|
|
@@ -231,19 +237,19 @@ input:checked+.track+.thumb {
|
|
|
231
237
|
}
|
|
232
238
|
|
|
233
239
|
.mcm-btn.reject {
|
|
234
|
-
background:
|
|
235
|
-
color:
|
|
240
|
+
background: var(--banner-danger-btn);
|
|
241
|
+
color: var(--banner-bg);
|
|
236
242
|
margin-right: 10px;
|
|
237
243
|
}
|
|
238
244
|
|
|
239
245
|
.mcm-btn.consent {
|
|
240
|
-
background:
|
|
241
|
-
color:
|
|
246
|
+
background: var(--banner-primary-color);
|
|
247
|
+
color: var(--banner-bg);
|
|
242
248
|
}
|
|
243
249
|
|
|
244
250
|
.mcm-spinner {
|
|
245
|
-
border: 4px solid
|
|
246
|
-
border-top-color:
|
|
251
|
+
border: 4px solid var(--banner-border);
|
|
252
|
+
border-top-color: var(--banner-primary-color);
|
|
247
253
|
border-radius: 50%;
|
|
248
254
|
width: 48px;
|
|
249
255
|
height: 48px;
|
|
@@ -314,7 +320,7 @@ input:checked+.track+.thumb {
|
|
|
314
320
|
|
|
315
321
|
.mcm-wrapper.bottom-bar .mcm-container {
|
|
316
322
|
border-radius: 0 !important;
|
|
317
|
-
border-top: 1px solid
|
|
323
|
+
border-top: 1px solid var(--banner-border);
|
|
318
324
|
max-height: 50vh;
|
|
319
325
|
box-shadow: 0 -10px 15px -3px rgba(0, 0, 0, 0.1);
|
|
320
326
|
}
|
|
@@ -330,11 +336,10 @@ input:checked+.track+.thumb {
|
|
|
330
336
|
}
|
|
331
337
|
}
|
|
332
338
|
|
|
333
|
-
/* Center Modal Template (Existing Default) */
|
|
334
339
|
.mcm-overlay.center-modal {
|
|
335
340
|
align-items: center !important;
|
|
336
341
|
justify-content: center !important;
|
|
337
|
-
background:
|
|
342
|
+
background: var(--banner-overlay) !important;
|
|
338
343
|
}
|
|
339
344
|
|
|
340
345
|
.mcm-wrapper.center-modal {
|
|
@@ -342,11 +347,10 @@ input:checked+.track+.thumb {
|
|
|
342
347
|
max-width: 550px;
|
|
343
348
|
}
|
|
344
349
|
|
|
345
|
-
/* Side Panel Template */
|
|
346
350
|
.mcm-overlay.side-panel {
|
|
347
351
|
align-items: stretch !important;
|
|
348
352
|
justify-content: flex-end !important;
|
|
349
|
-
background:
|
|
353
|
+
background: var(--banner-overlay) !important;
|
|
350
354
|
}
|
|
351
355
|
|
|
352
356
|
.mcm-wrapper.side-panel {
|
|
@@ -359,7 +363,7 @@ input:checked+.track+.thumb {
|
|
|
359
363
|
height: 100vh;
|
|
360
364
|
max-height: 100vh;
|
|
361
365
|
border-radius: 0;
|
|
362
|
-
border-left: 1px solid
|
|
366
|
+
border-left: 1px solid var(--banner-border);
|
|
363
367
|
}
|
|
364
368
|
|
|
365
369
|
/* Mobile adjustments for side panel */
|
|
@@ -380,21 +384,21 @@ input:checked+.track+.thumb {
|
|
|
380
384
|
.mcm-cookie-summary-title {
|
|
381
385
|
font-size: 1rem;
|
|
382
386
|
font-weight: 600;
|
|
383
|
-
color:
|
|
387
|
+
color: var(--banner-text);
|
|
384
388
|
margin: 0;
|
|
385
389
|
}
|
|
386
390
|
|
|
387
391
|
.mcm-cookie-summary-text {
|
|
388
392
|
font-size: 0.8125rem;
|
|
389
393
|
line-height: 1.4;
|
|
390
|
-
color:
|
|
394
|
+
color: var(--banner-text-muted);
|
|
391
395
|
margin: 0;
|
|
392
396
|
}
|
|
393
397
|
|
|
394
398
|
.mcm-cookie-summary-footer-links {
|
|
395
399
|
display: block;
|
|
396
400
|
font-size: 0.725rem;
|
|
397
|
-
color:
|
|
401
|
+
color: var(--banner-text-muted);
|
|
398
402
|
margin-top: 0.25rem;
|
|
399
403
|
line-height: 1.4;
|
|
400
404
|
width: 100%;
|
|
@@ -405,13 +409,13 @@ input:checked+.track+.thumb {
|
|
|
405
409
|
}
|
|
406
410
|
|
|
407
411
|
.mcm-cookie-summary-footer-links .mcm-link {
|
|
408
|
-
color:
|
|
412
|
+
color: var(--banner-text-muted);
|
|
409
413
|
text-decoration: underline;
|
|
410
414
|
cursor: pointer;
|
|
411
415
|
}
|
|
412
416
|
|
|
413
417
|
.mcm-cookie-summary-footer-links .mcm-link:hover {
|
|
414
|
-
color:
|
|
418
|
+
color: var(--banner-text);
|
|
415
419
|
}
|
|
416
420
|
|
|
417
421
|
.mcm-separator-pipe {
|
|
@@ -423,11 +427,11 @@ input:checked+.track+.thumb {
|
|
|
423
427
|
|
|
424
428
|
.mcm-powered-by {
|
|
425
429
|
font-size: 0.625rem;
|
|
426
|
-
color:
|
|
430
|
+
color: var(--banner-text-muted);
|
|
427
431
|
text-align: center;
|
|
428
432
|
padding: 0.375rem;
|
|
429
|
-
background-color:
|
|
430
|
-
border-top: 1px solid
|
|
433
|
+
background-color: var(--banner-card-bg);
|
|
434
|
+
border-top: 1px solid var(--banner-border);
|
|
431
435
|
width: calc(100% + 2.5rem);
|
|
432
436
|
/* Negate parent padding */
|
|
433
437
|
margin-left: -1.25rem;
|
|
@@ -438,7 +442,7 @@ input:checked+.track+.thumb {
|
|
|
438
442
|
|
|
439
443
|
.mcm-brand {
|
|
440
444
|
font-weight: 600;
|
|
441
|
-
color:
|
|
445
|
+
color: var(--banner-text);
|
|
442
446
|
}
|
|
443
447
|
|
|
444
448
|
.mcm-cookie-summary-actions {
|
|
@@ -461,8 +465,8 @@ input:checked+.track+.thumb {
|
|
|
461
465
|
|
|
462
466
|
.mcm-summary-btn.text {
|
|
463
467
|
background: transparent;
|
|
464
|
-
color:
|
|
465
|
-
border: 1px solid
|
|
468
|
+
color: var(--banner-primary-color);
|
|
469
|
+
border: 1px solid var(--banner-border);
|
|
466
470
|
padding: 0.5rem 0.65rem;
|
|
467
471
|
font-size: 0.8125rem;
|
|
468
472
|
margin-top: 0;
|
|
@@ -470,7 +474,7 @@ input:checked+.track+.thumb {
|
|
|
470
474
|
|
|
471
475
|
.mcm-cookie-summary hr {
|
|
472
476
|
border: 0;
|
|
473
|
-
border-top: 1px solid
|
|
477
|
+
border-top: 1px solid var(--banner-border);
|
|
474
478
|
margin: 0;
|
|
475
479
|
width: 100%;
|
|
476
480
|
}
|
|
@@ -482,9 +486,9 @@ input:checked+.track+.thumb {
|
|
|
482
486
|
}
|
|
483
487
|
|
|
484
488
|
.mcm-summary-btn.secondary {
|
|
485
|
-
background-color:
|
|
486
|
-
color:
|
|
487
|
-
border-color:
|
|
489
|
+
background-color: var(--banner-card-bg);
|
|
490
|
+
color: var(--banner-text);
|
|
491
|
+
border-color: var(--banner-border);
|
|
488
492
|
}
|
|
489
493
|
|
|
490
494
|
|
|
@@ -493,14 +497,14 @@ input:checked+.track+.thumb {
|
|
|
493
497
|
|
|
494
498
|
/* Floating Card Summary (Redacto style) */
|
|
495
499
|
.mcm-wrapper.floating-card .mcm-cookie-summary {
|
|
496
|
-
background:
|
|
500
|
+
background: var(--banner-bg);
|
|
497
501
|
border-radius: 1rem;
|
|
498
502
|
}
|
|
499
503
|
|
|
500
504
|
/* Bottom Bar Summary (Refined Row-based Light theme) */
|
|
501
505
|
.mcm-wrapper.bottom-bar .mcm-container {
|
|
502
|
-
background:
|
|
503
|
-
border-top: 1px solid
|
|
506
|
+
background: var(--banner-bg);
|
|
507
|
+
border-top: 1px solid var(--banner-border);
|
|
504
508
|
padding-bottom: 32px;
|
|
505
509
|
/* Increased to lift bar up */
|
|
506
510
|
position: relative;
|
|
@@ -528,7 +532,7 @@ input:checked+.track+.thumb {
|
|
|
528
532
|
}
|
|
529
533
|
|
|
530
534
|
.mcm-wrapper.bottom-bar .mcm-cookie-summary-title {
|
|
531
|
-
color:
|
|
535
|
+
color: var(--banner-text);
|
|
532
536
|
font-size: 1.125rem;
|
|
533
537
|
font-weight: 800;
|
|
534
538
|
margin-bottom: 0.25rem;
|
|
@@ -536,7 +540,7 @@ input:checked+.track+.thumb {
|
|
|
536
540
|
}
|
|
537
541
|
|
|
538
542
|
.mcm-wrapper.bottom-bar .mcm-cookie-summary-text {
|
|
539
|
-
color:
|
|
543
|
+
color: var(--banner-text-muted);
|
|
540
544
|
font-size: 0.875rem;
|
|
541
545
|
line-height: 1.5;
|
|
542
546
|
}
|
|
@@ -561,34 +565,34 @@ input:checked+.track+.thumb {
|
|
|
561
565
|
|
|
562
566
|
.mcm-wrapper.bottom-bar .mcm-cookie-summary-footer-links {
|
|
563
567
|
flex: 1 1 100%;
|
|
564
|
-
color:
|
|
568
|
+
color: var(--banner-text-muted);
|
|
565
569
|
font-size: 0.8125rem;
|
|
566
570
|
line-height: 1.6;
|
|
567
571
|
margin-top: 0;
|
|
568
572
|
text-align: left;
|
|
569
573
|
display: block !important;
|
|
570
|
-
border-top: 1px solid
|
|
574
|
+
border-top: 1px solid var(--banner-border);
|
|
571
575
|
padding-top: 0.375rem;
|
|
572
576
|
/* Reduced from 0.5rem */
|
|
573
577
|
}
|
|
574
578
|
|
|
575
579
|
.mcm-wrapper.bottom-bar .mcm-cookie-summary-footer-links .mcm-link {
|
|
576
|
-
color:
|
|
580
|
+
color: var(--banner-text);
|
|
577
581
|
text-decoration: underline;
|
|
578
582
|
text-underline-offset: 2px;
|
|
579
583
|
transition: all 0.2s ease;
|
|
580
584
|
}
|
|
581
585
|
|
|
582
586
|
.mcm-wrapper.bottom-bar .mcm-summary-btn.secondary {
|
|
583
|
-
background:
|
|
584
|
-
color:
|
|
585
|
-
border-color:
|
|
587
|
+
background: var(--banner-card-bg);
|
|
588
|
+
color: var(--banner-text);
|
|
589
|
+
border-color: var(--banner-border);
|
|
586
590
|
}
|
|
587
591
|
|
|
588
592
|
.mcm-wrapper.bottom-bar .mcm-summary-btn.text {
|
|
589
|
-
color:
|
|
590
|
-
border: 1px solid
|
|
591
|
-
background:
|
|
593
|
+
color: var(--banner-primary-color);
|
|
594
|
+
border: 1px solid var(--banner-border);
|
|
595
|
+
background: var(--banner-bg);
|
|
592
596
|
border-radius: 0.5rem;
|
|
593
597
|
}
|
|
594
598
|
|
|
@@ -598,9 +602,9 @@ input:checked+.track+.thumb {
|
|
|
598
602
|
/* Lifted up */
|
|
599
603
|
left: 0;
|
|
600
604
|
right: 0;
|
|
601
|
-
background-color:
|
|
602
|
-
border-top: 1px solid
|
|
603
|
-
color:
|
|
605
|
+
background-color: var(--banner-card-bg);
|
|
606
|
+
border-top: 1px solid var(--banner-border);
|
|
607
|
+
color: var(--banner-text-muted);
|
|
604
608
|
padding: 0.25rem;
|
|
605
609
|
gap: 4px;
|
|
606
610
|
/* Added space */
|
|
@@ -648,15 +652,15 @@ input:checked+.track+.thumb {
|
|
|
648
652
|
height: 100%;
|
|
649
653
|
max-height: 100vh;
|
|
650
654
|
border-radius: 0 !important;
|
|
651
|
-
border-left: 1px solid
|
|
655
|
+
border-left: 1px solid var(--banner-border) !important;
|
|
652
656
|
}
|
|
653
657
|
|
|
654
658
|
.mcm-wrapper.side-panel .mcm-close-btn {
|
|
655
659
|
top: 0px !important;
|
|
656
660
|
left: -16px !important;
|
|
657
661
|
/* Half-inside, half-outside */
|
|
658
|
-
background:
|
|
659
|
-
border: 1px solid
|
|
662
|
+
background: var(--banner-bg) !important;
|
|
663
|
+
border: 1px solid var(--banner-border) !important;
|
|
660
664
|
}
|
|
661
665
|
|
|
662
666
|
@keyframes mcm-drawer-slide-in {
|
|
@@ -688,14 +692,14 @@ input:checked+.track+.thumb {
|
|
|
688
692
|
|
|
689
693
|
.mcm-wrapper.modern-modal .mcm-header {
|
|
690
694
|
padding: 24px 24px 16px !important;
|
|
691
|
-
border-bottom: 1px solid
|
|
695
|
+
border-bottom: 1px solid var(--banner-border) !important;
|
|
692
696
|
margin-bottom: 0 !important;
|
|
693
697
|
}
|
|
694
698
|
|
|
695
699
|
.mcm-wrapper.modern-modal .mcm-header-text h1 {
|
|
696
700
|
font-size: 1.5rem !important;
|
|
697
701
|
font-weight: 700 !important;
|
|
698
|
-
color:
|
|
702
|
+
color: var(--banner-text) !important;
|
|
699
703
|
}
|
|
700
704
|
|
|
701
705
|
.mcm-wrapper.modern-modal .mcm-body {
|
|
@@ -705,35 +709,35 @@ input:checked+.track+.thumb {
|
|
|
705
709
|
|
|
706
710
|
/* Modern Card Styling */
|
|
707
711
|
.mcm-wrapper.modern-modal .mcm-card {
|
|
708
|
-
border: 1px solid
|
|
712
|
+
border: 1px solid var(--banner-border) !important;
|
|
709
713
|
border-radius: 10px !important;
|
|
710
714
|
padding: 20px !important;
|
|
711
|
-
background:
|
|
715
|
+
background: var(--banner-bg) !important;
|
|
712
716
|
box-shadow: none !important;
|
|
713
717
|
transition: border-color 0.2s ease !important;
|
|
714
718
|
}
|
|
715
719
|
|
|
716
720
|
.mcm-wrapper.modern-modal .mcm-card:hover {
|
|
717
|
-
border-color:
|
|
721
|
+
border-color: var(--banner-text-muted) !important;
|
|
718
722
|
}
|
|
719
723
|
|
|
720
724
|
.mcm-wrapper.modern-modal .mcm-card h3 {
|
|
721
725
|
font-size: 1.1rem !important;
|
|
722
726
|
font-weight: 700 !important;
|
|
723
|
-
color:
|
|
727
|
+
color: var(--banner-text) !important;
|
|
724
728
|
}
|
|
725
729
|
|
|
726
730
|
.mcm-wrapper.modern-modal .mcm-purpose-desc {
|
|
727
731
|
font-size: 0.95rem !important;
|
|
728
|
-
color:
|
|
732
|
+
color: var(--banner-text-muted) !important;
|
|
729
733
|
line-height: 1.6 !important;
|
|
730
734
|
margin-top: 8px !important;
|
|
731
735
|
}
|
|
732
736
|
|
|
733
737
|
/* Modern Badge Styling */
|
|
734
738
|
.mcm-wrapper.modern-modal .badge.mandatory {
|
|
735
|
-
background:
|
|
736
|
-
color:
|
|
739
|
+
background: var(--banner-danger-bg) !important;
|
|
740
|
+
color: var(--banner-danger-text) !important;
|
|
737
741
|
padding: 4px 16px !important;
|
|
738
742
|
font-size: 0.75rem !important;
|
|
739
743
|
font-weight: 700 !important;
|
|
@@ -748,8 +752,8 @@ input:checked+.track+.thumb {
|
|
|
748
752
|
justify-content: space-between !important;
|
|
749
753
|
align-items: center !important;
|
|
750
754
|
padding: 20px 24px !important;
|
|
751
|
-
background:
|
|
752
|
-
border-top: 1px solid
|
|
755
|
+
background: var(--banner-bg) !important;
|
|
756
|
+
border-top: 1px solid var(--banner-border) !important;
|
|
753
757
|
}
|
|
754
758
|
|
|
755
759
|
.mcm-wrapper.modern-modal .mcm-summary-btn {
|
|
@@ -762,15 +766,15 @@ input:checked+.track+.thumb {
|
|
|
762
766
|
.mcm-wrapper.modern-modal .mcm-summary-btn.secondary {
|
|
763
767
|
/* Only Essential */
|
|
764
768
|
background: transparent !important;
|
|
765
|
-
color:
|
|
766
|
-
border: 1px solid
|
|
769
|
+
color: var(--banner-text) !important;
|
|
770
|
+
border: 1px solid var(--banner-border) !important;
|
|
767
771
|
margin-right: auto !important;
|
|
768
772
|
}
|
|
769
773
|
|
|
770
774
|
.mcm-wrapper.modern-modal .mcm-summary-btn.primary {
|
|
771
775
|
/* Accept All */
|
|
772
|
-
background:
|
|
773
|
-
color:
|
|
776
|
+
background: var(--banner-primary-color) !important;
|
|
777
|
+
color: var(--banner-bg) !important;
|
|
774
778
|
border: none !important;
|
|
775
779
|
}
|
|
776
780
|
|
|
@@ -787,7 +791,7 @@ input:checked+.track+.thumb {
|
|
|
787
791
|
flex-direction: column;
|
|
788
792
|
height: 100%;
|
|
789
793
|
max-height: 85vh;
|
|
790
|
-
background:
|
|
794
|
+
background: var(--banner-bg);
|
|
791
795
|
font-family: inherit;
|
|
792
796
|
font-size: inherit;
|
|
793
797
|
}
|
|
@@ -795,7 +799,7 @@ input:checked+.track+.thumb {
|
|
|
795
799
|
/* Header */
|
|
796
800
|
.preferences-header {
|
|
797
801
|
padding: 1.5rem 1.5rem 1rem;
|
|
798
|
-
border-bottom: 1px solid
|
|
802
|
+
border-bottom: 1px solid var(--banner-border);
|
|
799
803
|
display: flex;
|
|
800
804
|
justify-content: space-between;
|
|
801
805
|
align-items: center;
|
|
@@ -805,13 +809,13 @@ input:checked+.track+.thumb {
|
|
|
805
809
|
margin: 0;
|
|
806
810
|
font-size: 1.5rem;
|
|
807
811
|
font-weight: 700;
|
|
808
|
-
color:
|
|
812
|
+
color: var(--banner-text);
|
|
809
813
|
}
|
|
810
814
|
|
|
811
815
|
.preferences-close-btn {
|
|
812
816
|
background: transparent;
|
|
813
817
|
border: none;
|
|
814
|
-
color:
|
|
818
|
+
color: var(--banner-text-muted);
|
|
815
819
|
cursor: pointer;
|
|
816
820
|
padding: 6px;
|
|
817
821
|
display: flex;
|
|
@@ -822,8 +826,8 @@ input:checked+.track+.thumb {
|
|
|
822
826
|
}
|
|
823
827
|
|
|
824
828
|
.preferences-close-btn:hover {
|
|
825
|
-
color:
|
|
826
|
-
background:
|
|
829
|
+
color: var(--banner-text);
|
|
830
|
+
background: var(--banner-hover-bg);
|
|
827
831
|
}
|
|
828
832
|
|
|
829
833
|
/* Hide the global close button for this layout */
|
|
@@ -834,7 +838,7 @@ input:checked+.track+.thumb {
|
|
|
834
838
|
/* Intro Text */
|
|
835
839
|
.preferences-intro {
|
|
836
840
|
padding: 1.25rem 1.5rem;
|
|
837
|
-
color:
|
|
841
|
+
color: var(--banner-text-muted);
|
|
838
842
|
font-size: 0.95rem;
|
|
839
843
|
line-height: 1.6;
|
|
840
844
|
}
|
|
@@ -851,12 +855,12 @@ input:checked+.track+.thumb {
|
|
|
851
855
|
|
|
852
856
|
/* Purpose Card */
|
|
853
857
|
.preferences-purpose-card {
|
|
854
|
-
border: 1px solid
|
|
855
|
-
border-left: 4px solid
|
|
858
|
+
border: 1px solid var(--banner-border);
|
|
859
|
+
border-left: 4px solid var(--banner-text);
|
|
856
860
|
/* Left accent border */
|
|
857
861
|
border-radius: 8px;
|
|
858
862
|
padding: 1.25rem;
|
|
859
|
-
background:
|
|
863
|
+
background: var(--banner-bg);
|
|
860
864
|
transition: box-shadow 0.2s ease;
|
|
861
865
|
}
|
|
862
866
|
|
|
@@ -882,16 +886,16 @@ input:checked+.track+.thumb {
|
|
|
882
886
|
margin: 0;
|
|
883
887
|
font-size: 1.125rem;
|
|
884
888
|
font-weight: 700;
|
|
885
|
-
color:
|
|
889
|
+
color: var(--banner-text);
|
|
886
890
|
}
|
|
887
891
|
|
|
888
892
|
/* Mandatory Badge */
|
|
889
893
|
.preferences-badge-mandatory {
|
|
890
894
|
display: inline-block;
|
|
891
895
|
padding: 0.25rem 0.75rem;
|
|
892
|
-
background:
|
|
896
|
+
background: var(--banner-danger-bg);
|
|
893
897
|
/* Gray pill in image */
|
|
894
|
-
color:
|
|
898
|
+
color: var(--banner-danger-text);
|
|
895
899
|
font-size: 0.75rem;
|
|
896
900
|
font-weight: 600;
|
|
897
901
|
border-radius: 9999px;
|
|
@@ -900,7 +904,7 @@ input:checked+.track+.thumb {
|
|
|
900
904
|
|
|
901
905
|
/* Purpose Description */
|
|
902
906
|
.preferences-purpose-description {
|
|
903
|
-
color:
|
|
907
|
+
color: var(--banner-text-muted);
|
|
904
908
|
font-size: 0.9rem;
|
|
905
909
|
line-height: 1.5;
|
|
906
910
|
margin-bottom: 0.75rem;
|
|
@@ -909,12 +913,12 @@ input:checked+.track+.thumb {
|
|
|
909
913
|
/* Services Used / Details Section */
|
|
910
914
|
.preferences-details {
|
|
911
915
|
margin-top: 0.5rem;
|
|
912
|
-
border-top: 1px solid
|
|
916
|
+
border-top: 1px solid var(--banner-border);
|
|
913
917
|
padding-top: 0.5rem;
|
|
914
918
|
}
|
|
915
919
|
|
|
916
920
|
.preferences-details .mcm-collapsible-btn {
|
|
917
|
-
color:
|
|
921
|
+
color: var(--banner-danger-btn) !important;
|
|
918
922
|
/* Red text for details in image */
|
|
919
923
|
font-size: 0.8125rem !important;
|
|
920
924
|
font-weight: 600 !important;
|
|
@@ -926,8 +930,8 @@ input:checked+.track+.thumb {
|
|
|
926
930
|
display: flex;
|
|
927
931
|
gap: 1rem;
|
|
928
932
|
padding: 1.25rem 1.5rem;
|
|
929
|
-
border-top: 1px solid
|
|
930
|
-
background:
|
|
933
|
+
border-top: 1px solid var(--banner-border);
|
|
934
|
+
background: var(--banner-bg);
|
|
931
935
|
}
|
|
932
936
|
|
|
933
937
|
.preferences-btn {
|
|
@@ -944,37 +948,37 @@ input:checked+.track+.thumb {
|
|
|
944
948
|
/* Only Essential Button */
|
|
945
949
|
.preferences-btn-essential {
|
|
946
950
|
background: transparent;
|
|
947
|
-
color:
|
|
948
|
-
border: 1px solid
|
|
951
|
+
color: var(--banner-text-muted);
|
|
952
|
+
border: 1px solid var(--banner-border);
|
|
949
953
|
}
|
|
950
954
|
|
|
951
955
|
.preferences-btn-essential:hover {
|
|
952
|
-
background:
|
|
953
|
-
border-color:
|
|
956
|
+
background: var(--banner-hover-bg);
|
|
957
|
+
border-color: var(--banner-text);
|
|
954
958
|
}
|
|
955
959
|
|
|
956
960
|
/* Save Preferences Button */
|
|
957
961
|
.preferences-btn-save {
|
|
958
|
-
background:
|
|
962
|
+
background: var(--banner-info-bg);
|
|
959
963
|
/* Coral from image */
|
|
960
|
-
color:
|
|
964
|
+
color: var(--banner-primary-color);
|
|
961
965
|
border: none;
|
|
962
966
|
}
|
|
963
967
|
|
|
964
968
|
.preferences-btn-save:hover {
|
|
965
|
-
background:
|
|
969
|
+
background: var(--banner-info-bg);
|
|
966
970
|
}
|
|
967
971
|
|
|
968
972
|
/* Accept All Button */
|
|
969
973
|
.preferences-btn-accept {
|
|
970
|
-
background:
|
|
974
|
+
background: var(--banner-primary-color);
|
|
971
975
|
/* Green from image */
|
|
972
|
-
color:
|
|
976
|
+
color: var(--banner-bg);
|
|
973
977
|
border: none;
|
|
974
978
|
}
|
|
975
979
|
|
|
976
980
|
.preferences-btn-accept:hover {
|
|
977
|
-
background:
|
|
981
|
+
background: var(--banner-primary-color);
|
|
978
982
|
}
|
|
979
983
|
|
|
980
984
|
/* Specific Wrapper Refinements */
|
|
@@ -1009,7 +1013,7 @@ input:checked+.track+.thumb {
|
|
|
1009
1013
|
left: 0;
|
|
1010
1014
|
right: 0;
|
|
1011
1015
|
bottom: 0;
|
|
1012
|
-
background-color:
|
|
1016
|
+
background-color: var(--banner-border);
|
|
1013
1017
|
transition: 0.3s;
|
|
1014
1018
|
border-radius: 24px;
|
|
1015
1019
|
}
|
|
@@ -1021,13 +1025,13 @@ input:checked+.track+.thumb {
|
|
|
1021
1025
|
width: 18px;
|
|
1022
1026
|
left: 3px;
|
|
1023
1027
|
bottom: 3px;
|
|
1024
|
-
background-color:
|
|
1028
|
+
background-color: var(--banner-bg);
|
|
1025
1029
|
transition: 0.3s;
|
|
1026
1030
|
border-radius: 50%;
|
|
1027
1031
|
}
|
|
1028
1032
|
|
|
1029
1033
|
.preferences-toggle input:checked+.preferences-toggle-slider {
|
|
1030
|
-
background-color:
|
|
1034
|
+
background-color: var(--banner-success-text);
|
|
1031
1035
|
}
|
|
1032
1036
|
|
|
1033
1037
|
.preferences-toggle input:checked+.preferences-toggle-slider:before {
|
|
@@ -1054,8 +1058,8 @@ input:checked+.track+.thumb {
|
|
|
1054
1058
|
/* Preferences Modal Footer & Actions Container */
|
|
1055
1059
|
.preferences-footer-container {
|
|
1056
1060
|
padding: 1rem 1.5rem;
|
|
1057
|
-
border-top: 1px solid
|
|
1058
|
-
background:
|
|
1061
|
+
border-top: 1px solid var(--banner-border);
|
|
1062
|
+
background: var(--banner-bg);
|
|
1059
1063
|
display: flex;
|
|
1060
1064
|
flex-direction: column;
|
|
1061
1065
|
gap: 0.5rem;
|
|
@@ -1076,10 +1080,10 @@ input:checked+.track+.thumb {
|
|
|
1076
1080
|
}
|
|
1077
1081
|
|
|
1078
1082
|
.preferences-purpose-card-wrapper>div {
|
|
1079
|
-
border-left: 4px solid
|
|
1083
|
+
border-left: 4px solid var(--banner-text) !important;
|
|
1080
1084
|
border-radius: 8px !important;
|
|
1081
1085
|
padding: 1.25rem !important;
|
|
1082
|
-
border: 1px solid
|
|
1086
|
+
border: 1px solid var(--banner-border) !important;
|
|
1083
1087
|
transition: box-shadow 0.2s ease !important;
|
|
1084
1088
|
}
|
|
1085
1089
|
|
|
@@ -1089,8 +1093,8 @@ input:checked+.track+.thumb {
|
|
|
1089
1093
|
|
|
1090
1094
|
/* Mandatory Badge Overrides */
|
|
1091
1095
|
.preferences-purpose-card-wrapper .mandatory-badge {
|
|
1092
|
-
background:
|
|
1093
|
-
color:
|
|
1096
|
+
background: var(--banner-danger-bg) !important;
|
|
1097
|
+
color: var(--banner-danger-text) !important;
|
|
1094
1098
|
border: none !important;
|
|
1095
1099
|
text-transform: capitalize !important;
|
|
1096
1100
|
padding: 0.125rem 0.625rem !important;
|
|
@@ -1099,7 +1103,7 @@ input:checked+.track+.thumb {
|
|
|
1099
1103
|
|
|
1100
1104
|
/* Red Collapsible Links */
|
|
1101
1105
|
.preferences-purpose-card-wrapper .mcm-collapsible-btn {
|
|
1102
|
-
color:
|
|
1106
|
+
color: var(--banner-danger-btn) !important;
|
|
1103
1107
|
font-size: 0.8125rem !important;
|
|
1104
1108
|
font-weight: 600 !important;
|
|
1105
1109
|
text-decoration: none !important;
|
|
@@ -1157,15 +1161,16 @@ input:checked+.track+.thumb {
|
|
|
1157
1161
|
max-width: none !important;
|
|
1158
1162
|
}
|
|
1159
1163
|
}
|
|
1164
|
+
|
|
1160
1165
|
/* Preferences Modal Logo */
|
|
1161
1166
|
.preferences-title-wrapper {
|
|
1162
|
-
|
|
1163
|
-
|
|
1164
|
-
|
|
1167
|
+
display: flex;
|
|
1168
|
+
align-items: center;
|
|
1169
|
+
gap: 0.75rem;
|
|
1165
1170
|
}
|
|
1166
1171
|
|
|
1167
1172
|
.preferences-logo {
|
|
1168
|
-
|
|
1169
|
-
|
|
1170
|
-
|
|
1171
|
-
}
|
|
1173
|
+
height: 24px;
|
|
1174
|
+
width: auto;
|
|
1175
|
+
object-fit: contain;
|
|
1176
|
+
}
|