import 'package:flutter/material.dart';
import '../models/divination_instructions.dart';

class DivinationInstructionModal extends StatelessWidget {
  final DivinationSystemInstruction instruction;

  const DivinationInstructionModal({super.key, required this.instruction});

  static void show(BuildContext context, String systemId) {
    final inst = DivinationInstructionsRepository.get(systemId);
    showModalBottomSheet(
      context: context,
      isScrollControlled: true,
      backgroundColor: const Color(0xFF0F1222),
      shape: const RoundedRectangleBorder(
        borderRadius: BorderRadius.vertical(top: Radius.circular(24)),
      ),
      builder: (ctx) => DivinationInstructionModal(instruction: inst),
    );
  }

  @override
  Widget build(BuildContext context) {
    return DraggableScrollableSheet(
      initialChildSize: 0.85,
      minChildSize: 0.5,
      maxChildSize: 0.95,
      expand: false,
      builder: (ctx, scroll) {
        return Container(
          padding: const EdgeInsets.fromLTRB(20, 12, 20, 24),
          child: ListView(
            controller: scroll,
            children: [
              Center(
                child: Container(
                  width: 44,
                  height: 4,
                  decoration: BoxDecoration(
                    color: Colors.white24,
                    borderRadius: BorderRadius.circular(2),
                  ),
                ),
              ),
              const SizedBox(height: 14),
              Row(
                children: [
                  Container(
                    width: 44,
                    height: 44,
                    alignment: Alignment.center,
                    decoration: BoxDecoration(
                      color: const Color(0xFF232742),
                      borderRadius: BorderRadius.circular(12),
                      border: Border.all(color: const Color(0xFFFFD54F).withValues(alpha: 0.5)),
                    ),
                    child: Text(instruction.icon, style: const TextStyle(fontSize: 22)),
                  ),
                  const SizedBox(width: 12),
                  Expanded(
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Text(
                          instruction.title,
                          style: const TextStyle(color: Color(0xFFFFF9C4), fontSize: 17, fontWeight: FontWeight.bold),
                        ),
                        const Text(
                          'Каноническое руководство и методы гадания',
                          style: TextStyle(color: Color(0xFF8C93B8), fontSize: 11),
                        ),
                      ],
                    ),
                  ),
                  IconButton(
                    icon: const Icon(Icons.close_rounded, color: Color(0xFF90A4AE)),
                    onPressed: () => Navigator.pop(ctx),
                  ),
                ],
              ),
              const SizedBox(height: 16),
              const Divider(color: Color(0xFF2A2D4A)),
              const SizedBox(height: 12),

              // Essence
              _buildSection(
                title: 'СУТЬ СИСТЕМЫ И ИСТОРИЯ',
                icon: Icons.auto_stories_rounded,
                content: instruction.historyAndEssence,
                accentColor: const Color(0xFF80DEEA),
              ),
              const SizedBox(height: 16),

              // Physical dice
              _buildSection(
                title: 'БРОСОК ФИЗИЧЕСКИХ КОСТЕЙ НА СТОЛЕ',
                icon: Icons.casino_rounded,
                content: instruction.physicalDiceMethod,
                accentColor: const Color(0xFFFFD54F),
              ),
              const SizedBox(height: 16),

              // Direct input
              _buildSection(
                title: 'РУЧНОЙ ВВОД СО СТОЛА В ПРИЛОЖЕНИЕ',
                icon: Icons.touch_app_rounded,
                content: instruction.directInputMethod,
                accentColor: const Color(0xFF81C784),
              ),
              const SizedBox(height: 16),

              // Interpretation
              _buildSection(
                title: 'ПРАВИЛА И СЕКРЕТЫ ТОЛКОВАНИЯ',
                icon: Icons.psychology_rounded,
                content: instruction.interpretationGuide,
                accentColor: const Color(0xFFBA68C8),
              ),
              const SizedBox(height: 16),

              // Sacred rules
              Container(
                padding: const EdgeInsets.all(16),
                decoration: BoxDecoration(
                  color: const Color(0xFF1E1738),
                  borderRadius: BorderRadius.circular(16),
                  border: Border.all(color: const Color(0xFFFFD54F).withValues(alpha: 0.3)),
                ),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    const Row(
                      children: [
                        Icon(Icons.shield_moon_rounded, color: Color(0xFFFFD54F), size: 18),
                        SizedBox(width: 8),
                        Text(
                          'САДЕЙСТВИЕ И САХРАННОСТЬ ПРАКТИКИ',
                          style: TextStyle(
                            color: Color(0xFFFFD54F),
                            fontSize: 11,
                            fontWeight: FontWeight.w900,
                            letterSpacing: 0.8,
                          ),
                        ),
                      ],
                    ),
                    const SizedBox(height: 10),
                    for (final r in instruction.sacredRules)
                      Padding(
                        padding: const EdgeInsets.symmetric(vertical: 3),
                        child: Row(
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: [
                            const Text('• ', style: TextStyle(color: Color(0xFFFFD54F), fontWeight: FontWeight.bold)),
                            Expanded(
                              child: Text(
                                r,
                                style: const TextStyle(color: Color(0xFFECEFF1), fontSize: 13, height: 1.4),
                              ),
                            ),
                          ],
                        ),
                      ),
                  ],
                ),
              ),
            ],
          ),
        );
      },
    );
  }

  Widget _buildSection({
    required String title,
    required IconData icon,
    required String content,
    required Color accentColor,
  }) {
    return Container(
      padding: const EdgeInsets.all(16),
      decoration: BoxDecoration(
        color: const Color(0xFF151829),
        borderRadius: BorderRadius.circular(16),
        border: Border.all(color: const Color(0xFF2A2D4A)),
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Row(
            children: [
              Icon(icon, color: accentColor, size: 16),
              const SizedBox(width: 8),
              Text(
                title,
                style: TextStyle(
                  color: accentColor,
                  fontSize: 11,
                  fontWeight: FontWeight.w900,
                  letterSpacing: 0.8,
                ),
              ),
            ],
          ),
          const SizedBox(height: 10),
          Text(
            content,
            style: const TextStyle(
              color: Color(0xFFD1D5DB),
              fontSize: 13.5,
              height: 1.5,
            ),
          ),
        ],
      ),
    );
  }
}