@import"https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600&display=swap";@import"https://fonts.googleapis.com/css2?family=Lobster&display=swap";body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}*{font-family:Poppins,sans-serif;margin:0;padding:0;text-decoration:none;list-style-type:none;outline:none}html{font-size:62.5%;background-color:#282c34}.App{display:flex;flex-direction:column;align-items:center;padding-bottom:0rem;border:#36d599 solid 2px}.logo-slogan{font-family:Lobster,cursive;margin:1rem 0 4rem;font-size:2.8rem}p{font-size:2rem;letter-spacing:.3rem;color:#36d599;margin-top:-20px}.search-form{width:100%;max-width:40rem;margin-left:-2rem;height:6rem;display:flex;justify-content:space-between;align-items:center;background-color:#3d4350;border-radius:50px;padding:1rem 1.5rem;border:2px solid #36d599;margin-bottom:4rem;margin-top:4rem;margin-left:-4rem}.search-form input{font-size:1.6rem;border:none;background-color:#3d4350;color:#fff;border-radius:25px;padding:1.5rem;transition:all .3s ease}.search-form input[type=submit]{font-size:1.6rem;background-color:#36d599;color:#fff;border-radius:50px;padding:1rem 2rem;cursor:pointer;transition:all .3s ease}.search-form input[type=submit]:hover{background-color:#fff;color:#fff;border:2px solid #36d599}.alert{position:absolute;top:32rem;left:0;background-color:#f25234;width:calc(100% - .4rem);border-radius:.5rem;padding:.2rem;text-align:center;color:#fff;font-size:1.8rem}.instructions{font-size:1.2em;text-align:center;margin-top:-30px;margin-left:-8rem;color:#444;background-color:#282c34}.no-results{font-size:1.2em;background-color:#f44336;color:#fff;padding:10px;text-align:center;border-radius:5px;margin:10px 0}.alert{background-color:#f44336;color:#fff;padding:10px;text-align:center;border-radius:5px;margin:10px 0}.landingImage.visible{opacity:1;transition:opacity 1s}.recipes{margin:2rem 0;padding-bottom:5rem;border-top:#36d599 solid 2px}.recipe-list{margin-top:5rem;display:grid;grid-template-columns:repeat(4,1fr);gap:2rem;width:auto}.recipe-card{background-color:#f9f9f9;min-width:20rem;margin:0 2rem;padding:20px;border-radius:8px;box-shadow:0 4px 8px #0000001a}.card-buttons{display:flex;justify-content:flex-start;align-items:center}.recipe-thumbnail{width:100%;height:25rem;border-radius:8px}.view-details-button{background-color:#007bff;color:#fff;border:none;padding:5px 20px;border-radius:5px;cursor:pointer;margin:20px 10px 0;transition:background-color .3s ease;font-size:1.08rem}.view-details-button:hover{background-color:#0056b3}.details-overlay{position:fixed;top:0;right:0;width:30%;height:100%;background-color:#0009;display:none;justify-content:center;align-items:center;z-index:1000}.details-overlay.open{display:flex}.recipe-details-container{background-color:#fff;padding:2rem;border-radius:8px;width:90%;height:100%;max-width:800px;box-shadow:0 4px 10px #0003;overflow-y:auto}.recipe-title{height:4rem;font-size:1.5rem;font-weight:700;margin-bottom:1rem;text-align:center}.recipe-image{width:90%;height:20rem;padding:2rem;border-radius:8px}.close-button{position:fixed;top:1rem;right:38rem;background-color:#ff4d4d;color:#fff;border:none;padding:4px 10px;cursor:pointer;font-size:16px;transition:background-color .3s ease}.close-button:hover{background-color:#e60000}h2{margin-top:20px;margin-left:4rem;font-size:24px;font-weight:700;padding:2rem;align-items:center}p{font-size:18px;margin:10px 0}ul{list-style-type:none;padding:0;padding:2rem}li{font-size:16px;margin:5px 0}.recipe-details{font-family:Arial,sans-serif;padding:20px;background-color:#f9f9f9;border-radius:10px;box-shadow:0 4px 8px #0000001a;max-width:600px;margin:0 auto}.recipe-info{margin-bottom:20px}.info-item{font-size:16px;margin-bottom:8px;display:flex;justify-content:space-between;align-items:center}.info-item strong{color:#333}.recipe-link{display:inline-block;padding:10px 20px;background-color:#007bff;color:#fff;text-decoration:none;font-weight:700;border-radius:5px;transition:background-color .3s ease}.recipe-link:hover{background-color:#0056b3}.loading-message{text-align:center;font-size:18px;color:#888}.landingImage{background-image:url(/assets/Food-Ingredients-CEzV4Smm.jpg);height:100vh;width:180vh;background-position:center;background-attachment:fixed;background-size:cover;border-radius:0 0 3rem 3rem;margin-top:-3rem}.landingImage{opacity:0;transition:opacity 1s ease-in-out}.landingImage.visible{opacity:1}.copyright{color:#f7efe3;font-size:1.4rem;height:5rem;display:flex;align-items:center;justify-content:center}
