+ Menu Hover no Layout Rail, Twilio, Sms, Email, Templates, LNovo Layout Configurações

src/layout/AppRailPanel.vue

@@ -28,7 +28,7 @@ import PatientCreatePopover from '@/components/ui/PatientCreatePopover.vue';
 import ComponentCadastroRapido from '@/components/ComponentCadastroRapido.vue';
 
 const menuStore = useMenuStore();
-const { layoutState } = useLayout();
+const { layoutState, layoutConfig, clearRailHoverClose, scheduleRailHoverClose } = useLayout();
 const entitlements = useEntitlementsStore();
 const menuBadges = useMenuBadges();
 const router = useRouter();
@@ -107,6 +107,16 @@ function closePanel() {
     layoutState.railPanelOpen = false;
 }
 
+// ── Hover: mantém painel aberto enquanto mouse está dentro ───
+function onPanelMouseEnter() {
+    if (layoutConfig.railOpenMode !== 'hover') return;
+    clearRailHoverClose();
+}
+function onPanelMouseLeave() {
+    if (layoutConfig.railOpenMode !== 'hover') return;
+    scheduleRailHoverClose(200);
+}
+
 // ── QuickCreate (Pacientes) ───────────────────────────────
 const createPopover = ref(null);
 const quickDialog = ref(false);
@@ -301,7 +311,14 @@ async function goToResult(r) {
 
 <template>
     <Transition name="panel-slide">
-        <aside v-if="layoutState.railPanelOpen" class="w-[260px] shrink-0 h-screen flex flex-col border-r border-[var(--surface-border)] bg-[var(--surface-card)] overflow-hidden" aria-label="Menu lateral">
+        <aside
+            v-if="layoutState.railPanelOpen"
+            class="w-[260px] shrink-0 h-screen flex flex-col border-r border-[var(--surface-border)] bg-[var(--surface-card)] overflow-hidden"
+            :class="{ 'rp-panel--hover': layoutConfig.railOpenMode === 'hover' }"
+            aria-label="Menu lateral"
+            @mouseenter="onPanelMouseEnter"
+            @mouseleave="onPanelMouseLeave"
+        >
             <!-- Header -->
             <div class="h-14 shrink-0 flex items-center justify-between px-4 border-b border-[var(--surface-border)]">
                 <span class="text-[0.9rem] font-bold tracking-tight text-[var(--text-color)]">
@@ -483,6 +500,18 @@ async function goToResult(r) {
 </template>
 
 <style scoped>
+/* ── Hover mode: painel flutua sobre o conteúdo (não empurra) ──
+   Reserva o espaço da barra de ícones (60px) e do topbar (56px),
+   igual ao comportamento do .layout-sidebar no layout clássico.  */
+.rp-panel--hover {
+    position: fixed !important;
+    top: calc(56px + var(--notice-banner-height, 0px)) !important;
+    left: 60px !important;
+    height: calc(100vh - 56px - var(--notice-banner-height, 0px)) !important;
+    box-shadow: 2px 0 6px rgba(0, 0, 0, 0.06) !important;
+    z-index: 999;
+}
+
 .panel-slide-enter-active,
 .panel-slide-leave-active {
     transition: