/*
 * responsive.custom.css is for custom media queries that are not set via the
 * theme settings, such as cascading media queries.
 *
 * By default all the other responsive stylesheets used in Adaptivetheme use a
 * "stacking method", however cascading media queries use a waterfall method so
 * you can leverage the cascade and inheritance for all browsers that support
 * media queries, regardless of screen size.
 *
 * @SEE http://zomigi.com/blog/essential-considerations-for-crafting-quality-media-queries/#mq-overlap-stack
 *
 * NOTE: this file loads by default, to disable got to your theme settings and
 * look under the "CSS" settings tab.
 */

/* ==========================================================================
   ≤1024px — tablets + phones: contain overflow, stack floats, reduce gutters
   ========================================================================== */
@media only screen and (max-width: 1024px) {
  html,
  body {
    overflow-x: hidden;
    max-width: 100%;
  }

  #page,
  #page .content-width,
  #content,
  #content .content-width,
  #footer .content-width,
  #copyright-region .content-width {
    max-width: 100%;
    box-sizing: border-box;
  }

  img,
  video,
  iframe,
  embed,
  object {
    max-width: 100%;
    height: auto;
  }

  .region[class*="float-blocks"] .block {
    float: none;
    width: 100%;
  }

  /* Footer: stack columns */
  #footer .footer-block .box-footer,
  #footer .footer-block .box-footer#info-footer,
  #footer .footer-block .box-footer#menu-footer,
  #footer .footer-block .box-footer#menu-footer-2,
  #footer .footer-block .box-footer#formulario-footer {
    float: none;
    display: block;
    width: 100%;
    max-width: 100%;
    margin: 0 0 4vw;
    padding-left: 0;
    padding-right: 0;
    min-width: 0;
  }

  #footer nav ul li {
    min-width: 0;
  }

  #footer .footer-block {
    padding-left: 5vw;
    padding-right: 5vw;
  }

  /* Home CTA strip */
  #page #home-chamada-cadastre-se .texto,
  #page #home-chamada-cadastre-se .link-pagina {
    float: none;
    display: block;
    width: 100%;
    max-width: 100%;
  }

  /* Auth / register cards */
  .page-cadastre-se #page #content #cadastro-wrapper .box-cadastro,
  .page-cadastre-se #page #content #cadastro-wrapper .box-cadastro#cadastre-empresa {
    float: none;
    width: 100%;
    padding-left: 8vw;
    padding-right: 8vw;
  }

  .page-user-password #page #content #user-pass,
  .page-user-login #page #content #user-login {
    width: 90%;
    max-width: 420px;
  }

  /* Profile columns */
  .page-user #page #content #meu-perfil-left,
  .page-user #page #content #meu-perfil-right {
    float: none;
    display: block;
    width: 100%;
    padding-left: 4vw;
    padding-right: 4vw;
  }

  /* Overlay first-access */
  #page #content .overlay-primeiro-acesso .overlay-inicio {
    width: 92%;
    max-width: 640px;
    height: auto;
    min-height: 0;
  }

  #page #content .overlay-primeiro-acesso .overlay-content {
    width: 100%;
    height: auto;
    min-height: 50vh;
    max-height: 90vh;
    overflow-y: auto;
  }

  /* Tourism detail: kill desktop absolute sidebar layout */
  .node-type-praia #page #content .node-praia {
    padding-left: 5vw;
    padding-right: 5vw;
    min-height: 0;
    overflow: visible;
    overflow-x: hidden;
  }

  .node-type-praia #page #content .node-praia .praia-img {
    position: relative;
    left: auto;
    top: auto;
    width: 100%;
    margin-bottom: 4vw;
  }

  .node-type-hospedagem #page #content .node-hospedagem .informacoes-basicas,
  .node-type-hospedagem #page #content .node-hospedagem .informacoes-residencia,
  .node-type-servicos #page #content .node-hospedagem .content-node-left,
  .node-type-servicos #page #content .node-hospedagem .content-node-right,
  .node-type-hospedagem #page #content .hospedagem-capa,
  .node-type-servicos #page #content .hospedagem-capa {
    float: none;
    width: 100%;
    display: block;
  }

  /* Listing filters / banners */
  .page-hospedagem #page #content #filtro-servicos-wrapper,
  .page-servicos #page #content #filtro-servicos-wrapper,
  .page-hospedagem #page #content .hospedagem-banner-topo form .views-exposed-widget,
  .page-servicos #page #content .banner-topo-servicos form .views-exposed-widget,
  .page-praias #page #content .banner-topo-praias form .views-exposed-widget {
    width: 100%;
    max-width: 100%;
    float: none;
  }

  /* Comments two-up → stack */
  .node-type-praia #page #content .comments-wrapper .comments,
  .node-type-hospedagem #page #content .comments-wrapper .comments,
  .node-type-servicos #page #content .comments-wrapper .comments {
    width: 100%;
    float: none;
  }

  /* Tables: horizontal scroll wrapper */
  .page-acesso-interno #page #content .view-content {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    max-width: 100%;
  }

  .page-acesso-interno #page #content table.views-table,
  table.views-table {
    min-width: 560px;
  }

  .page-acesso-interno #header-top {
    position: static;
    float: none;
    width: 100%;
    min-height: 0;
    margin-left: 0;
    padding-top: 0;
  }

  .page-acesso-interno-promocoes .view.view-comercial-listagens,
  .page-acesso-interno-eventos .view.view-comercial-listagens {
    margin-left: 0;
  }
}

