.header-inner {
    display: flex;
    justify-content: space-between; /* Distribui os itens nas extremidades */
}

.header-inner > div {
    flex: 1; /* Faz com que cada item ocupe o mesmo espaço */
}

.header-inner .search-bar {
    order: 1; /* Coloca a barra de busca primeiro (esquerda) */
}

.header-inner .login-icon {
    order: 2; /* Coloca o ícone de login segundo (centro) */
}

.header-inner .cart-icon {
    order: 3; /* Coloca o ícone do carrinho por último (direita) */
}

/* Se necessário, ajuste para garantir a centralização e o alinhamento adequado */
.header-inner > div {
    display: flex;
    align-items: center; /* Alinha verticalmente os itens */
    justify-content: center; /* Centraliza os itens dentro de cada div */
}