Flutter : the two container radius has a small line shadow - flutter

Question

Now I am trying to draw a container with the radius border to intersect with another container
But there is a line that remains visible around each container as shown in the picture Does anyone know how to hide it!
there is my code for that
Container(
height: MediaQuery.of(context).size.height * .47,
width: MediaQuery.of(context).size.width,
decoration: BoxDecoration(
color: Color.fromRGBO(28, 163, 200, 1),
border: null,
borderRadius: BorderRadius.only(
bottomLeft: Radius.circular(30.0),
//bottomLeft: Radius.circular(40.0),
),
),
),
Container(
color: Colors.transparent,
child: Container(
width: MediaQuery.of(context).size.width,
color: Color.fromRGBO(28, 163, 200, 1),
child: Container(
width: MediaQuery.of(context).size.width,
decoration: BoxDecoration(
color: Color.fromRGBO(247, 250, 251, 1),
border: null,
borderRadius: BorderRadius.only(
topRight: Radius.circular(30.0),
//bottomLeft: Radius.circular(40.0),
),
),
child: Padding(
padding: const EdgeInsets.only(left: 20, right: 20, top: 20),
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
Text(
"القائمة",
style: TextStyle(
fontWeight: FontWeight.bold,
fontSize: 18,
color: Colors.black),
),
Spacer(),
Text(
"عرض الكل",
style: TextStyle(
fontSize: 14,
color: Color.fromRGBO(255, 140, 0, 1)),
),
],
),
),
),
),
),

Answer 1

sounds like a renderer artifact, if you change the top container height ratio it goes away
height: MediaQuery.of(context).size.height * .47, // <-- change this to be 0.5
if you really want that particular height, then use a Stack() rather than embedded Containers

Answer 2

if you change the hight of the container it will render correctly. I have attached a screenshot of the result I get with this:
Column(
children: [
Container(
height: 300, //<--- This is what's causing the issue
width: MediaQuery.of(context).size.width,
decoration: BoxDecoration(
color: Color.fromRGBO(28, 163, 200, 1),
borderRadius: BorderRadius.only(
bottomLeft: Radius.circular(30.0),
//bottomLeft: Radius.circular(40.0),
),
),
),
Container(
// color: Colors.transparent,
child: Container(
width: MediaQuery.of(context).size.width,
decoration: BoxDecoration(
color: Color.fromRGBO(28, 163, 200, 1),
),
child: Container(
width: MediaQuery.of(context).size.width,
decoration: BoxDecoration(
color: Color.fromRGBO(247, 250, 251, 1),
borderRadius: BorderRadius.only(
topRight: Radius.circular(30.0),
//bottomLeft: Radius.circular(40.0),
),
),
child: Padding(
padding: const EdgeInsets.only(left: 20, right: 20, top: 20),
child: Row(
children: [
Text(
"القائمة",
style: TextStyle(fontWeight: FontWeight.bold, fontSize: 18, color: Colors.black),
),
Spacer(),
Text(
"عرض الكل",
style: TextStyle(fontSize: 14, color: Color.fromRGBO(255, 140, 0, 1)),
),
],
),
),
),
),
),
],
)