contoh template

<div
  style="
    font-family: &quot;Segoe UI&quot;, Tahoma, Geneva, Verdana, sans-serif;
    background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%);
    padding: 40px 20px;
    margin: 0;
  "
>
  <div
    style="
      max-width: 600px;
      margin: 0 auto;
      background: #ffffff;
      border-radius: 12px;
      box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1);
      overflow: hidden;
    "
  >
    <!-- Header dengan Logo -->
    <div
      style="
        background: linear-gradient(135deg, #1f3c88 0%, #2d5aa0 100%);
        padding: 40px 30px;
        text-align: center;
        border-bottom: 4px solid #0d2b6b;
      "
    >
      <img
        src="<https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgJ1qwbuD87O4p6J3V2SOVC_DDoyrjyJuxS5pwS6qICupfAfAX3gDPV7WWNLpvAlQu0a80npI3w0hR3PU3b-oRipW57QuvJyE9sfdUHHscpVm-vBMc32Tjsxfuoib1_IVoKawlEneX9q2hs/s1600/MA+M1.png>"
        alt="MAMSAKA Logo"
        style="
          max-width: 120px;
          height: auto;
          margin-bottom: 15px;
          display: block;
          margin-left: auto;
          margin-right: auto;
        "
      />
      <h1 style="color: #ffffff; margin: 0; font-size: 24px; font-weight: 700">
        MAMSAKA
      </h1>
      <p
        style="
          color: #e0e8f0;
          margin: 8px 0 0 0;
          font-size: 13px;
          letter-spacing: 1px;
        "
      >
        VERSION CONTROL SYSTEM
      </p>
    </div>

    <!-- Content -->
    <div style="padding: 40px 30px">
      <p style="font-size: 15px; color: #333; margin: 0 0 20px 0">
        Assalamu'alaikum Warahmatullahi Wabarakatuh,
      </p>

      <div
        style="
          background-color: #f8fafb;
          border-left: 4px solid #1f3c88;
          padding: 20px;
          margin-bottom: 25px;
          border-radius: 4px;
        "
      >
        <p style="font-size: 15px; color: #333; margin: 0; line-height: 1.6">
          Kami menerima permintaan untuk mengatur ulang (reset) password akun
          Anda pada sistem
          <strong style="color: #1f3c88">Version Control MAMSAKA</strong>.
        </p>
      </div>

      <p
        style="
          font-size: 15px;
          color: #555;
          margin-bottom: 30px;
          line-height: 1.6;
        "
      >
        Untuk melanjutkan proses reset password, silakan klik tombol berikut.
        Tautan ini hanya berlaku selama 24 jam ke depan:
      </p>

      <div style="text-align: center; margin: 35px 0">
        <a
          href="{{ .ConfirmationURL }}"
          style="
            background: linear-gradient(135deg, #1f3c88 0%, #2d5aa0 100%);
            color: #ffffff;
            padding: 16px 40px;
            text-decoration: none;
            border-radius: 6px;
            font-weight: 600;
            font-size: 15px;
            display: inline-block;
            box-shadow: 0 4px 15px rgba(31, 60, 136, 0.3);
          "
        >
          🔐 Reset Password
        </a>
      </div>

      <p
        style="
          font-size: 13px;
          color: #778;
          margin-bottom: 15px;
          line-height: 1.6;
        "
      >
        <strong style="color: #0d2b6b">Penting:</strong> Jika Anda tidak merasa
        melakukan permintaan ini atau tidak mengenali aktivitas ini, abaikan
        email ini dan segera hubungi administrator sistem untuk keamanan akun
        Anda.
      </p>

      <p style="font-size: 13px; color: #999; margin: 0; line-height: 1.6">
        Demi keamanan, tautan reset password ini akan kedaluwarsa secara
        otomatis setelah 24 jam.
      </p>
    </div>

    <!-- Divider -->
    <div style="height: 1px; background-color: #e0e0e0"></div>

    <!-- Footer -->
    <div
      style="
        background-color: #f8fafb;
        padding: 30px;
        text-align: center;
        border-top: 1px solid #e0e0e0;
      "
    >
      <p style="margin: 0 0 12px 0; color: #555; font-size: 13px">
        <strong>MA Muhammadiyah 1 Paciran (MAMSAKA)</strong>
      </p>
      <p
        style="
          margin: 0 0 15px 0;
          color: #777;
          font-size: 12px;
          line-height: 1.6;
        "
      >
        Jl. Pondok RT/RW : 002/006<br />
        Paciran, Lamongan – Jawa Timur<br />
        Indonesia
      </p>

      <div style="height: 1px; background-color: #e0e0e0; margin: 15px 0"></div>

      <p style="margin: 0; color: #999; font-size: 11px; line-height: 1.5">
        Email ini dikirim secara otomatis oleh sistem MAMSAKA.<br />
        Mohon tidak membalas email ini. Hubungi administrator jika ada
        pertanyaan.
      </p>
    </div>
  </div>
</div>

ke Hostinger