*{
    margin:0;
    padding:0;
    font-family:Arial;
}

body{
    background:#c4c0c0;
    display:flex;
    justify-content:center;
    align-items:center;
    min-height:100vh;
}

.container{
    background:#fff;
    width:420px;
    padding:20px;
    border-radius:15px;
}

.container h2{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-bottom: 20px;
}

.container h2 img{
    width: 35px;
    height: 35px;
    object-fit: contain;
}
img{
    display: flex;
    align-items: center;

}

.row{
    display:flex;
    gap:10px;
}

input{
    flex:1;
    padding:10px;
    border-radius:8px;
    border:1px solid #ccc;
}

button{
    padding:10px 15px;
    border:none;
    background:blue;
    color:white;
    border-radius:8px;
    cursor:pointer;
}

button:hover{
    background:blueviolet;
}

ul{
    list-style:none;
    margin-top:15px;
}

li{
    display:flex;
    justify-content:space-between;
    padding:10px;
    margin-bottom:8px;
    background:#f3f3f3;
    border-radius:8px;
    cursor:pointer;
}

li.done{
    text-decoration:line-through;
    color:gray;
}

.actions button{
    margin-left:5px;
}

.delete{
    background:red;
}