Ajuda Form vai que falta pouco =D

boa noite, estou montando um form de venda para o blog de minha esposa, estou a mais de 5 anos sem mexer com isso e completamente enferrujado. ja estou com bug mental.

esta tudo funcionando, compro vai pro carrinho, aparece descrição personalizada quantidade frete, preço tudo correto. o problema é...

se compro 2un do objeto azul, volto e compro 3 brancos, eles se somam e todos ficam brancos, totalizando 5 brancos. o problema é o ID

com id fixo independente da cor ou quantidade sera sempre o mesmo item para o sistema. n importando as alterações

preciso fazer com que o select separe o id junto algo como

<option value="azul" id"01001">Azul</option>

<option value="branco" id"01002">Branco</option>

sem mais obrigado

<form name="form" class="texto" target="pagseguro" action="https://pagseguro.uol.com.br/v2/checkout/cart.html?action=add" method="post">
 <p>
 <input type="hidden" name="receiverEmail" value="contato@hotmail.com" />
 <input type="hidden" name="currency" value="BRL" />
 <input type="hidden" name="itemId" value="010" />
 Escolha a Cor :            
 <select class="form_campos" name="itemDescription">
 <option value="azul">Azul</option>
 <option value="vermelho">Vermelho</option>
 <option value="preto">Preto</option>
 <option value="branco">Branco</option>
 <option value="rosa">Rosa</option>
 </select>
 <br>
 Escolha a Quantidade : 
 <select class="form_campos" name="itemQuantity">
 <option value="Escolha seu estado">quantidade</option>
 <option value="1">1</option>
 <option value="2">2</option>
 <option value="3">3</option>
 <option value="4">4</option>
 <option value="5">5</option>
 <option value="6">6</option>
 <option value="7">7</option>
 <option value="8">8</option>
 <option value="9">9</option>
 <option value="10">10</option>
 </select>
 </p>
 <p>
 <br>
 <br>
 </p>
 <p>
 <input type="hidden" name="itemAmount" value="45.00" />
 <input type="hidden" name="itemWeight" value="" />
 <input type="hidden" name="itemShippingCost" value="15.00" />
 <input type="image" src="https://p.simg.uol.com.br/out/pagseguro/i/botoes/pagamentos/209x48-comprar-assina.gif" name="submit" alt="Pague com PagSeguro - é rápido, grátis e seguro!" />
 </p>
 </form>
 <!-- FINAL FORMULARIO BOTAO PAGSEGURO -->
 </div>
 </td>
 <td width="672" rowspan="2" valign="top"><div id="apDiv11"> <form target="pagseguro" action="https://pagseguro.uol.com.br/security/webpagamentos/webpagto.aspx" method="post">
 <input type="hidden" name="email_cobranca" value="contato@contato.com" />
 <input type="hidden" name="tipo" value="VER" />
 <input type="image" src="https://p.simg.uol.com.br/out/pagseguro/i/botoes/pagamentos/99x61-carrinho-assina.gif" name="submit" alt="Visualizar carrinho de compras" />
 </form>