@font-face{font-family:Roboto;font-style:regular;font-weight:400;font-display:swap;src:url(base/src/assets/font/Roboto-Regular.ttf)}@font-face{font-family:Roboto;font-style:medium;font-weight:500;font-display:swap;src:url(base/src/assets/font/Roboto-Medium.ttf)}html{width:100%;background-color:#fff}body{font-family:Roboto,-apple-system,BlinkMacSystemFont,Segoe UI,Noto Sans,Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji";margin:0 auto;padding:clamp(24px,5vw,48px);width:min(100%,60vw);box-sizing:border-box}#root{width:100%}.page{width:100%;max-width:760px;margin:0 auto;padding:0;display:flex;flex-direction:column;gap:clamp(24px,4vw,48px)}.componentBox{display:flex;flex-direction:column;gap:clamp(16px,3vw,24px);width:100%;box-sizing:border-box}.primaryFontColor{color:#33353c}.secondaryFontColor{color:#686d7d}@media (max-width: 1024px){body{width:100%;padding:clamp(16px,4vw,24px)}.page{gap:clamp(16px,3vw,24px)}}.pagetitle{font-size:2rem;font-weight:400;line-height:normal;margin:0}.bodyfontMedium,.bodyfontRegular{font-size:1rem;font-weight:500;line-height:1.25em;margin:0}.bodyfontRegular{font-weight:400}.labelfontMedium,.labelfontRegular{color:#fff;font-size:.75rem;font-weight:500;line-height:1em;margin:0}.labelfontRegular{color:#686d7d;font-weight:400;line-height:normal}.checked{text-decoration:line-through}.shoppingItemList,.shoppingItemListEmpty{background-color:#d3d5db;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;padding:0;box-sizing:border-box;width:100%;border-radius:24px;overflow:hidden}.shoppingItemListEmpty{background-color:#edf0f7;height:168px}.footer{display:flex;justify-content:center;align-items:center;width:100%}.footerInline{display:flex;gap:4px;padding-inline:16px}.inputFormContainer{position:relative;width:100%;display:flex;justify-content:center;gap:24px}.inputFormWrapper{width:100%}.inputForm{width:100%;flex:1;display:flex;gap:24px;padding:12px 12px 12px 16px;border:none;box-shadow:inset 0 0 0 1px #717685;border-radius:24px;box-sizing:border-box}.isLoading{cursor:not-allowed}.addButton,.addButtonDisabled,.addButtonEnabled{position:absolute;right:8px;top:50%;transform:translateY(-50%);width:32px;height:32px;display:flex;align-items:center;justify-content:center;border:none;border-radius:26px;cursor:pointer;box-sizing:border-box;padding:0}.addButtonEnabled{background-color:#3651d9}.addButtonDisabled{background-color:#d3d5db}.shoppingItemCardContainer{background-color:#edf0f7;position:relative;width:100%;height:100%}.swipeBackground{position:absolute;inset:0;display:flex;justify-content:space-between;align-items:center;padding:0 24px;box-sizing:border-box;background-image:linear-gradient(to right,#3651d9 0% 50%,#de2635 50% 100%);z-index:0}.swipeLabel{display:flex;flex-direction:column;gap:4px;align-items:center;justify-content:center;width:32px;height:32px}.shoppingItemCard{position:relative;z-index:1;background-color:#edf0f7!important;display:flex;align-items:center;gap:24px;box-sizing:border-box;padding:16px 24px;width:100%;-webkit-user-select:none;user-select:none}.shoppingItemCard:hover{background-color:#00000008}.shoppingItemCard:hover .deleteButton{opacity:1}.checkbox{width:20px;height:20px;border:none;box-shadow:inset 0 0 0 1px #717685;border-radius:6px;background-color:#fff;display:flex;align-items:center;justify-content:center;padding:0;cursor:pointer}.checkbox.checked{border:none;background-color:#000}.itemName{flex:1}.deleteButton{position:absolute;right:24px;top:50%;transform:translateY(-50%);width:32px;height:32px;display:flex;align-items:center;justify-content:center;background-color:transparent;border:none;border-radius:50%;cursor:pointer;opacity:0;transition:opacity .3s ease-in-out}.deleteButton:hover{background-color:#00000012}.addIcon{width:18px;height:19px;color:#fff}.emptyListIcon{width:40px;height:37px;color:#686d7d}.checkedIcon{width:15px;height:14px;color:#fff}.checkIcon{width:19px;height:19px;color:#fff}.deleteIconReverse,.deleteIcon{width:18px;height:19px;color:#fff}.deleteIcon{color:#33353c}.deleteIcon:hover{color:#000}.heardUnfilledIcon{width:13px;height:12px;color:#686d7d;margin-bottom:-2px}