/*
 * Moldura do modal — cópia fiel do bloco "Modal" de
 * /mockup/agendador-cardapio-web.html. Usada na confirmação do lead e na
 * exclusão de reuniões pela administração.
 *
 * Diferenças por causa da troca de JavaScript por navegação real: o modal já
 * chega aberto (o servidor só o desenha quando ele deve estar aberto) e o X e o
 * fundo são links de fechar. .corpo-modal e .acoes-modal não existem no mockup:
 * são o miolo e a linha de botões de um modal sem formulário.
 */

.fundo-modal{
  position:fixed;inset:0;z-index:50;background:rgba(29,21,38,.55);backdrop-filter:blur(4px);
  display:flex;align-items:center;justify-content:center;padding:16px;
  opacity:0;visibility:hidden;transition:opacity 200ms ease,visibility 200ms;
}
.fundo-modal.aberto{opacity:1;visibility:visible}
.modal{
  background:var(--papel);border-radius:var(--r-lg);width:min(520px,100%);
  max-height:92vh;overflow-y:auto;box-shadow:0 24px 64px rgba(29,21,38,.32);
  transform:translateY(18px) scale(.97);transition:transform 240ms cubic-bezier(.22,.61,.36,1);
}
.fundo-modal.aberto .modal{transform:none}
.modal-topo{padding:22px 24px 18px;border-bottom:1px solid var(--linha);display:flex;justify-content:space-between;align-items:flex-start;gap:14px}
.modal-topo h3{font-size:19px;font-weight:800;letter-spacing:-.4px}
.modal-topo p{font-size:13.5px;color:var(--tinta-media);margin-top:3px}
.fechar{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;color:var(--tinta-fraca);flex:none;transition:var(--transicao)}
.fechar:hover{background:var(--fundo);color:var(--tinta)}

/* Clicar fora fecha, como no mockup — lá é um listener, aqui é um link que
   cobre o fundo e fica atrás da caixa. */
.saida-modal{position:absolute;inset:0;z-index:0}
.fundo-modal .modal{position:relative;z-index:1}

.corpo-modal{padding:20px 24px 24px}
.corpo-modal > p{font-size:14px;color:var(--tinta-media);margin-bottom:16px}
.acoes-modal{display:flex;gap:11px;justify-content:flex-end;flex-wrap:wrap;margin-top:20px}
.acoes-modal .btn{padding:12px 24px;font-size:14px}