1

frontend/src/components/AdminDashboard.css

@@ -103,15 +103,153 @@
   color: #2e7d32;
 }
 
-.status-badge.stopped {
+.status-badge.disabled {
   background-color: #ffebee;
   color: #c62828;
 }
 
 .profit {
   color: #2e7d32;
+  font-weight: 500;
 }
 
 .loss {
   color: #c62828;
+  font-weight: 500;
+}
+
+/* User Group Styles */
+.users-section {
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
+}
+
+.user-group-card {
+  background: white;
+  border-radius: 8px;
+  box-shadow: 0 2px 4px rgba(0,0,0,0.1);
+  overflow: hidden;
+  margin-bottom: 16px;
+}
+
+.user-group-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 16px 24px;
+  background-color: #f8f9fa;
+  cursor: pointer;
+  user-select: none;
+}
+
+.user-group-header:hover {
+  background-color: #f0f2f5;
+}
+
+.user-info {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+}
+
+.expand-icon {
+  font-size: 12px;
+  color: #666;
+  transition: transform 0.2s;
+}
+
+.expand-icon.expanded {
+  transform: rotate(90deg);
+}
+
+.user-name {
+  font-weight: 600;
+  font-size: 16px;
+}
+
+.user-role-badge {
+  font-size: 12px;
+  padding: 2px 6px;
+  border-radius: 4px;
+  text-transform: uppercase;
+}
+
+.user-role-badge.admin {
+  background-color: #e3f2fd;
+  color: #1976d2;
+}
+
+.user-role-badge.user {
+  background-color: #f5f5f5;
+  color: #616161;
+}
+
+.account-count {
+  color: #888;
+  font-size: 14px;
+}
+
+.user-actions {
+  display: flex;
+  gap: 12px;
+}
+
+.btn-text-action {
+  background: none;
+  border: none;
+  cursor: pointer;
+  font-size: 14px;
+  padding: 4px 8px;
+  border-radius: 4px;
+}
+
+.btn-text-action:hover {
+  background-color: rgba(0,0,0,0.05);
+}
+
+.btn-text-action:disabled {
+  color: #ccc;
+  cursor: not-allowed;
+}
+
+.btn-text-action.start {
+  color: #2e7d32;
+}
+
+.btn-text-action.stop {
+  color: #c62828;
+}
+
+.user-accounts-table {
+  padding: 16px 24px;
+  border-top: 1px solid #eee;
+}
+
+.no-accounts {
+  color: #999;
+  text-align: center;
+  padding: 20px;
+}
+
+.btn-mini {
+  padding: 4px 12px;
+  font-size: 12px;
+  border: none;
+  border-radius: 4px;
+  cursor: pointer;
+  color: white;
+}
+
+.btn-mini:disabled {
+  opacity: 0.5;
+  cursor: not-allowed;
+}
+
+.btn-mini.start {
+  background-color: #4caf50;
+}
+
+.btn-mini.stop {
+  background-color: #f44336;
 }