From c1a72ebd667777f3f52050728b0024cd0faafa66 Mon Sep 17 00:00:00 2001
From: xRangerDE <xRangerDE@24-music.de>
Date: Thu, 19 Mar 2026 17:55:14 +0100
Subject: [PATCH] feat(merge-split): add Merge & Split button and queue
 checkbox/merge-group styles

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 src/index.html |  1 +
 src/styles.css | 28 ++++++++++++++++++++++++++++
 2 files changed, 29 insertions(+)

diff --git a/src/index.html b/src/index.html
index fbf66f8..439d887 100644
--- a/src/index.html
+++ b/src/index.html
@@ -213,6 +213,7 @@
                 <div class="queue-list" id="queueList"></div>
                 <div class="queue-actions">
                     <button class="btn btn-start" id="btnStart" onclick="toggleDownload()">Start</button>
+                    <button class="btn btn-merge-group" id="btnMergeGroup" onclick="createMergeGroupFromSelection()" style="display:none">Merge &amp; Split</button>
                     <button class="btn btn-retry" id="btnRetryFailed" onclick="retryFailedDownloads()" title="Nur fehlgeschlagene Downloads erneut starten">Wiederholen</button>
                     <button class="btn btn-clear" id="btnClear" onclick="clearCompleted()">Leeren</button>
                 </div>
diff --git a/src/styles.css b/src/styles.css
index ef5c4ee..b5de05a 100644
--- a/src/styles.css
+++ b/src/styles.css
@@ -329,6 +329,34 @@ body {
     opacity: 1;
 }
 
+.queue-checkbox {
+    width: 14px;
+    height: 14px;
+    margin-top: 2px;
+    cursor: pointer;
+    accent-color: var(--accent);
+    flex-shrink: 0;
+}
+
+.queue-item.merge-group {
+    border-left: 3px solid var(--accent);
+}
+
+.merge-group-icon {
+    vertical-align: middle;
+    margin-right: 2px;
+    opacity: 0.8;
+}
+
+.btn-merge-group {
+    background: var(--accent);
+    color: var(--bg-primary);
+}
+
+.btn-merge-group:hover {
+    opacity: 0.9;
+}
+
 .queue-actions {
     display: flex;
     gap: 8px;