/*=====================================================================
  Menu inferior unificado da praca (paridade com o bottom-nav do app):
  4 abas com icone + rotulo, aba ativa em vermelho ChefMio.
  Carregado pela propria partial _MenuInferiorPraca (autocontido).
=====================================================================*/
.menu-inferior-praca {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 1030;
    display: flex;
    background: #FFFFFF;
    border-top: 1px solid #E9ECEF;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.04);
    padding-bottom: env(safe-area-inset-bottom, 0);
}

/* espaco para o conteudo nao terminar escondido atras da barra */
body {
    padding-bottom: 64px;
}

.menu-praca-aba {
    flex: 1 1 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    padding: 8px 4px 6px;
    text-decoration: none;
    color: #5C5E61; /* inativa (mesma do app) */
}

    .menu-praca-aba:hover,
    .menu-praca-aba:focus {
        text-decoration: none;
        color: #5C5E61;
    }

    .menu-praca-aba span {
        font-size: 11px;
        line-height: 13px;
        font-weight: 500;
    }

    .menu-praca-aba svg {
        display: block;
    }

    .menu-praca-aba.ativa,
    .menu-praca-aba.ativa:hover,
    .menu-praca-aba.ativa:focus {
        color: #CC161C;
    }

/* Na loja o menu tem 5 abas (com Promocoes): reduz um pouco o rotulo para
   "Pesquisar"/"Promocoes" nao quebrarem em telas estreitas. */
@media (max-width: 400px) {
    .menu-praca-aba span {
        font-size: 10px;
        letter-spacing: -0.2px;
    }

    .menu-praca-aba {
        padding-left: 2px;
        padding-right: 2px;
    }
}