@import"https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap";*{margin:0;padding:0}body{font-family:Inter,sans-serif;background-color:#1a1a1a}header{display:flex;align-items:center;justify-content:center;background-color:#0d0d0d;padding:80px}header .header_name{font-optical-sizing:auto;font-size:40px;font-weight:700;margin-left:10px}header .logo_initial_name{color:#4ea8de}header .logo_initial_end{color:#5e60ce}main{margin-top:-30px}main .input_container{display:flex;justify-content:center;max-width:800px;margin:auto}main .input_container .input_box{background-color:#262626;border-radius:5px;flex:1;padding:20px;font-size:16px;border:none;stroke:#0d0d0d;color:gray;outline:none}main .input_container .add_task_btn{margin-left:10px;background-color:#1e6f9f;border:none;padding:10px 15px;border-radius:8px;color:#f2f2f2;display:flex;align-items:center;object-fit:contain}main .input_container .add_task_btn .add_task_btn_name{font-size:16px}main .input_container .add_task_btn .add_task_btn_icon{margin-left:5px;font-size:20px;margin-top:4px}main{max-width:600px;margin:-30px auto auto}main .todo_list_info{margin:40px auto auto;display:flex;justify-content:space-between}main .todo_list_info .todo_list_left_info .task_created_label{font-size:14px;color:#4ea8de;font-weight:500}main .todo_list_info .todo_list_right_info .task_created_label{font-size:14px;color:#8284fa;font-weight:500}main .todo_list_info .todo_list_left_info .task_created_count,main .todo_list_info .todo_list_right_info .task_created_count{background-color:#262626;color:#d9d9d9;font-size:12px;display:inline-block;padding:5px;border-radius:10px;font-weight:700}main .todo_list_items{margin-top:20px;max-height:400px;overflow-y:scroll}main .todo_list_items .todo_item{display:flex;align-items:flex-start;margin-bottom:12px;padding:20px;border-radius:5px;background-color:#262626}main .todo_list_items .todo_item .todo_item_description{font-size:14px;display:inline-block;color:#f2f2f2;padding-left:15px;padding-right:15px;flex:1}main .todo_list_items .todo_item .todo_item_description.line-through{text-decoration:line-through;color:gray}main .todo_list_items .todo_item .todo_item_icon{color:#4ea8de;font-size:20px;cursor:pointer}main .todo_list_items .todo_item .todo_item_delete_icon{color:gray;font-size:20px;cursor:pointer}main .todo_list_items .todo_item .todo_item_delete_icon:hover{color:red}main .todo_list_empty{background-color:#262626;color:gray;padding:80px 20px;border-radius:5px;display:flex;align-items:center;justify-content:center}main .todo_list_items::-webkit-scrollbar{width:8px}main .todo_list_items::-webkit-scrollbar-track{background:#1a1a1a;border-radius:4px}main .todo_list_items::-webkit-scrollbar-thumb{background:#4ea8de;border-radius:4px;transition:background .3s ease}main .todo_list_items::-webkit-scrollbar-thumb:hover{background:#5e60ce}main .todo_list_items{scrollbar-width:thin;scrollbar-color:#4ea8de #1a1a1a}