@import url(https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&family=Roboto:wght@100&display=swap);*{box-sizing:border-box;color:#fff;font-family:Poppins,sans-serif;margin:0;outline:none;padding:0}:root{--bg-color-dark:#282c34;--bg-black-input:rgba(71,71,71,.8);--white:#fcfcfc;--red:#ff6262;--red-hover:#fc4c4c;--purple:#c464fc;--purple-hover:#ad21fd;--green:#6cd47e;--green-hover:#58c46a;--input-focused:hsla(0,7%,97%,.1);--bg-gradient-text:linear-gradient(90deg,#86bdf5,#ba44ff);--bg-gradient-primary:linear-gradient(90deg,#4078af,#a200ff);--bg-gradient-primary-hover:linear-gradient(90deg,#376ca1,#9102e3);--gap-sm:0.5rem;--gap-md:0.8rem;--gap-l:1rem;--text-regular:13px;--text-medium:16px;--texte-large:21px;--text-extraLarge:32px;--text-weight-regular:200;--text-weight-bold:500;--border-sm:12px;--border-md:18px;--border-large:25px}.App{background-color:#282c34;background-color:var(--bg-color-dark);display:grid;grid-template-columns:30% 70%;height:100vh;width:100%}.title_app{font-size:32px;font-size:var(--text-extraLarge);grid-column:1/2;padding:1rem;position:absolute;text-align:center;width:100%}.form_container{height:100%;width:100%}.form_container,.itemContainer{align-items:center;display:flex;flex-direction:column;justify-content:center}.itemContainer{gap:1rem;gap:var(--gap-l)}.buttons{border:none;border-radius:25px;border-radius:var(--border-large);cursor:pointer;display:grid;place-content:center}.button_primary{background:linear-gradient(90deg,#4078af,#a200ff);background:var(--bg-gradient-primary);height:12%;width:80%}.button_primary:hover{background:linear-gradient(90deg,#376ca1,#9102e3);background:var(--bg-gradient-primary-hover)}.danger_button{background-color:#ff6262;background-color:var(--red);padding:4px}.danger_button:hover{background-color:#fc4c4c;background-color:var(--red-hover);box-shadow:0 1px 10px 0 hsla(0,100%,80%,.315)}.button_trash{padding:8px}.edit_buttom{background-color:#c464fc;background-color:var(--purple);padding:6px}.edit_buttom:hover{background-color:#ad21fd;background-color:var(--purple-hover);box-shadow:0 1px 10px 0 rgba(239,156,255,.295)}.button_confirm{background-color:#6cd47e;background-color:var(--green);padding:4px}.button_confirm:hover{background-color:#58c46a;background-color:var(--green-hover);box-shadow:0 1px 10px 0 rgba(121,255,155,.295)}.add_button{background-color:#ff6262;background-color:var(--red);display:none;padding:8px}.add_button:hover{background-color:#fc4c4c;background-color:var(--red-hover);box-shadow:0 1px 10px 0 hsla(0,100%,80%,.315)}.close_button{border-radius:50%;display:none}.txtInput{border-radius:12px;border-radius:var(--border-sm);color:#fcfcfc;color:var(--white)}.txtArea,.txtInput{background-color:rgba(71,71,71,.8);background-color:var(--bg-black-input);border:none;font-size:13px;font-size:var(--text-regular);font-weight:200;font-weight:var(--text-weight-regular);padding:.5rem 1rem}.txtArea{border-radius:12px;border-radius:var(--border-sm);resize:none}.txtArea:focus,.txtInput:focus{border:1px solid hsla(0,7%,97%,.1);border:1px solid var(--input-focused)}.formTask{align-items:center;background-color:rgba(63,63,63,.5);border-radius:25px;border-radius:var(--border-large);box-shadow:0 8px 32px 0 hsla(0,0%,54%,.17);display:flex;flex-direction:column;justify-content:space-between;padding:1rem .2rem}.area_form,.formTask{height:50%;width:80%}.input_form{width:80%}.taskItemContainer{align-items:center;background-color:#3f3f3f;border-radius:18px;border-radius:var(--border-md);display:flex;justify-content:space-between;padding:.5rem 1rem;width:60%}.taskItem{display:flex;flex-direction:column;gap:.5rem;gap:var(--gap-sm);width:80%}.taskItem label{background:linear-gradient(90deg,#86bdf5,#ba44ff);background:var(--bg-gradient-text);-webkit-background-clip:text;color:transparent;cursor:pointer;font-size:16px;font-size:var(--text-medium);font-weight:500;font-weight:var(--text-weight-bold)}.description_container{display:flex;font-weight:200;font-weight:var(--text-weight-regular);gap:.5rem;gap:var(--gap-sm)}.description_container,.info_description{font-size:13px;font-size:var(--text-regular)}.info_description{height:auto;width:90%}.title_label{font-size:16px;font-size:var(--text-medium)}.item_top{align-items:flex-start;display:flex;gap:.8rem;gap:var(--gap-md)}.check{-webkit-tap-highlight-color:transparent;cursor:pointer;height:18px;margin:auto;position:relative;-webkit-transform:translateZ(0);transform:translateZ(0);width:18px}.check:before{background:rgba(34,50,84,.03);border-radius:50%;content:"";height:48px;left:-15px;opacity:0;position:absolute;top:-15px;transition:opacity .2s ease;width:48px}.check svg{fill:none;stroke-linecap:round;stroke-linejoin:round;stroke:#c8ccd4;stroke-width:1.5;position:relative;-webkit-transform:translateZ(0);transform:translateZ(0);transition:all .2s ease;z-index:1}.check svg path{stroke-dasharray:60;stroke-dashoffset:0}.check svg polyline{stroke-dasharray:22;stroke-dashoffset:66}.check:hover:before{opacity:1}.check:hover svg,.checkGreen:checked+.check svg{stroke:#a3e583;stroke:var(--accent-color,#a3e583)}.checkGreen:checked+.check svg path{stroke-dashoffset:60;transition:all .3s linear}.checkGreen:checked+.check svg polyline{stroke-dashoffset:42;transition:all .2s linear;transition-delay:.15s}.formTaskUpdating{display:flex;justify-content:space-around;width:100%}.containerInputsUpdating{display:flex;flex-direction:column;gap:.5rem;gap:var(--gap-sm);width:80%}.containerButtonsUpdating{align-items:center;display:flex;flex-direction:column;justify-content:space-around}@media only screen and (max-width:600px){.App{grid-template-columns:1fr}.form_container{background-color:#282c34;background-color:var(--bg-color-dark);bottom:0;height:90%;justify-content:space-around;padding:3rem 0;position:absolute;z-index:100}.asideVisible{left:0}.asideNotVisible{left:-150%}.formTask{height:70%;justify-content:space-around}.close_button{bottom:5%;display:grid;padding:8px}.add_button{border-radius:50%;bottom:8%;display:grid;position:absolute;right:8%}.taskItemContainer{width:90%}.taskItem{width:75%}}
/*# sourceMappingURL=main.e7ced800.css.map*/