*{margin:0;padding:0;font-family:Arial,Helvetica,sans-serif;box-sizing:border-box}body{background-image:url(/assets/projTODO-CTacbRCA.jpg);background-size:cover;background-position:center;background-repeat:no-repeat;height:100vh;display:flex;justify-content:center;align-items:center}.todo{background-color:#f4f4f4;padding:2rem 1rem;border-radius:5px;width:600px}.todo h1{text-align:center;margin-bottom:10px;padding-bottom:10px;color:#333}h2{color:#333}.todo h3{font-weight:500;color:#333}.todo p{font-size:14px;color:#333}.btn-actions{display:flex;justify-content:center;align-items:center;gap:10px}button{padding:.3rem .8rem;border-radius:5px;border:none;font-weight:700;opacity:.8;cursor:pointer;transition:.3s;color:#fff}button:hover{opacity:1}.complete{background-color:#42b72a}.delete{background-color:#ff3040}.todo-box{border-top:1px solid #acababd6;border-bottom:1px solid #acababd6}.todo-list{display:flex;justify-content:space-between;align-items:center;background-color:#fff;margin:1rem 0;padding:1rem;border-radius:5px;box-shadow:1px 1px 10px #00000040}input,select{border:none;padding:.5rem;border:1px solid #d4d4d4;border-radius:5px;width:100%}.create-box{display:flex;flex-direction:column;padding:1rem 0;gap:1rem}.btn-create{background-color:#4141d4;width:100px}.create-box form{display:flex;flex-direction:column;gap:1rem}
