@import url(https://fonts.googleapis.com/css2?family=Nunito:wght@200;400;500&display=swap);:root{--bg-color:#94d8e3;--alt-bg-color:#0000004d;--font-color:#fff;--alt-font-color:#222;--primary-color:#607d8b;--secondary-color:#93b5c6}.dark{--bg-color:#003950;--alt-bg-color:#0000004d;--font-color:#fff;--alt-font-color:#222;--primary-color:#008e9f;--secondary-color:#00e4ff}*{box-sizing:border-box;margin:0;padding:0}body{background:#94d8e3;background:var(--bg-color);color:#fff;color:var(--font-color);font-family:Nunito,sans-serif;font-size:100%;min-height:100vh;padding:80px 0;position:relative;transition:all .3s linear}.container{background:#0000004d;background:var(--alt-bg-color);border-radius:20px;box-shadow:0 0 20px 0 #00000045;margin:0 auto;max-width:900px;padding:30px;text-align:center;width:80%}@media (max-width:768px){.container{padding:20px;width:90%}}.container .head{grid-gap:1%;display:grid;gap:1%;grid-template-columns:70% 29%;margin-bottom:50px;width:100%}@media (max-width:768px){.container .head{gap:5px;grid-template-columns:1fr}}.head input{background-color:#eee;border:none;outline:none;padding:13px 20px}.head input,button{border-radius:10px;font-family:inherit;font-size:.9rem}button{background-color:#607d8b;background-color:var(--primary-color);border:none;color:#fff;color:var(--font-color);cursor:pointer;font-weight:500;padding:10px 30px;transition:all .3s ease}button:hover{opacity:.7}.filter{align-items:center;display:flex;gap:5px;justify-content:center;margin:0 auto 40px}@media (max-width:576px){.filter{flex-direction:column}}.filter button.active{background-color:#93b5c6;background-color:var(--secondary-color);color:#333}.tasks-wrapper{color:#fff;color:var(--font-color);display:flex;flex-direction:column;gap:20px;list-style:none;max-height:400px;overflow-y:auto;padding:0 50px}@media (max-width:768px){.tasks-wrapper{gap:5px;padding:0 5px}}.task{align-items:center;background-color:#607d8b;background-color:var(--primary-color);border-radius:10px;display:flex;gap:5px;padding:4px 20px 5px 30px;text-align:left;transition:all .5s ease}.task p{flex:1 1;font-size:1rem;text-transform:capitalize}.task button{align-items:center;background-color:transparent;border-radius:50%;color:#222;color:var(--alt-font-color);display:flex;font-size:1rem;font-weight:700;height:40px;justify-content:center;padding:0;transition:.7s;width:40px}.task button:hover{background-color:#222;background-color:var(--alt-font-color);border-radius:10px;color:#607d8b;color:var(--primary-color);opacity:.85}.tasks-wrapper .task-done{opacity:.5}.tasks-wrapper .task-done p{font-style:italic;text-decoration:line-through}button.btn-delete-all{background-color:#ba0f30;margin-top:50px}.no-tasks{color:#fff;color:var(--font-color)}.alert{align-items:center;border-radius:.25rem;bottom:0;box-shadow:0 0 20px 0 #00000045;color:#222;color:var(--alt-font-color);font-size:.9rem;left:-100%;letter-spacing:var(--spacing);margin-bottom:1rem;text-align:center;text-transform:capitalize;transition:all .5s cubic-bezier(.6,-.28,.74,.05);width:230px}.alert,.color-container{background:#eee;display:grid;height:80px;position:absolute}.color-container{grid-gap:3px;border-radius:10px;gap:3px;grid-template-columns:repeat(3,1fr);padding:3px;width:100px;z-index:3}.color-container>span{border-radius:5px}::-webkit-scrollbar{border-radius:10px;width:.5rem}::-webkit-scrollbar-track{border-radius:10px;box-shadow:inset 0 0 6px rgba(0,0,0,.3)}::-webkit-scrollbar-thumb{background-color:#00b3b3;border-radius:10px;height:50px;outline:0 inset #7fffd4}.preventClick{pointer-events:none}.footer{bottom:0;margin:10px auto;position:absolute;text-align:center;width:100%}.github{color:#008b8b;font-size:2rem}.toggle-btn{position:absolute;right:20px;top:0}.toggle-btn input[type=checkbox]{visibility:hidden}.toggle-btn input[type=checkbox]:checked+label{background-color:#111;-webkit-transform:rotate(1turn);transform:rotate(1turn)}.toggle-btn input[type=checkbox]:checked+label:before{background-color:#f8ffaf;-webkit-transform:translateX(45px);transform:translateX(45px)}.toggle-btn label{border:3px solid #111;border-radius:99em;cursor:pointer;display:flex;height:45px;position:relative;-webkit-transform-origin:50% 50%;transform-origin:50% 50%;transition:-webkit-transform .5s ease-in-out;transition:transform .5s ease-in-out;transition:transform .5s ease-in-out,-webkit-transform .5s ease-in-out;width:90px}.toggle-btn label:before{background-color:#111;border-radius:50%;content:"";display:block;height:27px;left:6px;position:absolute;top:6px;transition:-webkit-transform 1s ease;transition:transform 1s ease;transition:transform 1s ease,-webkit-transform 1s ease;transition-delay:.5s;width:27px}
/*# sourceMappingURL=main.69a67861.css.map*/