@import"https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap";.todoinputbase{width:100%;display:flex;justify-content:center;gap:1rem}.todoinputbase>input{width:66%;padding:.5rem;border:none;background-color:#fff;opacity:.7;border-radius:1rem}.todoinputbase>input::placeholder{font-weight:600;color:#000;text-transform:capitalize}.todoinputbase .addbutton{background-color:#60a5fa;padding:.5rem;display:flex;justify-content:center;align-items:center;border-radius:.8rem;border:none}.todoinputbase .addbutton:hover{background-color:#3b82f6}@media screen and (max-width: 475px){.todoinputbase{gap:1rem}.todoinputbase>input{width:70%;padding:.5rem}.todoinputbase>input::placeholder{font-size:.9rem}.todoinputbase .addbutton{padding:.3rem;margin:.1rem}}@media screen and (max-width: 390px){.todoinputbase{gap:.8rem}.todoinputbase>input{width:75%;padding:.5rem}.todoinputbase>input::placeholder{font-size:.8rem}.todoinputbase .addbutton{padding:.3rem;margin:.1rem;border:none}}.todobase{width:100%;display:flex;justify-content:center;gap:1rem;padding:1rem;border-radius:1rem;box-shadow:2px 2px 6px #000}.todobase .todotext{width:66%;border-radius:1rem;padding:.2rem;background-color:#216869;color:#fff;display:flex;text-transform:capitalize;border:none}.todobase .todotextmodification{vertical-align:center;text-decoration:line-through;text-transform:lowercase}.todobase .Editbtn{border-radius:.8rem;border:none}.todobase .Editbtn span{border:none;padding:.5rem;border-radius:.8rem;background-color:#60a5fa}.todobase .Editbtn span:hover{background-color:#3b82f6}.todobase .deletebtn{border-radius:.8rem;border:none}.todobase .deletebtn span{border:none;padding:.5rem;border-radius:.8rem;background-color:#60a5fa}.todobase .deletebtn span:hover{background-color:#3b82f6}.todoComplete{background-color:#49a078!important}.todoComplete .todotext{background-color:#49a078}.todonotComplete{background-color:#216869!important}@media screen and (max-width: 475px){.todobase{gap:.5rem;padding:.8rem}.todobase .todotext{width:75%;font-size:.8rem}.todobase .Editbtn span,.todobase .deletebtn span{display:flex;justify-content:center;align-items:center;width:100%;height:100%;font-size:18px;font-weight:600}}@media screen and (max-width: 390px){.todobase{gap:.2rem;padding:.8rem}.todobase .todotext{width:85%;font-size:.7rem}.todobase .Editbtn span,.todobase .deletebtn span{display:flex;justify-content:center;align-items:center;width:100%;height:100%;font-size:13px;font-weight:700}}*{margin:0;padding:0;box-sizing:border-box;font-family:Inter,sans-serif}.base{width:100%;min-height:100vh;display:flex;justify-content:center;align-items:center;flex-direction:column;background:linear-gradient(to left bottom,#032b43,#af3b6e);gap:1.5rem;overflow:auto}.base .inputbox{background-color:#136f63;width:66%;padding:2rem;display:flex;justify-content:center;align-items:center;flex-direction:column;gap:20px;border-radius:1rem;box-shadow:5px 10px 1rem #000;margin:1rem}.base .inputbox>p{text-transform:capitalize;font-size:1.5rem;color:#fff;text-align:center;letter-spacing:.02rem;font-weight:800}.base .inputbox>p:hover{text-decoration:underline}.base .todos{display:flex;justify-content:center;align-items:center;flex-direction:column;width:66%;gap:.5rem;margin:.5rem}.base .todos .eachtodo{width:100%}@media screen and (max-width: 475px){.base .inputbox{width:90%;padding:1rem;gap:10px}.base .inputbox>p{font-size:1.2rem}.base .todos{width:90%;gap:.3rem}}@media screen and (max-width: 390px){.base .inputbox{width:95%;padding:1rem;gap:10px}.base .inputbox>p{font-size:.8rem}.base .todos{width:95%;gap:.3rem}}@tailwind base;@tailwind components;@tailwind utilities;
