<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{{title}}</title>
<style>
  body { margin: 0; padding: 0; background: #f4f6f4; font-family: Roboto, Helvetica, Arial, sans-serif; }
  .tw-container { max-width: 600px; margin: 0 auto; padding: 32px 16px; }
  .tw-card { background: #ffffff; border-radius: 12px; overflow: hidden; box-shadow: 0 1px 3px rgba(15, 23, 42, 0.08); }
  .tw-header { background: #2e7d32; padding: 28px 32px; text-align: center; }
  .tw-wordmark { color: #ffffff; font-size: 22px; font-weight: 700; letter-spacing: 0.5px; }
  .tw-body { padding: 32px; color: #20251f; font-size: 15px; line-height: 1.6; }
  .tw-body p { margin: 0 0 16px; }
  .tw-button-row { text-align: center; padding: 8px 0 24px; }
  .tw-button { display: inline-block; background: #2e7d32; color: #ffffff !important; text-decoration: none; padding: 14px 32px; border-radius: 8px; font-weight: 600; font-size: 15px; }
  .tw-footer { text-align: center; padding: 20px 16px 0; color: #8a938a; font-size: 12px; line-height: 1.6; }
  .tw-footer a { color: #8a938a; }
</style>
</head>
<body>
  <div class="tw-container">
    <div class="tw-card">
      <div class="tw-header">
        <span class="tw-wordmark">TeamWallet</span>
      </div>
      <div class="tw-body">
        {{> @partial-block }}
      </div>
    </div>
    <div class="tw-footer">
      <p>Diese E-Mail wurde automatisch von TeamWallet verschickt.<br>&copy; {{year}} TeamWallet</p>
    </div>
  </div>
</body>
</html>
