@import"https://fonts.googleapis.com/css2?family=Pixelify+Sans:wght@400..700&display=swap";*{box-sizing:border-box;padding:0;margin:0;font-family:Pixelify Sans,sans-serif}#root{height:100vh;width:100vw;display:flex;align-items:center;justify-content:center}:root{--background-color: #6a7a37;--foreground-color: #c8c9b1;--button-color: #122006;--white: #fff4f5;font-optical-sizing:auto;font-style:normal}h1{font-size:50px;font-weight:400}h2{font-size:30px}h3{font-size:26px}main{height:80vh;width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center}main .title{position:absolute;top:20px}.app{background-color:var(--background-color);min-height:700px;width:fit-content;display:flex;flex-direction:column;padding:20px;border-radius:20px;border:var(--foreground-color) 4px solid;justify-content:center;align-items:center}.topHalf{display:flex;gap:30px;height:200px}.listItem{display:flex;position:relative;flex-direction:row;align-items:center;margin-bottom:10px;cursor:pointer;justify-content:space-between;padding-right:30px}.task-text{position:relative;width:fit-content;transition:opacity .4s}.task-text:before{content:"";position:absolute;width:0%;height:2px;opacity:.8;background-color:#000;top:10px;transition:width .6s ease-out}.task-text.completed{opacity:.8}.task-text.completed:before{width:100%}.task-text:hover{opacity:.6}.leafIcon{height:20px;width:20px;margin-left:20px}.dateSection{display:flex;flex-direction:column;background-color:var(--white);width:200px;height:200px;align-items:center;justify-content:space-around;border-radius:30px;border:var(--foreground-color) solid 6px}.circle{background-color:var(--background-color);border-radius:100px;height:80px;width:80px;display:flex;align-items:center;justify-content:center}.circle h1{color:var(--white)}.progressSection{background-color:var(--white);height:fit-content;width:450px;padding:20px;border-radius:30px;border:var(--foreground-color) solid 6px}.progressBar{height:20px;background:var(--foreground-color);border-radius:10px;overflow:hidden;margin-top:20px}.progress{height:100%;border-radius:10px 0 0 10px;transition:all .5s ease-in-out;-webkit-user-select:none;user-select:none;background-color:var(--background-color)}ul{list-style:none;margin-top:30px;background-color:var(--white);padding:10px;height:360px;border:var(--foreground-color) solid 6px;border-radius:30px;overflow:auto;width:100%}.addTaskSec{display:flex;height:100%;margin-top:20px;gap:20px}.textInput{width:80%;height:100%;background-color:var(--white);display:flex;padding-left:20px;box-shadow:2px 2px 0 var(--button-color),4px 4px 0 var(--foreground-color);outline:none}.login.app{padding:80px}.search{background-color:transparent;border:none;width:100%;outline:none;box-shadow:none;font-size:large}.search:active,.search:focus{outline:none;box-shadow:none}button{width:52px;height:52px;border:none;background-color:var(--button-color);color:var(--white);font-size:40px;transition:all .3s ease-in-out;padding:0 20px}button:hover{opacity:.9;cursor:pointer;padding:0 30px}footer{position:relative;margin:auto;bottom:0}.error{color:red;font-size:14px;margin:0;text-align:center}.login-container{display:flex;flex-direction:column;max-width:700px;height:fit-content;background-color:var(--white);max-height:720px;max-width:580px;gap:40px;padding:40px;align-items:center;border-radius:20px}.login.textInput{padding:0;width:100%;height:40px;background-color:#c8c9b1;margin:0 20px}.login h1{margin-top:20px}.loginHeading{display:flex;flex-direction:row;gap:10px;align-items:center;justify-content:center}.loginHeading img{margin:24px 0 0;width:26px;height:26px}.login-container input{background-color:transparent;padding:20px}.submit-btn{width:fit-content;margin:10px}@media screen and (max-width: 600px){.app{padding:15px;margin:10px;border-width:2px;height:fit-content;min-height:200px}main .title{position:absolute;top:5%}h1{font-size:30px}h2{font-size:20px}h3{font-size:18px}.topHalf{align-items:center;justify-content:center;height:fit-content;width:80vw}.dateSection,.progressSection{display:none}ul{width:100%;height:60vh}.addTaskSec{flex-direction:row;gap:0;align-items:center;justify-content:center;width:100%}.searchBar{width:100%;padding:0 10px;height:50px;border-radius:30px 0 0 30px}.addTaskSec button{align-self:center;width:20%;height:40px;padding:0 1px 1px 0;margin-left:20px!important}.search{font-size:medium;height:34px}.app button{width:40px;height:40px;font-size:30px;margin:auto}footer{margin:20px}.submit-btn{width:fit-content!important;margin:0}.login-container{width:90vw;height:fit-content;padding:20px;gap:20px;justify-content:center}.login.app{padding:20px}.login.textInput{height:50px}.login.textInput input{font-size:24px;padding:10px 0 0 20px}}