/* ==========================================================================
   ≤768px — type floors for known tiny global.vw selectors, forms, tables
   (avoid blanket p/a overrides — device sheets already size most UI)
   ========================================================================== */
@media only screen and (max-width: 768px) {
  /* Floors for selectors that often keep desktop 0.6–1.05vw from global */
  #copyright-region a,
  #copyright-region p,
  #copyright-region li,
  #page #content #user-login a.link-forgot-pass,
  .page-acesso-interno #page #content table.views-table th,
  .page-acesso-interno #page #content table.views-table td {
    font-size: clamp(12px, 3vw, 16px);
  }

  .page-user-login #page #content #user-login .box-login h1,
  .page-user-password #page #content #user-pass .box-recuperar-senha h1,
  .page-cadastre-se #page #content .pane-1 h1,
  .page-cadastre-se #page #content #cadastro-wrapper .box-cadastro h2 {
    font-size: clamp(22px, 5vw, 32px);
    line-height: 1.25;
    word-wrap: break-word;
  }

  .page-cadastre-se #page #content .pane-1 h3,
  .page-cadastre-se #page #content #cadastro-wrapper .box-cadastro h4,
  .page-cadastre-se #page #content #cadastro-wrapper .box-cadastro p,
  .page-cadastre-se #page #content #cadastro-wrapper .box-cadastro a {
    font-size: clamp(14px, 3.5vw, 18px);
  }

  #page #content .overlay-primeiro-acesso .informacoes-overlay h2.title {
    font-size: clamp(20px, 4.5vw, 28px);
  }

  #page #content .overlay-primeiro-acesso .informacoes-overlay p.descricao,
  #page #content .overlay-primeiro-acesso .informacoes-overlay .opcoes-funcoes-site .funcionalidades {
    font-size: clamp(14px, 3.5vw, 18px);
  }

  .node-type-praia #page #content .node-praia .descricao,
  .node-type-praia #page #content .node-praia .como-chegar,
  .node-type-praia #page #content .node-praia p.sub-title {
    font-size: clamp(14px, 3.5vw, 17px);
  }

  #page #busca-praia-home {
    position: relative;
    width: 92%;
    left: auto;
    right: auto;
    margin: 3vw auto;
  }

  #page #busca-praia-home .views-exposed-widgets {
    width: 100%;
  }

  .node-type-hospedagem #page #content .node-hospedagem .galeria-wrapper .flexslider,
  .node-type-servicos #page #content .node-hospedagem .galeria-wrapper .flexslider,
  .node-type-promocao #page #content .node-promocao .galeria-wrapper .flexslider {
    width: 100%;
    max-width: 100%;
  }

  .node-type-praia #page #content .node-praia .praia-img a.modal-link {
    display: inline-block;
    max-width: 100%;
  }

  /* Form fields full width */
  .page-fale-conosco #page #content .pane-webform-client-block-56 .form-item,
  .page-anunciar #page #content #alguma-duvida .form-item,
  .page-usuario-register #page #content .form-item,
  .page-node-add-hospedagem #page #content .form-item,
  .page-node-add-servicos #page #content .form-item,
  .page-node-add-eventos #page #content .form-item,
  .page-node-add-promocao #page #content .form-item {
    float: none;
    width: 100%;
    max-width: 100%;
  }

  input[type="text"],
  input[type="email"],
  input[type="password"],
  input[type="tel"],
  input[type="number"],
  input[type="search"],
  select,
  textarea,
  .form-text,
  .form-select,
  .form-textarea {
    max-width: 100%;
    box-sizing: border-box;
  }

  .page-acesso-interno #page #content form .views-exposed-widget .form-item select,
  .page-acesso-interno #page #content form .views-exposed-widget .form-item input,
  .page-acesso-interno .views-exposed-form .views-exposed-widget .form-submit {
    width: 100%;
    max-width: 100%;
    font-size: 14px;
    min-height: 40px;
  }

  .page-acesso-interno .views-exposed-form .views-exposed-widget {
    float: none;
    width: 100%;
    margin: 0 0 12px;
  }

  .page-quem-somos #page #content .imagem,
  .page-quem-somos #page #content .informacoes,
  .page-quem-somos #page #content .quem-somos-2 .imagem,
  .page-quem-somos #page #content .quem-somos-2 .informacoes {
    float: none;
    width: 100%;
    display: block;
  }

  .page-mapa #page #content .bloco-filtro .views-exposed-widget {
    float: none;
    width: 100%;
  }

  #page #content .overlay-primeiro-acesso .informacoes-overlay .opcoes-funcoes-site .funcionalidades {
    display: block;
    float: none;
    width: 100%;
    height: auto;
    border-right: 0;
    border-bottom: 1px solid #CCCCCC;
    padding: 12px 0;
  }
}

