<!DOCTYPE html>

<html lang="en">

<head>

  <meta charset="UTF-8" />

  <title>AW Collision – Expense Submission</title>

  <meta name="viewport" content="width=device-width, initial-scale=1.0" />


  <style>

    body {

      margin: 0;

      padding: 0;

      background: #f4f6fa;

      font-family: Inter, "Open Sans", sans-serif;

      color: #1f2937;

    }


    .container {

      min-height: 100vh;

      display: flex;

      align-items: center;

      justify-content: center;

      padding: 32px 16px;

    }


    .card {

      width: 100%;

      max-width: 520px;

      background: #ffffff;

      border-radius: 14px;

      padding: 32px;

      box-shadow: 0 10px 28px rgba(16,24,40,0.12);

    }


    h1 {

      text-align: center;

      margin-bottom: 8px;

      font-size: 26px;

      font-weight: 700;

    }


    .subtitle {

      text-align: center;

      color: #6b7280;

      font-size: 14px;

      margin-bottom: 28px;

    }


    label {

      display: block;

      font-weight: 600;

      font-size: 14px;

      margin-bottom: 6px;

    }


    .required {

      color: #dc2626;

      margin-left: 4px;

    }


    input,

    textarea {

      width: 100%;

      border: 1px solid #d1d5db;

      border-radius: 10px;

      padding: 14px 16px;

      font-size: 14px;

      margin-bottom: 18px;

      outline: none;

    }


    input:focus,

    textarea:focus {

      border-color: #2563eb;

      box-shadow: 0 0 0 4px rgba(37,99,235,0.1);

    }


    textarea {

      min-height: 90px;

      resize: vertical;

    }


    .hint {

      font-size: 12px;

      color: #6b7280;

      margin-top: -12px;

      margin-bottom: 16px;

    }


    button {

      width: 100%;

      height: 52px;

      border-radius: 12px;

      background: #c93c33;

      color: #ffffff;

      font-size: 16px;

      font-weight: 700;

      border: none;

      cursor: pointer;

      margin-top: 8px;

    }


    button:hover {

      background: #a8281f;

    }


    .footer-note {

      margin-top: 20px;

      font-size: 12px;

      color: #6b7280;

      text-align: center;

    }

  </style>

</head>


<body>

  <div class="container">

    <div class="card">

      <h1>Expense Submission</h1>

      <div class="subtitle">This request will be reviewed and approved by management</div>


      <form method="POST" action=“https://aawcr1400.app.n8n.cloud/webhook/testingform”>

        <label>

          Employee Name <span class="required">*</span>

        </label>

        <input type="text" name="employee_name" required />


        <label>

          Expense Amount ($) <span class="required">*</span>

        </label>

        <input type="number" step="0.01" name="amount" required />


        <label>

          Reason for Expense <span class="required">*</span>

        </label>

        <textarea name="reason" required></textarea>


        <label>

          Email Address <span class="required">*</span>

        </label>

        <input type="email" name="email" required />


        <button type="submit">Submit for Approval</button>

      </form>


      <div class="footer-note">

        Internal use only · AW Collision Company

      </div>

    </div>

  </div>

</body>

</html>