/**
 * Rede de segurança de responsividade.
 *
 * Muitos clientes reservam pelo celular. Estas regras impedem os estouros
 * horizontais mais comuns em telas que ainda não foram auditadas uma a uma.
 * Não substituem media queries específicas — só evitam que uma página nova
 * quebre feio por um descuido.
 */

/* Deliberadamente NÃO usamos `overflow-x: hidden` no body: isso esconderia o
   estouro em vez de corrigi-lo, e faria a auditoria de responsividade reportar
   "ok" numa tela quebrada. Preferimos que o problema apareça. */

/* Imagem nunca é mais larga que o container. */
img, video, iframe, svg {
    max-width: 100%;
    height: auto;
}

/* Palavras longas (URLs, e-mails, códigos) não empurram o layout. */
h1, h2, h3, h4, p, span, a, li, td, th, label {
    overflow-wrap: break-word;
}

/* Tabelas rolam dentro de si mesmas em vez de esticar a página. */
table {
    max-width: 100%;
}
.table-responsive,
.table-wrapper {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

/* Campos de formulário respeitam o container (padding não estoura a largura). */
input, select, textarea, button {
    max-width: 100%;
    box-sizing: border-box;
}

/* Blocos de código e pré-formatados rolam sozinhos. */
pre, code {
    overflow-x: auto;
    max-width: 100%;
}

@media (max-width: 600px) {
    /* O botão flutuante de WhatsApp não cobre a barra de ação dos favoritos. */
    .container {
        padding-left: 1rem;
        padding-right: 1rem;
    }
}

/* O botão flutuante do WhatsApp é fixo no canto inferior direito. Sem folga no
   fim da página, o último controle de um formulário fica embaixo dele e o
   usuário não consegue tocar. 5rem = o botão (56px) mais margem. */
@media (max-width: 900px) {
    body { padding-bottom: 5rem; }
}
