'use client';

import React from 'react';
import { useI18n } from '@/i18n/I18nContext';

const LanguageSwitcher = () => {
    const { locale, setLocale } = useI18n();

    return (
        <div className="flex items-center gap-2">
            <button
                onClick={() => setLocale('de')}
                className={`p-1.5 rounded-lg transition-all ${locale === 'de'
                        ? 'bg-amber-100 dark:bg-amber-900/30 scale-110 shadow-sm'
                        : 'opacity-50 hover:opacity-100 grayscale hover:grayscale-0'
                    }`}
                title="Deutsch"
            >
                <span className="text-lg">🇩🇪</span>
            </button>
            <button
                onClick={() => setLocale('en')}
                className={`p-1.5 rounded-lg transition-all ${locale === 'en'
                        ? 'bg-amber-100 dark:bg-amber-900/30 scale-110 shadow-sm'
                        : 'opacity-50 hover:opacity-100 grayscale hover:grayscale-0'
                    }`}
                title="English"
            >
                <span className="text-lg">🇬🇧</span>
            </button>
        </div>
    );
};

export default LanguageSwitcher;