import 'dart:ui';
import 'package:flutter/material.dart';
import 'package:intl/intl.dart';
import '../models/home_model.dart';
import 'outlined_text.dart';

class PersonWeightCard extends StatelessWidget {
  /// Alle Einträge einer Person, absteigend nach Datum sortiert.
  final String personName;
  final List<WeightModel> entries;
  final VoidCallback? onAddWeight;

  /// Wird aufgerufen wenn ein Verlaufseintrag oder der Header-Eintrag
  /// zum Bearbeiten angeklickt wird.
  final void Function(WeightModel entry)? onEditEntry;

  const PersonWeightCard({
    super.key,
    required this.personName,
    required this.entries,
    this.onAddWeight,
    this.onEditEntry,
  });

  @override
  Widget build(BuildContext context) {
    // Defensiv: sicher sortiert (neuestes zuerst)
    final sorted = [...entries]..sort((a, b) => b.date.compareTo(a.date));

    final current = sorted.first;
    final history = sorted.skip(1).toList();

    return ClipRRect(
      borderRadius: BorderRadius.circular(20),
      child: BackdropFilter(
        filter: ImageFilter.blur(sigmaX: 16, sigmaY: 16),
        child: Container(
          decoration: BoxDecoration(
            color: Colors.white.withValues(alpha: 0.07),
            borderRadius: BorderRadius.circular(20),
            border: Border.all(
              color: Colors.white.withValues(alpha: 0.15),
              width: 1,
            ),
          ),
          child: Column(
            mainAxisSize: MainAxisSize.min,
            crossAxisAlignment: CrossAxisAlignment.stretch,
            children: [
              // ── Header ──────────────────────────────────────────
              _CardHeader(
                current: current,
                name: personName,
                onAddWeight: onAddWeight,
                onEdit: onEditEntry != null
                    ? () => onEditEntry!(current)
                    : null,
              ),

              // ── Historische Einträge ─────────────────────────────
              if (history.isNotEmpty) ...[
                Padding(
                  padding: const EdgeInsets.symmetric(
                    horizontal: 16,
                    vertical: 6,
                  ),
                  child: Text(
                    'Verlauf',
                    style: TextStyle(
                      color: Colors.white.withValues(alpha: 0.45),
                      fontSize: 12,
                      letterSpacing: 1.2,
                      fontWeight: FontWeight.w600,
                    ),
                  ),
                ),
                ConstrainedBox(
                  constraints: const BoxConstraints(maxHeight: 220),
                  child: ListView.separated(
                    shrinkWrap: true,
                    padding: const EdgeInsets.only(
                      left: 12,
                      right: 12,
                      bottom: 12,
                    ),
                    itemCount: history.length,
                    separatorBuilder: (_, __) => Divider(
                      color: Colors.white.withValues(alpha: 0.08),
                      height: 1,
                    ),
                    itemBuilder: (context, i) => _HistoryRow(
                      entry: history[i],
                      onTap: onEditEntry != null
                          ? () => onEditEntry!(history[i])
                          : null,
                    ),
                  ),
                ),
              ] else ...[
                Padding(
                  padding: const EdgeInsets.fromLTRB(16, 0, 16, 16),
                  child: Text(
                    'Noch keine älteren Einträge.',
                    style: TextStyle(
                      color: Colors.white.withValues(alpha: 0.35),
                      fontSize: 13,
                    ),
                  ),
                ),
              ],
            ],
          ),
        ),
      ),
    );
  }
}

// ─────────────────────────────────────────────────────────────────────────────
// Header
// ─────────────────────────────────────────────────────────────────────────────

class _CardHeader extends StatelessWidget {
  final WeightModel current;
  final String name;
  final VoidCallback? onAddWeight;
  final VoidCallback? onEdit;

  const _CardHeader({
    required this.current,
    required this.name,
    this.onAddWeight,
    this.onEdit,
  });

