body{background-color:#232323;color:#fff;text-align:center}body ::selection{background-color:#c91b1b}.SignupContainer{display:flex;gap:20px;flex-direction:column;align-items:center;width:100%;max-width:460px}.SignupContainer .inputField{width:250px;height:35px;border-radius:15px;border:none;font-size:15px;padding:0 11px}.SignupContainer .inputField:focus{outline:none;border-radius:5px;transition:all .3s}.SignupContainer button{background-color:#fff;border:none;padding:10px 0;font-weight:600;border-radius:20px;width:150px}.SignupContainer button:hover{border-radius:5px;background-color:#979797;transition:all .3s}.todoInputContainer{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:20px}.todoInputContainer .addBtn{font-size:35px;cursor:pointer}.todoInputContainer #taskInput,.todoInputContainer #dateInput{width:250px;height:35px;border-radius:20px;border:none;padding:0 11px}.todoInputContainer #taskInput:focus,.todoInputContainer #dateInput:focus{outline:none;border:none}.todoInputContainer #dateInput{width:110px}.todoItemContainer{display:flex;flex-direction:column;gap:20px;align-items:center;padding:10px;margin:20px 0 0}.todoItemContainer .todoItem{display:flex;flex-wrap:wrap;width:100%;border-radius:20px;max-width:700px;min-width:200px;justify-content:space-between;align-items:center}.todoItemContainer .todoItem:hover{background-color:#3e3e3ec0}.todoItemContainer .todoItem .removeBtn{cursor:pointer;font-size:large;padding:5px;border-radius:100%}.todoItemContainer .todoItem .removeBtn:hover{color:#fff;background-color:green}.todoItemContainer .todoItem p{width:100%;max-width:200px}.container{margin:50px 0 0;display:flex;align-items:center;flex-direction:column}.container .inputField{width:250px;height:35px;border-radius:20px;border:none;font-size:15px;padding:0 11px}.container .inputField:disabled{background-color:silver;color:#000}.NavContainer{display:flex;flex-direction:column;justify-content:space-between;position:fixed;top:0;left:0;height:100%;background-color:#474747b0;padding:10px 0 0}.NavContainer div{display:flex;gap:10px;flex-direction:column}.NavContainer .Signout{font-size:25px;margin:0 10px 30px;cursor:pointer}.NavContainer .activeLink{color:green;font-size:25px;margin:0 10px}.NavContainer .activeLink :hover{color:gray}.NavContainer .links{color:#fff;font-size:25px;margin:0 10px}.NavContainer .links :hover{color:gray}.duration-select{padding:10px 20px;border:1px solid #ccc;border-radius:15px;cursor:pointer;font-weight:700}.duration-select:disabled{background-color:#f0f0f0;cursor:not-allowed}.duration-select:focus{outline:none}.display-timer{margin-top:20px}.display-timer p{margin:0;font-size:24px;font-weight:600}.button-container{display:flex;align-items:center;justify-content:center;gap:30px;margin-top:20px}.button-container button{padding:10px 30px;border:none;border-radius:15px;cursor:pointer;font-weight:600;transition:background-color .3s}.button-container button:hover{background-color:#0062cc}.button-container button:disabled{background-color:#f0f0f0;cursor:not-allowed}