@import"https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;600;700&display=swap";*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html{height:100%}body{height:100%;background-color:var(--neutral-color);font-family:var(--body-font);color:var(--font-color);font-size:var(--normal-font-size);scroll-behavior:smooth}button{cursor:pointer}a{display:block;color:inherit;text-decoration:none;cursor:pointer}ul{list-style:none}:root{--first-color: #dc2626;--font-color: #1a1818;--gray-color: #3f3f3f;--light-gray-color: #f1f1f1;--neutral-color: #f7f7f7;--body-font: "Montserrat", sans-serif;--big-font-size: 4rem;--h1-font-size: 1.7rem;--h2-font-size: 1.5rem;--h3-font-size: 1.1rem;--normal-font-size: .8rem;--small-font-size: .7rem;--font-thin: 300;--font-regular: 400;--font-medium: 600;--font-bold: 800;--font-black: 900;padding:2rem;display:flex;flex-direction:column;align-items:center;justify-content:center}h1{font-size:var(--h1-font-size);font-weight:var(--font-medium)}h2{font-size:var(--h2-font-size);font-weight:var(--font-medium)}h3{font-size:var(--h3-font-size);font-weight:var(--font-medium)}header{background-color:var(--first-color);color:var(--neutral-color);padding:1rem}.navbar-container{position:sticky;left:0;top:0;background-color:var(--light-gray-color);padding:1rem;width:300px}.project-menu{list-style:none;margin:1rem 0;padding:0 1rem}.list-name{cursor:pointer;display:flex;justify-content:space-between;margin-bottom:.8rem}.active-list{font-weight:var(--font-medium)}.remove-project-btn{visibility:hidden}.remove-project-btn:hover{-webkit-filter:brightness(80%)}.list-name:hover .remove-project-btn{visibility:visible}.main-content{justify-self:center;width:50%;margin:1rem auto}.todo-grid{display:flex;flex-direction:column;align-items:center}.title{display:flex;align-self:start;margin-top:2rem}.todo-card{display:grid;grid-template-columns:50px minmax(200px,1fr) 50px;grid-template-rows:minmax(24px,1fr) minmax(0,auto) 1fr;width:100%;border-bottom:1px solid rgb(211,211,211);padding:8px 16px 0;gap:6px}.edit-btn{background:url(./img/pen-to-square-solid.svg) no-repeat center center;width:12px;height:12px;padding:10px;border:none;display:none;border-radius:4px}.control-div{grid-area:1 / 3 / 2 / 4;display:flex;align-items:center;justify-content:end;gap:4px}.check-div{grid-area:1 / 1 / 2 / 2;place-self:end end;padding-right:6px}.task-name{grid-area:1 / 2 / 2 / 3;font-weight:var(--font-medium);place-self:center start}.completed{text-decoration:line-through}.task-description{grid-area:2 / 2 / 3 / 3;font-size:var(--small-font-size);color:var(--gray-color);margin-bottom:10px}.details-cont{grid-area:3 / 2 / 4 / 3;display:flex;justify-content:space-between;font-size:var(--small-font-size)}.details-div{display:flex;color:var(--first-color)}.task-date{padding-right:10px}.dialog{margin:auto;padding:1rem;border:none;border-radius:12px}.dialog::backdrop{background-color:#3f3f3f;opacity:.3}.dialog-main{display:flex}.project-title{display:flex;justify-content:space-between;padding-bottom:1rem}#taskForm{display:flex}.left-container,.right-container{display:flex;flex-direction:column}input[type=text],input[type=date],textarea,select{border:1px solid transparent;border-radius:6px;font-family:var(--body-font);margin:10px 0;padding:10px;height:initial;width:250px;outline:none;resize:none}input:focus,textarea:focus{border:1px solid lightgray}#closeBtn{padding:10px;background-color:inherit;border:none;border-radius:6px}.save-btn{padding:8px 16px;background-color:var(--first-color);color:var(--neutral-color);border:none;border-radius:6px}.save-btn:hover{background-color:#b41e1e}.save-btn:disabled{background-color:#b96e6e}#closeBtn:hover{background-color:#e7e7e7}main{max-width:300px;margin:0 auto;display:flex;flex-direction:column}.new-task-form{width:100%}.form-row{display:flex;flex-direction:column}label{font-size:var(--normal-font-size);font-weight:var(--font-medium);align-items:center;display:flex;margin-right:.5rem}ul{margin-top:1rem;width:100%;display:block}li{display:flex;margin-top:.5rem;align-items:center;justify-content:space-between}input[type=checkbox]{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:inherit;margin-right:.5rem;font:inherit;color:currentColor;width:1.2rem;height:1.2rem;border:1px solid #d1d1d1;border-radius:50%}input[type=checkbox]:checked{background:var(--first-color) url(/assets/check-solid-65df0e8c.svg) no-repeat center center;background-size:70%;border:none}.delete-btn{background:url(/assets/trash-solid-7c78f13c.svg) no-repeat center center;background-color:inherit;width:30px;height:30px;border:none;border-radius:4px;visibility:hidden}li:hover .delete-btn{visibility:visible;-webkit-filter:brightness(80%)}