  @override
  Widget build(BuildContext context) {
    final changeColor = current.weightChange < 0
        ? const Color(0xFF4FFFB0)
        : current.weightChange > 0
        ? const Color(0xFFFF6B6B)
        : Colors.white54;

    final changeIcon = current.weightChange < 0
        ? Icons.trending_down_rounded
        : current.weightChange > 0
        ? Icons.trending_up_rounded
        : Icons.remove_rounded;

    return Container(
      padding: const EdgeInsets.fromLTRB(16, 18, 16, 14),
      decoration: BoxDecoration(
        color: Colors.white.withValues(alpha: 0.05),
        borderRadius: const BorderRadius.vertical(top: Radius.circular(20)),
        border: Border(
          bottom: BorderSide(color: Colors.white.withValues(alpha: 0.1)),
        ),
      ),
      child: Row(
        crossAxisAlignment: CrossAxisAlignment.center,
        children: [
          // Avatar
          CircleAvatar(
            radius: 26,
            backgroundColor: Colors.white.withValues(alpha: 0.12),
            child: OutlinedText(
              name[0].toUpperCase(),
              style: const TextStyle(fontSize: 22, fontWeight: FontWeight.w900),
              fillColor: Colors.white,
              strokeColor: Colors.black,
              strokeWidth: 1.5,
            ),
          ),
          const SizedBox(width: 14),
          // Name + Datum
          Expanded(
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                OutlinedText(
                  name,
                  style: const TextStyle(
                    fontSize: 22,
                    fontWeight: FontWeight.w900,
                    letterSpacing: 0.4,
                  ),
                  fillColor: Colors.white,
                  strokeColor: Colors.black,
                  strokeWidth: 2,
                ),
                const SizedBox(height: 2),
                Text(
                  'Zuletzt: ${DateFormat('dd.MM.yyyy').format(current.date)}',
                  style: TextStyle(
                    color: Colors.white.withValues(alpha: 0.5),
                    fontSize: 12,
                    letterSpacing: 0.3,
                  ),
                ),
              ],
            ),
          ),
          // Add-Button
          if (onAddWeight != null) _GlassAddButton(onPressed: onAddWeight!),
          if (onEdit != null) ...[
            const SizedBox(width: 6),
            _GlassEditButton(onPressed: onEdit!),
          ],
          const SizedBox(width: 8),
          // Aktuelles Gewicht + Änderung
          Column(
            crossAxisAlignment: CrossAxisAlignment.end,
            children: [
              OutlinedText(
                '${current.weight.toStringAsFixed(1)} kg',
                style: const TextStyle(
                  fontSize: 26,
                  fontWeight: FontWeight.w900,
                  letterSpacing: 0.2,
                ),
                fillColor: Colors.white,
                strokeColor: Colors.black,
                strokeWidth: 2,
              ),
              const SizedBox(height: 4),
              Row(
                mainAxisSize: MainAxisSize.min,
                children: [
                  Icon(changeIcon, color: changeColor, size: 16),
                  const SizedBox(width: 3),
                  Text(
                    current.weightChange == 0
                        ? '±0.0 kg'
                        : '${current.weightChange > 0 ? '+' : ''}${current.weightChange.toStringAsFixed(1)} kg',
                    style: TextStyle(
                      color: changeColor,
                      fontSize: 13,
                      fontWeight: FontWeight.w600,
                    ),
                  ),
                ],
              ),
            ],
          ),
        ],
      ),
    );
  }
}

// ─────────────────────────────────────────────────────────────────────────────
// Verlaufs-Zeile
// ─────────────────────────────────────────────────────────────────────────────

class _HistoryRow extends StatelessWidget {
  final WeightModel entry;
  final VoidCallback? onTap;

  const _HistoryRow({required this.entry, this.onTap});

