version con las correcciones de texto y preferencias por defecto. Se ha dotado de un diseño responsive a la aplicación

src/lib/components/BotonAcabado.svelte

@@ -8,7 +8,7 @@
 
     const DEFAULT_IMAGE = "https://placehold.co/80x40/cccccc/333333?text=N/A";
 
-    let { opcion, estancia, filtro, seleccionada, onclick } = $props<{
+    let { opcion, filtro, seleccionada, onclick } = $props<{
         opcion : Opcion,
         filtro? : Filtro,
         estancia: string,

src/lib/components/BotonPopupImagen.svelte

@@ -7,7 +7,7 @@ import {  popupImagen } from "../stores/popups.svelte";
         imagen?: string;
     }>();
 
-    function handleOnclick (e: Event) {
+    function handleOnclick () {
         if (imagen) popupImagen.open(imagen ,titulo);
     }
 
@@ -18,8 +18,8 @@ import {  popupImagen } from "../stores/popups.svelte";
     <div role="button"
          tabindex="0"
          class="w-full group flex items-center text-left justify-between p-2 rounded-lg bg-gray-200 hover:bg-slate-400 cursor-pointer transition-colors duration-200 focus:outline-none focus:ring-2 focus:ring-cyan-500 text-gray-900 hover:text-white"
-         onclick={(e) => handleOnclick(e) }
+         onclick={handleOnclick}
-         onkeydown={(e) => { if (e.key === 'Enter' || e.key === 'Space') handleOnclick(e); }}
+         onkeydown={(e) => { if (e.key === 'Enter' || e.key === 'Space') handleOnclick(); }}
     >
         <span class="text-xs font-medium">{nombre ?? 'Sin Nombre'}</span>
     </div>

src/lib/components/EstanciaFicha.svelte

@@ -1,6 +1,5 @@
 <script lang="ts">
-    import {appState, imageSrc, setEstanciaSeleccionada} from "../stores/configurador.svelte.js";
+    import {imageSrc, setEstanciaSeleccionada} from "../stores/configurador.svelte.js";
-    import ImagenEstancia from "./ImagenEstancia.svelte";
     import type {Estancia} from "../../data/data_types";
     import EstanciaOpciones from "./EstanciaOpciones.svelte";
     import {navegationState} from "../stores/navegation.svelte.js";

src/lib/components/ImagenEstancia.svelte

@@ -12,7 +12,7 @@
 
     function goToConfigurador() {
         appState.estanciaSeleccionada = key;
-        navegationState.activeSection = 'configurador';
+        navegationState.activePage = 'cfg';
     }
 
 </script>

src/lib/components/Navegacion.svelte

@@ -18,11 +18,14 @@
     }
 
     // Nueva función para cerrar menú al hacer click fuera (opcional)
+    /*
     function handleBackdropClick(event: MouseEvent) {
         if ((event.target as HTMLElement).classList.contains('mobile-menu-backdrop')) {
             mobileMenuOpen = false;
         }
     }
+     */
+
 </script>
 
 <nav class="bg-white shadow-md border-b border-gray-200 sticky top-0 z-50">
@@ -86,7 +89,7 @@
                 <button
                         type="button"
                         class="inline-flex items-center justify-center p-2 rounded-md text-gray-400
-                           hover:text-gray-600 hover:bg-gray-100 focus:outline-none focus:ring-2
+                           hover:text-gray-600 hover:bg-gray-100 focus:outline-none focus:ring-2 z-400
                            focus:ring-inset focus:ring-blue-500 transition-colors duration-200
                            {mobileMenuOpen ? 'bg-gray-100 text-gray-600' : ''}"
                         onclick={toggleMobileMenu}
@@ -112,20 +115,20 @@
     <!-- Menú móvil con slide funcionando -->
     {#if mobileMenuOpen}
         <div
-                class="fixed inset-0 bg-black bg-opacity-50 z-40 md:hidden"
+                class="fixed inset-0 bg-white bg-opacity-90 z-40 md:hidden"
                 transition:fade={{ duration: 150 }}
-                onclick={() => mobileMenuOpen = false}>
+                onclick={() => mobileMenuOpen = false} >
 
             <!-- Menú que desliza desde arriba -->
-            <div
+            <div class="absolute top-16 left-0 right-0 bg-white shadow-xl border-t border-gray-200 z-200
-                    class="absolute top-16 left-0 right-0 bg-white shadow-xl border-t border-gray-200
+                    max-h-[calc(100vh-4rem)] overflow-y-auto"
-                   max-h-[calc(100vh-4rem)] overflow-y-auto"
                     transition:slide={{
                 duration: 300,
-                axis: 'Y',
+                axis: 'y',
                 easing: 'cubic-out'
             }}>
-                <div class="px-2 pt-2 pb-4 space-y-1 sm:px-3">
+                <div class="px-2 pt-2 pb-4 space-y-1 sm:px-3" >
+
                     {#each navegationState.sectionsInfo as section}
                         {#if section.menu }
                             <button
@@ -148,9 +151,11 @@
                             </button>
                         {/if}
                     {/each}
+
                     <div class="px-4 py-3 border-t border-gray-200 mt-2">
                         <PdfBoton />
                     </div>
+                    
                 </div>
             </div>
         </div>

src/lib/stores/navegation.svelte.ts

@@ -1,5 +1,5 @@
 
-export type PageId = 'ini' | 'cfg' | 'sel' | 'at';
+export type PageId = 'ini' | 'cfg' | 'sel' ;
 
 interface PageInfo {
     id   : PageId,
@@ -30,7 +30,6 @@ export const navegationState = {
         { id: 'ini', label: 'Inicio', menu: false },
         { id: 'cfg', label: 'Personalizar', mome: 'Personalizar Estancias', menu: true },
         { id: 'sel', label: 'Mi Selección', mome: 'Acabados y opciones seleccionadas', menu: true },
-        { id: 'at' , label: 'Active Thing', menu: false },
     ] as PageInfo[],
 }
 

src/lib/views/SeleccionView.svelte

@@ -2,9 +2,6 @@
 
     import {
         selections,
-        getAvailableGroups,
-        imageSrc,
-        appState,
         totalEstanciaOptions, totalOptions, getIncidencias, setEstanciaSeleccionada
     } from "../stores/configurador.svelte.js";
     import { proyecto } from "../../data/data_proyecto";
@@ -12,7 +9,6 @@
     import GalletaMensaje from "../components/GalletaMensaje.svelte";
     import EstanciaFicha from "../components/EstanciaFicha.svelte";
     import {formatearPrecio} from "../utils/formaters";
-    import Incidencias from "../components/Incidencias.svelte";
     import {navegationState} from "../stores/navegation.svelte";
     import PdfBoton from "../components/PdfBoton.svelte";