Update app.py

app.py

@@ -224,43 +224,33 @@ textarea {
     padding: 10px;
 }
 
-/* Tab container styling */
-.nav-tabs {
-    display: flex;
-    justify-content: space-around;
-    background-color: #333;
-    border-bottom: 1px solid #fff;
-    padding: 10px;
-}
-
 /* Inactive tab styling */
 .nav-tabs .nav-item {
     font-size: 1em;
-    color: #ffffff; /* Inactive tabs in white */
+    color: #ffffff !important; /* Inactive tabs in white */
     padding: 10px 20px;
     cursor: pointer;
     font-weight: 500;
     transition: color 0.3s, border-color 0.3s;
-    border: 2px solid transparent; /* Transparent border for inactive tabs */
-    border-radius: 8px; /* Rounded edges for tabs */
+    border: 2px solid transparent !important; /* Transparent border for inactive tabs */
+    border-radius: 8px !important; /* Rounded edges for tabs */
 }
 
 /* Hover effect on tabs */
 .nav-tabs .nav-item:hover {
-    color: #FFCA28; /* Bright yellow on hover */
+    color: #FFCA28 !important; /* Bright yellow on hover */
 }
 
 /* Active tab styling with green border */
-.nav-tabs .nav-item.active {
+.nav-tabs .nav-item.active, .nav-tabs .nav-item:focus, .nav-tabs .nav-item[aria-selected="true"] {
     color: #00FF00 !important; /* Green text color for active tab */
     border: 2px solid #00FF00 !important; /* Green border for active tab */
-    font-weight: 700;
-    background-color: rgba(0, 255, 0, 0.1); /* Light green background for active tab */
-    border-radius: 8px; /* Rounded border for active tab */
-    padding: 8px 18px; /* Adjust padding to fit within border */
+    font-weight: 700 !important;
+    background-color: rgba(0, 255, 0, 0.1) !important; /* Light green background for active tab */
+    border-radius: 8px !important; /* Rounded border for active tab */
+    padding: 8px 18px !important; /* Adjust padding to fit within border */
 }
 
-
 /* Billing Output */
 #billing_output {
     background: rgba(40, 40, 40, 0.9);