import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

class DeviceHeaderWidget extends StatelessWidget {
  final String deviceName;
  final String deviceModel;

  const DeviceHeaderWidget({
    super.key,
    required this.deviceName,
    required this.deviceModel,
  });

  @override
  Widget build(BuildContext context) {
    return Container(
      padding: EdgeInsets.symmetric(horizontal: 24.w, vertical: 32.h),
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.only(
          topLeft: Radius.circular(24.r),
          topRight: Radius.circular(24.r),
        ),
      ),
      child: Row(
        children: [
          Container(
            width: 64.w,
            height: 64.h,
            decoration: BoxDecoration(
              color: const Color.fromRGBO(219, 234, 254, 1),
              borderRadius: BorderRadius.circular(20.r),
            ),
            child: Icon(
              Icons.power,
              size: 50.sp,
              color: const Color.fromRGBO(59, 130, 246, 1),
            ),
          ),
          SizedBox(width: 24.w),
          Expanded(
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Text(
                  deviceName,
                  style: TextStyle(
                    fontSize: 28.sp,
                    fontWeight: FontWeight.w600,
                    color: const Color.fromRGBO(15, 23, 42, 1),
                  ),
                ),
                SizedBox(height: 12.h),
                Text(
                  deviceModel,
                  style: TextStyle(
                    fontSize: 24.sp,
                    color: const Color.fromRGBO(100, 116, 139, 1),
                  ),
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }
}
