:root[data-theme=light]{--bg-mobile: url(/To-do-list/assets/bg-mobile-light-eXTHhUPU.jpg);--bg-desktop: url(/To-do-list/assets/bg-desktop-light-BIdKokTn.jpg);--bg-color: whitesmoke;--bg-input: white;--font-color-input: hsl(235, 19%, 35%);--font-color-todo-item: hsl(235, 19%, 35%);--font-color-checked-item: hsl(236, 9%, 61%);--font-filter-active: hsl(220, 98%, 61%);--font-filter-text: hsl(234, 11%, 52%);--filter-hover: hsl(236, 9%, 61%);--border-bottom: hsl(236, 33%, 92%)}:root[data-theme=dark]{--bg-mobile: url(/To-do-list/assets/bg-mobile-dark-DBhZPurk.jpg);--bg-desktop: url(/To-do-list/assets/bg-desktop-dark-DzAvO98h.jpg);--bg-color: hsl(235, 21%, 11%);--bg-input: hsl(235, 24%, 19%);--font-color-input: white;--font-color-todo-item: hsl(234, 39%, 85%);--font-color-checked-item: hsl(234, 11%, 52%);--font-filter-active: hsl(220, 98%, 61%);--font-filter-text: hsl(234, 11%, 52%);--filter-hover: hsl(236, 33%, 92%);--border-bottom: hsl(233, 14%, 35%)}*{margin:0;padding:0;box-sizing:border-box;font-family:Josefin Sans,sans-serif;--check-background: linear-gradient(hsl(192, 100%, 67%), hsl(280, 87%, 65%))}body{background-image:var(--bg-mobile);background-repeat:no-repeat;background-size:100% auto;background-color:var(--bg-color);display:flex;justify-content:center}.container{width:100vw}.header-wrapper{display:flex;flex-direction:column;margin-top:25px;padding:0 20px}.header-container{display:flex;justify-content:space-between;align-items:center;padding-top:30px;padding-left:15px;padding-right:15px}.page-heading{letter-spacing:10px;font-weight:700;font-size:2rem;color:#fff}.header-logo{cursor:pointer}.header-input{all:unset;margin-top:20px;padding:15px;border-radius:6px;background-color:var(--bg-input);color:var(--font-color-input)}.list-item-container{display:flex;flex-direction:column;border-radius:6px;background-color:var(--bg-input);margin:20px;overflow:hidden}.listitem{display:flex;align-items:center;border-bottom:1px solid var(--border-bottom);padding:15px;min-height:60px}.input-check{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:20px;height:20px;border:1px solid hsl(234,39%,85%);border-radius:50%;position:relative;cursor:pointer;background-color:transparent}.input-check:hover{background:var(--check-background);border:none}.input-check:checked{background:var(--check-background);border:none}.input-check:checked:after{content:"";background-image:url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='11'%20height='9'%3e%3cpath%20fill='none'%20stroke='%23FFF'%20stroke-width='2'%20d='M1%204.304L3.696%207l6-6'/%3e%3c/svg%3e");background-repeat:no-repeat;background-position:center;width:19px;height:19px;display:block}.list-body{display:flex;width:100%;align-items:center;justify-content:space-between;margin-left:10px}.item{cursor:pointer;font-size:1rem;color:var(--font-color-todo-item)}.check{text-decoration:line-through;color:var(--font-color-checked-item)}.list-options{display:flex;justify-content:space-between;padding:15px;font-size:.9rem;color:var(--font-filter-text)}.filter-buttons{display:flex;justify-content:space-evenly;margin:20px;padding:15px;border-radius:6px;background-color:var(--bg-input);color:var(--font-filter-text)}.filter-buttons span{cursor:pointer;transition:color .2s ease;font-weight:700}.filter-buttons span:hover{color:var(--filter-hover)}.active{color:var(--font-filter-active)}.filter-button-desktop{display:none}.clear-button{cursor:pointer}.clear-button:hover{color:var(--filter-hover)}@media (min-width: 768px){body{background-image:var(--bg-desktop)}.container{width:60vw}.header-wrapper{margin-top:50px}.header-input{margin-top:30px}.list-item-container{margin-top:15px}.filter-buttons{display:none}.filter-button-desktop{display:flex;cursor:pointer;gap:20px;font-weight:700;transition:color .2s ease}.filter-button-desktop span:hover{color:var(--filter-hover)}}