<template>
  <div
    class="sticky bottom-0 z-10 border-t border-line bg-surface/95 px-3 py-3 backdrop-blur-sm sm:px-4"
    data-testid="workstation-action-bar"
  >
    <div
      class="flex flex-col gap-3 sm:flex-row sm:items-end sm:justify-between"
    >
      <div class="flex flex-wrap items-center gap-2 min-w-0">
        <slot name="left" />
      </div>
      <div class="flex flex-wrap items-center gap-2 min-w-0 sm:justify-center">
        <slot name="center" />
      </div>
      <div class="flex flex-wrap items-center gap-2 sm:justify-end">
        <slot name="primary" />
        <slot name="right" />
      </div>
    </div>
  </div>
</template>

<script setup lang="ts">
/**
 * Sticky bottom action bar for Entry / Verification / Approval workstations.
 * Wire into forms in Phase 16. Slots: left (Reject), center (Save Draft),
 * primary (Submit…), right (Next). Prefer btn-primary / btn-danger / btn-secondary.
 */
</script>
