<html lang="en">
    <head>
        <meta charset="UTF-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
       
        {{!-- <link rel="stylesheet" href="styles/styles.css" /> --}}
        <style>
                .email-wrapper {
                    max-width: 80%; /* Limit width to 80% of the window */
                    margin: 0 auto; /* Center the content horizontally */
                }
                .email-table {
                    width: 100%;
                    border-collapse: collapse;
                }
                .email-table td {
                    vertical-align: top;
                    padding: 10px;
                    border: 1px solid #000;
                    border-radius: 25px; /* Rounded corners */
                    background-color: #f0f0f0; /* Optional: Add a background color */
                }
                .email-table h2 {
                    margin: 0;
                }
                .remarks {
                    border: 1px solid black;
                    padding: 10px;
                    background-color:  #f0f0f0;
                    border-radius: 25px;
                }
            </style>
    </head>
    <body>
        <div class="email-wrapper">
<p>All,</p>
        <p>Please see the new blocking order that was created.</p>          
        {{#each items}}
           <div>
                <div class="email-table">
                    <table>
                        <tr>
                            <td>
                                <p><strong>Blocking number: </strong>{{blockingNumber}}</p>
                                <p><strong>Blocking Date: </strong>{{blockingDate}}</p>
                                <p><strong>Article: </strong>{{av}}</p>
                                <p><strong>Production Lot: </strong>{{lotNumber}}</p>
                                <p><strong>Line: </strong>{{line}}</p> 
                            </td>
                            <td>
                                <p><strong>Customer: </strong>{{customer}}</p>
                                <p><strong>Blocked pieces /LUs: </strong>{{peicesAndLoadingUnits}}</p>
                                <p><strong>Main defect group: </strong>{{mainDefectGroup}}</p>
                                <p><strong>Main defect: </strong>{{mainDefect}}</p>  
                            </td>
                        </tr>
                    </table>
                </div>
             </div>  
             <div  class="remarks">
                <h4>Remarks:</h4>
                <p>{{remark}}</p>
             </div> 
           </div>
        {{/each}}
     <br>
        <p>For further questions please reach out to quality.</p> <br>
        <p>Thank you,</p> <br>
        <p>Quality Department</p>
        </p>  
        </div>
            
    </body>
</html>