@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700&family=Roboto:wght@400;500&display=swap);body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;box-sizing:border-box;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;font-size:16px;line-height:1.5;margin:0;max-width:100%;overflow-x:hidden;padding:0}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}@keyframes gradientAnimation{0%{background-position:0 50%}50%{background-position:100% 50%}to{background-position:0 50%}}body,html{animation:gradientAnimation 15s ease infinite;background:linear-gradient(-45deg,#ee7752,#e73c7e,#23a6d5,#23d5ab);background-size:400% 400%;font-family:Roboto,sans-serif;height:100%;margin:0;padding:0}#root{align-items:center;display:flex;justify-content:center;min-height:100vh;padding:20px}#root,.App{box-sizing:border-box}.App{background-color:#ffffffe6;border-radius:10px;box-shadow:0 4px 6px #0000001a;max-width:800px;padding:2rem;width:100%}.App-header{margin-bottom:2rem;text-align:center}.App-header h1{color:#333;font-family:Poppins,sans-serif;font-size:2.5rem;font-weight:700;margin:0}.todo-form{display:flex;flex-direction:column;margin-bottom:2rem;width:100%}.todo-form input{border:1px solid #ccc;border-radius:4px;box-sizing:border-box;font-family:Roboto,sans-serif;font-size:1rem;margin-bottom:.5rem;padding:.75rem;width:100%}.todo-form button{background-color:#4a90e2;border:none;border-radius:4px;color:#fff;cursor:pointer;font-family:Poppins,sans-serif;font-size:1rem;font-weight:600;padding:.75rem 1.5rem;transition:background-color .3s ease;width:100%}.todo-form button:hover{background-color:#3a7bc8}@media (min-width:481px){.todo-form{flex-direction:row}.todo-form input{flex:1 1;margin-bottom:0;margin-right:.5rem}.todo-form button{width:auto}}.todo-list{list-style-type:none;max-height:50vh;overflow:auto;padding:0}.todo-item{background-color:#fff;border-radius:4px;box-shadow:0 2px 4px #0000001a;margin-bottom:1rem;padding:1rem}.todo-content{align-items:center;display:flex;margin-bottom:.5rem}.todo-content input[type=checkbox]{margin-right:.5rem}.todo-content span{font-family:Roboto,sans-serif;font-size:1.1rem;font-weight:500}.subtasks{margin-left:1.5rem}.subtask{align-items:center;display:flex;margin-bottom:.5rem}.subtask input[type=checkbox]{margin-right:.5rem}.subtask span{font-family:Roboto,sans-serif;font-size:.9rem}.subtask-form{display:flex;margin-top:.5rem}.subtask-form input{border:1px solid #ccc;border-radius:4px 0 0 4px;flex-grow:1;font-family:Roboto,sans-serif;font-size:.9rem;padding:.5rem}.subtask-form button{background-color:#4a90e2;border:none;border-radius:0 4px 4px 0;color:#fff;cursor:pointer;font-family:Poppins,sans-serif;font-size:.9rem;font-weight:600;padding:.5rem 1rem;transition:background-color .3s ease}.subtask-form button:hover{background-color:#3a7bc8}@media (max-width:768px){.App{max-width:90%;padding:1.5rem}.App-header h1{font-size:2rem}.todo-form button,.todo-form input{font-size:.9rem}}@media (max-width:480px){#root{padding:10px}.App{padding:1rem}.App-header h1{font-size:1.75rem}.todo-form{flex-direction:column}.todo-form input{margin-bottom:.5rem;margin-right:0}.todo-form button,.todo-form input{border-radius:4px;width:100%}.todo-item{padding:.75rem}.subtasks{margin-left:1rem}.subtask-form{flex-direction:column}.subtask-form button,.subtask-form input{border-radius:4px}.subtask-form input{margin-bottom:.5rem}}.progress-container{background-color:#e0e0e0;border-radius:4px;height:24px;margin-bottom:2rem;overflow:hidden;position:relative;width:100%}.progress-bar{height:100%;transition:width .3s ease-in-out,background-color .3s ease-in-out}.progress-text{border-radius:10px;color:#333;font-size:.9rem;font-weight:700;left:50%;padding:2px 8px;position:absolute;top:50%;transform:translate(-50%,-50%);z-index:1}.delete-btn{background-color:initial;border:none;color:#888;cursor:pointer;font-size:.8rem;padding:5px 10px;transition:color .3s ease}.delete-btn:hover{color:#ff4136}.subtask,.todo-content{align-items:center;display:flex;padding:5px 0}.subtask span,.todo-content span{flex-grow:1;margin-right:10px}.subtask input[type=checkbox],.todo-content input[type=checkbox]{margin-right:10px}
/*# sourceMappingURL=main.0c9df494.css.map*/