import 'dart:ui';
import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';

class NavBarItem {
  final String iconPath;
  final String label;

  NavBarItem({required this.iconPath, required this.label});
}

class Floatingnavbar extends StatelessWidget {
  final List<NavBarItem> items;
  final int selectedIndex;
  final ValueChanged<int> onTap;

  const Floatingnavbar({
    super.key,
    required this.items,
    required this.selectedIndex,
    required this.onTap,
  });

  @override
  Widget build(BuildContext context) {
    final bottomPadding = MediaQuery.of(context).padding.bottom;

    return ClipRRect(
    
      borderRadius: BorderRadius.circular(45),

      child: Container(
        color: Colors.transparent,
        child: Container(
          height: 70,
          margin: EdgeInsets.only(
            bottom: 10 + bottomPadding,
            left: 28,
            right: 28,
          ),

          /// ⭐ Restored white container (same as your original design)
          decoration: BoxDecoration(
            color: const Color(0xFFE9E9E9), // White navbar restored
            borderRadius: BorderRadius.circular(45),
          ),

          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceEvenly,
            children:
                items.asMap().entries.map((entry) {
                  final index = entry.key;
                  final item = entry.value;
                  final isSelected = selectedIndex == index;

                  return _NavBarItemTile(
                    item: item,
                    isSelected: isSelected,
                    onTap: () => onTap(index),
                  );
                }).toList(),
          ),
        ),
      ),
    );
  }
}

class _NavBarItemTile extends StatelessWidget {
  final NavBarItem item;
  final bool isSelected;
  final VoidCallback onTap;

  const _NavBarItemTile({
    Key? key,
    required this.item,
    required this.isSelected,
    required this.onTap,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Expanded(
      child: InkWell(
        onTap: onTap,
        borderRadius: BorderRadius.circular(45),
        child: Padding(
          padding: const EdgeInsets.symmetric(horizontal: 5, vertical: 5),
          child: Column(
            mainAxisSize: MainAxisSize.min,
            children: [
              SvgPicture.asset(
                item.iconPath,
                width: 30,
                height: 30,
                colorFilter: ColorFilter.mode(
                  isSelected ? const Color(0xFF177046) : Colors.black,
                  BlendMode.srcIn,
                ),
              ),

              const SizedBox(height: 6),

              Text(
                item.label,
                style: TextStyle(
                  color: isSelected ? const Color(0xFF177046) : Colors.black,
                  fontSize: 15,
                  fontFamily: 'AbdEriady',
                  fontWeight: isSelected ? FontWeight.w700 : FontWeight.w400,
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}
