@import"https://fonts.googleapis.com/css2?family=Poppins:wght@200;400;600&display=swap";*{margin:0;padding:0;box-sizing:border-box}body{font-family:Poppins,sans-serif;background:#ece9e6;background:-webkit-linear-gradient(to right,#FFFFFF,#ECE9E6);background:linear-gradient(to right,#fff,#ece9e6);display:flex;align-items:center;justify-content:center;min-height:100vh}img{max-width:100%}.mobile-container{width:400px;background-color:#fff;box-shadow:0 0 10px 2px #3333331a;overflow:hidden;border-radius:3px}header{display:flex;justify-content:center;align-items:center;padding:1rem;position:relative}header input{border:none;background-color:#eee;padding:.5rem 1rem;border-radius:3px;font-family:inherit}header button{background:transparent;border:none;color:#aaa;font-size:1.5rem;margin-left:10px;cursor:pointer}header button:focus{outline:none}header input:focus{outline:none}#refresh{position:absolute;left:5px}.fav-container{padding:.25rem 1rem;text-align:center;background-color:#f3e1ff}.fav-meals{display:flex;list-style-type:none;flex-wrap:wrap;align-items:center;justify-content:center;margin-top:1rem}.fav-meals li{width:85px;-webkit-user-select:none;user-select:none;cursor:pointer}.fav-meals li img{width:70px;height:70px;border-radius:50%;object-fit:cover;box-shadow:0 0 10px 2px #3333331a;transition:.5s}.fav-meals li span{font-size:.9rem;display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:80px}.fav-meals li:hover img{transition:.5s;padding:4px;background:#12c2e9;background:-webkit-linear-gradient(to right,#f64f59,#c471ed,#12c2e9);background:linear-gradient(to right,#f64f59,#c471ed,#12c2e9)}.meal{border-radius:3px;box-shadow:0 0 10px 2px #3333331a;margin:1.5rem;cursor:pointer}.meal-header{position:relative}.meal-header .random{position:absolute;top:1rem;left:-.5rem;background-color:#fff;padding:.25rem 1rem;border-radius:3px}.meal-header img{width:100%;height:200px;object-fit:cover}.meal-body{display:flex;justify-content:space-between;align-items:center;padding:1rem}.meal-body .fav-btn{background:transparent;border:none;font-size:1.2rem;color:#c5bcbc;cursor:pointer}.meal-body .fav-btn:focus{outline:none}.meal-body .fav-btn.active{color:#639}.close{border:none;position:relative;border-radius:50%;color:tomato;top:20px;left:20px;font-size:1rem;cursor:pointer;transition:.5s}.close:hover{color:#ff8b76;transition:.5s}.close:focus{outline:none}.popup-container{position:fixed;background-color:#00000080;left:0;right:0;top:0;bottom:0;display:flex;align-items:center;justify-content:center}.popup-container.hidden{opacity:0;pointer-events:none}.popup{background-color:#fff;max-width:600px;max-height:80vh;width:100%;padding:2rem;border-radius:5px;position:relative;overflow:auto;margin-top:3rem 0}.popup h1{text-align:center}.popup img{width:100%;height:300px;object-fit:cover;padding:1rem 0}.popup #close-popup{position:absolute;top:1rem;right:1rem;background:transparent;border:none;font-size:1.3rem;cursor:pointer}.popup #close-popup:focus{outline:none}.meal-info h3{margin:1rem 0}.meal-info ul{margin-left:3rem}