@truconsent/consent-notice 0.0.3 → 0.0.4

package/dist/MarsConsentModal.css

@@ -38,6 +38,7 @@
   overflow: hidden !important;
   position: relative;
   box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
+  border: 1px solid var(--banner-border);
 }
 
 /* Close button - repositioned to float on the corner of the white box */
@@ -125,12 +126,20 @@
 
 .badge {
   display: inline-block;
-  padding: 2px 6px;
+  padding: 2px 8px;
   font-size: 0.75rem;
+  font-weight: 600;
   border-radius: 4px;
-  background: var(--banner-border);
-  color: var(--banner-text);
+  background: var(--banner-hover-bg);
+  color: var(--banner-text-muted);
   margin-right: 5px;
+  border: 1px solid var(--banner-border);
+}
+
+.badge.legitimate {
+  background: var(--banner-info-bg);
+  color: var(--banner-primary-color);
+  border-color: var(--banner-info-border);
 }
 
 .badge.mandatory {
@@ -419,7 +428,7 @@ input:checked+.track+.thumb {
 }
 
 .mcm-separator-pipe {
-  color: #d1d5db;
+  color: var(--banner-border);
   opacity: 0.5;
   margin: 0 0.25rem;
   display: inline-block;
@@ -779,9 +788,9 @@ input:checked+.track+.thumb {
 }
 
 .mcm-wrapper.modern-modal .mcm-summary-btn.save-preferences {
-  /* Save Preferences - using coral color from image */
-  background: #ff7675 !important;
-  color: #fff !important;
+  /* Save Preferences */
+  background: var(--banner-primary-color) !important;
+  color: white !important;
   border: none !important;
 }
 

package/dist/RightCenter.css

@@ -40,9 +40,9 @@
 }
 
 .rc-tab-active {
-  background: #3b82f6;
+  background: var(--banner-primary-color);
   color: white;
-  border-color: #3b82f6;
+  border-color: var(--banner-primary-color);
 }
 
 /* ================= PRINCIPAL ID ================ */
@@ -103,7 +103,7 @@
 
 /* ================= BUTTONS ================ */
 .rc-btn-primary {
-  background: #3b82f6;
+  background: var(--banner-primary-color);
   color: white;
   border: none;
   padding: 12px 20px;
@@ -118,7 +118,7 @@
 }
 
 .rc-btn-primary:hover {
-  background: #2563eb;
+  opacity: 0.9;
 }
 
 .rc-btn-secondary {
@@ -343,7 +343,7 @@
 }
 
 input:checked+.rc-slider {
-  background-color: #3b82f6;
+  background-color: var(--banner-primary-color);
 }
 
 input:checked+.rc-slider:before {
@@ -514,7 +514,7 @@ input:checked+.rc-slider:before {
 
 /* reuse your existing btn-danger override, if needed */
 .rc-btn-danger {
-  background: #dc2626;
+  background: var(--banner-danger-btn);
   color: #fff;
   border: none;
   padding: 8px 16px;
@@ -524,12 +524,12 @@ input:checked+.rc-slider:before {
 }
 
 .rc-btn-danger:hover {
-  background: #b91c1c;
+  background: var(--banner-danger-btn-hover);
 }
 
 /* Danger button (delete) */
 .rc-btn-danger {
-  background: #dc2626;
+  background: var(--banner-danger-btn);
   color: #fff;
   border: none;
   padding: 8px 16px;
@@ -539,7 +539,7 @@ input:checked+.rc-slider:before {
 }
 
 .rc-btn-danger:hover {
-  background: #b91c1c;
+  background: var(--banner-danger-btn-hover);
 }
 
 .rc-nominee-warning {
@@ -605,7 +605,7 @@ input:checked+.rc-slider:before {
 .rc-form-select:focus,
 .rc-form-textarea:focus {
   outline: none;
-  border-color: #3b82f6;
+  border-color: var(--banner-primary-color);
   box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
 }
 
@@ -808,7 +808,7 @@ input:checked+.rc-slider:before {
 
 .rc-element-card {
   background: white;
-  border: 1px solid #e5e7eb;
+  border: 1px solid var(--banner-border);
   border-radius: 8px;
   padding: 16px;
 }
@@ -816,14 +816,14 @@ input:checked+.rc-slider:before {
 .rc-element-title {
   font-size: 14px;
   font-weight: 600;
-  color: #111827;
+  color: var(--banner-text);
   margin-bottom: 8px;
   display: block;
 }
 
 .rc-element-description {
   font-size: 13px;
-  color: #6b7280;
+  color: var(--banner-text-muted);
   margin: 0;
   line-height: 1.4;
 }
@@ -837,7 +837,7 @@ input:checked+.rc-slider:before {
 }
 
 .rc-modal-status-label {
-  color: #374151;
+  color: var(--banner-text-muted);
   font-weight: 500;
 }
 
@@ -854,7 +854,7 @@ input:checked+.rc-slider:before {
 }
 
 .rc-success-icon {
-  color: #10b981;
+  color: var(--banner-success-text);
   width: 48px;
   height: 48px;
   margin-bottom: 16px;
@@ -941,10 +941,11 @@ input:checked+.rc-slider:before {
   align-items: center;
   justify-content: center;
   gap: 8px;
-  background: #f9fafb;
-  border: 1px dashed #e5e7eb;
-  border-radius: 6px;
-  color: #6b7280;
+  background: var(--banner-card-bg);
+  border: 1px dashed var(--banner-border);
+  border-radius: 8px;
+  padding: 40px 20px;
+  color: var(--banner-text-muted);
   font-style: italic;
   padding: 16px;
   margin: 16px 0;
@@ -953,5 +954,5 @@ input:checked+.rc-slider:before {
 .rc-empty-state-icon {
   width: 20px;
   height: 20px;
-  color: #2563eb;
+  color: var(--banner-primary-color);
 }

package/dist/banner-styles.css

@@ -112,7 +112,7 @@
 
 .trubanner-subtitle {
   font-size: 0.8rem;
-  color: var(--banner-secondary-color, #555);
+  color: var(--banner-secondary-color);
   line-height: 1.4;
 }
 
@@ -298,7 +298,7 @@
 }
 
 .trubanner-item-name {
-  color: #374151;
+  color: var(--banner-text-muted);
 }
 
 .trubanner-actions {
@@ -339,9 +339,9 @@
 }
 
 .trubanner-button-primary {
-  background-color: var(--banner-primary-color, #3b82f6);
+  background-color: var(--banner-primary-color);
   color: white;
-  border-color: var(--banner-primary-color, #3b82f6);
+  border-color: var(--banner-primary-color);
 }
 
 .trubanner-button-primary:hover {
@@ -416,7 +416,7 @@
 
 .trubanner-mobile .trubanner-header-wrapper {
   padding: 0.5rem 0.5rem 0.3rem !important;
-  border-bottom: 1px solid #f0f0f0;
+  border-bottom: 1px solid var(--banner-border);
 }
 
 .trubanner-mobile .trubanner-logo {
@@ -437,7 +437,7 @@
 .trubanner-mobile .trubanner-subtitle {
   font-size: 0.68rem !important;
   line-height: 1.2 !important;
-  color: var(--banner-secondary-color, #555) !important;
+  color: var(--banner-secondary-color) !important;
   width: 100% !important;
   margin-top: 0 !important;
 }