Refactor form structure and add collapsible components

Improved the user interface on the TargetsPage by replacing static form headers with collapsible sections, enhancing maintainability and user experience. Updated styles for consistency, added hover effects, and ensured accessibility. Also replaced German special characters for uniform encoding.

frontend/src/styles.css

@@ -195,36 +195,59 @@ button {
 }
 
 .target-form {
-  position: relative;
-  padding-top: 56px;
+  margin-top: 12px;
 }
 
-.target-form-header {
-  position: absolute;
-  top: 14px;
-  left: 16px;
+.primary-btn {
+  font-weight: 650;
+  letter-spacing: 0.01em;
+  border-color: #4467ab;
+  background: linear-gradient(180deg, #1a2f56, #142643);
+  box-shadow: inset 0 1px 0 #5f8de144;
 }
 
-.target-form-header h3 {
+.primary-btn:hover {
+  border-color: #6b9ee9;
+  background: linear-gradient(180deg, #1d3766, #183053);
+}
+
+.collapsible {
+  padding-top: 12px;
+}
+
+.collapse-head {
+  list-style: none;
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin: -2px 0 0 0;
+  padding: 0 2px 8px 2px;
+}
+
+.collapse-head::-webkit-details-marker {
+  display: none;
+}
+
+.collapse-head h3 {
   margin: 0;
-  font-size: 16px;
+  font-size: 24px;
 }
 
-.target-form-header p {
+.collapse-head p {
   margin: 2px 0 0 0;
   color: #92a7cc;
   font-size: 12px;
 }
 
-.primary-btn {
-  font-weight: 700;
-  border-color: #3e73d4;
-  background: linear-gradient(90deg, #2e7cd4, #265fb4);
+.collapse-chevron {
+  font-size: 22px;
+  color: #89a7d8;
+  transition: transform 0.2s ease;
 }
 
-.primary-btn:hover {
-  border-color: #6aa8ff;
-  filter: brightness(1.05);
+details[open] .collapse-chevron {
+  transform: rotate(180deg);
 }
 
 .targets-table table tbody tr:hover {