:root {
    --main: #28402C;
    --contrast: #5A7760;
    --cream: #F2AA52;
    --text: #2A2D34;
    --text2: #e2d1c3;
}

.card, .detail, .large_frame, .dropbtn, .dropdown-content, .login-frame  {
    background-color: var(--main);

}

.dropdown-content, .optionSearch, .placeholder, .chip, input[type=text],
input[type=textArea], input[type=password], .favoriFilter input:checked + .chip,
.dropdownInfo-content, .modal-content, .chip-edit {
    background-color: var(--contrast);
}

.btn-grad, .chip-label input:checked + .chip, .buttonHome {
    background-color: var(--cream);
}

.card, .detail, .large_frame, .dropbtn, .favoriFilter, .dropdown-content,
.optionSearch, .placeholder, .fav-detail-phone button, .login-frame,
.dropdownInfo-content, .close, .btn-modal {
    color: var(--text2);
}

header, .chip-label input:checked + .chip, .btn-edit, .form-del,
.btn-edit:hover, .form-del:hover, .form-del:visited, .btn-edit:visited
, a .btn-grad, .buttonHome, .large_frame .btn-grad, .login-frame input{
    color: var(--text);
}

.noFav {
    color: var(--cream);
}


.dropbtn, .favoriFilter, .dropdown-content, .optionSearch {
    border: var(--cream) 1px solid;
}

.recipeFrame {
    background-color: var(--contrast);
}