test debug dark mode

modules/gift-list/gift-list.css

@@ -37,8 +37,8 @@
 }
 
 .cl-view-btn.is-active {
-  background: #334155;
-  color: white;
+  background: var(--text-main);
+  color: var(--bg-panel);
 }
 
 /* === FILTRES STICKY === */
@@ -95,7 +95,7 @@
 /* === SECTIONS ENFANTS === */
 .pf-child-section {
   margin-bottom: 30px;
-  background: white;
+  background: var(--bg-panel);
   padding: 20px;
   border-radius: 16px;
   border: 1px solid var(--border-light);
@@ -120,7 +120,7 @@
   overflow-x: auto;
   padding-bottom: 12px;
   margin-bottom: 15px;
-  border-bottom: 1px solid #f1f5f9;
+  border-bottom: 1px solid var(--bg-subtle);
   scrollbar-width: none; /* Firefox */
 }
 .pf-child-totals-bar::-webkit-scrollbar {
@@ -128,13 +128,13 @@
 }
 .pf-summary-pill {
   white-space: nowrap;
-  background: #f8fafc;
+  background: var(--bg-page);
   padding: 4px 12px;
   border-radius: 50px;
   font-size: 0.8rem;
   font-weight: 700;
-  color: #475569;
-  border: 1px solid #cbd5e1;
+  color: var(--text-muted);
+  border: 1px solid var(--border-strong);
   transition: opacity 0.2s;
 }
 
@@ -145,9 +145,9 @@
   grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
 }
 .pf-gift-card-compact {
-  background: white;
+  background: var(--bg-panel);
   border-radius: 10px;
-  border: 1px solid #e2e8f0;
+  border: 1px solid var(--border-light);
   padding: 12px;
   position: relative;
   transition: 0.2s;
@@ -156,12 +156,12 @@
   min-height: 100px;
 }
 .pf-gift-card-compact:hover {
-  border-color: #cbd5e1;
+  border-color: var(--border-strong);
   box-shadow: var(--shadow-md);
 }
 .pf-gift-title {
   font-weight: 600;
-  color: #1e293b;
+  color: var(--text-main);
   font-size: 0.95rem;
   margin: 0 0 10px 0;
   line-height: 1.3;
@@ -223,7 +223,7 @@
   margin: 0;
 }
 .pf-tricount-item {
-  background: white;
+  background: var(--bg-panel);
   padding: 12px 15px;
   border: 1px solid var(--border-light);
   border-radius: 8px;
@@ -317,7 +317,7 @@
   position: absolute;
   top: calc(100% + 8px);
   left: 0;
-  background: white;
+  background: var(--bg-panel);
   border: 1px solid var(--border-light);
   border-radius: 12px;
   padding: 8px;
@@ -348,7 +348,7 @@
   transition: 0.2s;
 }
 .pf-ms-option:hover {
-  background: #f8fafc;
+  background: var(--bg-page);
 }
 .pf-ms-option input[type="checkbox"] {
   margin: 0;
@@ -359,7 +359,7 @@
 }
 .pf-ms-option.is-all {
   font-weight: 700;
-  border-bottom: 1px solid #e2e8f0;
+  border-bottom: 1px solid var(--border-light);
   padding-bottom: 10px;
   margin-bottom: 4px;
   border-radius: 6px 6px 0 0;