import 'dart:math' as math;

import 'package:flutter/material.dart';
import 'package:hmg_patient_app_new/core/app_assets.dart';
import 'package:hmg_patient_app_new/core/app_export.dart';
import 'package:hmg_patient_app_new/core/utils/utils.dart';
import 'package:hmg_patient_app_new/features/water_monitor/water_monitor_view_model.dart';
import 'package:hmg_patient_app_new/presentation/water_monitor/widgets/bottle_shape_clipper.dart';
import 'package:hmg_patient_app_new/presentation/water_monitor/widgets/water_consumption_progress_widget.dart';
import 'package:hmg_patient_app_new/theme/colors.dart';
import 'package:provider/provider.dart';

class WaterBottleWidget extends StatelessWidget {
  const WaterBottleWidget({super.key});

  @override
  Widget build(BuildContext context) {
    return Consumer<WaterMonitorViewModel>(
      builder: (context, vm, _) {
        final progressPercent = (vm.progress * 100).clamp(0.0, 100.0);

        // SVG aspect ratio
        const svgAspectRatio = 315.0 / 143.0; // ~2.2

        // Responsive bottle sizing with device-specific constraints
        double bottleWidth;
        if (isTablet) {
          bottleWidth = math.min(SizeUtils.width * 0.15, 180.0);
        } else if (isFoldable) {
          bottleWidth = math.min(100.w, 160.0);
        } else {
          bottleWidth = math.min(120.w, 140.0);
        }

        final bottleHeight = bottleWidth * svgAspectRatio;

        // Fillable area percentages
        final fillableHeightPercent = 0.7;
        const fillableWidthPercent = 0.8;

        final fillableHeight = bottleHeight * fillableHeightPercent;
        final fillableWidth = bottleWidth * fillableWidthPercent;

        // Device-specific positioning offsets
        final double leftOffset = isTablet ? 4.w : 8.w;
        final double bottomOffset = isTablet ? -65.h : -78.h;

        return SizedBox(
          height: bottleHeight,
          width: bottleWidth,
          child: Stack(
            fit: StackFit.expand,
            alignment: Alignment.center,
            children: [
              // Bottle SVG outline
              Center(
                child: Utils.buildSvgWithAssets(
                  icon: AppAssets.waterBottle,
                  height: bottleHeight,
                  width: bottleWidth,
                  fit: BoxFit.contain,
                ),
              ),

              // Wave and bubbles clipped to bottle shape
              Positioned.fill(
                left: leftOffset,
                bottom: bottomOffset,
                child: Center(
                  child: SizedBox(
                    width: fillableWidth,
                    height: fillableHeight,
                    child: ClipPath(
                      clipper: BottleShapeClipper(),
                      child: Stack(
                        alignment: Alignment.bottomCenter,
                        children: [
                          // Animated wave
                          Positioned(
                            child: WaterConsumptionProgressWidget(
                              progress: progressPercent,
                              size: math.min(fillableWidth, fillableHeight),
                              containerWidth: fillableWidth,
                              containerHeight: fillableHeight,
                              waveDuration: const Duration(milliseconds: 3000),
                              waveColor: AppColors.blueColor,
                            ),
                          ),

                          // Bubbles (only show if progress > 10%)
                          if (progressPercent > 10)
                            Positioned(
                              bottom: fillableHeight * 0.12,
                              child: Utils.buildSvgWithAssets(
                                icon: AppAssets.waterBottleOuterBubbles,
                                height: isTablet ? math.min(45.0, fillableHeight * 0.2) : math.min(55.0, fillableHeight * 0.22),
                                width: fillableWidth * 0.65,
                              ),
                            ),
                        ],
                      ),
                    ),
                  ),
                ),
              ),
            ],
          ),
        );
      },
    );
  }
}
