/* ============================================================
   PROFINANCE HUB V56.04 — COMUNICAÇÃO INTERNA MOBILE · HOTFIX CABEÇALHO/FAB
   Escopo: <= 760px. Desktop preservado.
   UX: lista de conversas -> conversa em tela cheia (estilo app).
   ============================================================ */

.pf-com-mobile-appbar{display:none}
.pf-mobile-chat-back{display:none}

@media (max-width:760px){
  html,body{max-width:100%;overflow-x:hidden}
  body[data-module="comunicacao"]{min-height:100%;background:var(--bg)}

  /* V56.04: nesta tela o próprio módulo já é o chat.
     Esconde os atalhos globais para não cobrirem o botão Enviar. */
  body[data-module="comunicacao"] #pf-chat-launcher,
  body[data-module="comunicacao"] #pf-floating-chat,
  body[data-module="comunicacao"] #pf-scroll-top{
    display:none!important;visibility:hidden!important;pointer-events:none!important
  }

  /* Cabeçalho mobile em linguagem de aplicativo. */
  body[data-module="comunicacao"] .top .topin{display:none!important}
  body[data-module="comunicacao"] .top{
    position:relative!important;top:auto!important;z-index:20;background:linear-gradient(180deg,rgba(20,13,49,.99),rgba(15,10,36,.985));
    border-bottom:1px solid rgba(255,255,255,.065);backdrop-filter:blur(16px)
  }
  .pf-com-mobile-appbar{
    display:flex;align-items:center;gap:11px;padding:calc(10px + env(safe-area-inset-top)) 14px 11px;min-width:0
  }
  .pf-com-mobile-mark{
    width:44px;height:44px;flex:0 0 44px;border-radius:15px;padding:7px;object-fit:contain;
    background:linear-gradient(145deg,#f5792a,#9b5cff);border:1px solid rgba(255,255,255,.13);
    box-shadow:0 9px 24px rgba(245,121,42,.18)
  }
  .pf-com-mobile-title{min-width:0;flex:1}
  .pf-com-mobile-title small{display:block;font:800 9px/1.2 JetBrains Mono,monospace;letter-spacing:.15em;text-transform:uppercase;color:#f5792a}
  .pf-com-mobile-title strong{display:block;font:700 17px/1.2 Sora,Arial,sans-serif;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .pf-com-mobile-home{
    width:44px;height:44px;flex:0 0 44px;display:grid;place-items:center;border-radius:14px;border:1px solid rgba(255,255,255,.09);
    background:rgba(255,255,255,.045);color:var(--text);text-decoration:none
  }
  .pf-com-mobile-home svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}

  /* Tela principal: no mobile mostramos apenas a lista. */
  body[data-module="comunicacao"] .wrap{width:100%;max-width:none;padding:14px 12px calc(24px + env(safe-area-inset-bottom))}
  body[data-module="comunicacao"] .wrap>.eyebrow,
  body[data-module="comunicacao"] .wrap>h1,
  body[data-module="comunicacao"] .wrap>.lead{display:none!important}
  body[data-module="comunicacao"] .toolbar{margin:0 0 10px;justify-content:flex-end}
  body[data-module="comunicacao"] .toolbar .btn{min-height:44px;border-radius:14px;padding:10px 13px;font-size:11px}

  body[data-module="comunicacao"] .layout{
    display:block;height:auto;min-height:0;border:0;border-radius:0;overflow:visible;background:transparent;box-shadow:none
  }
  body[data-module="comunicacao"] .sidebar{
    display:block;max-height:none!important;overflow:visible;border:0!important;border-radius:0;background:transparent
  }
  body[data-module="comunicacao"] .side-head{
    padding:13px;border:1px solid var(--line);border-radius:20px;background:linear-gradient(160deg,rgba(31,22,67,.97),rgba(15,10,36,.98));margin-bottom:10px
  }
  body[data-module="comunicacao"] .side-head h2{font-size:17px;margin-bottom:10px}
  body[data-module="comunicacao"] .side-head input{
    min-height:46px;font-size:16px;border-radius:14px;padding:10px 13px;background:var(--surface3)
  }
  body[data-module="comunicacao"] .sidebar-section{margin:0 0 13px}
  body[data-module="comunicacao"] .sidebar-label{padding:8px 3px 7px;font:800 9px JetBrains Mono;letter-spacing:.11em;text-transform:uppercase;color:var(--dim)}
  body[data-module="comunicacao"] .conversation{
    width:100%;display:grid;grid-template-columns:50px minmax(0,1fr) auto;gap:11px;align-items:center;
    margin:0 0 8px;padding:12px;border:1px solid rgba(155,123,255,.16);border-radius:18px;
    background:linear-gradient(160deg,rgba(36,25,80,.94),rgba(17,11,43,.95));
    box-shadow:0 10px 24px rgba(5,3,18,.12)
  }
  body[data-module="comunicacao"] .conversation.active{background:linear-gradient(160deg,rgba(44,31,92,.98),rgba(22,14,54,.98));border-color:rgba(245,121,42,.34);box-shadow:inset 3px 0 0 #f5792a,0 10px 24px rgba(5,3,18,.12)}
  body[data-module="comunicacao"] .conversation:after{content:'›';font-size:22px;line-height:1;color:#8175a5;margin-left:2px}
  body[data-module="comunicacao"] .conversation>.unread{grid-column:3;grid-row:1;align-self:start;margin-top:1px}
  body[data-module="comunicacao"] .conversation:has(.unread):after{display:none}
  body[data-module="comunicacao"] .conv-avatar{width:50px;height:50px;border-radius:50%;font-size:14px;flex:0 0 50px;overflow:hidden}
  body[data-module="comunicacao"] .conversation b{font-size:13px;line-height:1.3}
  body[data-module="comunicacao"] .conversation small{font-size:10px;line-height:1.35;max-width:none;margin-top:5px;color:var(--dim)}
  body[data-module="comunicacao"] .sidebar-empty{padding:15px;border:1px dashed var(--line);border-radius:15px;color:var(--dim);font-size:11px;text-align:center}

  /* Conversa: tela cheia real, como app de mensagens. */
  body[data-module="comunicacao"] .chat{display:none}
  body[data-module="comunicacao"].pf-mobile-chat-open{overflow:hidden;overscroll-behavior:none}
  body[data-module="comunicacao"].pf-mobile-chat-open>.top{display:none!important}
  body[data-module="comunicacao"].pf-mobile-chat-open .chat{
    display:grid;position:fixed;inset:0;z-index:300;height:100dvh;min-height:0;
    grid-template-rows:auto minmax(0,1fr) auto;background:var(--bg);overflow:hidden
  }
  body[data-module="comunicacao"] .chat-head{
    min-height:70px;padding:calc(9px + env(safe-area-inset-top)) 10px 9px;gap:9px;
    background:linear-gradient(180deg,rgba(20,13,49,.998),rgba(15,10,36,.995));border-bottom:1px solid rgba(255,255,255,.07)
  }
  .pf-mobile-chat-back{
    display:grid;width:44px;height:44px;flex:0 0 44px;place-items:center;border:1px solid rgba(255,255,255,.09);
    border-radius:14px;background:rgba(255,255,255,.045);color:var(--text);font-size:24px;line-height:1;cursor:pointer
  }
  body[data-module="comunicacao"] .chat-head .conv-avatar{width:44px;height:44px;flex:0 0 44px;border-radius:50%}
  body[data-module="comunicacao"] .chat-head>div:not(.conv-avatar){min-width:0;flex:1}
  body[data-module="comunicacao"] .chat-head h2{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  body[data-module="comunicacao"] .chat-head p{font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:3px}
  body[data-module="comunicacao"] .chat-head .group-settings{min-height:40px;padding:8px 9px;flex:0 0 auto;font-size:8px;border-radius:11px}

  body[data-module="comunicacao"] .messages{
    min-height:0;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;
    padding:14px 12px 18px;gap:10px;background:radial-gradient(440px 260px at 10% -5%,rgba(126,79,230,.11),transparent 65%),var(--bg)
  }
  body[data-module="comunicacao"] .message{max-width:88%;padding:10px 11px;border-radius:16px 16px 16px 5px}
  body[data-module="comunicacao"] .message.mine{border-radius:16px 16px 5px 16px}
  body[data-module="comunicacao"] .message p{font-size:13px;line-height:1.5}
  body[data-module="comunicacao"] .msg-meta{font-size:8px;gap:5px;flex-wrap:wrap}
  body[data-module="comunicacao"] .read-state{font-size:7px}
  body[data-module="comunicacao"] .msg-actions button{font-size:9px;min-height:28px;padding:4px 2px}
  body[data-module="comunicacao"] .reaction-quickbar{opacity:1;max-height:38px;margin-top:6px;overflow:visible;flex-wrap:wrap}

  body[data-module="comunicacao"] .composer{
    position:relative;z-index:8;padding:9px 10px calc(9px + env(safe-area-inset-bottom));background:rgba(27,18,64,.98);border-top:1px solid rgba(255,255,255,.07)
  }
  body[data-module="comunicacao"] .composer textarea{
    height:48px;min-height:48px;max-height:112px;font-size:16px;border-radius:15px;padding:12px 13px;resize:none
  }
  body[data-module="comunicacao"] .composer-row{margin-top:7px;gap:6px;min-width:0}
  body[data-module="comunicacao"] .icon-btn{width:42px;height:42px;flex:0 0 42px;border-radius:13px}
  body[data-module="comunicacao"] .composer .send{position:relative;z-index:10;height:42px;min-width:54px;padding:0 12px;border-radius:13px;margin-left:auto}
  body[data-module="comunicacao"] .composer .send span{display:none}
  body[data-module="comunicacao"] .recording{font-size:8px;line-height:1.3;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  body[data-module="comunicacao"] .chat-audio-capture{max-width:100%}
  body[data-module="comunicacao"] .emoji-picker{left:0;right:auto;bottom:54px;grid-template-columns:repeat(6,36px);max-width:calc(100vw - 20px)}

  body[data-module="comunicacao"] .info{display:none!important}

  /* Modais em tela cheia/folha mobile. */
  body[data-module="comunicacao"] .overlay{padding:10px;padding-top:calc(10px + env(safe-area-inset-top));padding-bottom:calc(10px + env(safe-area-inset-bottom))}
  body[data-module="comunicacao"] .modal{width:100%;max-height:100%;border-radius:20px;padding:16px}
  body[data-module="comunicacao"] .grid,
  body[data-module="comunicacao"] .checks{grid-template-columns:1fr}
  body[data-module="comunicacao"] .field input,
  body[data-module="comunicacao"] .field select,
  body[data-module="comunicacao"] .field textarea{font-size:16px;min-height:44px}

  html[data-theme='light'] body[data-module="comunicacao"] .top,
  html[data-theme='light'] body[data-module="comunicacao"] .chat-head{background:linear-gradient(180deg,rgba(255,255,255,.99),rgba(246,248,252,.99))}
  html[data-theme='light'] body[data-module="comunicacao"] .conversation,
  html[data-theme='light'] body[data-module="comunicacao"] .side-head{background:linear-gradient(160deg,#fff,#f7f8ff)}
  html[data-theme='light'] body[data-module="comunicacao"] .pf-com-mobile-home,
  html[data-theme='light'] body[data-module="comunicacao"] .pf-mobile-chat-back{background:#f5f7fb;border-color:#dbe2ee;color:#20253a}
}