#root{display:flex;justify-content:center}.main-composant{display:flex;flex-direction:column;align-items:left;width:50vw;box-shadow:1px 1px 10px #0000007f;border-radius:25px;padding:20px;gap:15px;background-color:#fff;font-family:Noto Sans,sans-serif}form{display:flex;gap:10px;width:100%}form input{width:calc(100% - 70px);height:30px;border-radius:5px;padding:5px 10px;box-shadow:1px 1px 5px #0000007f;border:none}form button{border-radius:5px;border:none;padding:5px 20px;background-color:#1b57f3;color:#fff;cursor:pointer}.sorting{display:flex;justify-content:space-between;width:100%;height:30px}.sorting ul{display:flex;list-style:none;align-items:center;gap:10px;padding:0;height:30px;margin:0}.sorting ul li button{padding:8px 20px;border-radius:5px;border:none}.sorting ul li button:hover{cursor:pointer}.sorting select{height:30px;cursor:pointer}.selected-button{background-color:#1b57f3;color:#fff}.tasks-list{width:calc(100% - 40px);width:100%;margin:0;list-style:none;padding-left:0;display:flex;flex-direction:column;gap:10px}.tasks-list li{width:calc(100% - 20px);box-shadow:1px 1px 5px #0000007f;border-radius:5px;padding:10px;display:flex;justify-content:space-between;align-items:center}.tasks-list li .list{display:flex;gap:10px}.tasks-list li .list input{cursor:pointer}.tasks-list li .list-buttons{display:flex;gap:10px}.tasks-list li .list-buttons button{cursor:pointer}.tasks-list li .list-buttons button:first-child{border-radius:25px;border:none;padding:7px;border:1px solid transparent;color:#0009;background-color:#0000001a}.tasks-list li .list-buttons button:first-child:hover{background-color:#fff;border:1px solid #1b57f3;color:#1b57f3}.tasks-list li .list-buttons button:last-child{all:unset;padding:0 10px;cursor:pointer;color:#0009}.tasks-list li .list-buttons button:last-child:hover{color:red}