import 'package:flutter/material.dart';
import '../../../core/theme/halo_tokens.dart';

/// Floating expired banner shown above the chat input when the session
/// timer has hit zero but the session is still in `closing` grace.
///
/// Mirrors Figma `v3.jsx::HBChatExpiredBanner` (line 423): brand-pink
/// background, white text, `⏰` icon, "habis nih... mau lanjutin curhat
/// sama {name}?" copy, white `perpanjang` button.
class ChatExpiredBanner extends StatelessWidget {
  final String mitraName;
  final VoidCallback onExtend;

  const ChatExpiredBanner({
    super.key,
    required this.mitraName,
    required this.onExtend,
  });

  @override
  Widget build(BuildContext context) {
    return Container(
      margin: const EdgeInsets.fromLTRB(12, 0, 12, 8),
      padding: const EdgeInsets.symmetric(horizontal: 14, vertical: 10),
      decoration: BoxDecoration(
        color: HaloTokens.brand,
        borderRadius: BorderRadius.circular(12),
        boxShadow: [
          BoxShadow(
            color: HaloTokens.brand.withValues(alpha: 0.31),
            blurRadius: 16,
            offset: const Offset(0, 4),
          ),
        ],
      ),
      child: Row(
        children: [
          const Text('⏰', style: TextStyle(fontSize: 16)),
          const SizedBox(width: 10),
          Expanded(
            child: RichText(
              text: TextSpan(
                style: const TextStyle(
                  fontFamily: HaloTokens.fontBody,
                  fontSize: 12.5,
                  height: 1.4,
                  color: Colors.white,
                ),
                children: [
                  const TextSpan(
                    text: 'habis nih...',
                    style: TextStyle(fontWeight: FontWeight.w600),
                  ),
                  TextSpan(text: ' mau lanjutin curhat sama $mitraName?'),
                ],
              ),
            ),
          ),
          const SizedBox(width: 8),
          ElevatedButton(
            onPressed: onExtend,
            style: ElevatedButton.styleFrom(
              backgroundColor: Colors.white,
              foregroundColor: HaloTokens.brand,
              shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(999)),
              padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 6),
              minimumSize: const Size(0, 32),
              elevation: 0,
              textStyle: const TextStyle(
                fontFamily: HaloTokens.fontBody,
                fontSize: 11.5,
                fontWeight: FontWeight.w700,
              ),
            ),
            child: const Text('perpanjang'),
          ),
        ],
      ),
    );
  }
}
