Buttons

<div style="display: flex; flex-wrap: wrap; gap: 0.75rem; margin: 1rem 0;">
  <!-- Primary Gradient -->
  <a href="#" class="btn btn-primary">
    <iconify-icon icon="lucide:rocket"></iconify-icon>
    <span>Mulai Sekarang</span>
  </a>

  <!-- Success Green -->
  <a href="#" class="btn btn-success">
    <iconify-icon icon="lucide:check-circle-2"></iconify-icon>
    <span>Simpan & Aktifkan</span>
  </a>

  <!-- Secondary Slate -->
  <a href="#" class="btn btn-secondary">
    <iconify-icon icon="lucide:book-open"></iconify-icon>
    <span>Panduan API</span>
  </a>

  <!-- Outline Modern -->
  <a href="#" class="btn btn-outline">
    <iconify-icon icon="lucide:external-link"></iconify-icon>
    <span>Live Preview</span>
  </a>

  <!-- Dark Cyber -->
  <a href="#" class="btn btn-dark">
    <iconify-icon icon="lucide:terminal"></iconify-icon>
    <span>Buka Terminal</span>
  </a>

  <!-- Warning Amber -->
  <a href="#" class="btn btn-warning">
    <iconify-icon icon="lucide:zap"></iconify-icon>
    <span>Fitur Beta</span>
  </a>

  <!-- Danger Red -->
  <a href="#" class="btn btn-danger">
    <iconify-icon icon="lucide:trash-2"></iconify-icon>
    <span>Hapus Data</span>
  </a>

  <!-- Ghost Button -->
  <a href="#" class="btn btn-ghost">
    <iconify-icon icon="lucide:help-circle"></iconify-icon>
    <span>Pusat Bantuan</span>
  </a>
</div>

<div style="display: flex; flex-wrap: wrap; gap: 0.75rem; margin: 1rem 0;">
  <a href="https://wa.me/628123456789" target="_blank" class="btn btn-wa">
    <iconify-icon icon="mdi:whatsapp"></iconify-icon>
    <span>WhatsApp</span>
  </a>

  <a href="https://github.com" target="_blank" class="btn btn-dark">
    <iconify-icon icon="mdi:github"></iconify-icon>
    <span>GitHub</span>
  </a>
</div>

<div style="display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem; margin: 1rem 0;">
  <a href="#" class="btn btn-primary btn-xs">Extra Small (XS)</a>
  <a href="#" class="btn btn-primary btn-sm">Small (SM)</a>
  <a href="#" class="btn btn-primary btn-md">Medium (MD)</a>
  <a href="#" class="btn btn-primary btn-lg">Large (LG)</a>
  <a href="#" class="btn btn-primary btn-pill">Pill Shape</a>
  <a href="#" class="btn btn-primary btn-glow">Glowing Button ✨</a>
</div>

<a href="#" class="btn-download-card">
  <div class="btn-download-icon">
    <iconify-icon icon="lucide:download-cloud" style="font-size: 1.5rem;"></iconify-icon>
  </div>
  <div>
    <div class="btn-download-title">Download WA Gateway Source Code</div>
    <div class="btn-download-meta">ZIP • Versi 2.5.0 • 4.8 MB</div>
  </div>
</a>