tonne of imporvements, debugs, new ui

influence/app/public/css/styles.css

@@ -37,6 +37,75 @@ header p {
     font-size: 1.1em;
 }
 
+/* Buttons */
+.btn {
+    display: inline-block;
+    padding: 10px 16px;
+    margin: 2px;
+    font-size: 14px;
+    font-weight: 500;
+    line-height: 1.5;
+    text-align: center;
+    text-decoration: none;
+    white-space: nowrap;
+    vertical-align: middle;
+    cursor: pointer;
+    border: 1px solid transparent;
+    border-radius: 4px;
+    transition: all 0.2s ease-in-out;
+    user-select: none;
+}
+
+.btn:hover {
+    text-decoration: none;
+    transform: translateY(-1px);
+    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+}
+
+.btn:active {
+    transform: translateY(0);
+    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
+}
+
+.btn-primary {
+    color: white;
+    background-color: #005a9c;
+    border-color: #005a9c;
+}
+
+.btn-primary:hover {
+    background-color: #004a7c;
+    border-color: #004a7c;
+}
+
+.btn-secondary {
+    color: #005a9c;
+    background-color: white;
+    border-color: #005a9c;
+}
+
+.btn-secondary:hover {
+    color: white;
+    background-color: #005a9c;
+    border-color: #005a9c;
+}
+
+.btn-success {
+    color: white;
+    background-color: #28a745;
+    border-color: #28a745;
+}
+
+.btn-success:hover {
+    background-color: #218838;
+    border-color: #1e7e34;
+}
+
+.text-muted {
+    color: #6c757d;
+    font-style: italic;
+}
+
 /* Forms */
 .form-group {
     margin-bottom: 20px;
@@ -278,6 +347,17 @@ header p {
     flex-wrap: wrap;
 }
 
+.call-representative {
+    display: inline-flex;
+    align-items: center;
+    gap: 6px;
+}
+
+.call-representative:hover {
+    background-color: #218838;
+    border-color: #1e7e34;
+}
+
 /* Modal Styles */
 .modal {
     position: fixed;