/*
 * Correcao da barra de rolagem horizontal no celular - 10/09/2026
 *
 * Problema: o submenu do menu principal usava
 *   grid-template-columns: repeat(3, 1fr)
 * O valor 1fr tem minimo implicito de "auto", entao as colunas nunca
 * encolhiam abaixo da largura do texto. Em telas de celular o submenu
 * ficava 41px mais largo que a viewport, criando rolagem lateral.
 *
 * Correcao: minmax(0, 1fr) permite a coluna encolher, e 2 colunas dao
 * espaco suficiente para os nomes dos generos sem cortar o texto.
 *
 * Este arquivo existe separado do style.css porque o CDN (BunnyCDN)
 * mantinha uma copia antiga do style.css em edge storage, que nao era
 * invalidada nem trocando a query string. Um nome de arquivo novo
 * contorna qualquer cache.
 *
 * Reverter: remover o wp_enqueue_style('fix-menu-mobile', ...) do
 * functions.php e apagar este arquivo.
 */

@media only screen and (max-width: 1247px) {

  header nav#menu ul li > ul {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  header nav#menu ul li > ul > li {
    min-width: 0;
  }

  header nav#menu ul li > ul > li > a {
    min-width: 0;
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
    overflow-wrap: break-word;
  }
}