@font-face{font-family:Josefin Sans;src:url(/assets/JosefinSans-VariableFont_wght-4CYtYlBz.ttf) format("truetype");font-weight:100 900;font-style:normal}*{margin:0;padding:0;box-sizing:border-box;font-family:var(--font);font-family:Josefin Sans,sans-serif}:root{font-size:62.5%;--blue500: hsl(220, 98%, 61%);--light-blue: hsl(192, 100%, 67%);--pink: hsl(280, 87%, 65%);--white: #fff}[data-theme=dark]{--background-color-one: hsl(235, 21%, 11%);--background-color-two: hsl(235, 24%, 19%);--color-one: hsl(234, 39%, 85%);--Light-Grayish-Blue-hover: hsl(236, 33%, 92%);--color-two: hsl(234, 11%, 52%);--color-three: hsl(233, 14%, 35%);--bg-img: url(/assets/bg-mobile-dark-DBhZPurk.jpg);--bg-img-dsk: url(/assets/bg-desktop-dark-DzAvO98h.jpg)}[data-theme=light]{--background-color-two: hsl(0, 0%, 98%);--background-color-one: hsl(236, 33%, 92%);--color-three: hsl(233, 11%, 84%);--color-two: hsl(236, 9%, 61%);--color-one: hsl(235, 19%, 35%);--bg-img: url(/assets/bg-mobile-light-eXTHhUPU.jpg);--bg-img-dsk: url(/assets/bg-desktop-light-BIdKokTn.jpg)}body{width:100%;min-height:100vh;background-color:var(--background-color-one)}li{list-style:none}p{font-size:1.3rem}img{width:100%;display:block}.container{width:85%;max-width:60rem;margin:0 auto}.bg__only{display:none}.header{height:35vh;width:100%;background:var(--bg-img) center/cover no-repeat;transition:1s}@media(prefers-reduced-motion:reduce){*{transition:none}}.header__nav{padding:5rem 0 0;display:flex;justify-content:space-between;align-items:center}.logo{font-size:2.6rem;letter-spacing:1rem;color:var(--white)}.theme__btn{background-color:transparent;border:none}.main{position:relative;top:-10rem}.input__con{width:100%;position:relative}.todo__input{width:100%;height:5rem;border:0;border-radius:.7rem;padding:0 0 0 5rem;outline:none;font-size:1.6rem;background-color:var(--background-color-two);color:var(--color-one)}.input__circle{position:absolute;top:50%;left:2.5rem;translate:-50% -50%;width:2rem;height:2rem;border-radius:50%;background-color:var(--white)}.input__circle:before{content:"";position:absolute;inset:0;padding:.03rem;border-radius:50%;background:linear-gradient(120deg,var(--light-blue),var(--pink));-webkit-mask-image:linear-gradient(var(--white) 0 0),linear-gradient(var(--white) 0 0);mask-image:linear-gradient(var(--white) 0 0),linear-gradient(var(--white) 0 0);-webkit-mask-origin:content-box,border-box;mask-origin:content-box,border-box;mask-clip:content-box,border-box;mask-composite:exclude;-webkit-mask-composite:xor}.check{border-radius:50%;width:2rem;height:2rem;position:absolute;top:50%;left:2.5rem;translate:-50% -50%;display:flex;align-items:center;justify-content:center;cursor:pointer}.check:before{content:"";position:absolute;inset:0;padding:.03rem;border-radius:50%;background:linear-gradient(120deg,var(--light-blue),var(--pink));-webkit-mask-image:linear-gradient(var(--white) 0 0),linear-gradient(var(--white) 0 0);mask-image:linear-gradient(var(--white) 0 0),linear-gradient(var(--white) 0 0);-webkit-mask-origin:content-box,border-box;mask-origin:content-box,border-box;mask-clip:content-box,border-box;mask-composite:exclude;-webkit-mask-composite:xor}.check:hover:before{padding:.15rem}.check img{width:1rem;opacity:0}.done .check img{opacity:1}.empty__list{font-size:1.4rem;text-align:center;padding:2rem 1.8rem 2.8rem 2rem;border-block-end:.1rem solid var(--color-three)}.list__item,.details{position:relative;height:5rem;display:flex;align-items:center;justify-content:space-around;padding-inline-end:2rem}.list__item{cursor:pointer;font-size:1.2rem;border-bottom:1px solid var(--color-three);padding:2.8rem 1.8rem 2.8rem 2.8rem}.todo__main{width:100%;background-color:var(--background-color-two);border-radius:.7rem;margin-block-start:2rem;color:var(--color-one)}.cross{width:1.3rem;margin-inline-start:auto;cursor:pointer}.text{margin-inline-start:2rem;cursor:pointer}.details{padding:2.8rem 2rem;justify-content:space-between;color:var(--color-two)}.clear{cursor:pointer}.filter{width:100%;display:flex;padding:2rem 0;background-color:var(--background-color-two);margin-block-start:2rem;border-radius:.6rem;justify-content:center;gap:4rem}.filter__nav{font-size:1.5rem;font-weight:700;color:var(--color-two);margin-inline:1rem;cursor:pointer}.filter__nav:hover{color:var(--color-one)}.selected{color:var(--blue500)}.drag__text{text-align:center;font-size:1.5rem;color:var(--color-two);margin:4rem auto}.attribution{text-align:center;font-size:1.5rem;color:var(--color-two)}.attribution a{color:var(--blue500);font-weight:700;text-decoration:none}.done .text{text-decoration:line-through;color:var(--color-three)}.done .check{background:linear-gradient(120deg,var(--light-blue),var(--pink));border:none}@media screen and (min-width:45rem){.header{background:var(--bg-img-dsk) center/cover no-repeat}.bg__only{display:block}.filter{gap:3rem}.sm__only{display:none}.bg__only .filter{margin-block-start:0}.list__item{font-size:1.4rem;padding:3rem 1.8rem 3rem 3rem}.list__item:hover{font-weight:700}.list__item:hover .cross{opacity:1}}@media screen and (min-width:80rem){.cross{opacity:0}}