Auf Tabs umgestellt

backend/public/css/style.css

@@ -312,6 +312,38 @@ color:#555;
     margin-bottom:10px;
 }
 
+.tabs{
+    display:flex;
+    flex-wrap:wrap;
+    gap:8px;
+    margin:18px 0 24px 0;
+}
+
+.tab-button{
+    background:#e2e8f0;
+    color:#0f172a;
+    border-color:#cbd5e1;
+}
+
+.tab-button:hover{
+    background:#cbd5e1;
+    border-color:#94a3b8;
+}
+
+.tab-button.active{
+    background:#2563eb;
+    color:white;
+    border-color:#2563eb;
+}
+
+.tab-panel{
+    display:none;
+}
+
+.tab-panel.active{
+    display:block;
+}
+
 #ipList div{
     display:flex;
     align-items:center;
@@ -408,6 +440,23 @@ body.dark button.btn-ghost:hover{
     border-color:#475569;
 }
 
+body.dark .tab-button{
+    background:#334155;
+    color:#e5e7eb;
+    border-color:#475569;
+}
+
+body.dark .tab-button:hover{
+    background:#475569;
+    border-color:#64748b;
+}
+
+body.dark .tab-button.active{
+    background:#2563eb;
+    color:white;
+    border-color:#2563eb;
+}
+
 body.dark .domain-name,
 body.dark .subdomain-name{
     color:#f8fafc;