@import"https://fonts.googleapis.com/css2?family=Nunito+Sans:ital,wght@0,300;0,400;0,600;0,700;0,900;1,300;1,700&display=swap";h3{color:var(--orange);margin:16px 0}h3 strong{color:#fff;font-size:1.6rem}.search-container{display:flex;align-items:center;gap:.5rem;max-width:400px;min-width:300px;color:var(--orange);padding-right:1rem;margin:16px auto 32px;border-bottom:2px solid var(--orange)}.search-container input{height:2rem;width:100%;padding:0 1rem;background:transparent;color:#fff}.search-container input::-webkit-search-cancel-button{color:#fff;background:white}h4{margin-top:10px;margin-bottom:20px}.todo-list{display:flex;flex-direction:column;gap:10px;max-width:500px}.task{display:flex;align-items:center;gap:20px;width:100%;background:var(--orange);padding:1rem 2rem;min-height:3.5rem}.task:hover{transform:scale(1.02)}.task.completed{background:white;color:var(--orange)}.task.completed p{text-decoration:line-through}.task p{width:100%}.task .check,.task .trash{display:grid;place-items:center;cursor:pointer;border-radius:50%}.task .trash:hover{background:white;color:var(--orange);transition:.1s}.add-todo-form{background:white;padding:2rem 1.5rem;width:330px;border-radius:1px;color:var(--orange)}.add-todo-text{border:none;width:100%;min-height:120px;outline:none;padding:1rem 0;margin:0 auto}.buttons{margin-top:2rem;padding:0 2rem;display:flex;justify-content:space-between}.buttons .button{outline:none;border:none;cursor:pointer;padding:1rem 2rem}.button-orange{background:var(--orange);color:#fff}.button-orange:hover{background:white;color:var(--orange)}.create-button{width:50px;height:50px;border-radius:50%;background:var(--orange);display:grid;place-items:center;font-size:2rem;font-weight:700;position:fixed;right:5%;bottom:10%;cursor:pointer;z-index:100;box-shadow:0 0 20px 2px var(--orange)}.create-button:hover{background:white;color:var(--orange)}@media (min-width: 768px){.create-button{right:calc(50% - 300px)}}.bg-modal{position:fixed;top:0;left:0;width:100%;height:100%;backdrop-filter:blur(5px);display:grid;place-items:center}.empity-list{margin-top:3rem;display:flex;flex-direction:column;align-items:center;justify-content:center}.empity-list svg{width:100px;height:100px}.empity-list p{margin-top:2rem}.todo-list .loading{background:var(--orange);height:3.5rem;position:relative}.todo-list .loading:after{content:"";position:absolute;width:90%;height:.8rem;top:50%;left:50%;transform:translate(-50%,-50%);background:white;animation:sk-animation 1s infinite ease-in-out}@keyframes sk-animation{0%,to{background:rgb(214,214,214)}50%{background:white}}.storage-alert-container{position:fixed;top:0;left:0;width:100%;height:100%;backdrop-filter:blur(10px);display:grid;place-items:center}.storage-alert-container .storage-alert{background:var(--orange);width:330px;min-height:100px;gap:16px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem 1rem}.storage-alert-container .storage-alert .message{font-weight:700;display:flex;gap:8px;align-items:center}.storage-alert-container .storage-alert .message svg{width:50px;height:50px}.storage-alert-container .storage-alert .refresh-button{background:white;color:var(--orange);padding:.5rem 1rem;cursor:pointer;display:flex;align-items:center;gap:4px}.storage-alert-container .storage-alert .refresh-button:hover{color:#fff;background:var(--orange);border:2px solid white}:root{--dark: #0e0e0e;--orange: rgb(255, 98, 0)}*{margin:0;padding:0;box-sizing:border-box;transition:.25s}html,body{font-family:Nunito Sans,sans-serif;background:var(--dark);color:#fff}input{outline:none;border:none}.container{max-width:500px;margin:0 auto;padding:2rem;position:relative}.text-center{text-align:center}.app{display:flex;flex-direction:column}.app h2{font-size:2rem}.app h2 strong{color:var(--orange)}
