.taskList {
    padding-inline-start: 10px;
    padding-inline-end: 10px;
}

.taskList__item {
    padding: 10px;
    list-style-type: none;
    margin-bottom: 40px;
    border-bottom: 1px solid rgb(201, 201, 201);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.taskList__text {
    flex-grow: 1;
    padding: 0 20px;
    text-align: left;
    align-self: center;
}

.taskList__text--done {
    text-decoration: line-through;
}

.taskList__button {
    align-items: center;
    height: 40px;
    min-width: 40px;
    background-color: green;
    color: white;
    border: none;
    transition: 1s;
}

.taskList__button:hover {
    background-color: rgb(39, 160, 39);
}

.taskList__button:active {
    background-color: rgb(68, 185, 68);
}

.taskList__button--done {
    background-color: green;
}

.taskList__button--trash {
    background-color: rgb(255, 0, 51);
}

.taskList__button--trash:hover {
    background-color: rgb(255, 46, 88);
}

.taskList__button--trash:active {
    background-color: rgb(255, 81, 116);
}

.taskList__item--hidden {
    display: none;
}
