/* ==========================================================================
   OREGONS CHAT - MÓDULO: BARRA INFERIOR DE NAVEGACIÓN PRINCIPAL
   Estructura flexible para alinear iconos horizontalmente estilo WhatsApp
   ========================================================================== */

#barra-inferior-navegacion {
    position: absolute !important;
    bottom: 0 !important; /* Pegada al suelo del teléfono */
    left: 0 !important;
    width: 100% !important;
    height: 60px !important; /* Altura ideal fija */
    background-color: #2c2c2c !important; /* Gris claro de contraste */
    border-top: 1px solid #333333 !important;
    z-index: 210 !important;

    /* ¡Aquí está la solución! Forzamos la alineación horizontal de los iconos */
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
}

/* Alineación de los botones hacia la izquierda para dar espacio a los futuros iconos */
#barra-inferior-navegacion {
    display: flex !important;
    justify-content: flex-start !important; /* Desplaza el icono a la izquierda */
    align-items: center !important;
    padding-left: 15px !important; /* Margen suave para que no choque con el borde */
}

/* Contenedor individual del botón de Chats */
.item-navegacion-inferior {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: #ff6b00; /* Naranja OREGONS para resaltar que está seleccionado */
    cursor: pointer;
    background: transparent;
    border: none;
    height: 100%;
    padding: 0 20px;
}

/* El texto que dice "Chats" abajo del icono */
.item-navegacion-inferior span {
    font-size: 12px;
    margin-top: 4px;
    font-weight: bold;
    font-family: Arial, sans-serif;
}