/*
  PORQUE EXISTE: grelha desktop/tablet. NUNCA redefine .ide abaixo de
  821px — isso partia o mobile (chat numa coluna estreita + vazio à direita).
*/
@media (min-width: 821px) {
  /* Sem ficheiro: chat ocupa a largura toda (editor colapsado) */
  .ide {
    grid-template-columns: 0px minmax(0, 1fr);
  }
  /* Com ficheiro aberto: editor à esquerda + chat como painel lateral */
  body.tem-ficheiro .ide {
    grid-template-columns: minmax(320px, 1fr) minmax(360px, var(--chat-w, 460px));
  }
}

@media (min-width: 821px) and (max-width: 980px) {
  body.tem-ficheiro .ide {
    --chat-w: min(400px, 48vw);
    grid-template-columns: minmax(0, 1fr) var(--chat-w);
  }
}

@media (max-width: 400px) {
  .chat-conversa { padding-left: 10px; padding-right: 10px; }
  .msg-usuario { max-width: 98%; }
  .seletor-janela { flex-wrap: wrap; }
}

@media (max-width: 900px) and (orientation: landscape) and (max-height: 500px) {
  .chat-rodape { padding-top: 4px; padding-bottom: 4px; gap: 4px; }
  .status-chat { display: none !important; }
  .nav-mobile button {
    flex-direction: row;
    justify-content: center;
    gap: 8px;
    min-height: 44px;
    padding: 6px 0;
    font-size: 12px;
  }
  .nav-mobile button.ativo::before { display: none; }
  .caixa-prompt { margin: 0 8px 4px; padding: 8px 10px; }
  .chat-conversa { padding-top: 8px; padding-bottom: 8px; }
}

@media (min-width: 1400px) {
  .ide {
    --chat-w: 520px;
  }
  .chat-conversa { padding-left: 22px; padding-right: 22px; }
}

@media (max-width: 820px) {
  .painel-chat .chat-rodape .topo-acoes {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
    width: 100%;
  }
  .seletor-janela { flex: 1; min-width: 0; }

  /* Mobile: sidebar volta a ser ecrã cheio (não overlay) */
  .sidebar {
    position: relative !important;
    transform: none !important;
    width: 100% !important;
    max-width: 100% !important;
    box-shadow: none !important;
    pointer-events: auto !important;
    z-index: auto !important;
  }
  .split-chat,
  .split-sidebar,
  .btn-abrir-side,
  .btn-fechar-side,
  .btn-ficheiros-flutuante {
    display: none !important;
  }
}