import React from "react";
import { LuChevronLeft } from "react-icons/lu";

export default function StarPathBar({ canBack, pathText, onBack }) {
  if (!canBack) return null;

  return (
    <div className="mb-3 flex items-center gap-2">
      <button
        type="button"
        onClick={onBack}
        className="px-3 py-2 rounded-xl border border-black/10 bg-[#A1E3F919] dark:border-white/10 shadow hover:bg-black/5 dark:hover:bg-white/10 text-xs sm:text-sm inline-flex items-center gap-2"
      >
        <LuChevronLeft className="w-4 h-4 rotate-180 text-[#43BEFF] dark:text-white" />
        برگشت
      </button>

      <div className="text-xs text-black/60 dark:text-white/70 truncate">
        مسیر: <span className="font-bold text-black/80 dark:text-white/80">{pathText}</span>
      </div>
    </div>
  );
}
