form{width:100%}.input-container{width:100%;height:60px;margin-top:36px;border-radius:5px;display:flex;align-items:center;justify-content:space-between;overflow:hidden}.circle{width:25px;height:25px;border-radius:100%;margin-left:20px;flex-shrink:0}input{flex-grow:1;height:100%;margin-left:25px;border:none;outline:none;font-size:18px;font-family:Josefin Sans,sans-serif;font-weight:600}header{display:flex;justify-content:space-between;align-items:center}header h1{font-size:40px;letter-spacing:13px;color:#fff}header .theme-toggle{background:none;border:none;cursor:pointer}.task-containert{width:100%;height:405px;margin-top:36px;border-radius:5px;overflow:hidden;display:flex;flex-direction:column}footer{min-height:50px;width:90%;display:flex;align-items:center;justify-content:space-between;margin:0 auto;color:#484b6a;font-size:14px}footer button{border:none;outline:none;background-color:transparent;color:inherit;cursor:pointer}footer .dark-hover:hover{color:#fafafa}footer .light-hover:hover{color:#161722}footer .task-filters{display:flex;gap:15px}footer .task-filters .selected{color:#3a7bfd;font-weight:700}.tasks-list{flex-grow:1;overflow-y:auto;scrollbar-width:none;-ms-overflow-style:none}.todo-task .todo-task__container{width:95%;height:60px;display:flex;justify-content:space-between;cursor:pointer}.todo-task .todo-task__container .todo-task__info{display:flex;align-items:center;justify-content:space-between}.todo-task .todo-task__container .todo-task__info .todo-task__status-indicator{width:25px;height:25px;border-radius:100%;margin-left:20px;flex-shrink:0;display:flex;justify-content:center;align-items:center}.todo-task .todo-task__container .todo-task__info .todo-task__status-indicator .circleColor{width:100%;height:100%;border-radius:100%;display:flex;justify-content:center;align-items:center;background:linear-gradient(#57ddff,#c058f3)}.todo-task .todo-task__container .todo-task__info .dark:hover{border:1px solid transparent;background:linear-gradient(#393a4c,#393a4c) padding-box,linear-gradient(#57ddff,#c058f3) border-box;border-radius:50%}.todo-task .todo-task__container .todo-task__info .light:hover{border:1px solid transparent;background:linear-gradient(#fff,#fff) padding-box,linear-gradient(#57ddff,#c058f3) border-box;border-radius:50%}.todo-task .todo-task__container .todo-task__info .todo-task__text{display:flex;align-items:center;margin-left:20px}.todo-task .todo-task__container .todo-task__delete-btn{padding:8px;border:none;background:transparent;border-radius:9999px;transition:background .2s ease;cursor:pointer}*{margin:0;padding:0;box-sizing:border-box}body{width:100%;min-height:100vh;font-family:Josefin Sans,sans-serif}.containert{position:relative;width:100%;min-height:100vh;padding-bottom:100px;overflow-y:auto}.topImage{position:absolute;top:0}main{position:relative;width:min(515px,90%);top:78px;margin:auto}