Update templates/cart.html

templates/cart.html

@@ -53,6 +53,10 @@
             font-size: 1.1rem;
             font-weight: 600;
         }
+        .cart-item-actions .text-primary {
+            color: #000 !important; /* Changed from blue to black */
+        }
+
         .checkout-button {
            background-color: #0FAA39; /* Green background */
            color: #fff; /* White text */
@@ -111,58 +115,58 @@
             margin: 0 5px;
         }
         .cart-summary {
-    text-align: left;
-    margin-top: 15px;
-    padding: 20px;
-    background-color: #fff;
-    border-radius: 12px;
-    box-shadow: 0 6px 15px rgba(0, 0, 0, 0.1);
-}
-.bill-details {
-    display: grid;
-    grid-template-columns: 1fr 1fr; /* Two-column layout */
-    grid-gap: 10px;
-    margin-bottom: 10px;
-}
-.bill-details .label {
-    font-weight: 600;
-    font-size: 1rem;
-}
-.bill-details .amount {
-    text-align: right;
-    font-weight: 600;
-    font-size: 1rem;
-}
-.dotted-line {
-    border-bottom: 2px dotted #ccc;
-    margin: 15px 0;
-}
-.total-bill {
-    display: grid;
-    grid-template-columns: 1fr 1fr;
-    font-weight: 600;
-    font-size: 1.2rem;
-    margin-top: 10px;
-}
-.total-bill .label {
-    font-size: 1.1rem;
-}
-.total-bill .amount {
-    text-align: right;
-    font-size: 1.1rem;
-    color: #0FAA39; /* Green color for total */
-}
-.checkout-button {
-    background-color: #0FAA39;
-    color: #fff;
-    padding: 12px;
-    border-radius: 8px;
-    border: none;
-    width: 100%;
-    font-size: 1.2rem;
-    cursor: pointer;
-    transition: background-color 0.3s, color 0.3s;
-}
+            text-align: left;
+            margin-top: 15px;
+            padding: 20px;
+            background-color: #fff;
+            border-radius: 12px;
+            box-shadow: 0 6px 15px rgba(0, 0, 0, 0.1);
+        }
+        .bill-details {
+            display: grid;
+            grid-template-columns: 1fr 1fr; /* Two-column layout */
+            grid-gap: 10px;
+            margin-bottom: 10px;
+        }
+        .bill-details .label {
+            font-weight: 600;
+            font-size: 1rem;
+        }
+        .bill-details .amount {
+            text-align: right;
+            font-weight: 600;
+            font-size: 1rem;
+        }
+        .dotted-line {
+            border-bottom: 2px dotted #ccc;
+            margin: 15px 0;
+        }
+        .total-bill {
+            display: grid;
+            grid-template-columns: 1fr 1fr;
+            font-weight: 600;
+            font-size: 1.2rem;
+            margin-top: 10px;
+        }
+        .total-bill .label {
+            font-size: 1.1rem;
+        }
+        .total-bill .amount {
+                text-align: right;
+                font-size: 1.1rem;
+                color: #000; /* Changed from green to black */
+        }
+        .checkout-button {
+            background-color: #0FAA39;
+            color: #fff;
+            padding: 12px;
+            border-radius: 8px;
+            border: none;
+            width: 100%;
+            font-size: 1.2rem;
+            cursor: pointer;
+            transition: background-color 0.3s, color 0.3s;
+        }
       
         .suggestion-section {
             margin-top: 20px;
@@ -171,37 +175,37 @@
             border-radius: 10px;
         }
        .suggestion-item {
-    display: flex;
-    align-items: center; /* Vertically align image and text */
-    justify-content: space-between; /* Space between the image/text and the button */
-    padding: 10px 0;
-}
-.suggestion-item img {
-    width: 50px;
-    height: 50px;
-    object-fit: cover;
-    border-radius: 5px;
-    margin-right: 10px; /* Spacing between the image and the text */
-}
-.suggestion-item div {
-    display: flex;
-    flex-direction: column;
-    justify-content: center;
-    flex-grow: 1; /* Allow the text to take up the available space */
-}
-.suggestion-item button {
-    padding: 5px 15px;
-    font-size: 0.9rem;
-    border-radius: 5px;
-    border: 2px solid #0FAA39;
-    color: #0FAA39;
-    background-color: #fff;
-    font-weight: 600;
-    height: 44px;
-    cursor: pointer;
-    transition: background-color 0.3s, color 0.3s, border-color 0.3s;
-    margin-left: auto; /* Push button to the right */
-}
+            display: flex;
+            align-items: center; /* Vertically align image and text */
+            justify-content: space-between; /* Space between the image/text and the button */
+            padding: 10px 0;
+        }
+        .suggestion-item img {
+            width: 50px;
+            height: 50px;
+            object-fit: cover;
+            border-radius: 5px;
+            margin-right: 10px; /* Spacing between the image and the text */
+        }
+        .suggestion-item div {
+            display: flex;
+            flex-direction: column;
+            justify-content: center;
+            flex-grow: 1; /* Allow the text to take up the available space */
+        }
+        .suggestion-item button {
+            padding: 5px 15px;
+            font-size: 0.9rem;
+            border-radius: 5px;
+            border: 2px solid #0FAA39;
+            color: #0FAA39;
+            background-color: #fff;
+            font-weight: 600;
+            height: 44px;
+            cursor: pointer;
+            transition: background-color 0.3s, color 0.3s, border-color 0.3s;
+            margin-left: auto; /* Push button to the right */
+        }
        .suggestion-item button:hover {
            background-color: #0FAA39; /* Change background to green on hover */
            color: #fff; /* Change text color to white on hover */
@@ -252,7 +256,7 @@
                     <div>
                       <button class="remove-icon" onclick="removeItemFromCart('{{ item.Name }}')">🗑️</button>
                     </div>
-                    <div class="text-primary">
+                    <div class="text-primary" style="color: #000 !important;">  <!-- Inline style to ensure it's black -->
                         $<span class="base-price">{{ item.Price__c }}</span> 
                     </div>
                 </div>