/*
 * e-Reobot — correções mobile pontuais
 * 1. Exibição integral do asset principal do hero.
 * 2. Chat em tela cheia em smartphones.
 * Nenhum comportamento JavaScript, link, formulário ou conteúdo é alterado.
 */

@media (max-width: 840px) {
  /*
   * Imagem principal: remove limites de altura, máscara e proporções rígidas.
   * A imagem mantém sua proporção natural e aparece inteira dentro da tela.
   */
  .visual-wrap,
  .hero-visual {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    align-items: center !important;
    justify-content: center !important;
  }

  .visual-wrap .hero-card-inner,
  .hero-visual .hero-card,
  .hero-visual .hero-card-inner {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;
    aspect-ratio: auto !important;
    margin-inline: auto !important;
  }

  .visual-wrap .hero-card-inner,
  .hero-visual .hero-card-inner {
    overflow: visible !important;
  }

  .visual-wrap .hero-card-inner img,
  .hero-visual .hero-card img,
  .hero-visual .hero-card-inner img {
    position: static !important;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: auto !important;
    object-fit: contain !important;
    object-position: center center !important;
    transform: none !important;
    clip-path: none !important;
    -webkit-mask-image: none !important;
    mask-image: none !important;
  }

  /*
   * Chat mobile: a caixa deixa de ficar presa à lateral e ocupa a viewport.
   * O botão fechar existente permanece no cabeçalho do chat.
   */
  .faq-chatbot {
    z-index: 2147483000 !important;
  }

  .faq-chatbot-box {
    position: fixed !important;
    inset: 0 !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 100vw !important;
    max-width: none !important;
    min-width: 0 !important;
    height: 100vh !important;
    height: 100dvh !important;
    min-height: 100vh !important;
    min-height: 100dvh !important;
    max-height: none !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    overscroll-behavior: contain !important;
    z-index: 2147483001 !important;
    background: #fff !important;
  }

  .faq-chatbot-box[hidden] {
    display: none !important;
  }

  .faq-chatbot-header {
    flex: 0 0 auto !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: calc(68px + env(safe-area-inset-top)) !important;
    padding: max(12px, env(safe-area-inset-top)) 14px 12px !important;
    box-sizing: border-box !important;
    grid-template-columns: 40px 44px minmax(0, 1fr) 44px !important;
    gap: 10px !important;
  }

  .faq-chatbot-title {
    min-width: 0 !important;
  }

  .faq-chatbot-title strong,
  .faq-chatbot-title small {
    max-width: 100% !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    overflow-wrap: anywhere !important;
  }

  .faq-chatbot-close {
    position: relative !important;
    display: grid !important;
    place-items: center !important;
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    padding: 0 !important;
    margin: 0 !important;
    border-radius: 999px !important;
    cursor: pointer !important;
    font-size: 1.45rem !important;
    line-height: 1 !important;
    z-index: 2 !important;
  }

  .faq-chatbot-subheader {
    flex: 0 0 auto !important;
    min-width: 0 !important;
  }

  .faq-chatbot-messages {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    min-height: 0 !important;
    width: 100% !important;
    padding: 16px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    -webkit-overflow-scrolling: touch !important;
  }

  .faq-chatbot-message,
  .faq-chatbot-actions {
    max-width: 92% !important;
    overflow-wrap: anywhere !important;
    word-break: normal !important;
  }

  .faq-chatbot-suggestions,
  .faq-chatbot-options {
    flex: 0 0 auto !important;
    width: 100% !important;
    max-height: 28dvh !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }

  .faq-chatbot-form {
    flex: 0 0 auto !important;
    width: 100% !important;
    min-width: 0 !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 8px !important;
    padding: 10px 12px max(10px, env(safe-area-inset-bottom)) !important;
    box-sizing: border-box !important;
  }

  .faq-chatbot-input {
    width: 100% !important;
    min-width: 0 !important;
    font-size: 16px !important;
  }

  .faq-chatbot-send {
    flex: 0 0 auto !important;
    min-width: 52px !important;
    min-height: 46px !important;
  }

  /* Impede a página ao fundo de rolar enquanto o chat estiver aberto. */
  body:has(.faq-chatbot-box:not([hidden])) {
    overflow: hidden !important;
    touch-action: none !important;
  }
}

@media (max-width: 420px) {
  .faq-chatbot-header {
    grid-template-columns: 36px 40px minmax(0, 1fr) 42px !important;
    gap: 7px !important;
    padding-inline: 10px !important;
  }

  .faq-chatbot-close {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    min-height: 42px !important;
  }

  .faq-chatbot-messages {
    padding: 12px !important;
  }

  .faq-chatbot-form {
    padding-inline: 10px !important;
  }
}

@media (max-height: 520px) and (orientation: landscape) {
  .faq-chatbot-box {
    height: 100vh !important;
    height: 100dvh !important;
    min-height: 100vh !important;
    min-height: 100dvh !important;
  }

  .faq-chatbot-suggestions,
  .faq-chatbot-options {
    max-height: 22dvh !important;
  }
}

/* Carrossel da seção Controle total: gesto horizontal no mobile. */
@media (max-width: 840px) {
  #controleCarousel .control-carousel-window {
    touch-action: pan-y pinch-zoom !important;
    overscroll-behavior-x: contain;
    -webkit-user-select: none;
    user-select: none;
  }

  #controleCarousel .control-carousel-window.is-touching {
    cursor: grabbing;
  }

  #controleCarousel .control-carousel-track {
    will-change: transform;
  }
}
