fix ui style

features/booking/components/admin-reconcile-button.tsx

@@ -2,6 +2,7 @@
 
 import { useState } from "react";
 import { useRouter } from "next/navigation";
+import { Check } from "lucide-react";
 import { adminReconcileMidtransAction } from "@/features/booking/actions";
 
 interface AdminReconcileButtonProps {
@@ -45,8 +46,9 @@ export function AdminReconcileButton({
         {loading ? "Reconciling..." : "Reconcile Midtrans"}
       </button>
       {status && (
-        <span className="text-[11px] font-medium text-emerald-700">
-          ✓ {reconcileOutcomeLabel(status)}
+        <span className="inline-flex items-center gap-1 text-[11px] font-medium text-emerald-700">
+          <Check size={12} strokeWidth={2.5} aria-hidden />
+          {reconcileOutcomeLabel(status)}
         </span>
       )}
       {error && (

features/booking/components/cancel-booking-button.tsx

@@ -2,6 +2,7 @@
 
 import { useState } from "react";
 import { useRouter } from "next/navigation";
+import { CircleAlert } from "lucide-react";
 import { cancelBookingWithRefundAction } from "@/features/booking/actions";
 import { formatRupiah } from "@/lib/utils";
 
@@ -112,9 +113,17 @@ export function CancelBookingButton({ tripId, preview }: CancelBookingButtonProp
           Tier: {preview.tierLabel}
         </p>
         {noRefund ? (
-          <p className="mt-2 text-xs text-red-700">
-            ⚠️ Di luar window refund — uang tidak dikembalikan. Booking akan
-            di-cancel langsung.
+          <p className="mt-2 flex items-start gap-1.5 text-xs text-red-700">
+            <CircleAlert
+              size={14}
+              strokeWidth={2}
+              aria-hidden
+              className="mt-0.5 shrink-0"
+            />
+            <span>
+              Di luar window refund — uang tidak dikembalikan. Booking akan
+              di-cancel langsung.
+            </span>
           </p>
         ) : (
           <p className="mt-2 text-xs text-neutral-600">

features/booking/components/copy-button.tsx

@@ -1,6 +1,7 @@
 "use client";
 
 import { useState } from "react";
+import { Check, Copy } from "lucide-react";
 
 interface CopyButtonProps {
   value: string;
@@ -24,9 +25,19 @@ export function CopyButton({ value, label = "Salin" }: CopyButtonProps) {
     <button
       type="button"
       onClick={handleClick}
-      className="rounded-lg border border-neutral-200 bg-white px-2.5 py-1 text-xs font-medium text-neutral-600 transition-colors hover:bg-neutral-50"
+      className="inline-flex items-center gap-1 rounded-lg border border-neutral-200 bg-white px-2.5 py-1 text-xs font-medium text-neutral-600 transition-colors hover:bg-neutral-50"
     >
-      {copied ? "✓ Tersalin" : label}
+      {copied ? (
+        <>
+          <Check size={13} strokeWidth={2.5} aria-hidden className="text-emerald-600" />
+          Tersalin
+        </>
+      ) : (
+        <>
+          <Copy size={13} strokeWidth={1.75} aria-hidden />
+          {label}
+        </>
+      )}
     </button>
   );
 }