/* Menu do celular: painel que fica POR CIMA de qualquer elemento do site (barra de baixo, WhatsApp, faixa de cookies, stories).
   Só perde para o seletor de cidade (z-index 999999), que abre a partir dele. */
.mm-overlay { position: fixed; inset: 0; z-index: 100000; background: rgba(15, 23, 42, 0.55); opacity: 0; pointer-events: none; transition: opacity .25s ease; }
.mm-overlay.active { opacity: 1; pointer-events: auto; }

.mm { position: fixed; top: 0; right: 0; bottom: 0; z-index: 100001; width: 100%; max-width: 440px; display: flex; flex-direction: column; background: #f4f6fb; box-shadow: -20px 0 50px rgba(0, 0, 0, .18); transform: translateX(105%); visibility: hidden; transition: transform .28s ease, visibility 0s linear .28s; overscroll-behavior: contain; }
.mm.active { transform: none; visibility: visible; transition: transform .28s ease; }
.mm, .mm * { box-sizing: border-box; }
.mm a, .mm button { text-decoration: none; -webkit-tap-highlight-color: transparent; }

.mm-topo { flex: none; display: flex; align-items: center; gap: 10px; padding: 12px 14px; background: #fff; border-bottom: 1px solid #e6e9f2; }
.mm-titulo { margin: 0; font-size: 1.125rem; font-weight: 800; color: #0f172a; }
.mm-cidade { flex: 1 1 auto; min-width: 0; display: flex; align-items: center; gap: 6px; height: 44px; padding: 0 12px; border: 1px solid #e2e8f0; border-radius: 12px; background: #f8fafc; color: #334155; font-weight: 700; font-size: .875rem; cursor: pointer; }
.mm-cidade span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mm-cidade svg { flex: none; }
.mm-fechar { flex: none; margin-left: auto; width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; border: 0; border-radius: 12px; background: #f1f5f9; color: #475569; cursor: pointer; }
.mm-fechar:active { transform: scale(.92); }
.mm-fechar:focus-visible, .mm-cidade:focus-visible, .mm-link:focus-visible, .mm-cat:focus-visible, .mm-sub a:focus-visible, .mm-cta:focus-visible { outline: 3px solid var(--primary, #1d4ed8); outline-offset: 2px; }

.mm-corpo { flex: 1 1 auto; overflow-y: auto; -webkit-overflow-scrolling: touch; padding: 14px 14px 18px; }
.mm-rotulo { margin: 0 0 10px 2px; font-size: .75rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: #64748b; }

/* Atalhos de páginas: grade compacta (Home, Notícias, Eventos…) */
.mm-links { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-bottom: 18px; }
.mm-link { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; min-height: 76px; padding: 10px 6px; border: 1px solid #e6e9f2; border-radius: 14px; background: #fff; color: #334155; font-size: .8125rem; font-weight: 700; text-align: center; line-height: 1.15; }
.mm-link i, .mm-link svg { color: var(--primary, #1d4ed8); }
.mm-link:active { background: #eef2ff; }
.mm-link.is-atual { border-color: var(--primary, #1d4ed8); background: #eef2ff; }

/* Categorias em destaque: cartões grandes em 2 colunas */
.mm-cats { margin-bottom: 8px; }
.mm-grade { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.mm-cat { position: relative; display: flex; flex-direction: column; align-items: flex-start; justify-content: space-between; gap: 10px; width: 100%; min-height: 92px; padding: 12px; border: 1px solid #e6e9f2; border-radius: 16px; background: #fff; color: #0f172a; text-align: left; font: inherit; font-weight: 700; font-size: .9375rem; line-height: 1.15; cursor: pointer; box-shadow: 0 1px 2px rgba(15, 23, 42, .04); }
.mm-cat:active { transform: scale(.98); }
.mm-cat-icone { flex: none; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; border-radius: 12px; background: color-mix(in srgb, var(--primary, #1d4ed8) 12%, #fff); color: var(--primary, #1d4ed8); font-size: 1.1rem; }
.mm-cat-icone svg { width: 22px; height: 22px; }
.mm-cat-icone .material-icons { font-size: 22px; }
.mm-cat-nome { display: block; width: 100%; overflow-wrap: break-word; hyphens: auto; }
.mm-cat-seta { position: absolute; top: 12px; right: 10px; color: #94a3b8; transition: transform .2s ease; }
.mm-cat.is-aberta { border-color: var(--primary, #1d4ed8); background: #eef2ff; }
.mm-cat.is-aberta .mm-cat-seta { transform: rotate(180deg); color: var(--primary, #1d4ed8); }

/* Subcategorias: painel de largura total logo abaixo da linha da categoria tocada */
.mm-sub { grid-column: 1 / -1; padding: 12px; border: 1px solid var(--primary, #1d4ed8); border-radius: 16px; background: #fff; }
.mm-sub[hidden] { display: none; }
.mm-sub-tudo { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 48px; padding: 0 14px; border-radius: 12px; background: var(--primary, #1d4ed8); color: #fff; font-weight: 800; font-size: .9375rem; }
.mm-sub-lista { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.mm-sub-lista a { display: inline-flex; align-items: center; min-height: 40px; padding: 0 14px; border: 1px solid #dbe2ee; border-radius: 999px; background: #f8fafc; color: #334155; font-weight: 600; font-size: .875rem; }
.mm-sub-lista a:active { background: #eef2ff; border-color: var(--primary, #1d4ed8); }

.mm-carregando { padding: 28px 8px; text-align: center; color: #64748b; font-size: .9rem; }

/* Rodapé fixo do painel: chamada para divulgar o negócio */
.mm-rodape { flex: none; padding: 12px 14px calc(12px + env(safe-area-inset-bottom)); background: #fff; border-top: 1px solid #e6e9f2; }
.mm-cta { display: flex; align-items: center; justify-content: center; gap: 10px; min-height: 52px; border-radius: 14px; color: #fff; font-weight: 800; font-size: 1rem; }

@media (max-width: 360px) {
    .mm-links { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .mm-grade { grid-template-columns: minmax(0, 1fr); }
}
@media (prefers-reduced-motion: reduce) {
    .mm, .mm-overlay, .mm-cat-seta { transition: none; }
}

/* Com o menu aberto, nada fica por cima dele (faixa de cookies, WhatsApp, barra de baixo) */
body.menu-aberto .cookie-banner, body.menu-aberto .wa-widget-container, body.menu-aberto .sticky-footer-mobile { visibility: hidden; }
