@import"https://fonts.googleapis.com/css2?family=Manrope:wght@300;400;500;700&display=swap";*{box-sizing:border-box;font-family:Manrope,sans-serif}:root{--color-main: #f4f2f0;--color-primary: #8ab580;--color-secondary: #ecfde0;--color-white: #ffffff;--color-dark: rgba(80, 80, 80, 1);--color-background: rgba(224, 149, 127, 1);--color-border: rgb(200, 200, 200);--color-error: #d90e2c;--color-error-light: rgb(250, 190, 190);--color-debug: #fc65c2;--color-shadow: rgba(0, 0, 0, .2);--radius-light: 8px;--radius-soft: 12px;--radius-hard: 18px;--radius-full: 50%;--spacing-small: 10px;--spacing-medium: 18px;--font-large: 16px;--font-medium: 14px;--font-small: 12px}html,body{display:flex;flex-direction:column;justify-content:space-around;align-items:center;gap:var(--spacing-small);background-color:var(--color-background);font-family:Roboto,sans-serif}h3{font-size:var(--font-medium);display:block}p,span{font-size:var(--font-small)}button{margin:10px 0 0;color:var(--color-white);background-color:var(--color-primary);cursor:pointer;border:none}button.secondary{margin:0;color:var(--color-dark);background-color:var(--color-white);font-weight:700;cursor:pointer;border:none}button.smallest{padding:8px 16px;border-radius:var(--radius-soft);display:inline;height:40px;min-width:100px}button.large{padding:16px;border-radius:var(--radius-soft);display:block;width:100%}button.outline{background-color:var(--color-white);border:solid thin var(--color-primary);color:var(--color-primary)}button.dark{background-color:var(--color-dark);border:solid thin var(--color-dark);color:var(--color-white);font-weight:700}button.ghost{border:none;background-color:transparent;padding:0;color:var(--color-dark)}button.link{border:none;color:var(--color-dark);background-color:transparent;width:fit-content;display:inline;margin:0;padding:0}a:link,a:visited{color:#000}a.icon{display:block;padding:var(--spacing-medium);width:48px}main{z-index:0;margin:0;padding:0;display:flex;flex-direction:column;justify-content:flex-start;width:100%;max-width:1000px;height:fit-content;background-color:var(--color-white);border-radius:var(--radius-hard);box-sizing:border-box}.cover{z-index:1;width:100%;border-radius:var(--radius-hard)}.cover img{height:140px;width:100%;object-fit:cover;border-radius:var(--radius-hard)}form.recipe{z-index:2;display:flex;flex-direction:column;padding:var(--spacing-medium) 0;gap:var(--spacing-small);width:100%;box-shadow:0 -2px 0 var(--color-shadow);background-color:var(--color-white);border-radius:var(--radius-hard);margin-top:-40px}header{display:flex;flex-direction:column;align-content:flex-start;padding:0 var(--spacing-medium);gap:var(--spacing-small)}header .subheader{display:flex;flex-direction:row;align-items:start;gap:var(--spacing-small)}header .avatar{width:24px;height:24px;object-fit:cover;border-radius:var(--radius-full);border:thin solid var(--color-border)}header .title{margin:0;font-weight:bolder;font-size:var(--font-large)}header .subtitle{font-weight:lighter;font-size:var(--font-smallest)}section{padding:0 var(--spacing-medium)}section .title{margin:0 0 var(--spacing-small);font-size:var(--font-medium)}section .description{margin:0}section .error{background-color:var(--color-error-light);font-size:var(--font-small);color:var(--color-dark);padding:var(--spacing-small)}.options{margin-top:var(--spacing-small)}.options select{width:100%;padding:8px;font-size:var(--font-small);border:1px solid var(--color-border);border-radius:var(--radius-light);background-color:var(--color-white);cursor:pointer;transition:border-color .2s;height:46px}.options select:hover{border-color:var(--color-primary)}.options select:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 2px #0000001a}.hint{font-style:italic;color:var(--color-dark);opacity:.7;margin-top:5px}footer{display:flex;flex-direction:row;justify-content:space-around;align-items:center;padding:0 var(--spacing-medium);font-size:var(--font-small);color:var(--color-white)}footer a{font-weight:bolder;color:var(--color-white)!important}@media (min-width: 600px){main{width:460px}}.product-recommendations{padding:0 var(--spacing-medium)}.product-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--spacing-small)}.product-item{display:flex;flex-direction:row;align-items:center;gap:var(--spacing-small);padding:var(--spacing-small);border:1px solid var(--color-border);border-radius:var(--radius-light);background-color:var(--color-white);transition:box-shadow .2s ease}.product-item:hover{box-shadow:0 2px 4px var(--color-shadow)}.product-item[data-checked=true]{border-color:var(--color-primary);background-color:var(--color-secondary)}.product-image{width:48px;height:48px;object-fit:cover;border-radius:var(--radius-light);flex-shrink:0}.product-content{flex:1;display:flex;flex-direction:column;gap:4px}.product-title{margin:0;font-size:var(--font-medium);font-weight:700;color:var(--color-dark)}.seller{margin:0;font-size:var(--font-small);color:var(--color-dark);opacity:.8}.product-amount{font-size:var(--font-small);font-weight:700;color:var(--color-primary)}.product-item input[type=checkbox]{width:18px;height:18px;margin:0;cursor:pointer}.empty-message{text-align:center;color:var(--color-dark);opacity:.7;font-style:italic;padding:var(--spacing-medium)}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
