@import"https://fonts.googleapis.com/css2?family=Roboto+Mono:ital,wght@0,100..700;1,100..700&family=Vazirmatn:wght@100..900&display=swap";.header{display:flex;flex-direction:column;margin:2.5rem 0;padding:1rem 1.5rem;background-color:#ffffff67;border-radius:15px}.header h2{font-size:20px;margin-bottom:2rem;text-align:center}.app-name{color:#d26c1e}.inputs{display:flex;justify-content:center}.title,.task{background-color:#d26c1e23;border-radius:15px;padding:.5rem 1rem;margin:0 5px}.inputs p{margin-left:5px;font-size:17px}.inputs input,.edit-mode input{border:none;outline:none;padding:5px 8px;border-radius:10px;margin-top:8px;font-weight:700;transition:all .2s}.inputs input:focus,.edit-mode input:focus{background-color:#cba78793;transform:scale(1.05)}.header button,.edit-mode button{border:none;margin-top:15px;padding:.5rem 1rem;border-radius:15px;background-color:#009a00da;color:#f0f8ff;font-weight:600}.edit-mode input{margin:0 8px}.task-list{display:flex;flex-direction:column;margin:.5rem 0;padding:1rem 1.5rem;background-color:#ffffff67;border-radius:15px}.task-title{font-size:20px;font-weight:600;color:#00437d}.task-control{display:flex;margin-top:.5rem}.task-control p{flex:1;color:#565656}.task-control svg{display:inline-block;margin:0 7px;font-size:18px;transition:all .2s}.task-control svg:hover{transform:scale(1.3);color:#d26c1e}.task-status{font-weight:600;color:#525252;text-align:center}.task-control button{border:none;background-color:unset}.completed{background-color:#7d040467;border:1px solid rgba(255,0,0,.544);transition:.6s all}.completed-message{text-align:center;font-weight:600;font-size:20px;color:#941919;transform:translateY(0)}*{padding:0;margin:0;box-sizing:border-box}body{background-color:#e8e5cd;font-family:Vasirmath,sans-serif}ul,ol,li{list-style:none}a{text-decoration:none}.container{display:flex;height:100vh;justify-content:center;align-items:center;flex-direction:column}@media (max-width:500px){.container{height:auto}.to-do-app{width:95%;text-align:center;margin-top:1rem}.header{padding:1rem;width:100%}.header h2{font-size:16px}.inputs{display:block}.task{margin-top:1rem}.inputs input{width:100%}.task-title,.task-control p{font-size:16px}.task-control{display:block}.task-control p,.edit-mode input{margin-bottom:1rem}.task-list{padding:.5rem 1rem}}