fix: thorough dark mode fixes across all OWL templates and CSS

- Replace Bootstrap badge classes with theme-aware woo-badge classes in
  product mapping tabs
- Replace <code> with theme-aware .woo-code class
- Replace all text-muted with woo-text-muted using CSS custom properties
- Add client action wrapper background
- Add theme-aware select/checkbox/strong/input overrides
- Add .woo-code, .woo-text-muted, .woo-text-faint utility classes

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

fusion-woo-odoo/fusion_woocommerce/static/src/css/woo_styles.css

@@ -476,3 +476,82 @@ body.o_dark {
     width: 36px;
     text-align: center;
 }
+
+/* ----------------------------------------------------------
+   Theme-aware utility classes
+   ---------------------------------------------------------- */
+.woo-text-muted { color: var(--woo-text-muted) !important; }
+.woo-text-faint { color: var(--woo-text-faint) !important; }
+
+/* Inline code snippets (SKU etc.) */
+.woo-code {
+    font-family: monospace;
+    font-size: 0.85em;
+    padding: 1px 6px;
+    border-radius: 4px;
+    background: var(--woo-bg-tertiary);
+    color: var(--woo-text-secondary);
+}
+
+/* ----------------------------------------------------------
+   Client action wrapper — ensure background matches theme
+   ---------------------------------------------------------- */
+.o_action.o_client_action .woo-dashboard,
+.o_action.o_client_action .p-3 {
+    background: var(--woo-bg-primary);
+    color: var(--woo-text-primary);
+    min-height: 100%;
+}
+
+/* ----------------------------------------------------------
+   Form view overrides — theme-aware inputs in Odoo forms
+   ---------------------------------------------------------- */
+.o_form_view .woo-table th {
+    background: var(--woo-bg-tertiary);
+    color: var(--woo-text-secondary);
+}
+.o_form_view .woo-table td {
+    color: var(--woo-text-secondary);
+    border-bottom-color: var(--woo-border-light);
+}
+
+/* ----------------------------------------------------------
+   Checkbox overrides for dark mode
+   ---------------------------------------------------------- */
+.woo-table input[type="checkbox"],
+.woo-topbar input[type="checkbox"] {
+    accent-color: var(--woo-accent);
+}
+
+/* ----------------------------------------------------------
+   Select dropdown — theme aware
+   ---------------------------------------------------------- */
+.woo-topbar select {
+    background: var(--woo-input-bg);
+    color: var(--woo-text-primary);
+    border-color: var(--woo-input-border);
+}
+.woo-topbar select option {
+    background: var(--woo-bg-primary);
+    color: var(--woo-text-primary);
+}
+
+/* ----------------------------------------------------------
+   Odoo native overrides for our views
+   These ensure Odoo's own notebook/tab/statusbar elements
+   inside our module's form views respect the theme.
+   ---------------------------------------------------------- */
+.o_form_view .o_notebook .nav-link {
+    color: var(--woo-text-muted);
+}
+.o_form_view .o_notebook .nav-link.active {
+    color: var(--woo-text-primary);
+}
+
+/* ----------------------------------------------------------
+   Ensure strong/bold text uses theme colour
+   ---------------------------------------------------------- */
+.woo-table strong,
+.woo-card strong {
+    color: var(--woo-text-primary);
+}

fusion-woo-odoo/fusion_woocommerce/static/src/xml/dashboard.xml

@@ -125,7 +125,7 @@
                                                 <t t-esc="inst.last_sync"/>
                                             </t>
                                             <t t-else="">
-                                                <span class="text-muted">Never</span>
+                                                <span class="woo-text-muted">Never</span>
                                             </t>
                                         </td>
                                     </tr>

fusion-woo-odoo/fusion_woocommerce/static/src/xml/product_mapping.xml

@@ -78,17 +78,17 @@
                         <button class="woo-tab" t-att-class="state.activeTab === 'mapped' ? 'active' : ''"
                                 t-on-click="() => this.setTab('mapped')">
                             Mapped Products
-                            <span class="ms-1 badge bg-secondary" t-esc="state.mappedProducts.length"/>
+                            <span class="ms-1 woo-badge woo-badge-mapped" t-esc="state.mappedProducts.length"/>
                         </button>
                         <button class="woo-tab" t-att-class="state.activeTab === 'unmatched' ? 'active' : ''"
                                 t-on-click="() => this.setTab('unmatched')">
                             Unmatched Products
-                            <span class="ms-1 badge bg-warning text-dark" t-esc="state.wooProducts.length"/>
+                            <span class="ms-1 woo-badge woo-badge-unmapped" t-esc="state.wooProducts.length"/>
                         </button>
                         <button class="woo-tab" t-att-class="state.activeTab === 'conflicts' ? 'active' : ''"
                                 t-on-click="() => this.setTab('conflicts')">
                             Conflicts
-                            <span class="ms-1 badge bg-danger" t-esc="state.conflictCount"/>
+                            <span class="ms-1 woo-badge woo-badge-conflict" t-esc="state.conflictCount"/>
                         </button>
                     </div>
 
@@ -144,7 +144,7 @@
                                                            t-on-change="() => this.toggleSelectMapped(p.id)"/>
                                                 </td>
                                                 <td><t t-esc="p.woo_product_name"/></td>
-                                                <td><code><t t-esc="p.woo_sku"/></code></td>
+                                                <td><span class="woo-code"><t t-esc="p.woo_sku"/></span></td>
                                                 <td><t t-esc="p.odoo_product_name"/></td>
                                                 <td><t t-esc="p.instance_name"/></td>
                                                 <td>
@@ -177,7 +177,7 @@
                                 <i class="fa fa-link me-1"/> Map Selected
                             </button>
                             <t t-if="!canMap">
-                                <small class="text-muted align-self-center">
+                                <small class="woo-text-muted align-self-center">
                                     Select one Odoo product and one WooCommerce product to map them.
                                 </small>
                             </t>
@@ -215,7 +215,7 @@
 
                             <!-- Divider -->
                             <div class="woo-split-divider">
-                                <i class="fa fa-exchange text-muted"/>
+                                <i class="fa fa-exchange woo-text-muted"/>
                             </div>
 
                             <!-- WooCommerce products panel -->