Histórico da Página

<div style="font-family: 'Segoe UI', Arial, sans-serif; border: 1px solid #d1d1d1; border-radius: 15px; width: 100%; margin: 10px 0; background-color: #ffffff; box-shadow: 0 4px 12px rgba(0,0,0,0.1); overflow: hidden;">
    
    <div style="background-color: #367C2B; padding: 18px 30px; border-bottom: 6px solid #FFDE00; display: flex; justify-content: space-between; align-items: center;">
        <div style="display: flex; align-items: center; gap: 20px;">
            <div style="background: #ffffff; color: #367C2B; padding: 4px 12px; border-radius: 4px; font-weight: bold; font-size: 0.85em; letter-spacing: 1px;">JD</div>
            <h2 style="color: #ffffff; margin: 0; font-size: 1.3em; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px;">Melhoria de Usabilidade: Identificação de Moeda</h2>
        </div>
        <div style="color: #FFDE00; font-weight: bold; font-size: 0.9em; letter-spacing: 1px;">
            OFICINA → ABERTURA DE OS
        </div>
    </div>

    <div style="padding: 30px; color: #333333;">
        
        <div style="margin-bottom: 30px; padding-bottom: 20px; border-bottom: 1px solid #eeeeee;">
            <h4 style="color: #367C2B; margin-top: 0; font-size: 1.1em; text-transform: uppercase;">Cenário Atual</h4>
            <p style="font-size: 1.05em; line-height: 1.6; margin: 10px 0 0 0; color: #1a1a1a;">
                No processo de <strong>Abertura de Ordem de Serviço</strong>, a interface não exibe a descrição da moeda utilizada, apresentando apenas o índice numérico (ex: Moeda 1, Moeda 2). Esta característica gera ambiguidade e dificulta a identificação rápida da unidade monetária por parte do usuário.
            </p>
        </div>

        <div style="display: grid; grid-template-columns: 1.3fr 1fr; gap: 40px; margin-bottom: 35px;">
            
            <div style="border-left: 5px solid #367C2B; padding-left: 20px;">
                <h4 style="color: #367C2B; margin-top: 0; font-size: 1.1em; text-transform: uppercase;">Necessidade Identificada</h4>
                <p style="font-size: 1em; line-height: 1.7; color: #444444; margin: 10px 0 0 0;">
                    Disponibilizar um campo que apresente a descrição correspondente ao código selecionado, garantindo que o preenchimento e a consulta da OS sejam intuitivos.
                </p>
            </div>

            <div style="background-color: #fffdf5; padding: 20px; border-radius: 10px; border: 1px solid #f0e68c;">
                <h4 style="color: #856404; margin-top: 0; font-size: 1.05em; display: flex; align-items: center; gap: 8px;">
                    <span style="font-size: 1.2em;">💡</span> Referência Técnica:
                </h4>
                <p style="margin: 10px 0 0 0; color: #555555; font-size: 0.95em; line-height: 1.6;">
                    Seguir o padrão da rotina de <strong>Pedido de Venda (SC5)</strong>, onde a moeda é tratada de forma descritiva (ex: 1 - REAL, 2 - DÓLAR), otimizando a experiência do operador.
                </p>
            </div>
        </div>

        <div style="background-color: #367C2B; color: #ffffff; padding: 25px 30px; border-radius: 12px; display: flex; align-items: flex-start; gap: 20px; border-left: 10px solid #FFDE00;">
            <div style="font-size: 1.8em; line-height: 1; color: #FFDE00;">⚙️</div>
            <div>
                <strong style="color: #FFDE00; font-size: 1em; text-transform: uppercase; display: block; margin-bottom: 8px; letter-spacing: 1px;">Requisito Funcional:</strong>
                <p style="margin: 0; font-size: 1.05em; font-style: italic; color: #f0f0f0; line-height: 1.5;">
                    Implementar a exibição da descrição da moeda na interface de abertura e consulta de Ordens de Serviço, eliminando a dependência exclusiva de códigos numéricos e alinhando a rotina aos padrões de usabilidade do backoffice.
                </p>
            </div>
        </div>

    </div>

    <div style="background-color: #f4f4f4; padding: 12px 30px; text-align: right; border-top: 1px solid #eee;">
        <span style="font-size: 0.85em; color: #777;">John Deere Technical Support - UX/UI Enhancement</span>
    </div>
</div>