@import url("https://fonts.googleapis.com/css2?family=Glory:wght@100..800&display=swap");:root{--clr-light-100:#fafafa;--clr-light-200:#f5f5f5;--clr-light-300:#d9d9d9;--clr-dark-100:#564d43;--clr-dark-200:#3a332c;--clr-dark-300:#141712;--hue:80;--clr-primary-100:hsl(var(--hue) 74% 80%);--clr-primary-200:hsl(var(--hue) 74% 70%);--clr-primary-300:hsl(var(--hue) 74% 60%);--clr-primary-400:hsl(var(--hue) 74% 50%);--clr-primary-500:hsl(var(--hue) 74% 40%);--clr-primary-600:hsl(var(--hue) 74% 30%);--clr-red:#df2040;--ff-primary:"Glory",sans-serif;--bs-small:0 0.2rem 0.2rem hsl(30 13% 20%/0.2);--bs-medium:0 0.5rem 0.6rem hsl(30 13% 20%/0.3);--bs-big:0rem 0rem 1rem 1.6rem hsl(100 12% 8%/0.2);--rounded-corners:0.7rem;--border-line:2px solid var(--clr-primary-400);--transition-time:0.2s;--header-height:9rem;--icon-size:2.4rem;--inline-padding:5rem;--block-padding:4rem;--main-padding:var(--block-padding) var(--inline-padding)}@media only screen and (max-width:56.25em){:root{--inline-padding:7rem;--block-padding:5rem}}@media only screen and (max-width:37.5em){:root{--inline-padding:5rem}}@media only screen and (max-width:28.125em){:root{--inline-padding:4rem;--block-padding:4rem}}html{font-size:62.5%}@media only screen and (max-width:75em){html{font-size:56.25%}}@media only screen and (max-width:56.25em){html{font-size:50%}}@media only screen and (max-width:28.125em){html{font-size:43.75%}}a,body,figcaption,figure,h1,h2,h3,h4,h5,li,p,ul{margin:0;padding:0}body{text-rendering:optimizeSpeed;background:linear-gradient(120deg,var(--clr-dark-200) 0,var(--clr-dark-300) 100%);background-repeat:repeat;background-size:cover;box-sizing:border-box;color:var(--clr-dark-200);font-family:var(--ff-primary);line-height:1.6;min-height:100vh;overflow-x:hidden;padding:3% 0;scroll-behavior:smooth}@media only screen and (max-width:75em){body{padding:0}}*,:after,:before{box-sizing:inherit}img{display:block;max-width:100%;user-select:none}button,input{font:inherit}::selection{background-color:var(--clr-dark-200);color:var(--clr-primary-100);margin:1rem}::-webkit-scrollbar{height:15px;width:15px}::-webkit-scrollbar-track{background-color:var(--clr-dark-200)}::-webkit-scrollbar-thumb{background-color:var(--clr-dark-100);border:3px solid var(--clr-dark-200);border-radius:var(--rounded-corners)}::-webkit-scrollbar-thumb:hover{background-color:var(--clr-primary-300)}@supports (scrollbar-color:white white){*{scrollbar-color:var(--clr-dark-100) var(--clr-dark-200);scrollbar-width:thin}}@media (prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}.container{background:var(--clr-light-100);border-radius:var(--rounded-corners);box-shadow:var(--bs-big);display:grid;grid-template-columns:1fr 2fr;grid-template-rows:var(--header-height) 1fr;margin:0 auto;min-height:80vh;overflow:hidden;position:relative;width:clamp(115rem,80%,140rem)}@media only screen and (max-width:75em){.container{border-radius:0;box-shadow:none;margin:0;min-height:100vh;width:100vw}}@media only screen and (max-width:56.25em){.container{grid-template-columns:1fr;grid-template-rows:max-content max-content 1fr}}.header{align-items:center;background-color:var(--clr-light-100);border-bottom:var(--border-line);box-shadow:0 .6rem 1rem rgba(58,51,44,.3);display:flex;flex-direction:row;gap:max(15%,5rem);grid-column:1/-1;grid-row:1/2;height:var(--header-height);justify-content:center;justify-content:space-between;z-index:4}@media only screen and (max-width:37.5em){.header{gap:5rem}}@media only screen and (max-width:28.125em){.header{gap:3rem}}.search-results{background-color:var(--clr-light-100);background-image:radial-gradient(var(--clr-light-200) 15%,transparent 16%),radial-gradient(var(--clr-light-200),transparent 16%);background-position:0 0,30px 30px;background-size:60px 60px;display:flex;flex-direction:column;grid-column:1/1;grid-row:2/-1;justify-content:space-between;overflow:hidden;position:relative}@media only screen and (max-width:56.25em){.search-results{border-bottom:var(--border-line);box-shadow:var(--bs-small);grid-column:1/-1;grid-row:2/3;min-height:14rem;overflow-x:hidden;width:100vw}}.recipe{align-items:center;align-items:stretch;display:flex;flex-direction:column;grid-column:2/-1;grid-row:2/-1;justify-content:center}@media only screen and (max-width:56.25em){.recipe{grid-column:1/-1;grid-row:3/-1}}.copyright{bottom:.5em;position:absolute;right:1.2em;z-index:2}.copyright__text{color:var(--clr-dark-100);font-size:1.4rem;font-weight:100}.copyright__link:link,.copyright__link:visited{color:var(--clr-dark-100);font-weight:300}.copyright__link:focus,.copyright__link:hover{color:var(--clr-dark-200)}.spinner{align-items:center;display:flex;justify-content:center;margin:2rem auto;padding:var(--main-padding);text-align:center}.new-recipe>.spinner{grid-column:1/-1}.spinner>div{animation:bounce 1s ease-in-out infinite both;background-color:var(--clr-primary-300);border-radius:var(--rounded-corners);display:inline-block;height:3rem;width:3rem}.spinner>div:first-child{animation-delay:-.3s}.spinner>div:nth-child(2){animation-delay:-.15s;margin:0 1rem}@keyframes bounce{0%,80%,to{transform:scale(0)}40%{transform:scale(1)}}h1{font-size:5rem;font-weight:800;line-height:.9}h2,h3{font-weight:600;line-height:1.1}h2{font-size:4rem}h3{font-size:3rem}h4{font-size:2.4rem;font-weight:400}h5{font-size:2rem;font-weight:100}p{font-size:1.8rem;font-weight:400}strong{font-weight:700;text-decoration:underline;text-decoration-color:var(--clr-primary-400);text-decoration-thickness:.4rem}small{font-size:1.2rem;font-weight:300}a:link,a:visited{cursor:pointer;outline:none;text-decoration:none}.btn{align-items:center;background-color:var(--clr-light-300);border:none;border-radius:var(--rounded-corners);color:var(--clr-dark-100);cursor:pointer;display:flex;justify-content:center;outline:none;padding:.5rem;transform:translateY(0);transition:all var(--transition-time)}.btn__icon{fill:var(--clr-dark-100);height:2.4rem;width:2.4rem}.btn--active,.btn:hover{background-color:var(--clr-dark-100);box-shadow:var(--bs-medium);color:var(--clr-primary-200)}.btn:hover{transform:translateY(-.2em)}.btn:active{transform:translateY(0)}.btn--active{transform:translateY(-.2em)}.btn--active .btn__icon,.btn:hover .btn__icon{fill:var(--clr-primary-200)}.btn--small .btn__icon{height:1.8rem;width:1.8rem}.btn--very-small .btn__icon{height:1.4rem;width:1.4rem}.btn--small:hover,.btn--very-small:hover{box-shadow:var(--bs-small)}.message{align-items:center;display:flex;flex-direction:column;height:100%;justify-content:center;padding:var(--main-padding);position:relative;text-align:center}.recipe>.message{background-blend-mode:hue;background-image:linear-gradient(var(--clr-light-100),var(--clr-light-100)),url(bg.5c6a6fec.jpg);background-position:50%;background-repeat:no-repeat;background-size:cover;border-left:var(--border-line)}@media only screen and (max-width:56.25em){.recipe>.message{border-left:none}}.message__title{margin-bottom:1.6rem}.message__logo{font-weight:700;letter-spacing:-3px}.message__logo>span{color:var(--clr-primary-400)}.message__icon{fill:var(--clr-primary-400);height:6rem;width:6rem}.message__icon--red{fill:var(--clr-red)}.message__text{font-size:1.8rem;margin-left:auto;margin-right:auto;max-width:60ch}.logo{font-size:3.6rem;font-weight:700;letter-spacing:-3px;margin-left:2rem;user-select:none}.logo__text>span{color:var(--clr-primary-400)}@media only screen and (max-width:28.125em){.logo__text{display:none}}.logo__img{display:none}@media only screen and (max-width:28.125em){.logo__img{display:block}}.search{flex:1;position:relative}.search__field{background-color:inherit;border:1px solid var(--clr-dark-100);border-radius:var(--rounded-corners);color:var(--clr-dark-200);font-size:1.4rem;font-weight:400;outline:none;padding:.6em 1em;transition:box-shadow var(--transition-time);width:100%}.search__field::placeholder{color:var(--clr-primary-300);font-weight:400}.search__field:hover{box-shadow:var(--bs-small)}.search__field:focus{box-shadow:var(--bs-medium)}.search__btn{background-color:var(--clr-light-100);border:none;cursor:pointer;height:var(--icon-size);outline:none;padding:0;position:absolute;right:1em;top:.8em;transform:translateY(0);width:var(--icon-size)}.search__btn:active{transform:translateY(1px)}.search__icon{fill:var(--clr-light-300);background-color:inherit;height:var(--icon-size);transition:fill .2s;width:var(--icon-size)}.search__btn:focus>.search__icon,.search__btn:hover>.search__icon{fill:var(--clr-primary-400)}.navbar{align-items:center;display:flex;flex-direction:row;flex-shrink:0;justify-content:center}.navbar,.navbar__btn{height:100%;position:relative}.navbar__btn{background-color:var(--clr-light-100);border:none;cursor:pointer;outline:none;padding:0 2.4em;transition:background-color var(--transition-time)}.navbar__btn:focus,.navbar__btn:hover{background-color:var(--clr-light-300)}.navbar__icon{fill:var(--clr-dark-100);height:var(--icon-size);transform:translateY(0);transition:fill var(--transition-time),transform var(--transition-time);width:var(--icon-size)}.navbar__info{background-color:var(--clr-primary-400);left:0;padding:.1em 0;position:absolute;right:0;text-transform:uppercase;top:0;transform:translateY(-100%);transition:transform var(--transition-time);user-select:none}.navbar__btn:focus .navbar__icon,.navbar__btn:hover .navbar__icon{fill:var(--clr-dark-300);transform:translateY(1em)}.navbar__btn:active .navbar__icon{transform:translateY(.8em)}.navbar__btn:focus .navbar__info,.navbar__btn:hover .navbar__info{transform:translateY(0)}.bookmarks,.calendar,.ing-list{background-color:var(--clr-light-100);border-bottom:var(--border-line);border-left:var(--border-line);box-shadow:var(--bs-medium);cursor:default;opacity:0;overflow-y:auto;position:absolute;right:0;top:100%;transition:visibility var(--transition-time),opacity var(--transition-time);visibility:hidden;width:40rem;z-index:1}.bookmarks__list,.calendar__list,.ing-list__list{display:flex;flex-direction:column}.bookmarks:hover,.calendar:hover,.ing-list:hover,.navbar__btn:focus+.bookmarks,.navbar__btn:focus+.calendar,.navbar__btn:focus+.ing-list,.navbar__btn:hover+.bookmarks,.navbar__btn:hover+.calendar,.navbar__btn:hover+.ing-list{opacity:1;visibility:visible}.navbar__btn:focus+.bookmarks,.navbar__btn:focus+.calendar,.navbar__btn:focus+.ing-list{z-index:2}.bookmarks__list>.preview:last-child .preview__card{border-bottom:none}.ing-list{background-color:var(--clr-light-300)}.ing-list__list{gap:.1rem}.ing-list__list>*{background-color:var(--clr-light-100);padding:1.2rem 1rem}.ing-list__list>.message{padding:var(--main-padding)}.ing-list__remove-btn{margin-left:auto}.ing-list__btns{align-items:center;display:flex;gap:2rem;justify-content:center}.ing-list__clipboard-btn,.ing-list__remove-all-btn{flex:1;font-size:1.4rem}.ing-list::-webkit-scrollbar-track{background-color:var(--clr-light-100)}.ing-list::-webkit-scrollbar-thumb{background-color:var(--clr-light-300)}.ing-list::-webkit-scrollbar-thumb:hover{background-color:var(--clr-primary-300)}.calendar{background-color:var(--clr-light-300)}.calendar__list{gap:.1rem}.calendar__day{align-items:center;background-color:var(--clr-light-100);display:flex;justify-content:center;min-height:8rem;position:relative}.calendar__day>.preview{flex:1}.calendar__list .calendar__day:last-child .preview .preview__card{border-bottom:none}.calendar__day-name{color:var(--clr-light-300);font-size:3rem;font-weight:800;padding-left:1rem}.calendar__day-name--badge{color:var(--clr-light-200);padding-left:0;position:absolute;right:1rem;top:.2rem;z-index:3}.calendar__btn{position:absolute;right:1rem;z-index:5}.title{height:40rem;position:relative}@media only screen and (max-width:56.25em){.title{height:35rem}}.title:after{background-image:linear-gradient(180deg,rgba(34,31,27,.6) 0,rgba(34,31,27,.9));content:"";display:inline-block;inset:0;position:absolute;z-index:2}.title__text{color:var(--clr-light-100);left:50%;max-width:25ch;text-align:center;top:50%;transform:translate(-50%,-50%)}.title__text,.title__user{position:absolute;z-index:3}.title__user{align-items:center;background-color:var(--clr-dark-200);border-radius:50%;bottom:1.5rem;display:flex;justify-content:center;left:1.5rem;padding:1rem}.title__icon{height:var(--icon-size);width:var(--icon-size)}.title__icon--user{fill:var(--clr-dark-100)}.title__icon--user-active{fill:var(--clr-light-300)}.title__img{display:block;height:100%;object-fit:cover;width:100%;z-index:1}.details{align-items:center;background-color:var(--clr-light-200);border-bottom:var(--border-line);box-shadow:0 .6rem 1rem rgba(58,51,44,.3);display:flex;flex-direction:row;justify-content:center;justify-content:space-around;padding:var(--main-padding);z-index:2}@media only screen and (max-width:56.25em){.details{justify-content:space-between}}.detail{align-items:center;display:flex;gap:1.6em;justify-content:center}.detail__icon{height:var(--icon-size);width:var(--icon-size)}.detail__btns{display:flex;gap:1em}.ingredients{background-color:var(--clr-light-100);padding:var(--main-padding)}.ingredients__title{margin-bottom:var(--block-padding);text-align:center}.ingredients__list{display:grid;gap:2.2rem 5%;grid-template-columns:repeat(auto-fit,minmax(25rem,1fr))}.ingredients__item{align-items:center;display:flex;font-size:1.6rem;gap:1.2rem;justify-content:center;justify-content:stretch}.ingredients__item-mark{color:var(--clr-primary-300);font-size:1.8rem}.ingredients__item-quantity{flex-shrink:0}.ingredients__add-ing{font-size:1.4rem;gap:1rem;margin-top:var(--block-padding)}.source{background-color:var(--clr-light-200);border-top:var(--border-line);box-shadow:0 -.6rem 1rem rgba(58,51,44,.3);flex:1;padding:var(--main-padding);z-index:2}.source__title{text-align:center}.source__text,.source__title{margin-bottom:var(--block-padding)}.source__link,.source__link:link,.source__link:visited{background-color:var(--clr-dark-100);border-radius:5px;color:var(--clr-light-100);display:inline-block;font-size:2rem;padding:.8em 1.6em;transform:translateY(0);transition:all var(--transition-time)}.source__content{align-items:center;display:flex;gap:1rem;justify-content:center;justify-content:flex-start;transition:gap var(--transition-time) var(--transition-time)}.source__icon{fill:var(--clr-light-100);height:3rem;width:3rem}.source__link:focus,.source__link:hover{background-color:var(--clr-dark-200);box-shadow:var(--bs-medium);transform:translateY(-.4rem)}.source__link:focus .source__content,.source__link:hover .source__content{gap:2rem}.results{display:flex;flex:1;flex-direction:column;width:100%}@media only screen and (max-width:56.25em){.results{align-items:center;display:flex;flex-direction:row;justify-content:center;overflow-x:auto;overscroll-behavior-x:contain}}.pag{align-items:center;display:flex;gap:1em;justify-content:center;padding:var(--main-padding)}@media only screen and (max-width:56.25em){.pag{gap:2em;padding:calc(var(--block-padding)/2) calc(var(--inline-padding)/2)}}.pag__btn{font-size:1.4rem;height:3rem;width:3rem}.preview{display:block;height:14rem}@media only screen and (max-width:56.25em){.results .preview{min-width:25vw}}@media only screen and (max-width:37.5em){.results .preview{min-width:50vw}}.preview__link:link,.preview__link:visited{height:100%}.preview__card{border-bottom:var(--border-line);color:var(--clr-light-100);height:100%;overflow-y:hidden;position:relative;width:100%}@media only screen and (max-width:56.25em){.results .preview__card{border-bottom:none}}.preview__card:after{background:linear-gradient(90deg,#3a332c,rgba(86,77,67,.9) 30%,rgba(115,102,89,.2));background-size:100%;content:"";inset:0;position:absolute;transition:background-size var(--transition-time);z-index:2}.preview__sub-title,.preview__title{left:1rem;line-height:1;max-width:20ch;position:absolute;text-align:left;transition:bottom .2s;z-index:3}.preview__title{bottom:1rem;font-size:2rem}.preview__sub-title{bottom:-2rem;font-size:1.2rem;font-weight:300}.preview__icon{fill:var(--clr-light-300);height:var(--icon-size);left:1rem;position:absolute;top:1rem;width:var(--icon-size);z-index:3}.preview__card:focus:after,.preview__card:hover:after,.preview__link-active .preview__card:after{background-size:200%}.preview__card:focus .preview__title,.preview__card:hover .preview__title,.preview__link-active .preview__card .preview__title{bottom:3rem}.preview__card:focus .preview__sub-title,.preview__card:hover .preview__sub-title,.preview__link-active .preview__card .preview__sub-title{bottom:1rem}.preview__link-active .preview__title:before{animation:activation var(--transition-time) forwards;background-color:var(--clr-primary-400);border-radius:var(--rounded-corners);content:"";height:.2rem;left:-2rem;position:absolute;top:-1rem;transform-origin:left;width:calc(100% + 2rem);z-index:3}.preview__img{display:block;height:100%;object-fit:cover;width:100%;z-index:1}@keyframes activation{0%{transform:scale(0)}to{transform:scale(1)}}.hidden{display:none;opacity:0;visibility:hidden}.overlay{background-color:var(--clr-dark-300);height:100%;left:0;opacity:.95;position:fixed;top:0;width:100%;z-index:99}@supports (backdrop-filter:none){.overlay{backdrop-filter:blur(5px)}}.new-recipe-window{background-color:var(--clr-light-100);border-radius:var(--rounded-corners);left:50%;padding:var(--main-padding);position:absolute;top:10%;transform:translateX(-50%);width:80%;z-index:100}@media only screen and (max-width:37.5em){.new-recipe-window{border-radius:0;width:100%}}.new-recipe-window__btn{position:absolute;right:2rem;top:2rem}.row{display:flex;flex-direction:column;gap:2rem}.row h3{margin-bottom:2rem;text-decoration:underline;text-decoration-color:var(--clr-primary-400);text-decoration-thickness:.4rem}.new-recipe{display:grid;gap:5rem 3rem;grid-template-columns:repeat(2,1fr)}@media only screen and (max-width:50em){.new-recipe{grid-template-columns:1fr}}.new-recipe__ing-area{display:flex;flex-direction:column;gap:1.6rem}.new-recipe__ing-area div:first-child button{opacity:0;visibility:hidden}.new-recipe__ing-field{align-items:center;background-color:var(--clr-light-200);border-radius:var(--rounded-corners);box-shadow:var(--bs-medium);display:grid;gap:2rem 1rem;grid-template-columns:repeat(2,1fr);padding:2rem}.new-recipe__ing-field h5{grid-column:1/1}.new-recipe__ing-field div:last-child{grid-column:1/-1}.new-recipe__ing-remove-btn{grid-column:2/-1;justify-self:end}.new-recipe__field label{display:block;font-size:1.4rem}.new-recipe__field input{background-color:var(--clr-light-100);border:1px solid var(--clr-dark-100);border-radius:var(--rounded-corners);font-size:2rem;outline:none;padding:.2em .6em;transition:box-shadow var(--transition-time),border var(--transition-time),background-color var(--transition-time);width:100%}.new-recipe__field input::placeholder{color:var(--clr-dark-100);font-size:1.6rem}.new-recipe__field input:hover{border:1px solid var(--clr-dark-200);box-shadow:var(--bs-small)}.new-recipe__field input:focus{background-color:var(--clr-primary-100);box-shadow:var(--bs-medium)}.new-recipe__field input:valid{border-color:var(--clr-primary-400);outline:1px solid var(--clr-primary-400)}.new-recipe__field input:invalid{border-color:var(--clr-red);outline:1px solid var(--clr-red)}.new-recipe__field input:placeholder-shown{border-color:var(--clr-dark-100);outline:none}.new-recipe__upload-btn{background-color:var(--clr-dark-100);border-radius:var(--rounded-corners);color:var(--clr-light-100);display:inline-block;font-size:2rem;grid-column:1/-1;justify-self:center;outline:none;padding:.8em 1.6em;transform:translateY(0);transition:all var(--transition-time)}.new-recipe__upload-btn:focus,.new-recipe__upload-btn:hover{background-color:var(--clr-dark-200);box-shadow:var(--bs-medium);transform:translateY(-.4rem)}.new-recipe__content{align-items:center;display:flex;gap:1rem;justify-content:center;transition:gap var(--transition-time) var(--transition-time)}.new-recipe__icon{fill:var(--clr-light-100);height:3rem;width:3rem}.new-recipe__upload-btn:focus .new-recipe__content,.new-recipe__upload-btn:hover .new-recipe__content{gap:2rem}.alert{align-items:center;background-color:var(--clr-light-100);border-left:var(--rounded-corners) solid var(--clr-primary-300);border-radius:var(--rounded-corners) 0 0 var(--rounded-corners);box-shadow:var(--bs-small);display:flex;gap:1.4rem;justify-content:center;padding:.4em 1em;position:fixed;right:0;top:5%;transform:translateX(100%);transition:transform .2s;user-select:none;z-index:100}@media only screen and (max-width:56.25em){.alert{border-bottom:var(--rounded-corners) solid var(--clr-primary-300);border-left:none;border-radius:0 0 var(--rounded-corners) var(--rounded-corners);right:10%;top:0;transform:translateX(0) translateY(-120%)}}.alert__pop{transform:translateX(0)}@media only screen and (max-width:56.25em){.alert__pop{transform:translateY(0)}}.alert__icon{height:var(--icon-size);width:var(--icon-size)}.alert__text{font-size:1.6rem;font-weight:500}.alert--red{border-color:var(--clr-red)}.alert--red .alert__icon{fill:var(--clr-red)}.alert--green{border-color:var(--clr-primary-300)}.alert--green .alert__icon{fill:var(--clr-primary-300)}
/*# sourceMappingURL=index.fdd7fab0.css.map */