/* ==========================================================================
   ≤699px — phone reinforcement (aligned with smartphone_landscape MQ)
   ========================================================================== */
@media only screen and (max-width: 699px) {
  .region[class*="float-blocks"] .block {
    float: none;
    width: 100%;
  }

  body #page {
    margin-top: 0;
    padding-top: 0;
  }

  /* Tourism content pages — stack and contain overflow */
  .node-type-praia #page #content .node-praia,
  .node-type-hospedagem #page #content .node-hospedagem,
  .node-type-servicos #page #content .node-hospedagem,
  .node-type-eventos #page #content .node-eventos,
  .node-type-promocao #page #content .node-promocao,
  .node-type-informacoes-de-ubatuba #page #content .node-content {
    overflow-x: hidden;
    padding-left: 4vw;
    padding-right: 4vw;
  }

  .node-type-praia #page #content .node-praia .praia-img,
  .node-type-hospedagem #page #content .hospedagem-capa,
  .node-type-servicos #page #content .hospedagem-capa {
    width: 100%;
  }

  .node-type-praia #page #content .node-praia .praia-img img,
  .node-type-hospedagem #page #content .hospedagem-capa img,
  .node-type-servicos #page #content .hospedagem-capa img,
  .node-type-hospedagem #page #content .node-hospedagem .galeria-wrapper img,
  .node-type-servicos #page #content .node-hospedagem .galeria-wrapper img {
    max-width: 100%;
    height: auto;
  }

  .node-type-praia #page #content .node-praia h1.nome,
  .node-type-hospedagem #page #content .node-hospedagem h1.nome,
  .node-type-servicos #page #content .node-hospedagem h1.nome,
  .node-type-eventos #page #content h1.nome,
  .node-type-promocao #page #content h1.nome,
  .node-type-informacoes-de-ubatuba #page #content h1.nome {
    font-size: clamp(20px, 6vw, 28px);
    line-height: 1.25;
    word-wrap: break-word;
  }

  .node-type-praia #page #content .node-praia p,
  .node-type-praia #page #content .node-praia .descricao,
  .node-type-praia #page #content .node-praia .como-chegar,
  .node-type-hospedagem #page #content .node-hospedagem p,
  .node-type-servicos #page #content .node-hospedagem p,
  .node-type-informacoes-de-ubatuba #page #content .descricao p {
    font-size: clamp(14px, 3.8vw, 16px);
    line-height: 1.45;
  }

  .node-type-hospedagem #page #content .node-hospedagem .informacoes-basicas,
  .node-type-hospedagem #page #content .node-hospedagem .informacoes-residencia,
  .node-type-servicos #page #content .node-hospedagem .content-node-left,
  .node-type-servicos #page #content .node-hospedagem .content-node-right {
    float: none;
    width: 100%;
    display: block;
  }

  .node-type-praia #page #content .node-praia .informacoes-praia-box .listagem-info li,
  .node-type-hospedagem #page #content .node-hospedagem .listagem-taxonomia li {
    width: 50%;
    box-sizing: border-box;
  }

  .node-type-hospedagem #page #content .hospedagem-capa .codigo-box {
    position: static;
    display: inline-block;
    margin: 8px 8px 0 0;
  }

  .node-type-praia #page #content .node-praia .comments-wrapper,
  .node-type-hospedagem #page #content .node-hospedagem .comments-wrapper,
  .node-type-servicos #page #content .node-hospedagem .comments-wrapper {
    padding-left: 0;
    padding-right: 0;
  }

  /* Listing cards: prefer 1 column on narrow phones */
  .page-blog .view-blog .view-content ul li,
  .page-hospedagem #page #content .view-hospedagem .view-content ul li,
  .page-servicos #page #content .view-servi-os .view-content ul li,
  .page-eventos #page #content .view-eventos .view-content ul li,
  #page #content #todas-promocoes .view-promocao li {
    width: 100%;
    float: none;
    display: block;
    margin-left: 0;
    margin-right: 0;
  }

  .page-acesso-interno #page #content table.views-table th,
  .page-acesso-interno #page #content table.views-table td {
    font-size: 12px;
    padding: 8px 6px;
    min-width: 0;
  }

  #copyright-region,
  #copyright-region .content-width {
    text-align: center;
    padding-left: 4vw;
    padding-right: 4vw;
  }

  #copyright-region a,
  #copyright-region p,
  #copyright-region li {
    font-size: 12px;
  }
}
