import React from "react";

interface SectionDividerProps {
  icon?: string;
  text?: string;
}

export default function SectionDivider({
  icon = "✦",
  text,
}: SectionDividerProps) {
  return (
    <div className="flex items-center gap-4 my-12">
      <div className="flex-grow h-px bg-gradient-to-r from-transparent via-gray-300 dark:via-gray-700 to-transparent" />
      <div className="flex items-center gap-2 px-4 py-2 bg-gradient-to-r from-brand-green/10 to-emerald-500/10 rounded-full border border-brand-green/20">
        <span className="text-brand-green text-lg">{icon}</span>
        {text && (
          <span className="text-sm font-semibold text-gray-700 dark:text-gray-300">
            {text}
          </span>
        )}
      </div>
      <div className="flex-grow h-px bg-gradient-to-r from-transparent via-gray-300 dark:via-gray-700 to-transparent" />
    </div>
  );
}