Auto commit: 2026-02-14T15:54:26.642Z

index.php

@@ -31,9 +31,9 @@ $whatsapp_link = "https://wa.me/" . preg_replace('/[^0-9]/', '', $whatsapp_numbe
         :root {
             --accent-color: #00e676; /* WhatsApp Green */
             --primary-color: #38bdf8; /* Sky Blue */
-            --bg-overlay: rgba(15, 23, 42, 0.85);
+            --bg-overlay: rgba(15, 23, 42, 0.5); /* More transparent overlay */
-            --glass-bg: rgba(30, 41, 59, 0.7);
+            --glass-bg: rgba(15, 23, 42, 0.3); /* Transparent card background */
-            --glass-border: rgba(255, 255, 255, 0.1);
+            --glass-border: rgba(255, 255, 255, 0.2);
         }
 
         body, html {
@@ -43,7 +43,7 @@ $whatsapp_link = "https://wa.me/" . preg_replace('/[^0-9]/', '', $whatsapp_numbe
             height: 100%;
             font-family: 'Inter', sans-serif;
             color: #ffffff;
-            background-color: #0f172a;
+            background-color: #000;
             overflow: hidden;
         }
 
@@ -88,12 +88,12 @@ $whatsapp_link = "https://wa.me/" . preg_replace('/[^0-9]/', '', $whatsapp_numbe
 
         .glass-card {
             background: var(--glass-bg);
-            backdrop-filter: blur(16px);
+            backdrop-filter: blur(8px);
-            -webkit-backdrop-filter: blur(16px);
+            -webkit-backdrop-filter: blur(8px);
             border: 1px solid var(--glass-border);
             border-radius: 24px;
             padding: 2.5rem;
-            box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.5);
+            box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.3);
         }
 
         .brand h1 {
@@ -195,6 +195,67 @@ $whatsapp_link = "https://wa.me/" . preg_replace('/[^0-9]/', '', $whatsapp_numbe
             cursor: pointer;
         }
 
+        /* Interaction Form */
+        .interaction-form {
+            margin-top: 2rem;
+            display: flex;
+            flex-direction: column;
+            gap: 1rem;
+            text-align: left;
+        }
+
+        .interaction-form label {
+            font-size: 0.85rem;
+            font-weight: 600;
+            margin-bottom: -0.5rem;
+            opacity: 0.9;
+        }
+
+        .interaction-form input, 
+        .interaction-form textarea {
+            width: 100%;
+            padding: 0.8rem;
+            border-radius: 12px;
+            border: 1px solid rgba(255, 255, 255, 0.2);
+            background-color: rgba(255, 255, 255, 0.9); /* Semi-transparent white */
+            color: #0f172a; 
+            font-family: inherit;
+            font-size: 0.95rem;
+            box-sizing: border-box;
+            outline: none;
+            transition: all 0.2s;
+        }
+
+        .interaction-form textarea {
+            resize: none;
+            height: 80px;
+        }
+
+        .interaction-form input::placeholder,
+        .interaction-form textarea::placeholder {
+            color: #64748b;
+        }
+
+        .send-whatsapp-btn {
+            background-color: var(--accent-color);
+            color: #fff;
+            border: none;
+            padding: 0.8rem;
+            border-radius: 12px;
+            font-weight: 700;
+            cursor: pointer;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            gap: 0.5rem;
+            transition: transform 0.2s, background 0.2s;
+        }
+
+        .send-whatsapp-btn:hover {
+            transform: translateY(-2px);
+            background-color: #00c853;
+        }
+
         /* Right Side: Featured Image */
         .image-section {
             flex: 1.2;
@@ -235,7 +296,7 @@ $whatsapp_link = "https://wa.me/" . preg_replace('/[^0-9]/', '', $whatsapp_numbe
             width: 180px;
             height: 180px;
             margin: 1rem auto;
-            background: #fff;
+            background: rgba(255, 255, 255, 0.85);
             border-radius: 12px;
             display: flex;
             flex-direction: column;
@@ -243,6 +304,7 @@ $whatsapp_link = "https://wa.me/" . preg_replace('/[^0-9]/', '', $whatsapp_numbe
             justify-content: center;
             color: #333;
             padding: 10px;
+            backdrop-filter: blur(4px);
         }
 
         .qr-placeholder i {
@@ -341,6 +403,19 @@ $whatsapp_link = "https://wa.me/" . preg_replace('/[^0-9]/', '', $whatsapp_numbe
                     </div>
                 </div>
 
+                <!-- Interaction Form -->
+                <div class="interaction-form">
+                    <label>Tu Nombre</label>
+                    <input type="text" id="user-name" placeholder="Ej. Juan Pérez">
+                    
+                    <label>Tu Mensaje / Pedido Musical</label>
+                    <textarea id="user-message" placeholder="Escribe aquí lo que quieras decirnos..."></textarea>
+                    
+                    <button class="send-whatsapp-btn" onclick="sendToWhatsApp()">
+                        <i class="bi bi-whatsapp"></i> Enviar al WhatsApp
+                    </button>
+                </div>
+
                 <!-- Payment / Support Section -->
                 <div class="payment-section">
                     <p class="small">Apoya nuestro proyecto</p>
@@ -390,6 +465,26 @@ $whatsapp_link = "https://wa.me/" . preg_replace('/[^0-9]/', '', $whatsapp_numbe
             audio.volume = val;
         }
 
+        function sendToWhatsApp() {
+            const name = document.getElementById('user-name').value;
+            const message = document.getElementById('user-message').value;
+            const phoneNumber = '5359177041';
+            
+            if (!message.trim()) {
+                alert('Por favor, escribe un mensaje.');
+                return;
+            }
+
+            let finalMessage = `Hola Lili Records! `;
+            if (name.trim()) {
+                finalMessage += `Soy ${name}. `;
+            }
+            finalMessage += message;
+
+            const url = `https://wa.me/${phoneNumber}?text=${encodeURIComponent(finalMessage)}`;
+            window.open(url, '_blank');
+        }
+
         // Fetch Now Playing Metadata from RadioKing
         async function updateMetadata() {
             try {