diff --git a/resources/views/layouts/navigation.blade.php b/resources/views/layouts/navigation.blade.php
index a4eb903..dcd5883 100755
--- a/resources/views/layouts/navigation.blade.php
+++ b/resources/views/layouts/navigation.blade.php
@@ -218,15 +218,17 @@
                 @endif
 
                 <!-- Logout -->
-                <form method="POST" action="{{ route('logout') }}">
-                    @csrf
-                    <button type="submit" class="w-full text-left py-2 px-3 rounded flex items-center justify-start gap-2 bg-red-600 text-white hover:bg-red-700">
-                        <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6">
-                            <path stroke-linecap="round" stroke-linejoin="round" d="M8.25 9V5.25A2.25 2.25 0 0 1 10.5 3h6a2.25 2.25 0 0 1 2.25 2.25v13.5A2.25 2.25 0 0 1 16.5 21h-6a2.25 2.25 0 0 1-2.25-2.25V15m-3 0-3-3m0 0 3-3m-3 3H15" />
-                        </svg>
-                        <span>Cerrar sesión</span>
-                    </button>
-                </form>
+                <div class="pt-6">
+                    <form method="POST" action="{{ route('logout') }}">
+                        @csrf
+                        <button type="submit" class="w-full text-left py-2 px-3 rounded flex items-center justify-start gap-2 bg-red-600 text-white hover:bg-red-700">
+                            <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6">
+                                <path stroke-linecap="round" stroke-linejoin="round" d="M8.25 9V5.25A2.25 2.25 0 0 1 10.5 3h6a2.25 2.25 0 0 1 2.25 2.25v13.5A2.25 2.25 0 0 1 16.5 21h-6a2.25 2.25 0 0 1-2.25-2.25V15m-3 0-3-3m0 0 3-3m-3 3H15" />
+                            </svg>
+                            <span>Cerrar sesión</span>
+                        </button>
+                    </form>
+                </div>
             </nav>
         </div>
     </div>
diff --git a/resources/views/livewire/show-promociones.blade.php b/resources/views/livewire/show-promociones.blade.php
index 08f4d95..64e239c 100755
--- a/resources/views/livewire/show-promociones.blade.php
+++ b/resources/views/livewire/show-promociones.blade.php
@@ -41,42 +41,49 @@
                     </a>
                 @endif
             </div>
-            {{-- <div class=" gap-2 hidden sm:flex">
-                <select name="categoria_id" id="categoria_id" wire:model.debounce.500ms="categoria_id"
-                    class="w-[8rem] border-2 border-neutral-200 rounded-[0.8rem] shadow apperance-none ring-0 focus:ring-0 focus:border-neutral-300 py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
-                    <option value="" selected>Categoria</option>
-                    @foreach ($categorias as $categoria)
-                        <option value="{{ $categoria->id }}">{{ $categoria->nombre ?? '' }}</option>
-                    @endforeach
-                </select>
-                <div>
-                    @if (auth()->user()->rol->nombre == 'super' || auth()->user()->rol->nombre == 'administrador')
-                        <button x-on:click="newCategoria=true" x-transition.duration.300ms
-                            class="w-10 h-10 float-right bg-[#B221FD] hover:bg-[#7a02b8] rounded-full active:shadow-lg mouse shadow  ease-in focus:outline-none">
-                            <svg viewBox="0 0 20 20" enable-background="new 0 0 20 20" class="w-6 h-6 inline-block">
-                                <path fill="#FFFFFF"
-                                    d="M16,10c0,0.553-0.048,1-0.601,1H11v4.399C11,15.951,10.553,16,10,16c-0.553,0-1-0.049-1-0.601V11H4.601
-                                    C4.049,11,4,10.553,4,10c0-0.553,0.049-1,0.601-1H9V4.601C9,4.048,9.447,4,10,4c0.553,0,1,0.048,1,0.601V9h4.399
-                                    C15.952,9,16,9.447,16,10z" />
-                            </svg>
-                        </button>
-                    @endif
-
-                </div>
-            </div> --}}
         </div>
 
-        <div class="swiper-container overflow-hidden py-4 px-3" wire:ignore>
-            <div class="swiper-wrapper">
-                @foreach ($categorias as $i => $categoria1)
-                    <div wire:key="banner-{{ $categoria1->id }}" class="swiper-slide cursor-pointer transition hover:scale-105 rounded-lg overflow-hidden shadow bg-white" x-on:click="categorian='{{ $categoria1->nombre }}'">
-                        <img src="{{ asset($categoria1->imagen) }}" class="w-full h-12 md:h-32 object-cover object-center text-xs" alt="imagen de {{ $categoria1->nombre }}">
-                    </div>
-                @endforeach
+        <div
+            x-data="{
+                seleccionada: {
+                    nombre: '{{ $categorias->first()->nombre }}',
+                    imagen: '{{ asset($categorias->first()->imagen) }}'
+                }
+            }"
+            class="w-full"
+        >
+            <div x-show="seleccionada"
+                x-transition
+                class="mb-6 bg-white shadow rounded-2xl overflow-hidden transform transition-all duration-300 max-w-4xl m-auto">
+                <img :src="seleccionada.imagen"
+                    class="w-full h-24 sm:h-36 md:h-56 object-cover object-center"
+                    alt="imagen de categoría seleccionada">
+                <div class="p-4 text-center">
+                    <h2 class="text-xl font-semibold text-gray-800" x-text="seleccionada.nombre"></h2>
+                </div>
+            </div>
+
+            <div class="swiper-container overflow-hidden py-4 px-3" wire:ignore>
+                <div class="swiper-wrapper">
+                    @foreach ($categorias as $categoria1)
+                        <div wire:key="banner-{{ $categoria1->id }}" class="swiper-slide cursor-pointer transition hover:scale-105 rounded-lg overflow-hidden shadow bg-white"
+                            x-on:click="
+                                seleccionada = {
+                                    nombre: '{{ $categoria1->nombre }}',
+                                    imagen: '{{ asset($categoria1->imagen) }}'
+                                };
+                                $wire.set('categorian', '{{ $categoria1->nombre }}')
+                            "
+                        >
+                            <img src="{{ asset($categoria1->imagen) }}"
+                                class="w-full h-12 md:h-32 object-cover object-center"
+                                alt="imagen de {{ $categoria1->nombre }}">
+                        </div>
+                    @endforeach
+                </div>
             </div>
         </div>
 
-
         <div class="flex items-center justify-center mt-2 mb-4">
             <button x-on:click="verPro=true" class="max-w-md rounded-lg text-sm md:text-base px-4 py-2 text-white bg-[#B221FD] hover:bg-[#7a02b8] focus:shadow-outline-green sm-text-sm sm-leading-5">
                 Ver todas las promociones
@@ -1133,10 +1140,6 @@
                 </div>
             </div>
         </div>
-
-
-
-
     </div>
 
     <script>