diff --git a/resources/views/orders/loan/mobile/card-history.blade.php b/resources/views/orders/loan/mobile/card-history.blade.php
index 1fdc53e..48571b8 100644
--- a/resources/views/orders/loan/mobile/card-history.blade.php
+++ b/resources/views/orders/loan/mobile/card-history.blade.php
@@ -15,7 +15,6 @@
         width: 300px;
         height: 180px;
         border-radius: 15px;
-        border: 2px solid #ffffff;
         background-color: transparent;
         padding: 20px;
         color: #2b3e50;
@@ -46,12 +45,16 @@
     .expiry-date {
         font-size: 14px;
     }
+
+    :is(.dark .dark\:border-white) {
+        border: 2px solid #ffffff;
+    }
 </style>
 
 <div class="credit-card-container">
-    <div class="credit-card">
+    <div class="credit-card border-2 dark:border-white">
         <div
-            class="card-number text-white cursor-pointer"
+            class="card-number dark:text-white cursor-pointer"
             onclick="fetchCardHistory(
                 '{{ $resource->passport_serie }}',
                 '{{ $resource->passport_id }}',
@@ -60,8 +63,8 @@
             )"
         >{{ $resource->card_number }}</div>
         <div class="expiry-container">
-            <div class="card-holder text-white">{{ $resource->card_name }}</div>
-            <div class="expiry-date text-white">{{ $card_month }}/{{ $card_year }}</div>
+            <div class="card-holder dark:text-white">{{ $resource->card_name }}</div>
+            <div class="expiry-date dark:text-white">{{ $card_month }}/{{ $card_year }}</div>
         </div>
     </div>
     <div id="card-history-details">