From c605a4f1a23035eb62d03587588555c8beacdbef Mon Sep 17 00:00:00 2001
From: Leonardo <lmnohama@gmail.com>
Date: Wed, 6 May 2026 15:59:26 -0300
Subject: [PATCH] MelissaSeguranca: card Trocar senha altura por conteudo +
 scroll y auto
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Em desktop o card .mse-w do main (Trocar senha) ganha:
- max-height: 100% (do .mse-main) — nao passa do viewport
- SEM min-height — altura natural por conteudo
- body com flex: 1 + min-height: 0 + overflow-y: auto pra scroll
  interno quando o conteudo (3 inputs + barra de forca + match +
  warning + 2 botoes) precisar de mais espaco que o disponivel.

Diferente da sidebar (que mantem min-h 300 pq pode haver pouca info).

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 src/layout/melissa/MelissaSeguranca.vue | 20 ++++++++++++++++----
 1 file changed, 16 insertions(+), 4 deletions(-)

diff --git a/src/layout/melissa/MelissaSeguranca.vue b/src/layout/melissa/MelissaSeguranca.vue
index f9e27ec..a5775be 100644
--- a/src/layout/melissa/MelissaSeguranca.vue
+++ b/src/layout/melissa/MelissaSeguranca.vue
@@ -921,15 +921,25 @@ onMounted(async () => {
 .mse-drawer-fade-enter-from,
 .mse-drawer-fade-leave-to { opacity: 0; }
 
-/* ═══════ Desktop (>=1024px): cards min-h 300 + body scroll ═══════ */
+/* ═══════ Desktop (>=1024px) ═══════ */
 @media (min-width: 1024px) {
+    /* Sidebar: cards min-h 300 + max-h 100% + body scroll */
     .mse-side > .mse-side__scroll > .mse-w--side {
         min-height: 300px;
         max-height: 100%;
         display: flex;
         flex-direction: column;
     }
-    .mse-side .mse-w--side > .mse-w__body {
+    /* Main: card "Trocar senha" sem min-height (altura por conteudo)
+       mas cap-ado em max-height: 100% do main pra nao passar do viewport;
+       body com overflow-y: auto pra scroll interno se conteudo for longo. */
+    .mse-main > .mse-w {
+        max-height: 100%;
+        display: flex;
+        flex-direction: column;
+    }
+    .mse-side .mse-w--side > .mse-w__body,
+    .mse-main > .mse-w > .mse-w__body {
         flex: 1;
         min-height: 0;
         overflow-y: auto;
@@ -937,8 +947,10 @@ onMounted(async () => {
         scrollbar-width: thin;
         scrollbar-color: var(--m-border-strong) transparent;
     }
-    .mse-side .mse-w--side > .mse-w__body::-webkit-scrollbar { width: 5px; }
-    .mse-side .mse-w--side > .mse-w__body::-webkit-scrollbar-thumb {
+    .mse-side .mse-w--side > .mse-w__body::-webkit-scrollbar,
+    .mse-main > .mse-w > .mse-w__body::-webkit-scrollbar { width: 5px; }
+    .mse-side .mse-w--side > .mse-w__body::-webkit-scrollbar-thumb,
+    .mse-main > .mse-w > .mse-w__body::-webkit-scrollbar-thumb {
         background: var(--m-border-strong);
         border-radius: 3px;
     }