body{width:100%;height:100vh;overflow:hidden;text-align:center;font-family:Lexend,sans-serif;background:linear-gradient(135deg,#4ab1ff,#2d5cfe);background-size:cover}:root{--trash-color: #ff3f5b}.main-container,.login-component{position:relative;margin:30px auto;background-color:#fff;max-width:400px;min-height:200px;box-shadow:0 3px 31px 2px #00000030;border-radius:5px;padding:50px 20px 20px}.account-menu{background-color:#fff;text-align:right}.account-menu-btn{margin-right:50px}.login-component{display:flex;flex-direction:column}.login-component>*{width:70%;margin:5px auto;padding:10px}.spacer{height:1px;background-color:#c5c5c5;flex:1;margin:30px 10px 10px}.task-input{height:52px;position:relative}.task-input input{height:100%;width:70%;outline:none;font-size:18px;border-radius:5px;border:1px solid #999}.task-input input:focus,.task-input input.active{border:2px solid #3c87ff}.task-input input::placeholder{color:#bfbfbf}form{width:70%;margin:auto}input[type=text]{font-family:Lexend;width:100%;height:40px;outline:none;font-size:18px;border-radius:5px;padding:0 20px;border:1px solid #c1c1c1;box-sizing:border-box}input[type=text]:focus{border:2px solid #3c87ff;outline:none;box-sizing:border-box}.addlist-btn,.add-btn,.close-modal-btn{font-family:Lexend;border:none;outline:none;color:#fff;cursor:pointer;font-size:15px;padding:7px 13px;letter-spacing:.3px;border-radius:5px;transition:transform .25s ease;background:linear-gradient(135deg,#1798fb 0%,#2d5cfe 100%)}.add-btn{width:100%;height:40px;border-radius:5px;margin-top:10px;font-size:1.2rem}.form-btn{cursor:pointer}.close-modal-btn{width:100%;margin:10px auto}input[type=text]::placeholder{color:#ddd}.tasks-list{display:flex;align-items:center;justify-content:space-evenly;background-color:#4ab1ff;width:100%;margin:10px auto;padding:10px 30px;color:#fff;box-sizing:border-box;text-align:left;border-radius:5px;cursor:pointer}.tasks-container{margin:10px}.tasks-container:not(:last-child){border-bottom:1px solid #c5c5c5}.close-tasklist-btn{cursor:pointer;position:absolute;top:20px;right:20px;opacity:40%}.close-tasklist-btn:hover{opacity:100}.tasks-list-heading{flex-grow:1}.task{width:90%;margin:auto;padding:20px 5px;display:flex;box-sizing:border-box;align-items:center;justify-content:space-between}.task-completed{opacity:50%;width:90%;margin:auto;padding:20px 5px;display:flex;box-sizing:border-box;align-items:center;justify-content:space-between}.marked-through{text-decoration:line-through}.remove-icon{min-width:17px;cursor:pointer;margin-left:auto}input[type=checkbox]{min-width:20px;min-height:20px;margin-right:15px}input[type=checkbox]:checked{accent-color:#1798fb;min-width:20px;min-height:20px}.svg-icon{fill:gray}.tasks-list .svg-icon{fill:#2d5cfe}.svg-icon:hover{fill:#ff3f5b}.modal{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:9999;background-color:#fff;padding:50px;box-shadow:0 0 10px #0000004d}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;z-index:9998}