From 042de94bd37808b735c9898131669277642f1372 Mon Sep 17 00:00:00 2001
From: Flatlogic Bot <support@flatlogic.com>
Date: Sat, 31 Jan 2026 15:18:24 +0000
Subject: [PATCH] Auto commit: 2026-01-31T15:18:24.547Z

---
 index.php | 148 ++++++++++++++++++++++++++++--------------------------
 1 file changed, 78 insertions(+), 70 deletions(-)

diff --git a/index.php b/index.php
index 7bcb142..c54da82 100644
--- a/index.php
+++ b/index.php
@@ -509,10 +509,10 @@ try {
             <canvas id="visualizer"></canvas>
 
             <div class="mt-4 pt-3 border-top border-white border-opacity-10 position-relative" style="z-index: 2;">
+                <button class="btn btn-sm btn-outline-light rounded-pill px-4 mb-2 w-100" data-bs-toggle="modal" data-bs-target="#playlistModal">
+                    <i class="fas fa-list-ul me-2"></i> <?= $isAdmin ? 'Gestión de Playlist' : 'Ver Playlist' ?>
+                </button>
                 <?php if ($isAdmin): ?>
-                <a href="#playlistSection" class="btn btn-sm btn-outline-light rounded-pill px-4 mb-2 w-100">
-                    <i class="fas fa-list-ul me-2"></i> Gestión de Playlist
-                </a>
                 <div class="mt-2 small text-primary fw-bold"><i class="fas fa-user-shield me-1"></i> PANEL ADMINISTRADOR</div>
                 <a href="?logout=1" class="btn btn-sm btn-outline-danger px-4 rounded-pill mt-2 w-100">Cerrar Sesión</a>
                 <?php endif; ?>
@@ -539,72 +539,6 @@ try {
     <div class="right-content">
       <img src="<?= $promoImage ?>" alt="Lili Records Promo" class="promo-image">
 
-      <?php if ($isAdmin): ?>
-      <!-- Playlist Window (Admin Only) -->
-      <div class="comments-window mb-4" id="playlistSection" style="min-height: auto;">
-        <div class="comments-header border-0 mb-3">
-          <div>
-            <h5 class="mb-1"><i class="fas fa-list-ul me-2 text-primary"></i>Gestión de Playlist</h5>
-            <p class="small opacity-60 mb-0">Control total de canciones para la radio.</p>
-          </div>
-          <button class="btn btn-sm btn-outline-primary rounded-pill px-3" onclick="document.getElementById('addSongForm').classList.toggle('d-none')">
-            <i class="fas fa-plus me-1"></i> Añadir
-          </button>
-        </div>
-
-        <div id="addSongForm" class="mb-4 d-none p-3 rounded-4" style="background: rgba(255,255,255,0.05); border: 1px solid var(--glass-border);">
-            <form action="manage_songs.php" method="POST" class="row g-2">
-                <input type="hidden" name="action" value="add">
-                <div class="col-sm-5">
-                    <input type="text" name="title" class="form-control form-control-glass" placeholder="Título" required>
-                </div>
-                <div class="col-sm-5">
-                    <input type="text" name="artist" class="form-control form-control-glass" placeholder="Artista" required>
-                </div>
-                <div class="col-sm-2">
-                    <button type="submit" class="btn btn-send-request text-white w-100 h-100">
-                        <i class="fas fa-plus"></i>
-                    </button>
-                </div>
-            </form>
-        </div>
-
-        <div class="comments-list" style="max-height: 400px; flex: none;">
-            <?php if (empty($songs)): ?>
-                <div class="text-center py-4 opacity-30">
-                  <i class="fas fa-music fa-3x mb-3"></i>
-                  <p>No hay canciones en la lista.</p>
-                </div>
-            <?php else: ?>
-                <?php foreach ($songs as $song): ?>
-                    <div class="song-item-modal <?= $song['is_active'] ? 'song-active-modal' : '' ?> p-3 mb-2 d-flex justify-content-between align-items-center">
-                        <div>
-                            <span class="song-title-text"><?= htmlspecialchars($song['title']) ?></span>
-                            <span class="song-artist-text"><?= htmlspecialchars($song['artist']) ?></span>
-                        </div>
-                        <div class="d-flex align-items-center gap-2">
-                            <form action="manage_songs.php" method="POST" class="m-0">
-                                <input type="hidden" name="action" value="toggle_active">
-                                <input type="hidden" name="id" value="<?= $song['id'] ?>">
-                                <button type="submit" class="btn-toggle-song <?= $song['is_active'] ? 'active' : '' ?> py-1 px-3">
-                                    <?= $song['is_active'] ? 'AL AIRE' : 'PONER AL AIRE' ?>
-                                </button>
-                            </form>
-                            <form action="manage_songs.php" method="POST" class="m-0" onsubmit="return confirm('¿Eliminar canción?')">
-                                <input type="hidden" name="action" value="delete">
-                                <input type="hidden" name="id" value="<?= $song['id'] ?>">
-                                <button type="submit" class="btn-delete-song" style="width: 28px; height: 28px;">
-                                    <i class="fas fa-trash-alt" style="font-size: 0.7rem;"></i>
-                                </button>
-                            </form>
-                        </div>
-                    </div>
-                <?php endforeach; ?>
-            <?php endif; ?>
-        </div>
-      </div>
-      <?php endif; ?>
-
       <!-- Messages Window -->
       <div class="comments-window">
         <div class="comments-header border-0 mb-3">
@@ -669,6 +603,80 @@ try {
     </div>
   </div>
 
+  <!-- Modal Playlist -->
+  <div class="modal fade" id="playlistModal" tabindex="-1" aria-hidden="true">
+    <div class="modal-dialog modal-dialog-centered modal-lg">
+      <div class="modal-content border-0" style="background: rgba(15,15,15,0.98); border-radius: 35px; backdrop-filter: blur(30px);">
+        <div class="modal-header border-white border-opacity-10 px-5 py-4">
+          <h5 class="modal-title fw-bold"><i class="fas fa-list-ul me-2 text-primary"></i>LISTA DE REPRODUCCIÓN</h5>
+          <button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button>
+        </div>
+        <div class="modal-body px-5 py-4">
+          <?php if ($isAdmin): ?>
+          <div class="mb-4 p-3 rounded-4" style="background: rgba(255,255,255,0.05); border: 1px solid var(--glass-border);">
+            <h6 class="small fw-bold mb-3 text-uppercase text-primary">Añadir Nueva Canción</h6>
+            <form action="manage_songs.php" method="POST" class="row g-2">
+                <input type="hidden" name="action" value="add">
+                <div class="col-sm-5">
+                    <input type="text" name="title" class="form-control form-control-glass" placeholder="Título" required>
+                </div>
+                <div class="col-sm-5">
+                    <input type="text" name="artist" class="form-control form-control-glass" placeholder="Artista" required>
+                </div>
+                <div class="col-sm-2">
+                    <button type="submit" class="btn btn-send-request text-white w-100 h-100">
+                        <i class="fas fa-plus"></i>
+                    </button>
+                </div>
+            </form>
+          </div>
+          <?php endif; ?>
+
+          <div class="comments-list" style="max-height: 450px;">
+            <?php if (empty($songs)): ?>
+                <div class="text-center py-4 opacity-30">
+                  <i class="fas fa-music fa-3x mb-3"></i>
+                  <p>No hay canciones en la lista.</p>
+                </div>
+            <?php else: ?>
+                <?php foreach ($songs as $song): ?>
+                    <div class="song-item-modal <?= $song['is_active'] ? 'song-active-modal' : '' ?>">
+                        <div>
+                            <span class="song-title-text"><?= htmlspecialchars($song['title']) ?></span>
+                            <span class="song-artist-text"><?= htmlspecialchars($song['artist']) ?></span>
+                        </div>
+                        <div class="d-flex align-items-center gap-2">
+                            <?php if ($isAdmin): ?>
+                            <form action="manage_songs.php" method="POST" class="m-0">
+                                <input type="hidden" name="action" value="toggle_active">
+                                <input type="hidden" name="id" value="<?= $song['id'] ?>">
+                                <button type="submit" class="btn-toggle-song <?= $song['is_active'] ? 'active' : '' ?>">
+                                    <?= $song['is_active'] ? 'AL AIRE' : 'PONER AL AIRE' ?>
+                                </button>
+                            </form>
+                            <form action="manage_songs.php" method="POST" class="m-0" onsubmit="return confirm('¿Eliminar canción?')">
+                                <input type="hidden" name="action" value="delete">
+                                <input type="hidden" name="id" value="<?= $song['id'] ?>">
+                                <button type="submit" class="btn-delete-song">
+                                    <i class="fas fa-trash-alt"></i>
+                                </button>
+                            </form>
+                            <?php elseif ($song['is_active']): ?>
+                                <span class="badge rounded-pill bg-primary px-3 py-2">SONANDO AHORA</span>
+                            <?php endif; ?>
+                        </div>
+                    </div>
+                <?php endforeach; ?>
+            <?php endif; ?>
+          </div>
+        </div>
+        <div class="modal-footer border-0 px-5 pb-5">
+          <button type="button" class="btn btn-outline-light px-5 py-2 rounded-pill fw-bold" data-bs-dismiss="modal">CERRAR</button>
+        </div>
+      </div>
+    </div>
+  </div>
+
   <!-- Modal Política de Privacidad -->
   <div class="modal fade" id="policyModal" tabindex="-1" aria-hidden="true">
     <div class="modal-dialog modal-dialog-centered modal-lg">
@@ -838,4 +846,4 @@ try {
     fetchMetadata();
   </script>
 </body>
-</html>
+</html>
\ No newline at end of file