fix: Corregir configuración de estilos y componentes

- Agregar imports de Tailwind CSS v4 y Nuxt UI en main.css
- Renombrar QueueActions.vue -> Actions.vue y QueueItem.vue -> Item.vue para evitar conflictos de nombres de componentes
- Crear composable useMediaQuery para manejo de responsive
- Corregir referencias a componentes en index.vue y PrintQueue.vue
- Actualizar imports de servidor a rutas relativas
- Instalar @iconify-json/heroicons y @iconify-json/lucide
- Actualizar Jimp a sintaxis v1.x

app/assets/css/main.css

@@ -1,3 +1,6 @@
+@import "tailwindcss";
+@import "@nuxt/ui";
+
 /* Safe area para PWA en iOS */
 .safe-area-bottom {
   padding-bottom: env(safe-area-inset-bottom);
@@ -19,11 +22,20 @@
 }
 
 ::-webkit-scrollbar-thumb {
-  @apply bg-gray-300 dark:bg-gray-700 rounded-full;
+  background: rgb(209 213 219); /* gray-300 */
+  border-radius: 9999px;
 }
 
 ::-webkit-scrollbar-thumb:hover {
-  @apply bg-gray-400 dark:bg-gray-600;
+  background: rgb(156 163 175); /* gray-400 */
+}
+
+.dark ::-webkit-scrollbar-thumb {
+  background: rgb(55 65 81); /* gray-700 */
+}
+
+.dark ::-webkit-scrollbar-thumb:hover {
+  background: rgb(75 85 99); /* gray-600 */
 }
 
 /* Reset básico */

app/components/queue/PrintQueue.vue

@@ -15,7 +15,7 @@ const queue = usePrintQueue()
     </div>
 
     <TransitionGroup name="list" tag="div" class="space-y-2">
-      <QueueQueueItem
+      <QueueItem
         v-for="(op, index) in queue.operations.value"
         :key="index"
         :operation="op"

app/composables/useMediaQuery.ts

@@ -0,0 +1,20 @@
+export function useMediaQuery(query: string) {
+  const matches = ref(false)
+
+  if (import.meta.client) {
+    const mediaQuery = window.matchMedia(query)
+    matches.value = mediaQuery.matches
+
+    const handler = (e: MediaQueryListEvent) => {
+      matches.value = e.matches
+    }
+
+    mediaQuery.addEventListener('change', handler)
+
+    onUnmounted(() => {
+      mediaQuery.removeEventListener('change', handler)
+    })
+  }
+
+  return matches
+}

app/pages/index.vue

@@ -28,7 +28,7 @@ const queue = usePrintQueue()
         </div>
 
         <div class="p-4 border-t border-gray-200 dark:border-gray-800">
-          <QueueQueueActions />
+          <QueueActions />
         </div>
       </aside>
 
@@ -44,7 +44,7 @@ const queue = usePrintQueue()
 
           <template v-else-if="activeTab === 'queue'">
             <QueuePrintQueue />
-            <QueueQueueActions class="mt-4" />
+            <QueueActions class="mt-4" />
           </template>
 
           <template v-else-if="activeTab === 'templates'">