components/editor/TokenDisplay.tsx

'use client'

import { Crown } from 'lucide-react'

interface TokenDisplayProps {
  tokens: number
  isPremium?: boolean
}

export function TokenDisplay({ tokens, isPremium }: TokenDisplayProps) {
  return (
    <div className="flex items-center gap-2 px-3 py-1.5 rounded-xl" style={{
      background: 'rgba(234, 179, 8, 0.1)',
      backdropFilter: 'blur(10px)',
      WebkitBackdropFilter: 'blur(10px)',
      border: '1px solid rgba(234, 179, 8, 0.2)',
    }}>
      <Crown className="w-4 h-4" style={{ color: '#eab308' }} />
      <span className="text-sm font-medium" style={{ color: '#eab308' }}>Beta Unlimited</span>
    </div>
  )
}