enhanced preorder map

public/js/pages/PreorderRimoTypeMap/PreorderRimoTypeMap.css

@@ -8,6 +8,7 @@
 }
 
 .map-filter-container {
+    margin-left: 40px;
     display: flex;
     gap: 0.5rem;
     flex-wrap: wrap;
@@ -88,11 +89,12 @@
 }
 
 .tooltip-content-wrapper.marker-label-highlight {
-    background-color: rgba(248, 215, 218, 0.9);
-    border-color: #e57373;
-    color: #721c24;
+    background-color: #dc3545; /* A solid, vibrant red */
+    border-color: #c82333;   /* A slightly darker border for definition */
+    color: white;            /* White text for maximum contrast */
 }
 
+
 .tooltip-content-wrapper.marker-label-saturated {
     background-color: #28a745; /* A solid, vibrant green */
     border-color: #218838;   /* A slightly darker border for definition */

public/js/pages/Preordercampaign/Preordercampaign.js

@@ -44,6 +44,11 @@ Vue.component('Preordercampaign', {
                             <span>{{ campaign.count_total_units.total_unit_count }}</span>
                             <span>({{ ((campaign.active_preorder_count.total_count / (campaign.count_total_units.total_unit_count)) * 100 || 0).toFixed(1) }} %)</span>
                           </template>
+                          <template v-if="campaign.count_total_units.total_unit_count_not2connect > 0">
+                            <span>N2C:</span><span>{{ campaign.active_preorder_count.not2connect_count }} /</span>
+                            <span>{{ campaign.count_total_units.total_unit_count_not2connect }}</span>
+                            <span>({{ ((campaign.active_preorder_count.not2connect_count / campaign.count_total_units.total_unit_count_not2connect) * 100 || 0).toFixed(2) }} %)</span>
+                          </template>
                         </div>
                       </div>
                     </template>