body{font-family:Arial,Helvetica,sans-serif;margin:0;min-height:100vh;display:flex;justify-content:center;background-image:url(../../background.jpeg);background-size:cover;background-repeat:no-repeat;padding:40px 20px;box-sizing:border-box}.container{max-width:500px;width:100%;background-color:#0000004d;padding:30px;border-radius:10px;color:#fff;box-shadow:0 4px 12px #0003}h2{text-align:center;font-size:30px}.form-group{display:flex;flex-direction:row;margin:20px;width:auto;justify-content:center}input[type=text]{padding:10px;width:300px;margin-right:10px;font-size:15px;border-radius:5px;border:none}input[type=text]:focus{outline:none}.add-button{background-color:#261c51;color:#f0f0f0;font-weight:700;border:1px solid white;padding:10px;border-radius:5px}button:hover{background-color:#2c215f;cursor:pointer}ol{max-height:400px;overflow-y:auto;padding:0;margin:0 auto}ol::-webkit-scrollbar{width:8px}ol::-webkit-scrollbar-track{background:transparent}ol::-webkit-scrollbar-thumb{background-color:#888;border-radius:10px}ol::-webkit-scrollbar-thumb:hover{background-color:#555}li{display:flex;justify-content:space-between;align-items:center;background-color:#000;padding:15px;margin-bottom:10px;border-radius:5px;color:#e6e6e6;list-style-type:none}.buttons{display:flex;gap:10px}.buttons button{background-color:transparent;border:none;color:#fff;font-size:16px;cursor:pointer}.delete-button:hover{color:#fe4d4d}.edit-button:hover{color:#4d7ffe}.done-button:hover{color:#4bff78}.not-done-button:hover{color:#ff6c7f}.completed{text-decoration:line-through;color:gray}.move-button-up:hover{color:#f8ff22}.move-button-down:hover{color:#9ea300}.task-summary{text-align:center}.filter-buttons{display:flex;justify-content:center;align-items:center;gap:10px;margin:20px 0}.filter-buttons button{border:none;background-color:transparent;color:#d9d9d9;font-size:14px;padding:8px 12px;cursor:pointer;border-bottom:2px solid transparent;transition:border-color .3s ease}.filter-buttons button.active{border-bottom:2px solid white}.no-tasks-message{text-align:center;color:#a3a3a3}.clear-button{text-align:center;background-color:#7676764a;color:#fff;border:none;float:right;justify-content:end;padding:8px;border-radius:5px;margin:5px}.clear-button:hover{background-color:#6c6c6c33}.input-error{border:2px solid #ff4848!important}.error-message{color:#ff4848;text-align:center}