@import url(https://fonts.googleapis.com/css2?family=Josefin+Sans:wght@300;400;500;600;700&display=swap);*{box-sizing:border-box;margin:0;padding:0}body{background:var(--body-bg-color);font-family:Josefin Sans,sans-serif}.app{align-items:flex-start;display:flex;justify-content:center}.app .app-bg{background-image:url(/static/media/lite-bg-imges.55255a4185a142440eae.jpg);background-image:var(--body-bg-image);background-repeat:no-repeat;background-size:cover;height:300px;left:0;position:fixed;right:0;top:0;width:100%;z-index:-1}.app .app__container{width:540px}.app .app__container .todos{align-items:center;background:#fff;background:var(--body-addItem-color);border-radius:5px;box-shadow:0 35px 50px -15px rgba(194,195,214,.5);box-shadow:0 35px 50px -15px var(--input-box-shadow);color:#c8cbe7;display:flex;flex-direction:column;font-family:Josefin Sans;font-size:18px;justify-content:center;letter-spacing:-.25px;margin-top:24px;min-height:100px}.app .app__container footer{color:#9495a5;color:var(--filter-paragraf-color);font-family:Josefin Sans;font-size:14px;font-style:normal;font-weight:400;letter-spacing:-.194px;line-height:normal;padding:50px;text-align:center}@media screen and (max-width:767px){.app{padding:0 24px}.app .app__container{max-width:375px}}:root{--body-bg-color:#fff;--body-bg-image:url(/static/media/lite-bg-imges.55255a4185a142440eae.jpg);--body-addItem-color:#fff;--body-lite-icon:#e3e4f1;--body-input-paragraf-color:#393a4b;--border-bottom:#e3e4f1;--task-colors:#494c6b;--task-colors-done:#d1d2da;--input-box-shadow:rgba(194,195,214,.5);--filter-paragraf-color:#9495a5;--filter-paragraf-color-hover:#494c6b}body.lite{--body-bg-color:#171823;--body-bg-image:url(/static/media/todo-bg-img.e488e5818503f56862d9.jpg);--body-addItem-color:#25273d;--body-lite-icon:#393a4b;--body-input-paragraf-color:#767992;--border-bottom:#393a4b;--task-colors:#c8cbe7;--task-colors-done:#4d5067;--input-box-shadow:rgba(0,0,0,.5);--filter-paragraf-color:#5b5e7e;--filter-paragraf-color-hover:#fff}header{padding-top:70px;width:100%}header .header__container{display:flex;justify-content:space-between}header .header__container h1{color:#fff;cursor:pointer;font-family:Josefin Sans;font-size:40px;font-weight:700;letter-spacing:15px}header .header__container img{cursor:pointer;height:26px;width:26px}.add-todo{padding-top:50px;width:100%}.add-todo .add-todo__container{background:var(--body-addItem-color);border-radius:5px;box-shadow:0 35px 50px -15px var(--input-box-shadow);display:flex;justify-content:space-between;padding:20px 24px}.add-todo .add-todo__container span{align-items:center;display:flex;width:100%}.add-todo .add-todo__container span img{cursor:pointer;-webkit-user-select:none;user-select:none}.add-todo .add-todo__container span .lite-icon{border:1px solid var(--body-lite-icon);border-radius:24px;cursor:pointer;height:20px;width:24px}.add-todo .add-todo__container span .lite-icon:hover{border:1px solid #c058f3}.add-todo .add-todo__container span input{background:var(--body-addItem-color);border:none;color:var(--body-input-paragraf-color);font-family:Josefin Sans;font-size:18px;font-weight:400;letter-spacing:-.25px;margin:0 24px;outline:none;width:100%}.add-todo .add-todo__container .btn-add{background:linear-gradient(135deg,#5df,#c058f3);border:0;border-radius:4px;color:#fff;cursor:pointer;font-family:Josefin Sans,sans-serif;padding:5px 10px}@media screen and (max-width:767px){.add-todo .add-todo__container span input{margin:0 10px}}.todo-item{border-bottom:1px solid var(--border-bottom);justify-content:space-between;padding:20px 24px;width:100%}.todo-item,.todo-item span{align-items:center;display:flex}.todo-item span{-webkit-column-gap:24px;column-gap:24px}.todo-item span img{cursor:pointer;-webkit-user-select:none;user-select:none}.todo-item span .lite-icon{border:1px solid var(--body-lite-icon);border-radius:24px;cursor:pointer;height:24px;width:24px}.todo-item span .lite-icon:hover{border:1px solid #c058f3}.todo-item span .task{color:var(--task-colors);font-family:400}.todo-item span .task,.todo-item span .task-done{font-family:Josefin Sans;font-size:18px;letter-spacing:-.25px}.todo-item span .task-done{color:var(--task-colors-done);text-decoration:line-through}.todo-item .close-icon{cursor:pointer}.todo-item .close-icon img{display:none}.todo-item:hover{cursor:pointer}.todo-item:hover .close-icon img{display:block}.filter-item{align-items:center;display:flex;justify-content:space-between;padding:20px 24px;width:100%}.filter-item h3,.filter-item h4{color:var(--filter-paragraf-color);cursor:pointer;font-size:14px;font-weight:400;letter-spacing:-.194px;line-height:normal}.filter-item h4:hover{color:var(--filter-paragraf-color-hover)}.filter-item span{-webkit-column-gap:20px;column-gap:20px;display:flex}.filter-item span .paragraf{color:var(--filter-paragraf-color);cursor:pointer;font-family:Josefin Sans;font-size:14px;font-style:normal;font-weight:700;letter-spacing:-.194px;line-height:normal}.filter-item span p:hover{color:var(--filter-paragraf-color-hover)}.filter-item span .paragraf-active{color:#3a7cfd;font-family:Josefin Sans;font-size:14px;font-style:normal;font-weight:700;letter-spacing:-.194px;line-height:normal}@media screen and (max-width:767px){.filter-item{padding:20px 10px}.filter-item span{-webkit-column-gap:5px;column-gap:5px;display:flex}}
/*# sourceMappingURL=main.3f9f8c29.css.map*/