'use client'

import { cn } from '@/lib/utils'

export function Card({
  children,
  className,
  title,
  action,
  elevated = false,
}: {
  children: React.ReactNode
  className?: string
  title?: string
  action?: React.ReactNode
  elevated?: boolean
}) {
  return (
    <div
      className={cn(
        'premium-card light-glass-reflection rounded-2xl',
        elevated ? 'premium-card-glow shine-border' : 'depth-sm',
        className,
      )}
    >
      {(title || action) && (
        <div className="relative z-10 flex items-center justify-between border-b border-[var(--premium-divider)] px-5 py-4">
          {title && <h3 className="text-base font-semibold text-[var(--premium-text)]">{title}</h3>}
          {action}
        </div>
      )}
      <div className="relative z-10 p-5">{children}</div>
    </div>
  )
}