Auto commit: 2026-02-04T00:33:32.636Z

static/css/custom.css

@@ -17,6 +17,12 @@ body {
     overflow-x: hidden;
     position: relative;
     min-height: 100vh;
+    padding-bottom: 0;
+    transition: padding-bottom 0.3s ease;
+}
+
+body.player-active {
+    padding-bottom: 100px;
 }
 
 body::before {
@@ -141,6 +147,11 @@ body::before {
     display: flex;
     flex-direction: column;
     align-items: flex-end;
+    transition: bottom 0.3s ease;
+}
+
+body.player-active .whatsapp-widget {
+    bottom: 130px;
 }
 
 .whatsapp-button {
@@ -183,4 +194,55 @@ body::before {
 .whatsapp-widget:hover .whatsapp-tooltip {
     opacity: 1;
     transform: translateY(0);
-}
+}
+
+/* Player Bar */
+.player-bar {
+    position: fixed;
+    bottom: -150px;
+    left: 0;
+    width: 100%;
+    height: 100px;
+    background: rgba(11, 13, 23, 0.95);
+    backdrop-filter: blur(15px);
+    border-top: 2px solid var(--neon-cyan);
+    z-index: 2000;
+    transition: bottom 0.4s cubic-bezier(0.4, 0, 0.2, 1);
+    display: flex;
+    align-items: center;
+}
+
+.player-bar.active {
+    bottom: 0;
+}
+
+.player-iframe-container {
+    width: 100%;
+    height: 100%;
+    position: relative;
+    overflow: hidden;
+}
+
+.player-iframe-container iframe {
+    width: 100%;
+    height: 350px; /* Mostramos solo la parte superior del player de RadioKing */
+    border: none;
+    position: absolute;
+    top: -120px; /* Ajuste para centrar los controles del player */
+}
+
+.close-player {
+    position: absolute;
+    top: 5px;
+    right: 15px;
+    background: none;
+    border: none;
+    color: var(--text-muted);
+    font-size: 1.5rem;
+    cursor: pointer;
+    z-index: 2001;
+}
+
+.close-player:hover {
+    color: var(--neon-pink);
+}