/* ============================================================
   Vale dos Chalés — Base de proteção responsiva (global)
   ----------------------------------------------------------
   Inclua em TODOS os layouts HTML do app. Garante:
   • Zero overflow horizontal em qualquer device (iPhone SE,
     iPad, Android, desktop).
   • Sem zoom automático do Safari iOS ao focar inputs.
   • Safe-area-inset respeitado (notch do iPhone).
   • Touch feedback nativo (sem flash azul ao tocar).
   • Imagens/vídeos nunca extrapolam o container.
   Mantenha este CSS sempre como o PRIMEIRO <link> ou no início
   do <style>, pra que os layouts específicos possam sobrescrever.
   ============================================================ */

html, body {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
    overscroll-behavior-x: none;
    -webkit-text-size-adjust: 100%;
}

body {
    /* safe-area padding individual (não use shorthand pra não somar largura) */
    padding-top:    env(safe-area-inset-top, 0px);
    padding-right:  env(safe-area-inset-right, 0px);
    padding-bottom: env(safe-area-inset-bottom, 0px);
    padding-left:   env(safe-area-inset-left, 0px);
}

/* Imagens, vídeos e iframes nunca causam overflow */
img, video, iframe, svg, embed, object {
    max-width: 100%;
    height: auto;
}

/* Tabelas longas em mobile: rolam no próprio container, não no body */
.table-wrap, .responsive-table {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    max-width: 100%;
}

/* Inputs com >= 16px = Safari iOS não dá zoom automático no focus */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="password"],
input[type="number"],
input[type="date"],
input[type="time"],
input[type="datetime-local"],
input[type="search"],
input[type="url"],
input:not([type]),
select,
textarea {
    font-size: 16px !important;
}

/* Tap highlight nativo apagado (visual mais limpo, mais "app") */
a, button, [role="button"], input, label, summary {
    -webkit-tap-highlight-color: transparent;
}

/* Mantém word-break em strings longas (URLs, emails) que poderiam quebrar o layout */
.break-words, p, h1, h2, h3, h4, h5, h6 {
    overflow-wrap: anywhere;
    word-wrap: break-word;
}