Chane child state from parent in React

I just started learning React and I have a couple cards I want to toggle a className from the component and remove the className from Parent. How do I do this? This is the child component

import React from 'react'
import { useState} from 'react'

const Card = ({check,cardID}) => {
const [isToggled,setToggle] = useState(false)


const flip = () => {
  setToggle(!isToggled)
  check()
}


return (
 <div className='flip-card' >
    <div id={`card${cardID}`}  onClick={flip} className={`flip-card-inner ${isToggled ? "flipclass":""}`}>
    <div className="flip-card-front">
        <span>Flip for surprise</span>
    </div>
    <div className="flip-card-back">
        <img className="card-img" src="/firstsect.jpg" alt="Avatar" height="100%" width="100%" />
    </div>
    </div>
</div>
)}

export default Card

and in the parent component I want to set the isToggled state to false so the flipclass wont be added

import React from 'react'
import Card from './Card'
import { useState, useRef } from 'react'

export const Cards = ({cardsarray,cardID}) => {
const [Counter,setCounter] = useState(0)



const check = ()=> {
    setCounter(count => count+ 1)
    
    if (Counter === 1) {
        //Change isToggled on the other component to false
        setCounter(0)
    }
}

return (
<div className="all-cards">
    {
      cardsarray.map((_user,index)=>(
        <Card cardID={index} check={check} key={index}></Card>
      ))
    }
</div>
)}

I already tried using the state in the parent component and passing the istoggled as props but the whole array of cards gets the class instead of the particular card that calls the function. How do i go about this?