import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:intl/intl.dart';
import 'package:flutter/foundation.dart' show kIsWeb;
import 'package:flutter/services.dart';
import 'dart:math' as math;
import 'package:font_awesome_flutter/font_awesome_flutter.dart';
import '../providers/subscription_provider.dart';
import '../providers/category_provider.dart';
import '../services/sms_service.dart';
import '../services/subscription_url_matcher.dart';
import '../services/exchange_rate_service.dart';

class AddSubscriptionScreen extends StatefulWidget {
  const AddSubscriptionScreen({Key? key}) : super(key: key);

  @override
  State<AddSubscriptionScreen> createState() => _AddSubscriptionScreenState();
}

class _AddSubscriptionScreenState extends State<AddSubscriptionScreen>
    with SingleTickerProviderStateMixin {
  final _formKey = GlobalKey<FormState>();
  final _serviceNameController = TextEditingController();
  final _monthlyCostController = TextEditingController();
  final _nextBillingDateController = TextEditingController();
  final _websiteUrlController = TextEditingController();
  String _billingCycle = '월간';
  String _currency = 'KRW';
  DateTime? _nextBillingDate;
  bool _isLoading = false;
  String? _selectedCategoryId;
  
  // 이벤트 관련 상태 변수
  bool _isEventActive = false;
  DateTime? _eventStartDate = DateTime.now();  // 오늘로 초기화
  DateTime? _eventEndDate = DateTime.now().add(const Duration(days: 30));  // 30일 후로 초기화
  final _eventPriceController = TextEditingController();

  // 포커스 노드 추가
  final _serviceNameFocus = FocusNode();
  final _monthlyCostFocus = FocusNode();
  final _billingCycleFocus = FocusNode();
  final _nextBillingDateFocus = FocusNode();
  final _websiteUrlFocus = FocusNode();
  final _categoryFocus = FocusNode();
  final _currencyFocus = FocusNode();

  // 애니메이션 컨트롤러
  late AnimationController _animationController;
  late Animation<double> _fadeAnimation;
  late Animation<Offset> _slideAnimation;

  // 스크롤 컨트롤러
  final ScrollController _scrollController = ScrollController();
  double _scrollOffset = 0;

  // 현재 편집 중인 필드
  int _currentEditingField = -1;

  // 호버 상태
  bool _isSaveHovered = false;

  final List<Color> _gradientColors = [
    const Color(0xFF3B82F6),
    const Color(0xFF0EA5E9),
    const Color(0xFF06B6D4),
  ];

  @override
  void initState() {
    super.initState();

    // 결제일 기본값을 오늘 날짜로 설정
    _nextBillingDate = DateTime.now();

    // 디버깅 정보 출력
    print('환경 정보: kIsWeb = $kIsWeb');
    print('초기 통화 단위: $_currency');

    // 서비스명 컨트롤러에 리스너 추가
    _serviceNameController.addListener(_onServiceNameChanged);

    // 애니메이션 컨트롤러 초기화
    _animationController = AnimationController(
      vsync: this,
      duration: const Duration(milliseconds: 800),
    );

    _fadeAnimation = Tween<double>(
      begin: 0.0,
      end: 1.0,
    ).animate(CurvedAnimation(
      parent: _animationController,
      curve: Curves.easeIn,
    ));

    _slideAnimation = Tween<Offset>(
      begin: const Offset(0.0, 0.2),
      end: Offset.zero,
    ).animate(CurvedAnimation(
      parent: _animationController,
      curve: Curves.easeOutCubic,
    ));

    _scrollController.addListener(() {
      setState(() {
        _scrollOffset = _scrollController.offset;
      });
    });

    _animationController.forward();
  }

  @override
  void dispose() {
    _serviceNameController.removeListener(_onServiceNameChanged);
    _serviceNameController.dispose();
    _monthlyCostController.dispose();
    _nextBillingDateController.dispose();
    _websiteUrlController.dispose();
    _eventPriceController.dispose();
    _animationController.dispose();
    _scrollController.dispose();

    // 포커스 노드 해제
    _serviceNameFocus.dispose();
    _monthlyCostFocus.dispose();
    _billingCycleFocus.dispose();
    _nextBillingDateFocus.dispose();
    _websiteUrlFocus.dispose();
    _categoryFocus.dispose();
    _currencyFocus.dispose();

    super.dispose();
  }

  // 서비스명이 변경될 때 호출되는 콜백 함수
  void _onServiceNameChanged() {
    if (_serviceNameController.text.isNotEmpty &&
        _websiteUrlController.text.isEmpty) {
      // 자동 URL 매칭 시도
      final suggestedUrl =
          SubscriptionUrlMatcher.suggestUrl(_serviceNameController.text);

      // 매칭된 URL이 있으면 텍스트 컨트롤러에 설정
      if (suggestedUrl != null && suggestedUrl.isNotEmpty) {
        setState(() {
          _websiteUrlController.text = suggestedUrl;
        });
      }
    }

    // 서비스명이 변경될 때 카테고리 자동 선택 시도
    if (_serviceNameController.text.isNotEmpty && _selectedCategoryId == null) {
      _autoSelectCategory();
    }
  }

  // 서비스명을 기반으로 카테고리 자동 선택 함수
  void _autoSelectCategory() {
    if (_serviceNameController.text.isEmpty) return;

    final serviceName = _serviceNameController.text.toLowerCase();
    final categoryProvider =
        Provider.of<CategoryProvider>(context, listen: false);

    // 카테고리가 없으면 리턴
    if (categoryProvider.categories.isEmpty) return;

    // OTT 서비스 확인
    if (SubscriptionUrlMatcher.ottServices.keys.any((key) =>
        serviceName.contains(key.toLowerCase()) ||
        key.toLowerCase().contains(serviceName))) {
      // OTT 관련 카테고리 찾기
      try {
        final ottCategory = categoryProvider.categories.firstWhere(
          (cat) =>
              cat.name.contains('OTT') ||
              cat.name.contains('미디어') ||
              cat.name.contains('영상'),
        );

        setState(() {
          _selectedCategoryId = ottCategory.id;
        });
        return;
      } catch (_) {
        // OTT 카테고리가 없으면 첫 번째 카테고리 사용
        if (categoryProvider.categories.isNotEmpty) {
          setState(() {
            _selectedCategoryId = categoryProvider.categories.first.id;
          });
        }
      }
    }

    // 음악 서비스 확인
    if (SubscriptionUrlMatcher.musicServices.keys.any((key) =>
        serviceName.contains(key.toLowerCase()) ||
        key.toLowerCase().contains(serviceName))) {
      // 음악 관련 카테고리 찾기
      try {
        final musicCategory = categoryProvider.categories.firstWhere(
          (cat) => cat.name.contains('음악') || cat.name.contains('스트리밍'),
        );

        setState(() {
          _selectedCategoryId = musicCategory.id;
        });
        return;
      } catch (_) {
        // 음악 카테고리가 없으면 첫 번째 카테고리 사용
        if (categoryProvider.categories.isNotEmpty) {
          setState(() {
            _selectedCategoryId = categoryProvider.categories.first.id;
          });
        }
      }
    }

    // AI 서비스 확인
    if (SubscriptionUrlMatcher.aiServices.keys.any((key) =>
        serviceName.contains(key.toLowerCase()) ||
        key.toLowerCase().contains(serviceName))) {
      // AI 관련 카테고리 찾기
      try {
        final aiCategory = categoryProvider.categories.firstWhere(
          (cat) => cat.name.contains('AI') || cat.name.contains('인공지능'),
        );

        setState(() {
          _selectedCategoryId = aiCategory.id;
        });
        return;
      } catch (_) {
        // AI 카테고리가 없으면 첫 번째 카테고리 사용
        if (categoryProvider.categories.isNotEmpty) {
          setState(() {
            _selectedCategoryId = categoryProvider.categories.first.id;
          });
        }
      }
    }

    // 프로그래밍/개발 서비스 확인
    if (SubscriptionUrlMatcher.programmingServices.keys.any((key) =>
        serviceName.contains(key.toLowerCase()) ||
        key.toLowerCase().contains(serviceName))) {
      // 개발 관련 카테고리 찾기
      try {
        final devCategory = categoryProvider.categories.firstWhere(
          (cat) => cat.name.contains('개발') || cat.name.contains('프로그래밍'),
        );

        setState(() {
          _selectedCategoryId = devCategory.id;
        });
        return;
      } catch (_) {
        // 개발 카테고리가 없으면 첫 번째 카테고리 사용
        if (categoryProvider.categories.isNotEmpty) {
          setState(() {
            _selectedCategoryId = categoryProvider.categories.first.id;
          });
        }
      }
    }

    // 오피스/협업 툴 확인
    if (SubscriptionUrlMatcher.officeTools.keys.any((key) =>
        serviceName.contains(key.toLowerCase()) ||
        key.toLowerCase().contains(serviceName))) {
      // 오피스 관련 카테고리 찾기
      try {
        final officeCategory = categoryProvider.categories.firstWhere(
          (cat) =>
              cat.name.contains('오피스') ||
              cat.name.contains('협업') ||
              cat.name.contains('업무'),
        );

        setState(() {
          _selectedCategoryId = officeCategory.id;
        });
        return;
      } catch (_) {
        // 오피스 카테고리가 없으면 첫 번째 카테고리 사용
        if (categoryProvider.categories.isNotEmpty) {
          setState(() {
            _selectedCategoryId = categoryProvider.categories.first.id;
          });
        }
      }
    }

    // 기타 서비스 확인
    if (SubscriptionUrlMatcher.otherServices.keys.any((key) =>
        serviceName.contains(key.toLowerCase()) ||
        key.toLowerCase().contains(serviceName))) {
      // 기타 관련 카테고리 찾기
      try {
        final otherCategory = categoryProvider.categories.firstWhere(
          (cat) => cat.name.contains('기타') || cat.name.contains('게임'),
        );

        setState(() {
          _selectedCategoryId = otherCategory.id;
        });
      } catch (_) {
        // 기타 카테고리가 없으면 첫 번째 카테고리 사용
        if (categoryProvider.categories.isNotEmpty) {
          setState(() {
            _selectedCategoryId = categoryProvider.categories.first.id;
          });
        }
      }
    }
  }

  Future<void> _scanSMS() async {
    if (kIsWeb) return;

    setState(() => _isLoading = true);

    try {
      if (!await SMSService.hasSMSPermission()) {
        final granted = await SMSService.requestSMSPermission();
        if (!granted) {
          if (mounted) {
            ScaffoldMessenger.of(context).showSnackBar(
              SnackBar(
                content: Row(
                  children: [
                    const Icon(Icons.error_outline, color: Colors.white),
                    const SizedBox(width: 12),
                    const Expanded(child: Text('SMS 권한이 필요합니다.')),
                  ],
                ),
                behavior: SnackBarBehavior.floating,
                backgroundColor: Colors.red,
                shape: RoundedRectangleBorder(
                    borderRadius: BorderRadius.circular(10)),
              ),
            );
          }
          return;
        }
      }

      final subscriptions = await SMSService.scanSubscriptions();
      if (subscriptions.isEmpty) {
        if (mounted) {
          ScaffoldMessenger.of(context).showSnackBar(
            SnackBar(
              content: Row(
                children: [
                  const Icon(Icons.info_outline, color: Colors.white),
                  const SizedBox(width: 12),
                  const Expanded(child: Text('구독 관련 SMS를 찾을 수 없습니다.')),
                ],
              ),
              behavior: SnackBarBehavior.floating,
              backgroundColor: Colors.orange,
              shape: RoundedRectangleBorder(
                  borderRadius: BorderRadius.circular(10)),
            ),
          );
        }
        return;
      }

      final subscription = subscriptions.first;
      setState(() {
        _serviceNameController.text = subscription['serviceName'] ?? '';

        // 비용 처리 및 통화 단위 자동 감지
        final costValue = subscription['monthlyCost']?.toString() ?? '';

        // costValue가 비어있지 않을 경우에만 처리
        if (costValue.isNotEmpty) {
          // 달러 표시가 있거나 소수점이 있으면 달러로 판단
          if (costValue.contains('\$') || costValue.contains('.')) {
            // 달러로 설정
            _currency = 'USD';

            // 달러 기호 제거 및 숫자만 추출
            String numericValue = costValue.replaceAll('\$', '').trim();

            // 소수점이 없는 경우 소수점 추가
            if (!numericValue.contains('.')) {
              numericValue = '$numericValue.00';
            }

            // 3자리마다 콤마 추가하여 포맷팅
            final double parsedValue =
                double.tryParse(numericValue.replaceAll(',', '')) ?? 0.0;
            _monthlyCostController.text =
                NumberFormat('#,##0.00').format(parsedValue);
          } else {
            // 원화로 설정
            _currency = 'KRW';

            // ₩ 기호와 콤마 제거
            String numericValue =
                costValue.replaceAll('₩', '').replaceAll(',', '').trim();

            // 숫자로 변환하여 정수로 포맷팅
            final int parsedValue = int.tryParse(numericValue) ?? 0;
            _monthlyCostController.text =
                NumberFormat.decimalPattern().format(parsedValue);
          }
        } else {
          _monthlyCostController.text = '';
        }

        _billingCycle = subscription['billingCycle'] ?? '월간';
        _nextBillingDate = subscription['nextBillingDate'] != null
            ? DateTime.parse(subscription['nextBillingDate'])
            : DateTime.now();

        // 서비스명이 있으면 URL 자동 매칭 시도
        if (subscription['serviceName'] != null &&
            subscription['serviceName'].isNotEmpty) {
          final suggestedUrl =
              SubscriptionUrlMatcher.suggestUrl(subscription['serviceName']);
          if (suggestedUrl != null) {
            _websiteUrlController.text = suggestedUrl;
          }

          // 서비스명 기반으로 카테고리 자동 선택
          _autoSelectCategory();
        }

        // 애니메이션 재생
        _animationController.reset();
        _animationController.forward();
      });
    } catch (e) {
      if (mounted) {
        ScaffoldMessenger.of(context).showSnackBar(
          SnackBar(
            content: Row(
              children: [
                const Icon(Icons.error_outline, color: Colors.white),
                const SizedBox(width: 12),
                Expanded(child: Text('SMS 스캔 중 오류 발생: $e')),
              ],
            ),
            behavior: SnackBarBehavior.floating,
            backgroundColor: Colors.red,
            shape:
                RoundedRectangleBorder(borderRadius: BorderRadius.circular(10)),
          ),
        );
      }
    } finally {
      if (mounted) {
        setState(() => _isLoading = false);
      }
    }
  }

  Future<void> _saveSubscription() async {
    if (_formKey.currentState!.validate() && _nextBillingDate != null) {
      setState(() {
        _isLoading = true;
      });

      try {
        // 콤마 제거하고 숫자만 추출
        final monthlyCost =
            double.parse(_monthlyCostController.text.replaceAll(',', ''));
            
        // 이벤트 가격 파싱
        double? eventPrice;
        if (_isEventActive && _eventPriceController.text.isNotEmpty) {
          eventPrice = double.tryParse(_eventPriceController.text.replaceAll(',', ''));
        }

        await Provider.of<SubscriptionProvider>(context, listen: false)
            .addSubscription(
          serviceName: _serviceNameController.text.trim(),
          monthlyCost: monthlyCost,
          billingCycle: _billingCycle,
          nextBillingDate: _nextBillingDate!,
          websiteUrl: _websiteUrlController.text.trim(),
          categoryId: _selectedCategoryId,
          currency: _currency,
          isEventActive: _isEventActive,
          eventStartDate: _eventStartDate,
          eventEndDate: _eventEndDate,
          eventPrice: eventPrice,
        );

        if (mounted) {
          Navigator.pop(context, true); // 성공 여부 반환
        }
      } catch (e) {
        setState(() {
          _isLoading = false;
        });

        if (mounted) {
          ScaffoldMessenger.of(context).showSnackBar(
            SnackBar(
              content: Text('저장 중 오류가 발생했습니다: $e'),
              backgroundColor: Colors.red,
            ),
          );
        }
      }
    } else {
      _scrollController.animateTo(
        0.0,
        duration: const Duration(milliseconds: 300),
        curve: Curves.easeOut,
      );
    }
  }

  @override
  Widget build(BuildContext context) {
    final double appBarOpacity = math.max(0, math.min(1, _scrollOffset / 100));

    // 통화 기호 텍스트 (디버깅용)
    print('현재 통화 단위: $_currency');
    final currencySymbol = _currency == 'KRW' ? '₩' : '\$';
    print('통화 기호: $currencySymbol');

    return Scaffold(
      backgroundColor: const Color(0xFFF8FAFC),
      extendBodyBehindAppBar: true,
      appBar: PreferredSize(
        preferredSize: const Size.fromHeight(60),
        child: Container(
          decoration: BoxDecoration(
            color: Colors.white.withValues(alpha: appBarOpacity),
            boxShadow: appBarOpacity > 0.6
                ? [
                    BoxShadow(
                      color: Colors.black.withValues(alpha: 0.1 * appBarOpacity),
                      spreadRadius: 1,
                      blurRadius: 8,
                      offset: const Offset(0, 4),
                    )
                  ]
                : null,
          ),
          child: SafeArea(
            child: AppBar(
              title: Text(
                '구독 추가',
                style: TextStyle(
                  fontFamily: 'Montserrat',
                  fontSize: 24,
                  fontWeight: FontWeight.w800,
                  letterSpacing: -0.5,
                  color: const Color(0xFF1E293B),
                  shadows: appBarOpacity > 0.6
                      ? [
                          Shadow(
                            color: Colors.black.withValues(alpha: 0.2),
                            offset: const Offset(0, 1),
                            blurRadius: 2,
                          )
                        ]
                      : null,
                ),
              ),
              elevation: 0,
              backgroundColor: Colors.transparent,
              actions: [
                if (!kIsWeb)
                  _isLoading
                      ? const Padding(
                          padding: EdgeInsets.only(right: 16.0),
                          child: Center(
                            child: SizedBox(
                              width: 24,
                              height: 24,
                              child: CircularProgressIndicator(
                                strokeWidth: 2,
                                valueColor: AlwaysStoppedAnimation<Color>(
                                    Color(0xFF3B82F6)),
                              ),
                            ),
                          ),
                        )
                      : IconButton(
                          icon: const FaIcon(FontAwesomeIcons.message,
                              size: 20, color: Color(0xFF3B82F6)),
                          onPressed: _scanSMS,
                          tooltip: 'SMS에서 구독 정보 스캔',
                        ),
              ],
            ),
          ),
        ),
      ),
      body: SingleChildScrollView(
        controller: _scrollController,
        physics: const BouncingScrollPhysics(),
        padding: const EdgeInsets.all(16),
        child: Form(
          key: _formKey,
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              SizedBox(height: MediaQuery.of(context).padding.top + 60),
              // 헤더 섹션
              FadeTransition(
                opacity: _fadeAnimation,
                child: SlideTransition(
                  position: _slideAnimation,
                  child: Container(
                    margin: const EdgeInsets.only(bottom: 24),
                    padding: const EdgeInsets.all(24),
                    decoration: BoxDecoration(
                      borderRadius: BorderRadius.circular(24),
                      gradient: LinearGradient(
                        colors: _gradientColors,
                        begin: Alignment.topLeft,
                        end: Alignment.bottomRight,
                      ),
                      boxShadow: [
                        BoxShadow(
                          color: _gradientColors[0].withValues(alpha: 0.3),
                          blurRadius: 20,
                          spreadRadius: 0,
                          offset: const Offset(0, 8),
                        ),
                      ],
                    ),
                    child: Row(
                      children: [
                        Container(
                          padding: const EdgeInsets.all(16),
                          decoration: BoxDecoration(
                            color: Colors.white.withValues(alpha: 0.2),
                            borderRadius: BorderRadius.circular(16),
                          ),
                          child: const Icon(
                            Icons.add_rounded,
                            size: 32,
                            color: Colors.white,
                          ),
                        ),
                        const SizedBox(width: 16),
                        const Expanded(
                          child: Column(
                            crossAxisAlignment: CrossAxisAlignment.start,
                            children: [
                              Text(
                                '새 구독 추가',
                                style: TextStyle(
                                  fontSize: 24,
                                  fontWeight: FontWeight.w800,
                                  color: Colors.white,
                                  letterSpacing: -0.5,
                                ),
                              ),
                              SizedBox(height: 4),
                              Text(
                                '서비스 정보를 입력해주세요',
                                style: TextStyle(
                                  fontSize: 14,
                                  fontWeight: FontWeight.w500,
                                  color: Colors.white70,
                                ),
                              ),
                            ],
                          ),
                        ),
                      ],
                    ),
                  ),
                ),
              ),

              // 서비스 정보 카드
              FadeTransition(
                opacity: Tween<double>(begin: 0.0, end: 1.0).animate(
                  CurvedAnimation(
                    parent: _animationController,
                    curve: const Interval(0.2, 1.0, curve: Curves.easeIn),
                  ),
                ),
                child: SlideTransition(
                  position: Tween<Offset>(
                    begin: const Offset(0.0, 0.4),
                    end: Offset.zero,
                  ).animate(CurvedAnimation(
                    parent: _animationController,
                    curve: const Interval(0.2, 1.0, curve: Curves.easeOutCubic),
                  )),
                  child: Card(
                    elevation: 1,
                    shadowColor: Colors.black12,
                    shape: RoundedRectangleBorder(
                      borderRadius: BorderRadius.circular(20),
                    ),
                    child: Padding(
                      padding: const EdgeInsets.all(24),
                      child: Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          Row(
                            children: [
                              ShaderMask(
                                shaderCallback: (bounds) => LinearGradient(
                                  colors: _gradientColors,
                                  begin: Alignment.topLeft,
                                  end: Alignment.bottomRight,
                                ).createShader(bounds),
                                child: const Icon(
                                  FontAwesomeIcons.fileLines,
                                  size: 20,
                                  color: Colors.white,
                                ),
                              ),
                              const SizedBox(width: 12),
                              const Text(
                                '서비스 정보',
                                style: TextStyle(
                                  fontSize: 18,
                                  fontWeight: FontWeight.w700,
                                  letterSpacing: -0.5,
                                  color: Color(0xFF1E293B),
                                ),
                              ),
                            ],
                          ),
                          const SizedBox(height: 24),

                          // 서비스명 필드
                          AnimatedContainer(
                            duration: const Duration(milliseconds: 200),
                            margin: const EdgeInsets.only(bottom: 20),
                            decoration: BoxDecoration(
                              borderRadius: BorderRadius.circular(16),
                              color: _currentEditingField == 0
                                  ? const Color(0xFF3B82F6).withValues(alpha: 0.1)
                                  : Colors.transparent,
                            ),
                            padding: const EdgeInsets.all(8),
                            child: Column(
                              crossAxisAlignment: CrossAxisAlignment.start,
                              children: [
                                const Text(
                                  '서비스명',
                                  style: TextStyle(
                                    fontSize: 14,
                                    fontWeight: FontWeight.w500,
                                    color: Color(0xFF3B82F6),
                                  ),
                                ),
                                const SizedBox(height: 8),
                                TextFormField(
                                  controller: _serviceNameController,
                                  focusNode: _serviceNameFocus,
                                  textInputAction: TextInputAction.next,
                                  onTap: () =>
                                      setState(() => _currentEditingField = 0),
                                  onEditingComplete: () {
                                    _monthlyCostFocus.requestFocus();
                                    setState(() => _currentEditingField = -1);
                                  },
                                  validator: (value) {
                                    if (value == null || value.isEmpty) {
                                      return '서비스명을 입력해주세요';
                                    }
                                    return null;
                                  },
                                  style: const TextStyle(
                                    color: Color(0xFF1E293B),
                                    fontSize: 16,
                                    fontWeight: FontWeight.w500,
                                  ),
                                  decoration: InputDecoration(
                                    filled: true,
                                    fillColor: Colors.white,
                                    contentPadding: const EdgeInsets.symmetric(
                                        vertical: 16, horizontal: 20),
                                    border: OutlineInputBorder(
                                      borderRadius: BorderRadius.circular(12),
                                      borderSide: BorderSide(
                                        color: Colors.grey.withValues(alpha: 0.2),
                                      ),
                                    ),
                                    focusedBorder: OutlineInputBorder(
                                      borderRadius: BorderRadius.circular(12),
                                      borderSide: const BorderSide(
                                        color: Color(0xFF3B82F6),
                                        width: 2,
                                      ),
                                    ),
                                    errorBorder: OutlineInputBorder(
                                      borderRadius: BorderRadius.circular(12),
                                      borderSide: const BorderSide(
                                        color: Colors.red,
                                        width: 2,
                                      ),
                                    ),
                                    hintText: '넷플릭스',
                                    hintStyle: TextStyle(
                                      color: Colors.grey.shade500,
                                      fontSize: 16,
                                    ),
                                  ),
                                ),
                              ],
                            ),
                          ),

                          // 월 비용 필드
                          AnimatedContainer(
                            duration: const Duration(milliseconds: 200),
                            margin: const EdgeInsets.only(bottom: 20),
                            decoration: BoxDecoration(
                              borderRadius: BorderRadius.circular(16),
                              color: _currentEditingField == 1
                                  ? const Color(0xFF3B82F6).withValues(alpha: 0.1)
                                  : Colors.transparent,
                            ),
                            padding: const EdgeInsets.all(8),
                            child: Column(
                              crossAxisAlignment: CrossAxisAlignment.start,
                              children: [
                                // 환율 정보와 비용 입력 제목 표시 (상단)
                                Row(
                                  mainAxisAlignment:
                                      MainAxisAlignment.spaceBetween,
                                  crossAxisAlignment: CrossAxisAlignment.center,
                                  children: [
                                    const Text(
                                      '비용 입력',
                                      style: TextStyle(
                                        fontSize: 14,
                                        fontWeight: FontWeight.w500,
                                        color: Color(0xFF3B82F6),
                                      ),
                                    ),
                                    if (_currency == 'USD')
                                      FutureBuilder<String>(
                                        future: ExchangeRateService()
                                            .getFormattedExchangeRateInfo(),
                                        builder: (context, snapshot) {
                                          if (snapshot.hasData) {
                                            return Text(
                                              snapshot.data!,
                                              style: TextStyle(
                                                fontSize: 12,
                                                color: Colors.grey[600],
                                                fontWeight: FontWeight.w500,
                                              ),
                                            );
                                          }
                                          return const SizedBox.shrink();
                                        },
                                      ),
                                  ],
                                ),
                                const SizedBox(height: 8),
                                Row(
                                  children: [
                                    // 통화 단위 선택 (좌측)
                                    Expanded(
                                      flex: 3, // 25% 너비 차지
                                      child: DropdownButtonFormField<String>(
                                        value: _currency,
                                        focusNode: _currencyFocus,
                                        isDense: true,
                                        onTap: () => setState(
                                            () => _currentEditingField = 1),
                                        onChanged: (value) {
                                          if (value != null) {
                                            setState(() {
                                              _currency = value;

                                              // 통화 단위 변경 시 입력 값 변환
                                              final currentText =
                                                  _monthlyCostController.text;
                                              if (currentText.isNotEmpty) {
                                                // 콤마 제거하고 숫자만 추출
                                                final numericValue =
                                                    double.tryParse(currentText
                                                        .replaceAll(',', ''));

                                                if (numericValue != null) {
                                                  if (value == 'KRW') {
                                                    // 달러 → 원화: 소수점 제거
                                                    _monthlyCostController
                                                        .text = NumberFormat
                                                            .decimalPattern()
                                                        .format(numericValue
                                                            .toInt());
                                                  } else {
                                                    // 원화 → 달러: 소수점 2자리 추가
                                                    _monthlyCostController
                                                        .text = NumberFormat(
                                                            '#,##0.00')
                                                        .format(numericValue);
                                                  }
                                                }
                                              }

                                              // 화면 갱신하여 통화 기호도 업데이트
                                              _monthlyCostFocus.requestFocus();
                                            });
                                          }
                                        },
                                        decoration: InputDecoration(
                                          filled: true,
                                          fillColor: Colors.white,
                                          contentPadding:
                                              const EdgeInsets.symmetric(
                                                  vertical: 16, horizontal: 12),
                                          border: OutlineInputBorder(
                                            borderRadius:
                                                BorderRadius.circular(12),
                                            borderSide: BorderSide(
                                              color:
                                                  Colors.grey.withValues(alpha: 0.2),
                                            ),
                                          ),
                                          focusedBorder: OutlineInputBorder(
                                            borderRadius:
                                                BorderRadius.circular(12),
                                            borderSide: const BorderSide(
                                              color: Color(0xFF3B82F6),
                                              width: 2,
                                            ),
                                          ),
                                        ),
                                        icon: const Icon(
                                          Icons.arrow_drop_down,
                                          color: Color(0xFF3B82F6),
                                        ),
                                        items: ['KRW', 'USD']
                                            .map((currency) => DropdownMenuItem(
                                                  value: currency,
                                                  child: Text(
                                                    currency == 'KRW'
                                                        ? 'KRW'
                                                        : 'USD',
                                                    style: const TextStyle(
                                                      fontSize: 14,
                                                      fontWeight:
                                                          FontWeight.w500,
                                                      color: Colors.black87,
                                                    ),
                                                  ),
                                                ))
                                            .toList(),
                                      ),
                                    ),
                                    const SizedBox(width: 8),
                                    // 월 비용 입력 필드 (우측) - 테두리 제거 및 배경색 통일
                                    Expanded(
                                      flex: 7, // 75% 너비 차지
                                      child: Container(
                                        height: 50, // 높이를 56에서 50으로 줄임
                                        // 우측에서 40픽셀 줄이기
                                        margin: const EdgeInsets.only(right: 0),
                                        // 내부 패딩을 고정값으로 설정하여 포커스 상태와 관계없이 일관되게 유지
                                        padding: const EdgeInsets.all(4),
                                        decoration: BoxDecoration(
                                          // 포커스 상태에 따른 배경색 변경 (배경색만 변경)
                                          color: _currentEditingField == 1
                                              ? const Color(
                                                  0xFFF3F4F6) // 포커스 상태일 때 연한 회색
                                              : Colors
                                                  .transparent, // 포커스 없을 때 투명
                                          borderRadius:
                                              BorderRadius.circular(12),
                                          // 테두리 설정 (포커스 상태에 따라 색상만 변경)
                                          border: Border.all(
                                            color: _currentEditingField == 1
                                                ? const Color(0xFF3B82F6)
                                                : Colors.grey.withValues(alpha: 
                                                    0.4), // 포커스 없을 때 더 진한 회색
                                            width: _currentEditingField == 1
                                                ? 2
                                                : 1,
                                          ),
                                        ),
                                        child: Row(
                                          children: [
                                            // 통화 기호 - 항상 표시되도록 수정
                                            Container(
                                              width: 40,
                                              alignment: Alignment.center,
                                              decoration: BoxDecoration(
                                                // 테두리 추가 (좌측 통화선택란과 동일한 스타일)
                                                border: Border(
                                                  right: BorderSide(
                                                    color: Colors.grey
                                                        .withValues(alpha: 0.2),
                                                    width: 1,
                                                  ),
                                                ),
                                              ),
                                              child: Text(
                                                _currency == 'KRW' ? '₩' : '\$',
                                                style: const TextStyle(
                                                  color: Color(0xFF3B82F6),
                                                  fontSize: 18,
                                                  fontWeight: FontWeight.bold,
                                                ),
                                              ),
                                            ),
                                            // 실제 입력 필드 - 기호 관련 코드 제거하여 중복 방지
                                            Expanded(
                                              child: Stack(
                                                alignment:
                                                    Alignment.centerRight,
                                                children: [
                                                  TextField(
                                                    controller:
                                                        _monthlyCostController,
                                                    focusNode:
                                                        _monthlyCostFocus,
                                                    textInputAction:
                                                        TextInputAction.next,
                                                    keyboardType:
                                                        const TextInputType
                                                            .numberWithOptions(
                                                            decimal: true),
                                                    inputFormatters: [
                                                      // 통화 단위에 따라 다른 입력 형식 적용
                                                      FilteringTextInputFormatter
                                                          .allow(
                                                        _currency == 'KRW'
                                                            ? RegExp(
                                                                r'[0-9,]') // 원화: 정수만 허용
                                                            : RegExp(
                                                                r'[0-9,.]'), // 달러: 소수점 허용
                                                      ),
                                                      // 커스텀 포맷터 - 3자리마다 콤마 추가
                                                      TextInputFormatter
                                                          .withFunction(
                                                              (oldValue,
                                                                  newValue) {
                                                        // 입력값에서 콤마 제거
                                                        final text = newValue
                                                            .text
                                                            .replaceAll(
                                                                ',', '');

                                                        if (text.isEmpty) {
                                                          return newValue
                                                              .copyWith(
                                                                  text: '');
                                                        }

                                                        // 숫자 형식 검증
                                                        if (_currency ==
                                                            'KRW') {
                                                          // 원화: 정수 형식
                                                          if (double.tryParse(
                                                                  text) ==
                                                              null) {
                                                            return oldValue;
                                                          }

                                                          // 3자리마다 콤마 추가
                                                          final formattedValue =
                                                              NumberFormat
                                                                      .decimalPattern()
                                                                  .format(
                                                                      int.parse(
                                                                          text));

                                                          return newValue
                                                              .copyWith(
                                                            text:
                                                                formattedValue,
                                                            selection: TextSelection
                                                                .collapsed(
                                                                    offset: formattedValue
                                                                        .length),
                                                          );
                                                        } else {
                                                          // 달러: 소수점 형식
                                                          if (double.tryParse(
                                                                      text) ==
                                                                  null &&
                                                              text != '.') {
                                                            return oldValue;
                                                          }

                                                          // 소수점 이하 처리를 위해 부분 분리
                                                          final parts =
                                                              text.split('.');
                                                          final integerPart =
                                                              parts[0];
                                                          final decimalPart = parts
                                                                      .length >
                                                                  1
                                                              ? '.${parts[1].length > 2 ? parts[1].substring(0, 2) : parts[1]}'
                                                              : '';

                                                          // 3자리마다 콤마 추가 (정수 부분만)
                                                          String formattedValue;
                                                          if (integerPart
                                                              .isEmpty) {
                                                            formattedValue =
                                                                '0$decimalPart';
                                                          } else {
                                                            final formatted = NumberFormat
                                                                    .decimalPattern()
                                                                .format(int.parse(
                                                                    integerPart));
                                                            formattedValue =
                                                                '$formatted$decimalPart';
                                                          }

                                                          return newValue
                                                              .copyWith(
                                                            text:
                                                                formattedValue,
                                                            selection: TextSelection
                                                                .collapsed(
                                                                    offset: formattedValue
                                                                        .length),
                                                          );
                                                        }
                                                      }),
                                                    ],
                                                    onTap: () => setState(() =>
                                                        _currentEditingField =
                                                            1),
                                                    onSubmitted: (_) {
                                                      _billingCycleFocus
                                                          .requestFocus();
                                                      setState(() =>
                                                          _currentEditingField =
                                                              -1);
                                                    },
                                                    style: const TextStyle(
                                                      color: Color(0xFF1E293B),
                                                      fontSize: 16,
                                                      fontWeight:
                                                          FontWeight.w500,
                                                    ),
                                                    decoration: InputDecoration(
                                                      border: InputBorder.none,
                                                      // 포커스 상태와 관계없이 일관된 패딩 유지
                                                      contentPadding:
                                                          const EdgeInsets
                                                              .symmetric(
                                                              vertical: 14,
                                                              horizontal: 8),
                                                      hintText:
                                                          _currency == 'KRW'
                                                              ? '9,000'
                                                              : '9.99',
                                                      hintStyle: TextStyle(
                                                        color: Colors
                                                            .grey.shade500,
                                                        fontSize: 16,
                                                      ),
                                                      // 모든 테두리 제거
                                                      enabledBorder:
                                                          InputBorder.none,
                                                      focusedBorder:
                                                          InputBorder.none,
                                                      errorBorder:
                                                          InputBorder.none,
                                                      disabledBorder:
                                                          InputBorder.none,
                                                      focusedErrorBorder:
                                                          InputBorder.none,
                                                    ),
                                                  ),
                                                  // 달러일 때 원화 환산 금액 표시
                                                  if (_currency == 'USD')
                                                    ValueListenableBuilder<
                                                        TextEditingValue>(
                                                      valueListenable:
                                                          _monthlyCostController,
                                                      builder: (context, value,
                                                          child) {
                                                        // 입력값이 바뀔 때마다 환산 금액 갱신
                                                        return FutureBuilder<
                                                            String>(
                                                          future: ExchangeRateService()
                                                              .getFormattedKrwAmount(
                                                                  double.tryParse(value
                                                                          .text
                                                                          .replaceAll(
                                                                              ',',
                                                                              '')) ??
                                                                      0.0),
                                                          builder: (context,
                                                              snapshot) {
                                                            if (snapshot
                                                                    .hasData &&
                                                                snapshot.data!
                                                                    .isNotEmpty) {
                                                              return Padding(
                                                                padding:
                                                                    const EdgeInsets
                                                                        .only(
                                                                        right:
                                                                            12.0),
                                                                child: Text(
                                                                  snapshot
                                                                      .data!,
                                                                  style:
                                                                      const TextStyle(
                                                                    fontSize:
                                                                        14,
                                                                    color: Colors
                                                                        .blue,
                                                                    fontWeight:
                                                                        FontWeight
                                                                            .w500,
                                                                  ),
                                                                ),
                                                              );
                                                            }
                                                            return const SizedBox
                                                                .shrink();
                                                          },
                                                        );
                                                      },
                                                    ),
                                                ],
                                              ),
                                            ),
                                          ],
                                        ),
                                      ),
                                    ),
                                  ],
                                ),
                              ],
                            ),
                          ),

                          // 결제 주기 필드
                          AnimatedContainer(
                            duration: const Duration(milliseconds: 200),
                            margin: const EdgeInsets.only(bottom: 20),
                            decoration: BoxDecoration(
                              borderRadius: BorderRadius.circular(16),
                              color: _currentEditingField == 2
                                  ? const Color(0xFF3B82F6).withValues(alpha: 0.1)
                                  : Colors.transparent,
                            ),
                            padding: const EdgeInsets.all(8),
                            child: Column(
                              crossAxisAlignment: CrossAxisAlignment.start,
                              children: [
                                const Text(
                                  '결제 주기',
                                  style: TextStyle(
                                    fontSize: 14,
                                    fontWeight: FontWeight.w500,
                                    color: Color(0xFF3B82F6),
                                  ),
                                ),
                                const SizedBox(height: 8),
                                DropdownButtonFormField<String>(
                                  value: _billingCycle,
                                  focusNode: _billingCycleFocus,
                                  onTap: () =>
                                      setState(() => _currentEditingField = 2),
                                  onChanged: (value) {
                                    if (value != null) {
                                      setState(() {
                                        _billingCycle = value;
                                        _currentEditingField = -1;
                                        _nextBillingDateFocus.requestFocus();
                                      });
                                    }
                                  },
                                  decoration: InputDecoration(
                                    filled: true,
                                    fillColor: Colors.white,
                                    contentPadding: const EdgeInsets.all(16),
                                    border: OutlineInputBorder(
                                      borderRadius: BorderRadius.circular(12),
                                      borderSide: BorderSide(
                                        color: Colors.grey.withValues(alpha: 0.2),
                                      ),
                                    ),
                                    focusedBorder: OutlineInputBorder(
                                      borderRadius: BorderRadius.circular(12),
                                      borderSide: const BorderSide(
                                        color: Color(0xFF3B82F6),
                                        width: 2,
                                      ),
                                    ),
                                    prefixIcon: const Icon(
                                      Icons.calendar_today_rounded,
                                      color: Color(0xFF3B82F6),
                                    ),
                                  ),
                                  icon: const Icon(
                                    Icons.arrow_drop_down_circle_outlined,
                                    color: Color(0xFF3B82F6),
                                  ),
                                  elevation: 2,
                                  dropdownColor: Colors.white,
                                  style: const TextStyle(
                                    color: Colors.black87,
                                    fontSize: 16,
                                    fontWeight: FontWeight.w500,
                                  ),
                                  items: ['월간', '연간', '주간']
                                      .map((cycle) => DropdownMenuItem(
                                            value: cycle,
                                            child: Text(
                                              cycle,
                                              style: const TextStyle(
                                                fontSize: 16,
                                                fontWeight: FontWeight.w500,
                                                color: Colors.black87,
                                              ),
                                            ),
                                          ))
                                      .toList(),
                                ),
                              ],
                            ),
                          ),

                          // 다음 결제일 필드
                          AnimatedContainer(
                            duration: const Duration(milliseconds: 200),
                            margin: const EdgeInsets.only(bottom: 20),
                            decoration: BoxDecoration(
                              borderRadius: BorderRadius.circular(16),
                              color: _currentEditingField == 3
                                  ? const Color(0xFF3B82F6).withValues(alpha: 0.1)
                                  : Colors.transparent,
                            ),
                            padding: const EdgeInsets.all(8),
                            child: Column(
                              crossAxisAlignment: CrossAxisAlignment.start,
                              children: [
                                const Text(
                                  '다음 결제일',
                                  style: TextStyle(
                                    fontSize: 14,
                                    fontWeight: FontWeight.w500,
                                    color: Color(0xFF3B82F6),
                                  ),
                                ),
                                const SizedBox(height: 8),
                                InkWell(
                                  focusNode: _nextBillingDateFocus,
                                  onTap: () async {
                                    setState(() => _currentEditingField = 3);
                                    final DateTime? picked =
                                        await showDatePicker(
                                      context: context,
                                      initialDate:
                                          _nextBillingDate ?? DateTime.now(),
                                      firstDate: DateTime.now(),
                                      lastDate: DateTime.now().add(
                                        const Duration(days: 365 * 2),
                                      ),
                                      builder: (BuildContext context,
                                          Widget? child) {
                                        return Theme(
                                          data: ThemeData.light().copyWith(
                                            colorScheme: ColorScheme.light(
                                              primary: _gradientColors[0],
                                              onPrimary: Colors.white,
                                              surface: Colors.white,
                                              onSurface: Colors.black,
                                            ),
                                          ),
                                          child: child!,
                                        );
                                      },
                                    );
                                    if (picked != null) {
                                      setState(() {
                                        _nextBillingDate = picked;
                                        _currentEditingField = -1;
                                        _websiteUrlFocus.requestFocus();
                                      });
                                    } else {
                                      setState(() => _currentEditingField = -1);
                                    }
                                  },
                                  borderRadius: BorderRadius.circular(12),
                                  child: Container(
                                    padding: const EdgeInsets.all(16),
                                    decoration: BoxDecoration(
                                      border: Border.all(
                                        color: _nextBillingDate == null
                                            ? Colors.red
                                            : Colors.grey.withValues(alpha: 0.2),
                                      ),
                                      borderRadius: BorderRadius.circular(12),
                                      color: Colors.white,
                                    ),
                                    child: Row(
                                      children: [
                                        const Icon(
                                          Icons.event_rounded,
                                          color: Color(0xFF3B82F6),
                                        ),
                                        const SizedBox(width: 12),
                                        Text(
                                          _nextBillingDate == null
                                              ? '결제일을 선택해주세요'
                                              : DateFormat('yyyy년 MM월 dd일')
                                                  .format(_nextBillingDate!),
                                          style: TextStyle(
                                            fontSize: 16,
                                            color: _nextBillingDate == null
                                                ? Colors.grey.shade500
                                                : const Color(0xFF1E293B),
                                            fontWeight: FontWeight.w500,
                                          ),
                                        ),
                                      ],
                                    ),
                                  ),
                                ),
                              ],
                            ),
                          ),

                          // 웹사이트 URL 필드
                          AnimatedContainer(
                            duration: const Duration(milliseconds: 200),
                            margin: const EdgeInsets.only(bottom: 20),
                            decoration: BoxDecoration(
                              borderRadius: BorderRadius.circular(16),
                              color: _currentEditingField == 4
                                  ? const Color(0xFF3B82F6).withValues(alpha: 0.1)
                                  : Colors.transparent,
                            ),
                            padding: const EdgeInsets.all(8),
                            child: Column(
                              crossAxisAlignment: CrossAxisAlignment.start,
                              children: [
                                const Text(
                                  '웹사이트 URL (선택)',
                                  style: TextStyle(
                                    fontSize: 14,
                                    fontWeight: FontWeight.w500,
                                    color: Color(0xFF3B82F6),
                                  ),
                                ),
                                const SizedBox(height: 8),
                                TextFormField(
                                  controller: _websiteUrlController,
                                  focusNode: _websiteUrlFocus,
                                  textInputAction: TextInputAction.done,
                                  onTap: () =>
                                      setState(() => _currentEditingField = 4),
                                  onEditingComplete: () {
                                    setState(() => _currentEditingField = 5);
                                    _categoryFocus.requestFocus();
                                  },
                                  style: const TextStyle(
                                    color: Color(0xFF1E293B),
                                    fontSize: 16,
                                    fontWeight: FontWeight.w500,
                                  ),
                                  decoration: InputDecoration(
                                    filled: true,
                                    fillColor: Colors.white,
                                    contentPadding: const EdgeInsets.symmetric(
                                        vertical: 16, horizontal: 20),
                                    border: OutlineInputBorder(
                                      borderRadius: BorderRadius.circular(12),
                                      borderSide: BorderSide(
                                        color: Colors.grey.withValues(alpha: 0.2),
                                      ),
                                    ),
                                    focusedBorder: OutlineInputBorder(
                                      borderRadius: BorderRadius.circular(12),
                                      borderSide: const BorderSide(
                                        color: Color(0xFF3B82F6),
                                        width: 2,
                                      ),
                                    ),
                                    hintText: 'https://netflix.com',
                                    hintStyle: TextStyle(
                                      color: Colors.grey.shade500,
                                      fontSize: 16,
                                    ),
                                  ),
                                ),
                              ],
                            ),
                          ),

                          // 카테고리 선택 필드
                          AnimatedContainer(
                            duration: const Duration(milliseconds: 200),
                            margin: const EdgeInsets.only(bottom: 20),
                            decoration: BoxDecoration(
                              borderRadius: BorderRadius.circular(16),
                              color: _currentEditingField == 5
                                  ? const Color(0xFF3B82F6).withValues(alpha: 0.1)
                                  : Colors.transparent,
                            ),
                            padding: const EdgeInsets.all(8),
                            child: Column(
                              crossAxisAlignment: CrossAxisAlignment.start,
                              children: [
                                const Text(
                                  '카테고리 (선택)',
                                  style: TextStyle(
                                    fontSize: 14,
                                    fontWeight: FontWeight.w500,
                                    color: Color(0xFF3B82F6),
                                  ),
                                ),
                                const SizedBox(height: 8),
                                Consumer<CategoryProvider>(
                                  builder: (context, categoryProvider, child) {
                                    // 카테고리가 없을 때 메시지 표시
                                    if (categoryProvider.categories.isEmpty) {
                                      return InkWell(
                                        onTap: () {
                                          // 서비스명 분석 후 카테고리 자동 선택
                                          _autoSelectCategory();
                                        },
                                        child: Container(
                                          width: double.infinity,
                                          padding: const EdgeInsets.symmetric(
                                            vertical: 16,
                                            horizontal: 16,
                                          ),
                                          decoration: BoxDecoration(
                                            border: Border.all(
                                              color:
                                                  Colors.grey.withValues(alpha: 0.2),
                                            ),
                                            borderRadius:
                                                BorderRadius.circular(12),
                                            color: Colors.white,
                                          ),
                                          child: Row(
                                            children: [
                                              const Icon(
                                                Icons.category_rounded,
                                                color: Color(0xFF3B82F6),
                                              ),
                                              const SizedBox(width: 12),
                                              const Expanded(
                                                child: Text(
                                                  '카테고리 자동 설정',
                                                  style: TextStyle(
                                                    color: Color(0xFF1E293B),
                                                    fontSize: 16,
                                                    fontWeight: FontWeight.w500,
                                                  ),
                                                ),
                                              ),
                                              const Icon(
                                                Icons.sync,
                                                color: Color(0xFF3B82F6),
                                              ),
                                            ],
                                          ),
                                        ),
                                      );
                                    }

                                    // 카테고리 드롭다운 표시
                                    return DropdownButtonFormField<String>(
                                      value: _selectedCategoryId,
                                      focusNode: _categoryFocus,
                                      onTap: () => setState(
                                          () => _currentEditingField = 5),
                                      onChanged: (value) {
                                        setState(() {
                                          _selectedCategoryId = value;
                                          _currentEditingField = -1;
                                          _categoryFocus.unfocus();
                                        });
                                      },
                                      icon: const Icon(
                                        Icons.arrow_drop_down_circle_outlined,
                                        color: Color(0xFF3B82F6),
                                      ),
                                      decoration: InputDecoration(
                                        filled: true,
                                        fillColor: Colors.white,
                                        contentPadding:
                                            const EdgeInsets.symmetric(
                                                vertical: 16, horizontal: 20),
                                        border: OutlineInputBorder(
                                          borderRadius:
                                              BorderRadius.circular(12),
                                          borderSide: BorderSide(
                                            color: Colors.grey.withValues(alpha: 0.2),
                                          ),
                                        ),
                                        focusedBorder: OutlineInputBorder(
                                          borderRadius:
                                              BorderRadius.circular(12),
                                          borderSide: const BorderSide(
                                            color: Color(0xFF3B82F6),
                                            width: 2,
                                          ),
                                        ),
                                      ),
                                      style: const TextStyle(
                                        color: Colors.black87,
                                        fontSize: 16,
                                        fontWeight: FontWeight.w500,
                                      ),
                                      hint: const Text(
                                        '카테고리 선택',
                                        style: TextStyle(
                                          color: Colors.grey,
                                          fontSize: 16,
                                        ),
                                      ),
                                      isExpanded: true,
                                      items: [
                                        DropdownMenuItem<String>(
                                          value: null,
                                          child: const Text(
                                            '카테고리 없음',
                                            style: TextStyle(
                                              fontSize: 16,
                                              fontWeight: FontWeight.w500,
                                              color: Colors.grey,
                                            ),
                                          ),
                                        ),
                                        ...categoryProvider.categories
                                            .map((category) {
                                          return DropdownMenuItem<String>(
                                            value: category.id,
                                            child: Text(
                                              category.name,
                                              style: const TextStyle(
                                                fontSize: 16,
                                                fontWeight: FontWeight.w500,
                                                color: Colors.black87,
                                              ),
                                            ),
                                          );
                                        }).toList(),
                                      ],
                                    );
                                  },
                                ),
                              ],
                            ),
                          ),
                          
                          // 이벤트 설정 섹션
                          Container(
                            margin: const EdgeInsets.only(bottom: 20),
                            padding: const EdgeInsets.all(16),
                            decoration: BoxDecoration(
                              color: Colors.white,
                              borderRadius: BorderRadius.circular(16),
                              border: Border.all(
                                color: _isEventActive 
                                    ? const Color(0xFF3B82F6) 
                                    : Colors.grey.withValues(alpha: 0.2),
                                width: _isEventActive ? 2 : 1,
                              ),
                            ),
                            child: Column(
                              crossAxisAlignment: CrossAxisAlignment.start,
                              children: [
                                Row(
                                  children: [
                                    Checkbox(
                                      value: _isEventActive,
                                      onChanged: (value) {
                                        setState(() {
                                          _isEventActive = value ?? false;
                                          if (!_isEventActive) {
                                            // 이벤트 비활성화 시 관련 데이터 초기화
                                            _eventStartDate = DateTime.now();  // 오늘로 재설정
                                            _eventEndDate = DateTime.now().add(const Duration(days: 30));  // 30일 후로 재설정
                                            _eventPriceController.clear();
                                          } else {
                                            // 이벤트 활성화 시 날짜가 null이면 기본값 설정
                                            _eventStartDate ??= DateTime.now();
                                            _eventEndDate ??= DateTime.now().add(const Duration(days: 30));
                                          }
                                        });
                                      },
                                      activeColor: const Color(0xFF3B82F6),
                                    ),
                                    const Text(
                                      '이벤트/할인 설정',
                                      style: TextStyle(
                                        fontSize: 16,
                                        fontWeight: FontWeight.w600,
                                        color: Color(0xFF1E293B),
                                      ),
                                    ),
                                    const SizedBox(width: 8),
                                    Icon(
                                      Icons.local_offer,
                                      size: 20,
                                      color: _isEventActive 
                                          ? const Color(0xFF3B82F6)
                                          : Colors.grey,
                                    ),
                                  ],
                                ),
                                
                                // 이벤트 활성화 시 추가 필드 표시
                                AnimatedContainer(
                                  duration: const Duration(milliseconds: 300),
                                  height: _isEventActive ? null : 0,
                                  child: AnimatedOpacity(
                                    duration: const Duration(milliseconds: 300),
                                    opacity: _isEventActive ? 1.0 : 0.0,
                                    child: Column(
                                      children: [
                                        const SizedBox(height: 16),
                                        
                                        // 이벤트 기간 설정
                                        Row(
                                          children: [
                                            // 시작일
                                            Expanded(
                                              child: InkWell(
                                                onTap: () async {
                                                  final DateTime? picked = await showDatePicker(
                                                    context: context,
                                                    initialDate: _eventStartDate ?? DateTime.now(),
                                                    firstDate: DateTime.now().subtract(const Duration(days: 365)),
                                                    lastDate: DateTime.now().add(const Duration(days: 365 * 2)),
                                                    builder: (BuildContext context, Widget? child) {
                                                      return Theme(
                                                        data: ThemeData.light().copyWith(
                                                          colorScheme: ColorScheme.light(
                                                            primary: const Color(0xFF3B82F6),
                                                            onPrimary: Colors.white,
                                                            surface: Colors.white,
                                                            onSurface: Colors.black,
                                                          ),
                                                        ),
                                                        child: child!,
                                                      );
                                                    },
                                                  );
                                                  if (picked != null) {
                                                    setState(() {
                                                      _eventStartDate = picked;
                                                    });
                                                  }
                                                },
                                                borderRadius: BorderRadius.circular(12),
                                                child: Container(
                                                  padding: const EdgeInsets.all(12),
                                                  decoration: BoxDecoration(
                                                    border: Border.all(color: Colors.grey.withValues(alpha: 0.3)),
                                                    borderRadius: BorderRadius.circular(12),
                                                  ),
                                                  child: Column(
                                                    crossAxisAlignment: CrossAxisAlignment.start,
                                                    children: [
                                                      const Text(
                                                        '시작일',
                                                        style: TextStyle(
                                                          fontSize: 12,
                                                          color: Colors.grey,
                                                        ),
                                                      ),
                                                      const SizedBox(height: 4),
                                                      Text(
                                                        _eventStartDate == null
                                                            ? '선택'
                                                            : DateFormat('MM/dd').format(_eventStartDate!),
                                                        style: const TextStyle(
                                                          fontSize: 14,
                                                          fontWeight: FontWeight.w500,
                                                        ),
                                                      ),
                                                    ],
                                                  ),
                                                ),
                                              ),
                                            ),
                                            const SizedBox(width: 8),
                                            const Icon(Icons.arrow_forward, color: Colors.grey),
                                            const SizedBox(width: 8),
                                            // 종료일
                                            Expanded(
                                              child: InkWell(
                                                onTap: () async {
                                                  final DateTime? picked = await showDatePicker(
                                                    context: context,
                                                    initialDate: _eventEndDate ?? DateTime.now().add(const Duration(days: 30)),
                                                    firstDate: _eventStartDate ?? DateTime.now(),
                                                    lastDate: DateTime.now().add(const Duration(days: 365 * 2)),
                                                    builder: (BuildContext context, Widget? child) {
                                                      return Theme(
                                                        data: ThemeData.light().copyWith(
                                                          colorScheme: ColorScheme.light(
                                                            primary: const Color(0xFF3B82F6),
                                                            onPrimary: Colors.white,
                                                            surface: Colors.white,
                                                            onSurface: Colors.black,
                                                          ),
                                                        ),
                                                        child: child!,
                                                      );
                                                    },
                                                  );
                                                  if (picked != null) {
                                                    setState(() {
                                                      _eventEndDate = picked;
                                                    });
                                                  }
                                                },
                                                borderRadius: BorderRadius.circular(12),
                                                child: Container(
                                                  padding: const EdgeInsets.all(12),
                                                  decoration: BoxDecoration(
                                                    border: Border.all(color: Colors.grey.withValues(alpha: 0.3)),
                                                    borderRadius: BorderRadius.circular(12),
                                                  ),
                                                  child: Column(
                                                    crossAxisAlignment: CrossAxisAlignment.start,
                                                    children: [
                                                      const Text(
                                                        '종료일',
                                                        style: TextStyle(
                                                          fontSize: 12,
                                                          color: Colors.grey,
                                                        ),
                                                      ),
                                                      const SizedBox(height: 4),
                                                      Text(
                                                        _eventEndDate == null
                                                            ? '선택'
                                                            : DateFormat('MM/dd').format(_eventEndDate!),
                                                        style: const TextStyle(
                                                          fontSize: 14,
                                                          fontWeight: FontWeight.w500,
                                                        ),
                                                      ),
                                                    ],
                                                  ),
                                                ),
                                              ),
                                            ),
                                          ],
                                        ),
                                        
                                        const SizedBox(height: 16),
                                        
                                        // 이벤트 가격 입력
                                        Column(
                                          crossAxisAlignment: CrossAxisAlignment.start,
                                          children: [
                                            const Text(
                                              '이벤트 가격',
                                              style: TextStyle(
                                                fontSize: 14,
                                                fontWeight: FontWeight.w500,
                                                color: Color(0xFF3B82F6),
                                              ),
                                            ),
                                            const SizedBox(height: 8),
                                            TextFormField(
                                              controller: _eventPriceController,
                                              keyboardType: const TextInputType.numberWithOptions(decimal: true),
                                              inputFormatters: [
                                                FilteringTextInputFormatter.allow(RegExp(r'[\d,.]')),
                                              ],
                                              decoration: InputDecoration(
                                                hintText: '할인된 가격을 입력하세요',
                                                prefixText: _currency == 'KRW' ? '₩ ' : '\$ ',
                                                filled: true,
                                                fillColor: Colors.white,
                                                contentPadding: const EdgeInsets.symmetric(
                                                  vertical: 16,
                                                  horizontal: 16,
                                                ),
                                                border: OutlineInputBorder(
                                                  borderRadius: BorderRadius.circular(12),
                                                  borderSide: BorderSide(
                                                    color: Colors.grey.withValues(alpha: 0.2),
                                                  ),
                                                ),
                                                focusedBorder: OutlineInputBorder(
                                                  borderRadius: BorderRadius.circular(12),
                                                  borderSide: const BorderSide(
                                                    color: Color(0xFF3B82F6),
                                                    width: 2,
                                                  ),
                                                ),
                                              ),
                                              onChanged: (value) {
                                                // 콤마 자동 추가
                                                if (value.isNotEmpty && !value.contains('.')) {
                                                  final number = int.tryParse(value.replaceAll(',', ''));
                                                  if (number != null) {
                                                    final formatted = NumberFormat('#,###').format(number);
                                                    if (formatted != value) {
                                                      _eventPriceController.value = TextEditingValue(
                                                        text: formatted,
                                                        selection: TextSelection.collapsed(
                                                          offset: formatted.length,
                                                        ),
                                                      );
                                                    }
                                                  }
                                                }
                                              },
                                            ),
                                          ],
                                        ),
                                      ],
                                    ),
                                  ),
                                ),
                              ],
                            ),
                          ),
                        ],
                      ),
                    ),
                  ),
                ),
              ),

              const SizedBox(height: 32),

              // 저장 버튼
              FadeTransition(
                opacity: Tween<double>(begin: 0.0, end: 1.0).animate(
                  CurvedAnimation(
                    parent: _animationController,
                    curve: const Interval(0.6, 1.0, curve: Curves.easeIn),
                  ),
                ),
                child: SlideTransition(
                  position: Tween<Offset>(
                    begin: const Offset(0.0, 0.6),
                    end: Offset.zero,
                  ).animate(CurvedAnimation(
                    parent: _animationController,
                    curve: const Interval(0.6, 1.0, curve: Curves.easeOutCubic),
                  )),
                  child: MouseRegion(
                    onEnter: (_) => setState(() => _isSaveHovered = true),
                    onExit: (_) => setState(() => _isSaveHovered = false),
                    child: AnimatedContainer(
                      duration: const Duration(milliseconds: 200),
                      width: double.infinity,
                      height: 60,
                      transform: _isSaveHovered
                          ? (Matrix4.identity()..scale(1.02))
                          : Matrix4.identity(),
                      child: ElevatedButton(
                        onPressed: _isLoading ? null : _saveSubscription,
                        style: ElevatedButton.styleFrom(
                          backgroundColor: const Color(0xFF3B82F6),
                          foregroundColor: Colors.white,
                          disabledBackgroundColor: Colors.grey.withValues(alpha: 0.3),
                          disabledForegroundColor:
                              Colors.white.withValues(alpha: 0.5),
                          shape: RoundedRectangleBorder(
                            borderRadius: BorderRadius.circular(16),
                          ),
                          padding: const EdgeInsets.symmetric(vertical: 16),
                          elevation: _isSaveHovered ? 8 : 4,
                          shadowColor: const Color(0xFF3B82F6).withValues(alpha: 0.5),
                        ),
                        child: _isLoading
                            ? const SizedBox(
                                width: 24,
                                height: 24,
                                child: CircularProgressIndicator(
                                  strokeWidth: 2,
                                  valueColor: AlwaysStoppedAnimation<Color>(
                                      Colors.white),
                                ),
                              )
                            : Row(
                                mainAxisAlignment: MainAxisAlignment.center,
                                children: [
                                  Icon(
                                    Icons.add_circle_outline,
                                    color: Colors.white,
                                    size: _isSaveHovered ? 24 : 20,
                                  ),
                                  const SizedBox(width: 8),
                                  const Text(
                                    '구독 추가하기',
                                    style: TextStyle(
                                      fontSize: 18,
                                      fontWeight: FontWeight.w600,
                                      color: Colors.white,
                                    ),
                                  ),
                                ],
                              ),
                      ),
                    ),
                  ),
                ),
              ),

              const SizedBox(height: 80),
            ],
          ),
        ),
      ),
    );
  }
}