import 'package:flutter/material.dart';

class ControlScreen extends StatefulWidget {
  const ControlScreen({super.key});

  @override
  State<ControlScreen> createState() => _ControlScreenState();
}

class _ControlScreenState extends State<ControlScreen> {
  final Color _mainBlueColor = const Color(0xFF002FA7);
  final Color _mainTextColor = const Color(0xFF1C1C1E);
  final Color _subTextColor = const Color(0xFF6A717B);
  final Color _pageBackgroundColor = const Color(0xFFF5F7F9);
  final Color _cardBackgroundColor = Colors.white;
  final Color _accentContainerColor = const Color(0xFFF0F2F5);
  final Color _warningColor = Colors.redAccent;

  static const BoxShadow _cleanShadow = BoxShadow(
    color: Color.fromRGBO(0, 0, 0, 0.07),
    blurRadius: 8,
    offset: Offset(0, 4),
    spreadRadius: 0,
  );

  bool _isSecurityLocked = true;
  int _selectedDoorIndex = 0;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: _pageBackgroundColor,
      appBar: AppBar(
        title: Text(
          '제어 센터',
          style: TextStyle(
            fontWeight: FontWeight.w700,
            fontSize: 18,
            letterSpacing: 0.5,
            color: _mainTextColor,
          ),
        ),
        backgroundColor: _pageBackgroundColor,
        scrolledUnderElevation: 0,
        elevation: 0,
        centerTitle: false,
      ),
      body: SingleChildScrollView(
        padding: const EdgeInsets.symmetric(horizontal: 16.0, vertical: 16.0),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            _buildSystemStatusCard(),
            const SizedBox(height: 16),
            _buildDoorControlCard(),
            const SizedBox(height: 16),
            _buildControlResultsCard(),
            const SizedBox(height: 16),
            _buildAlertLogsCard(),
            const SizedBox(height: 16),
            _buildSecuritySwitchCard(),
            const SizedBox(height: 24),
          ],
        ),
      ),
    );
  }

  Widget _buildSystemStatusCard() {
    const double cardContentHeight = 150.0;

    return Container(
      padding: const EdgeInsets.all(16),
      decoration: BoxDecoration(
        color: _cardBackgroundColor,
        borderRadius: BorderRadius.circular(8),
        boxShadow: [_cleanShadow],
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            '보관함 상태',
            style: TextStyle(
              color: _mainTextColor,
              fontSize: 14,
              fontWeight: FontWeight.w600,
            ),
          ),
          const SizedBox(height: 16),
          SizedBox(
            height: cardContentHeight,
            child: Row(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Container(
                  width: 130,
                  height: double.infinity,
                  padding: const EdgeInsets.all(20.0),
                  decoration: BoxDecoration(
                    color: _accentContainerColor,
                    borderRadius: BorderRadius.circular(8),
                  ),
                  child: Image.asset(
                    'assets/images/top.png',
                    fit: BoxFit.contain,
                  ),
                ),
                const SizedBox(width: 16),
                Expanded(
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      Text(
                        'NOW',
                        style: TextStyle(
                          color: _subTextColor,
                          fontSize: 11,
                          fontWeight: FontWeight.bold,
                        ),
                      ),
                      const SizedBox(height: 8),
                      Expanded(
                        child: _buildStatusButton(
                          text: '사용 중',
                          textColor: _mainBlueColor,
                          bgColor: _accentContainerColor,
                        ),
                      ),
                      const SizedBox(height: 10),
                      Expanded(
                        child: _buildStatusButton(
                          text: '센서 경고 : 문 열림',
                          textColor: _warningColor,
                          bgColor: _accentContainerColor,
                          isError: true,
                        ),
                      ),
                    ],
                  ),
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }

  Widget _buildStatusButton({
    required String text,
    required Color textColor,
    required Color bgColor,
    bool isError = false,
  }) {
    return Container(
      width: double.infinity,
      alignment: Alignment.center,
      decoration: BoxDecoration(
        color: bgColor,
        borderRadius: BorderRadius.circular(8),
      ),
      child: Text(
        text,
        textAlign: TextAlign.center,
        style: TextStyle(
          color: textColor,
          fontWeight: FontWeight.bold,
          fontSize: isError ? 12 : 14,
          height: 1.2,
        ),
      ),
    );
  }

  Widget _buildDoorControlCard() {
    return Container(
      padding: const EdgeInsets.all(16),
      decoration: BoxDecoration(
        color: _cardBackgroundColor,
        borderRadius: BorderRadius.circular(8),
        boxShadow: [_cleanShadow],
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            '보관함 문 제어',
            style: TextStyle(
              color: _mainTextColor,
              fontSize: 14,
              fontWeight: FontWeight.w600,
            ),
          ),
          const SizedBox(height: 16),
          Row(
            children: [
              _buildDoorButton(0, 'OPEN'),
              const SizedBox(width: 12),
              _buildDoorButton(1, 'CLOSE'),
              const SizedBox(width: 12),
              _buildDoorButton(2, 'LOCK'),
            ],
          ),
        ],
      ),
    );
  }

  Widget _buildDoorButton(int index, String text) {
    final bool isSelected = _selectedDoorIndex == index;

    return Expanded(
      child: GestureDetector(
        onTap: () {
          setState(() {
            _selectedDoorIndex = index;
          });
        },
        child: Container(
          height: 80,
          decoration: BoxDecoration(
            color: isSelected ? _mainBlueColor : _accentContainerColor,
            borderRadius: BorderRadius.circular(8),
          ),
          child: Center(
            child: Text(
              text,
              style: TextStyle(
                color: isSelected ? Colors.white : _mainTextColor,
                fontWeight: FontWeight.bold,
                fontSize: 18,
              ),
            ),
          ),
        ),
      ),
    );
  }

  Widget _buildControlResultsCard() {
    return Container(
      padding: const EdgeInsets.all(16),
      decoration: BoxDecoration(
        color: _cardBackgroundColor,
        borderRadius: BorderRadius.circular(8),
        boxShadow: [_cleanShadow],
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            '실시간 상태',
            style: TextStyle(
              color: _mainTextColor,
              fontSize: 14,
              fontWeight: FontWeight.w600,
            ),
          ),
          const SizedBox(height: 16),
          Container(
            padding: const EdgeInsets.all(12),
            decoration: BoxDecoration(
              color: _accentContainerColor,
              borderRadius: BorderRadius.circular(6),
            ),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Row(
                  children: [
                    Icon(Icons.warning_amber_rounded,
                        color: _warningColor, size: 16),
                    const SizedBox(width: 8),
                    Expanded(
                      child: RichText(
                        text: TextSpan(
                          children: [
                            TextSpan(
                              text: '센서 경고 : ',
                              style: TextStyle(
                                color: _warningColor,
                                fontWeight: FontWeight.bold,
                                fontSize: 12,
                              ),
                            ),
                            TextSpan(
                              text: '문 열림',
                              style: TextStyle(
                                color: _warningColor,
                                fontSize: 12,
                                fontWeight: FontWeight.bold,
                              ),
                            ),
                          ],
                        ),
                      ),
                    ),
                  ],
                ),
                const SizedBox(height: 12),
                ClipRRect(
                  borderRadius: BorderRadius.circular(4),
                  child: LinearProgressIndicator(
                    value: 0.6,
                    backgroundColor: _pageBackgroundColor,
                    valueColor: AlwaysStoppedAnimation<Color>(_warningColor),
                    minHeight: 6,
                  ),
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }

  Widget _buildAlertLogsCard() {
    return Container(
      padding: const EdgeInsets.all(16),
      decoration: BoxDecoration(
        color: _cardBackgroundColor,
        borderRadius: BorderRadius.circular(8),
        boxShadow: [_cleanShadow],
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            '시스템 기록',
            style: TextStyle(
              color: _mainTextColor,
              fontSize: 14,
              fontWeight: FontWeight.w600,
            ),
          ),
          const SizedBox(height: 16),
          Container(
            padding: const EdgeInsets.all(12),
            decoration: BoxDecoration(
              color: _accentContainerColor,
              borderRadius: BorderRadius.circular(6),
            ),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Row(
                  children: [
                    Icon(Icons.warning_amber_rounded,
                        color: _warningColor, size: 14),
                    const SizedBox(width: 8),
                    Text(
                      '1:50 PM - 센서 경고 : 문 열림',
                      style: TextStyle(
                        color: _mainTextColor,
                        fontSize: 12,
                        fontWeight: FontWeight.bold,
                      ),
                    ),
                  ],
                ),
                const SizedBox(height: 8),
                Row(
                  children: [
                    Icon(Icons.bookmark, color: _subTextColor, size: 14),
                    const SizedBox(width: 8),
                    Text(
                      '2:02 PM - UV LED 작동',
                      style: TextStyle(
                        color: _mainTextColor,
                        fontSize: 12,
                        fontWeight: FontWeight.bold,
                      ),
                    ),
                  ],
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }

  Widget _buildSecuritySwitchCard() {
    return Container(
      padding: const EdgeInsets.all(16),
      decoration: BoxDecoration(
        color: _cardBackgroundColor,
        borderRadius: BorderRadius.circular(8),
        boxShadow: [_cleanShadow],
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            '도난 방지 잠금',
            style: TextStyle(
              color: _mainTextColor,
              fontSize: 14,
              fontWeight: FontWeight.w600,
            ),
          ),
          const SizedBox(height: 16),
          Container(
            padding:
            const EdgeInsets.symmetric(horizontal: 22, vertical: 16),
            decoration: BoxDecoration(
              color: _accentContainerColor,
              borderRadius: BorderRadius.circular(6),
            ),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                Text(
                  _isSecurityLocked
                      ? 'ON'
                      : 'OFF',
                  style: TextStyle(
                    color: _mainTextColor,
                    fontSize: 16,
                    fontWeight: FontWeight.bold,
                  ),
                ),
                Transform.scale(
                  scale: 1.1,
                  child: Switch(
                    value: _isSecurityLocked,
                    onChanged: (val) {
                      setState(() {
                        _isSecurityLocked = val;
                      });
                    },
                    activeThumbColor: _mainBlueColor,
                    activeTrackColor: _mainBlueColor.withOpacity(0.5),
                    inactiveThumbColor: Colors.white,
                    inactiveTrackColor: _accentContainerColor,
                  ),
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }
}