
import React from 'react';

interface BudgetStatusDisplayProps {
  budgetStatusText: string;
  budgetAmount: string;
  actualPercentage: number;
  isOverBudget: boolean;
}

const BudgetStatusDisplay: React.FC<BudgetStatusDisplayProps> = ({
  budgetStatusText,
  budgetAmount,
  actualPercentage,
  isOverBudget
}) => {
  return (
    <div className="flex justify-between items-center">
      <div className={`text-sm font-medium ${isOverBudget ? 'text-red-500' : 'text-gray-500'}`}>
        {budgetStatusText}{budgetAmount}원
      </div>
      <div className="text-sm font-medium text-gray-500">
        {actualPercentage}%
      </div>
    </div>
  );
};

export default BudgetStatusDisplay;