  @override
  Widget build(BuildContext context) {
    final changeColor = entry.weightChange < 0
        ? const Color(0xFF4FFFB0)
        : entry.weightChange > 0
        ? const Color(0xFFFF6B6B)
        : Colors.white54;

    return InkWell(
      onTap: onTap,
      borderRadius: BorderRadius.circular(8),
      child: Padding(
        padding: const EdgeInsets.symmetric(vertical: 11, horizontal: 6),
        child: Row(
          children: [
            // Datum
            Expanded(
              flex: 3,
              child: Text(
                DateFormat('dd.MM.yyyy').format(entry.date),
                style: TextStyle(
                  color: Colors.white.withValues(alpha: 0.6),
                  fontSize: 14,
                ),
              ),
            ),
            // Gewicht
            Expanded(
              flex: 2,
              child: Text(
                '${entry.weight.toStringAsFixed(1)} kg',
                textAlign: TextAlign.center,
                style: const TextStyle(
                  color: Colors.white,
                  fontSize: 14,
                  fontWeight: FontWeight.w600,
                ),
              ),
            ),
            // Änderung
            Expanded(
              flex: 2,
              child: Row(
                mainAxisAlignment: MainAxisAlignment.end,
                children: [
                  Icon(
                    entry.weightChange < 0
                        ? Icons.arrow_downward_rounded
                        : entry.weightChange > 0
                        ? Icons.arrow_upward_rounded
                        : Icons.remove_rounded,
                    color: changeColor,
                    size: 14,
                  ),
                  const SizedBox(width: 2),
                  Text(
                    entry.weightChange == 0
                        ? '±0.0'
                        : '${entry.weightChange > 0 ? '+' : ''}${entry.weightChange.toStringAsFixed(1)}',
                    style: TextStyle(
                      color: changeColor,
                      fontSize: 13,
                      fontWeight: FontWeight.w600,
                    ),
                  ),
                ],
              ),
            ),
            // Edit-Button – gut sichtbar auf Mobile
            if (onTap != null) ...[
              const SizedBox(width: 10),
              Container(
                padding: const EdgeInsets.symmetric(horizontal: 9, vertical: 6),
                decoration: BoxDecoration(
                  color: Colors.white.withValues(alpha: 0.12),
                  borderRadius: BorderRadius.circular(8),
                  border: Border.all(
                    color: Colors.white.withValues(alpha: 0.25),
                  ),
                ),
                child: const Icon(
                  Icons.edit_outlined,
                  size: 16,
                  color: Colors.white,
                ),
              ),
            ],
          ],
        ),
      ),
    );
  }
}

// ─────────────────────────────────────────────────────────────────────────────
// Glas-Add-Button (runder "+"-Button passend zum Karten-Header)
// ─────────────────────────────────────────────────────────────────────────────

/// Ein runder Bearbeiten-Button im Glas-Stil.
class _GlassEditButton extends StatelessWidget {
  final VoidCallback onPressed;

  const _GlassEditButton({required this.onPressed});

  @override
  Widget build(BuildContext context) {
    return Tooltip(
      message: 'Eintrag bearbeiten',
      child: InkWell(
        onTap: onPressed,
        borderRadius: BorderRadius.circular(50),
        child: ClipRRect(
          borderRadius: BorderRadius.circular(50),
          child: BackdropFilter(
            filter: ImageFilter.blur(sigmaX: 8, sigmaY: 8),
            child: Container(
              padding: const EdgeInsets.all(8),
              decoration: BoxDecoration(
                color: Colors.white.withValues(alpha: 0.10),
                shape: BoxShape.circle,
                border: Border.all(color: Colors.white.withValues(alpha: 0.25)),
              ),
              child: const Icon(
                Icons.edit_outlined,
                color: Colors.white,
                size: 18,
              ),
            ),
          ),
        ),
      ),
    );
  }
}

// ─────────────────────────────────────────────────────────────────────────────
// Glas-Add-Button
// ─────────────────────────────────────────────────────────────────────────────

class _GlassAddButton extends StatelessWidget {
  final VoidCallback onPressed;

  const _GlassAddButton({required this.onPressed});

  @override
  Widget build(BuildContext context) {
    return Tooltip(
      message: 'Gewicht hinzufügen',
      child: InkWell(
        onTap: onPressed,
        borderRadius: BorderRadius.circular(50),
        child: ClipRRect(
          borderRadius: BorderRadius.circular(50),
          child: BackdropFilter(
            filter: ImageFilter.blur(sigmaX: 8, sigmaY: 8),
            child: Container(
              padding: const EdgeInsets.all(8),
              decoration: BoxDecoration(
                color: Colors.white.withValues(alpha: 0.14),
                shape: BoxShape.circle,
                border: Border.all(color: Colors.white.withValues(alpha: 0.3)),
              ),
              child: const Icon(
                Icons.add_rounded,
                color: Colors.white,
                size: 20,
              ),
            ),
          ),
        ),
      ),
    );
  }
}