<div class="mb-8">
  <h1 class="text-3xl font-display font-semibold">Profil Saya</h1>
  <p class="text-muted text-sm mt-1">Perbarui informasi akun dan ganti password.</p>
</div>

<div class="grid lg:grid-cols-2 gap-6">

  <!-- profile form -->
  <div class="card p-6">
    <h2 class="text-lg font-display font-semibold mb-5">Informasi Akun</h2>
    <form action="/member/profile" method="post" class="space-y-4">
      <div>
        <label class="text-sm text-muted">Nama Lengkap</label>
        <input name="name" class="input mt-2" value="<%= profile.name %>" required />
      </div>
      <div>
        <label class="text-sm text-muted">Email</label>
        <input class="input mt-2 opacity-60 cursor-not-allowed" value="<%= profile.email %>" disabled />
        <div class="text-xs text-muted-2 mt-1.5">Email tidak bisa diubah. Hubungi admin jika perlu ganti.</div>
      </div>
      <div>
        <label class="text-sm text-muted">No. WhatsApp</label>
        <input name="phone" class="input mt-2" value="<%= profile.phone || '' %>" placeholder="08xxxx" />
      </div>
      <div>
        <label class="text-sm text-muted">Akun Broker</label>
        <input name="broker_account" class="input mt-2" value="<%= profile.broker_account || '' %>" placeholder="Contoh: Exness 1234567" />
      </div>
      <button class="btn btn-gold w-full h-11 rounded-full">Simpan Perubahan</button>
    </form>

    <div class="mt-6 pt-6 border-t border-white/5 text-sm text-muted-2">
      Member sejak <%= new Date(profile.created_at).toLocaleDateString('id-ID',{day:'2-digit',month:'long',year:'numeric'}) %>
      <% if (profile.is_ib) { %> • <span class="pill pill-gold ml-1">IB AKTIF</span><% } %>
    </div>
  </div>

  <!-- password form -->
  <div class="card p-6">
    <h2 class="text-lg font-display font-semibold mb-5">Ganti Password</h2>
    <form action="/member/profile/password" method="post" class="space-y-4">
      <div>
        <label class="text-sm text-muted">Password Lama</label>
        <input type="password" name="current" class="input mt-2" required />
      </div>
      <div>
        <label class="text-sm text-muted">Password Baru</label>
        <input type="password" name="password" class="input mt-2" minlength="6" required />
      </div>
      <div>
        <label class="text-sm text-muted">Konfirmasi Password Baru</label>
        <input type="password" name="password_confirm" class="input mt-2" minlength="6" required />
      </div>
      <button class="btn btn-outline w-full h-11 rounded-full">Ubah Password</button>
    </form>
  </div>
</div>
