@import"https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap";@import"https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200";::-webkit-scrollbar{width:10px}::-webkit-scrollbar-track{box-shadow:inset 0 0 5px #ffb5bc;border-radius:10px}::-webkit-scrollbar-thumb{background:#ffb5bc;border-radius:10px}::-webkit-scrollbar-thumb:hover{background:#ffb5bc80}*{-webkit-user-select:none;user-select:none;font-family:Nunito}body{margin:0;padding:0}.app{position:fixed;top:0;left:0;width:100vw;height:100vh;display:flex;flex-direction:column;align-items:center;background:url(https://i.postimg.cc/wjjFMQcB/pexels-mdsnmdsnmdsn-1831234.jpg);background-size:cover;background-position:center}.header{width:100%;height:70px;background:#ffb5bc99;box-shadow:0 8px 32px #0000001a;display:flex;align-items:center}.headerIcon{margin:0 3px 0 20px;font-size:45px;color:#fff;font-variation-settings:"FILL" 1}.headerTitle{color:#fff}.content{width:100%;display:flex;flex-grow:1;justify-content:center}.container{margin:50px 0 0;display:flex;flex-direction:column;align-items:center}.addInputContainer{width:auto;height:auto;display:flex;flex-direction:row;justify-content:center;transform:translate(35px)}.addInputBox{display:flex;align-items:center;justify-content:center;width:500px;max-width:85vw;height:50px;outline:6px solid rgba(255,181,188,.4);border-radius:10px;box-shadow:0 2px 8px #0000001a}.addInputBox:hover{outline:9px solid rgba(255,181,188,.4);animation:inputActive .2s ease-in-out}.addInput{width:70%;height:48px;font-size:20px;text-align:center;outline:none;border:none;border-radius:10px 0 0 10px;background:#fff9}.timeInput{padding:10px;width:30%;height:30px;font-size:16px;font-weight:700;text-align:center;outline:none;border:none;border-left:5px solid rgba(255,181,188,.6);border-radius:0 10px 10px 0;background:#fff9}.timeInput:hover{cursor:pointer}.addButton{margin:-12px 0 0 20px;width:70px;height:70px;display:flex;align-items:center;justify-content:center;color:#fff;border-radius:50%;background:#ffb5bc;box-shadow:0 2px 8px #0000001a}.addButton:hover{outline:9px solid rgba(255,181,188,.4);animation:buttonActive .2s ease-in-out;cursor:pointer}.addButton:active{filter:brightness(1.1)}.addButtonIcon{font-variation-settings:"wght" 600;font-size:30px}.listContainer{margin:30px 0 40px;width:600px;max-width:90vw;height:0px;flex-grow:1;background:#fff9;border-radius:10px;box-shadow:0 4px 8px #0000001a;display:flex;align-items:center;justify-content:center}.listBox{padding:20px 0;width:90%;height:80%;display:flex;flex-direction:column;align-items:center;overflow-y:auto}.listItem{margin:15px 0;width:100%;display:flex;flex-direction:row;justify-content:center}.listItemDeleted{animation:listItemDeleted .2s ease-in-out}.itemIndex{color:#ffb5bc;font-weight:700;margin:0 0 0 20px;font-size:24px}.itemValue{text-align:center;word-break:break-word;width:70%;margin:0 20px;padding:0 10px;font-size:20px;border-bottom:3px solid rgb(255,181,188)}.itemValue:hover{cursor:pointer}.itemSwitchButtons{margin:-9px 10px 0 7px;display:flex;flex-direction:column;color:#ffb5bc}.itemSwitchButton{font-variation-settings:"wght" 600}.itemSwitchButton:hover{outline:3px solid rgba(255,181,188,.4);border-radius:50%;animation:switchActive .2s ease-in-out;cursor:pointer}.itemSwitchButton:active{filter:brightness(1.1)}.itemDeleteButton{margin:-10px 0 0;width:50px;min-width:50px;height:50px;min-height:50px;display:flex;align-items:center;justify-content:center;color:#fff;border-radius:50%;background:#ffb5bc;box-shadow:0 2px 8px #0000001a}.itemDeleteButton:hover{outline:9px solid rgba(255,181,188,.4);animation:buttonActive .2s ease-in-out;cursor:pointer}.itemDeleteButton:active{filter:brightness(1.1)}@media screen and (max-width: 700px){.headerIcon{margin:0 3px 0 10px}.container{margin:30px 0 0}.addInputContainer{flex-direction:column;align-items:center;justify-content:normal;transform:translate(0)}.addButton{margin:20px 0 0 17px}.listContainer{margin:20px 0}}@keyframes inputActive{0%{outline-width:6px}to{outline-width:9px}}@keyframes buttonActive{0%{outline-width:0px}to{outline-width:10px}}@keyframes switchActive{0%{outline-width:0px}to{outline-width:3px}}
