import React from 'react'

export function SkeletonBox({ className = '' }) {
    return <div className={`shimmer rounded-xl ${className}`} />
}

export function SkeletonWallet() {
    return (
        <div className="bg-surface border border-line rounded-2xl p-6 mb-6">
            <div className="shimmer h-3 w-24 rounded-full mb-4" />
            <div className="shimmer h-9 w-44 rounded-lg mb-5" />
            <div className="shimmer h-11 w-36 rounded-xl" />
        </div>
    )
}

export function SkeletonTxRow() {
    return (
        <div className="bg-surface border border-line rounded-2xl p-4 mb-2.5 flex items-center justify-between">
            <div className="flex items-center gap-3">
                <div className="shimmer h-10 w-10 rounded-xl" />
                <div>
                    <div className="shimmer h-3 w-28 rounded-full mb-2" />
                    <div className="shimmer h-2.5 w-16 rounded-full" />
                </div>
            </div>
            <div className="shimmer h-3 w-14 rounded-full" />
        </div>
    )
}