How can I create a custom checkbox button like this in flutter

this is an example and you can improve it if you want

import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatefulWidget {
  const MyApp({super.key});

  @override
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  var plans = <Plan>[];
  Plan? selectedPlans;

  @override
  initState() {
    super.initState();
    initPlans();
  }

  initPlans() {
    plans.add(Plan(name: 'Small', price: 4.99));
    plans.add(Plan(name: 'Medium', price: 8.99));
    plans.add(Plan(name: 'Large', price: 13.99));
  }

  togglePlans(index) {
    for (var i = 0; i < plans.length; i++) {
      plans[i].selected = false;
    }
    plans[index].selected = true;
    selectedPlans = plans[index];
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: SafeArea(
          child: Scaffold(
        backgroundColor: const Color(0xffF1DCC4),
        body: Center(
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceAround,
            children: List.generate(
              plans.length,
              (index) => InkWell(
                onTap: () {
                  togglePlans(index);
                  setState(() {});
                },
                child: PlanCard(
                  plan: plans.elementAt(index),
                ),
              ),
            ),
          ),
        ),
      )),
    );
  }
}

class PlanCard extends StatelessWidget {
  final Plan plan;
  const PlanCard({super.key, required this.plan});

  @override
  Widget build(BuildContext context) {
    return AnimatedContainer(
      height: 70,
      width: 100,
      margin: const EdgeInsets.symmetric(horizontal: 5),
      decoration: BoxDecoration(
        color: plan.selected ? Colors.red : Colors.white,
        borderRadius: BorderRadius.circular(5),
      ),
      duration: const Duration(seconds: 1),
      child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          Text(
            plan.name,
            style: TextStyle(
              fontWeight: FontWeight.bold,
              fontSize: 16,
              color: plan.selected ? Colors.white : Colors.black,
            ),
          ),
          const SizedBox(height: 5),
          Text(
            '${plan.price}$',
            style: TextStyle(
              fontWeight: FontWeight.bold,
              fontSize: 12,
              color: plan.selected ? Colors.white38 : Colors.green,
            ),
          )
        ],
      ),
    );
  }
}

class Plan {
  String name;
  double price;
  bool selected;

  Plan({required this.name, required this.price, this.selected = false});
}