@font-face{font-family:'Inter';font-style:normal;font-weight:400 700;font-display:swap;src:url(/fonts/inter-variable-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:'Inter';font-style:normal;font-weight:400 700;font-display:swap;src:url(/fonts/inter-variable-latin-ext.woff2) format('woff2');unicode-range:U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:'Lora';font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/lora-700-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:'Lora';font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/lora-700-latin-ext.woff2) format('woff2');unicode-range:U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:'Great Vibes';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/great-vibes-400-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:'Great Vibes';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/great-vibes-400-latin-ext.woff2) format('woff2');unicode-range:U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}:root{color-scheme:light;--primary-color:#FF9500;--primary-color-light:#FFBC7D;--primary-color-dark:#D97706;--primary-color-pastel:#FFF5E6;--primary-color-ultralight:#FFFBF2;--secondary-color:#2B6CB0;--text-color-dark:#1A202C;--text-color-light:#334155;--text-color-white:#ffffff;--background-light:#F7FAFC;--background-white:#ffffff;--border-color:#EDF2F7;--header-bg-color:#FBEFDD;--ribbon-bg-color:#FDF2E2}html[data-theme="light"]{color-scheme:light;--primary-color:#FF9500;--primary-color-light:#FFBC7D;--primary-color-dark:#D97706;--primary-color-pastel:#FFF5E6;--primary-color-ultralight:#FFFBF2;--secondary-color:#2B6CB0;--text-color-dark:#1A202C;--text-color-light:#334155;--text-color-white:#ffffff;--background-light:#F7FAFC;--background-white:#ffffff;--border-color:#EDF2F7;--header-bg-color:#FBEFDD;--ribbon-bg-color:#FDF2E2;--footer-background-color:var(--text-color-dark);--footer-text-color:var(--text-color-white);--footer-link-color:var(--background-light)}html[data-theme="dark"]{color-scheme:dark;--primary-color:#FF9500;--primary-color-light:#d88e2c;--primary-color-dark:#ffa52a;--primary-color-pastel:#2d2316;--primary-color-ultralight:#282117;--secondary-color:#63B3ED;--text-color-dark:#E2E8F0;--text-color-light:#CBD5E1;--text-color-white:#ffffff;--background-light:#1A202C;--background-white:#2D3748;--border-color:#4A5568;--header-bg-color:#261f14;--ribbon-bg-color:#2d271d;--footer-background-color:var(--header-bg-color);--footer-text-color:var(--text-color-light);--footer-link-color:var(--text-color-dark)}:root{--font-family-body:'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;--font-family-heading:'Lora', "Times New Roman", Times, serif;--font-family-branding:'Great Vibes', cursive;--spacing-xs:0.25rem;--spacing-sm:0.5rem;--spacing-md:1rem;--spacing-lg:1.5rem;--spacing-xl:2rem;--spacing-xxl:4rem;--box-shadow-sm:0 1px 3px 0 rgba(0, 0, 0, 0.05), 0 1px 2px 0 rgba(0, 0, 0, 0.03);--box-shadow-md:0 4px 6px -1px rgba(0, 0, 0, 0.07), 0 2px 4px -1px rgba(0, 0, 0, 0.04);--box-shadow-lg:0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);--container-width:1290px;--container-padding:1.5rem;--header-height:60px}*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-family-body);line-height:1.6;color:var(--text-color-light);background-color:var(--background-light);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body.mobile-menu-active{overflow:hidden}#page-wrapper{display:flex;flex-direction:column;min-height:100vh}.main-content{flex-grow:1;padding-top:var(--spacing-xxl);padding-bottom:var(--spacing-xxl);position:relative;z-index:1}.container{width:100%;max-width:var(--container-width);margin-left:auto;margin-right:auto;padding-left:var(--container-padding);padding-right:var(--container-padding)}h1,h2,h3,h4,h5,h6{font-family:var(--font-family-heading);color:var(--text-color-dark);line-height:1.3;margin-bottom:var(--spacing-md)}h1.page-title{font-size:2.5rem;text-align:center;margin-bottom:var(--spacing-xl)}p{margin-bottom:var(--spacing-md)}a{color:var(--primary-color-dark);text-decoration:none;transition:color 0.2s ease-in-out}a:hover{color:var(--primary-color)}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}*:focus-visible{outline:2px solid var(--primary-color-dark);outline-offset:2px;border-radius:4px}@media (max-width:767px){.container{padding-left:0;padding-right:0}}@media (max-width:640px){h1.page-title{font-size:2rem}.main-content{padding-top:var(--spacing-xl);padding-bottom:var(--spacing-xl)}}.skip-to-content-link{position:fixed;top:0;left:50%;transform:translate(-50%,-120%);z-index:9999;color:var(--text-color-white);background-color:var(--primary-color-dark);padding:var(--spacing-md);text-align:center;font-weight:700;text-decoration:none;border-radius:0 0 8px 8px;box-shadow:var(--box-shadow-lg);transition:transform 0.3s ease-in-out}.skip-to-content-link:focus{transform:translate(-50%,0);outline:2px solid var(--primary-color);outline-offset:2px}.site-header{background-color:var(--header-bg-color);box-shadow:var(--box-shadow-md);padding:var(--spacing-sm) 0;position:sticky;top:0;z-index:990;border-bottom:1px solid var(--border-color)}.header-container{display:flex;justify-content:space-between;align-items:center;gap:var(--spacing-lg)}.site-branding a{font-family:var(--font-family-branding);font-size:2.5rem;font-weight:400;color:var(--primary-color-dark);flex-shrink:0;text-shadow:1px 1px 3px rgb(0 0 0 / .1);transition:color 0.3s ease}.site-branding a:hover{color:var(--primary-color)}@media (max-width:1024px){.desktop-nav,.header-right{display:none}}``` ### 4. Lépés:Fejléc Háttérszín Finomhangolása Végül pedig cseréld le a `/var/www/izekesillatok/public/css/variables.css` fájl tartalmát. A `html[data-theme="light"]` blokkban a `--header-bg-color` értékét módosítottam. ```css :root{color-scheme:light;--primary-color:#FF9500;--primary-color-light:#FFBC7D;--primary-color-dark:#D97706;--primary-color-pastel:#FFF5E6;--primary-color-ultralight:#FFFBF2;--secondary-color:#2B6CB0;--text-color-dark:#1A202C;--text-color-light:#334155;--text-color-white:#ffffff;--background-light:#F7FAFC;--background-white:#ffffff;--border-color:#EDF2F7;--header-bg-color:#FEF8F0;--ribbon-bg-color:#FDF2E2}html[data-theme="light"]{color-scheme:light;--primary-color:#FF9500;--primary-color-light:#FFBC7D;--primary-color-dark:#D97706;--primary-color-pastel:#FFF5E6;--primary-color-ultralight:#FFFBF2;--secondary-color:#2B6CB0;--text-color-dark:#1A202C;--text-color-light:#334155;--text-color-white:#ffffff;--background-light:#F7FAFC;--background-white:#ffffff;--border-color:#EDF2F7;--header-bg-color:#FEF8F0;--ribbon-bg-color:#FDF2E2;--footer-background-color:var(--text-color-dark);--footer-text-color:var(--text-color-white);--footer-link-color:var(--background-light)}html[data-theme="dark"]{color-scheme:dark;--primary-color:#FF9500;--primary-color-light:#d88e2c;--primary-color-dark:#ffa52a;--primary-color-pastel:#2d2316;--primary-color-ultralight:#282117;--secondary-color:#63B3ED;--text-color-dark:#E2E8F0;--text-color-light:#CBD5E1;--text-color-white:#ffffff;--background-light:#1A202C;--background-white:#2D3748;--border-color:#4A5568;--header-bg-color:#261f14;--ribbon-bg-color:#2d271d;--footer-background-color:var(--header-bg-color);--footer-text-color:var(--text-color-light);--footer-link-color:var(--text-color-dark)}:root{--font-family-body:'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;--font-family-heading:'Lora', "Times New Roman", Times, serif;--font-family-branding:'Great Vibes', cursive;--spacing-xs:0.25rem;--spacing-sm:0.5rem;--spacing-md:1rem;--spacing-lg:1.5rem;--spacing-xl:2rem;--spacing-xxl:4rem;--box-shadow-sm:0 1px 3px 0 rgba(0, 0, 0, 0.05), 0 1px 2px 0 rgba(0, 0, 0, 0.03);--box-shadow-md:0 4px 6px -1px rgba(0, 0, 0, 0.07), 0 2px 4px -1px rgba(0, 0, 0, 0.04);--box-shadow-lg:0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);--container-width:1290px;--container-padding:1.5rem;--header-height:60px}.site-footer{background-color:var(--footer-background-color);color:var(--footer-text-color);padding:var(--spacing-xl) 0}.footer-container{text-align:center}.footer-navigation{margin-top:var(--spacing-sm)}.footer-navigation a{color:var(--footer-link-color);margin:0 var(--spacing-sm)}.footer-navigation a:hover{color:var(--primary-color-light);text-decoration:underline}.theme-toggle-btn{background-color:#fff0;border:1px solid var(--border-color);border-radius:50%;width:40px;height:40px;padding:0;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--text-color-dark);transition:background-color 0.2s ease,color 0.2s ease,box-shadow 0.2s ease;flex-shrink:0}.theme-toggle-btn:hover{background-color:var(--background-light);box-shadow:var(--box-shadow-sm)}.theme-toggle-btn .icon{width:20px;height:20px}.theme-toggle-btn .icon-moon{display:none}.theme-toggle-btn .icon-sun{display:block}html[data-theme="dark"] .theme-toggle-btn .icon-moon{display:block}html[data-theme="dark"] .theme-toggle-btn .icon-sun{display:none}.mobile-user-nav .theme-toggle-btn{width:100%;border-radius:8px;justify-content:flex-start;padding:var(--spacing-md);gap:var(--spacing-sm);font-size:1rem;font-weight:500}.language-switcher{position:relative;cursor:pointer}.active-language{display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-md);border:1px solid var(--border-color);border-radius:999px;background-color:var(--background-white);transition:background-color 0.2s ease,box-shadow 0.2s ease;font-weight:700;text-transform:uppercase;font-size:.85rem;color:var(--text-color-dark)}.language-switcher:hover .active-language,.language-switcher:focus-within .active-language{background-color:var(--background-light);box-shadow:var(--box-shadow-sm)}.language-dropdown{position:absolute;top:calc(100% + 8px);right:0;background-color:var(--background-white);border:1px solid var(--border-color);border-radius:8px;box-shadow:var(--box-shadow-lg);list-style:none;padding:var(--spacing-sm);margin:0;min-width:120px;z-index:1010;opacity:0;visibility:hidden;transform:translateY(10px);transition:opacity 0.2s ease,transform 0.2s ease,visibility 0.2s}.language-switcher:hover .language-dropdown,.language-switcher:focus-within .language-dropdown{opacity:1;visibility:visible;transform:translateY(0)}.language-dropdown a{display:block;padding:var(--spacing-sm) var(--spacing-md);color:var(--text-color-dark);text-decoration:none;border-radius:6px;font-weight:500}.language-dropdown a:hover{background-color:var(--background-light);color:var(--primary-color-dark)}.desktop-nav,.header-right{display:none}@media (min-width:1025px){.desktop-nav,.header-right{display:flex;align-items:center;gap:var(--spacing-lg)}.desktop-nav{flex-grow:1}.header-right{flex-shrink:0}}.main-navigation ul{display:flex;justify-content:center;list-style:none;gap:var(--spacing-lg)}.main-navigation>ul>li>a{display:flex;align-items:center;gap:var(--spacing-xs);color:var(--text-color-light);font-weight:700;padding:var(--spacing-sm) 0;position:relative;font-family:var(--font-family-body);font-size:.95rem}.main-navigation>ul>li>a::after{content:'';position:absolute;bottom:0;left:0;width:0;height:2px;background-color:var(--primary-color);transition:width 0.3s ease}.main-navigation>ul>li>a:hover::after,.main-navigation>ul>li>a.active::after{width:100%}.has-dropdown{position:relative}.dropdown-arrow{display:inline-block;width:16px;height:16px;transition:transform 0.3s ease}.has-dropdown.dropdown-active .dropdown-arrow{transform:rotate(180deg)}.dropdown-menu-container{position:absolute;top:calc(100% + 10px);left:50%;transform:translateX(-50%) translateY(10px);z-index:1010;width:650px;max-width:95vw;background:var(--background-white);border-radius:12px;box-shadow:var(--box-shadow-lg);border:1px solid var(--border-color);opacity:0;visibility:hidden;pointer-events:none;transition:opacity 0.3s ease,transform 0.3s ease,visibility 0.3s}.has-dropdown.dropdown-active>.dropdown-menu-container{opacity:1;visibility:visible;pointer-events:auto;transform:translateX(-50%) translateY(0)}.dropdown-menu-layout-wrapper{display:flex;flex-direction:column;padding:var(--spacing-lg);min-height:380px}.dropdown-menu-layout{display:flex;gap:var(--spacing-lg);flex-grow:1}.dropdown-title{font-size:.8rem;text-transform:uppercase;letter-spacing:1px;color:var(--text-color-light);margin-bottom:var(--spacing-md);padding-bottom:var(--spacing-sm);border-bottom:1px solid var(--border-color)}.dropdown-categories{flex:1.5;border-right:1px solid var(--border-color);padding-right:var(--spacing-lg)}.category-grid{list-style:none;padding:0;margin:0;display:grid!important;grid-template-columns:1fr 1fr;gap:var(--spacing-xs) var(--spacing-lg)}.category-grid a{display:block;padding:var(--spacing-xs) var(--spacing-sm);font-weight:500;font-size:.9rem;color:var(--text-color-dark);transition:all 0.2s ease;border-radius:6px}.category-grid a:hover{color:var(--primary-color-dark);background-color:var(--primary-color-pastel)}.dropdown-featured{flex:1;display:flex;flex-direction:column}.featured-recipe-card{position:relative;display:block;flex-grow:1;min-height:0;text-decoration:none;border-radius:8px;overflow:hidden;transition:transform 0.2s ease,box-shadow 0.2s ease;background-color:var(--background-light)}.featured-recipe-card:hover{transform:translateY(-4px);box-shadow:var(--box-shadow-md)}.featured-recipe-image{position:absolute;top:0;left:0;width:100%;height:100%}.featured-recipe-image img{width:100%;height:100%;object-fit:cover}.featured-recipe-card::after{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(to top,rgb(0 0 0 / .75) 0%,#fff0 60%);z-index:1}.featured-recipe-content{position:absolute;bottom:0;left:0;right:0;padding:var(--spacing-md);z-index:2}.featured-recipe-content h5{margin:0 0 var(--spacing-sm) 0;color:var(--text-color-white);font-size:.95rem;line-height:1.4;text-shadow:1px 1px 3px rgb(0 0 0 / .6)}.featured-recipe-cta{font-size:.8rem;font-weight:700;color:var(--text-color-white);opacity:.9}.dropdown-menu-footer{padding-top:var(--spacing-md);margin-top:var(--spacing-lg);border-top:1px solid var(--border-color);text-align:center}.dropdown-footer-link{font-weight:700;color:var(--primary-color-dark);text-decoration:none;transition:color 0.2s ease}.dropdown-footer-link:hover{color:var(--primary-color);text-decoration:underline}.user-navigation{display:flex;align-items:center;gap:var(--spacing-lg)}.user-nav-link{display:flex;align-items:center;gap:var(--spacing-sm);color:var(--text-color-dark);font-weight:500}.user-nav-link span{display:block}.user-nav-link svg{color:var(--primary-color)}.user-nav-link:hover,.user-nav-link:hover svg{color:var(--primary-color-dark)}@media (max-width:1200px){.user-nav-link span{display:none}}.mobile-header-controls{display:none}@media (max-width:1024px){.mobile-header-controls{display:flex;align-items:center;gap:var(--spacing-md)}}.mobile-search-toggle,.mobile-menu-toggle{background:none;border:none;cursor:pointer;padding:.5rem;color:var(--text-color-dark);position:relative}.hamburger-icon{display:block;width:24px;height:2px;background-color:var(--text-color-dark);position:relative}.hamburger-icon::before,.hamburger-icon::after{content:'';position:absolute;left:0;width:100%;height:2px;background-color:var(--text-color-dark)}.hamburger-icon::before{top:-8px}.hamburger-icon::after{top:8px}#mobile-menu-overlay{position:fixed;inset:0;background-color:rgb(0 0 0 / .5);z-index:999;opacity:0;visibility:hidden;transition:opacity 0.4s ease,visibility 0.4s;cursor:pointer}body.mobile-menu-active #mobile-menu-overlay{opacity:1;visibility:visible}.mobile-menu-panel{position:fixed;top:0;right:0;width:100%;max-width:350px;height:100%;background-color:var(--background-white);z-index:1000;transform:translateX(100%);transition:transform 0.4s cubic-bezier(.23,1,.32,1),background-color 0.3s ease;visibility:hidden;box-shadow:-5px 0 15px rgb(0 0 0 / .1);overflow-y:auto;padding:var(--spacing-md) var(--container-padding) var(--spacing-xl);padding-top:calc(var(--header-height) + var(--spacing-lg))}body.mobile-menu-active .mobile-menu-panel{transform:translateX(0);visibility:visible}.mobile-menu-close-btn{position:absolute;top:10px;right:var(--container-padding);background:none;border:none;font-size:2.5rem;color:var(--text-color-light);cursor:pointer;line-height:1;padding:.5rem;transition:transform 0.2s ease,color 0.2s ease;z-index:1001}.mobile-menu-close-btn:hover{color:var(--primary-color-dark);transform:rotate(90deg)}.mobile-navigation ul{list-style:none;padding:0;margin:0}.mobile-navigation button.accordion-toggle{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-md) 0;font-size:1.1rem;font-weight:700;color:var(--text-color-dark);text-decoration:none;border-bottom:1px solid var(--border-color);transition:background-color 0.2s ease,border-color 0.3s ease;width:100%;background:none;border-top:none;border-left:none;border-right:none;cursor:pointer;font-family:inherit}.mobile-navigation a{display:block;padding:var(--spacing-md) 0;font-size:1.1rem;font-weight:700;color:var(--text-color-dark);text-decoration:none;border-bottom:1px solid var(--border-color);transition:background-color 0.2s ease,border-color 0.3s ease}.mobile-navigation a:hover{background-color:var(--background-light)}.mobile-navigation .accordion-toggle-icon{transition:transform 0.3s ease-in-out;width:20px;height:20px}.mobile-menu-accordion.is-open>.accordion-toggle .accordion-toggle-icon{transform:rotate(180deg)}.accordion-panel{list-style:none;padding:0;margin:0;background-color:var(--background-light);max-height:0;overflow:hidden;transition:max-height 0.4s ease-in-out,background-color 0.3s ease}.mobile-menu-accordion.is-open .accordion-panel{max-height:800px}.accordion-panel a{position:relative;font-size:.95rem;font-weight:500;padding:var(--spacing-md) 0 var(--spacing-md) var(--spacing-xl);border-color:var(--border-color)}.accordion-panel a:hover{background:none}.accordion-panel a::before{content:'•';position:absolute;left:var(--spacing-sm);top:50%;transform:translateY(-50%);color:var(--primary-color);font-size:1.2rem;line-height:1}.mobile-menu-footer{margin-top:var(--spacing-xl);padding-top:var(--spacing-xl);border-top:1px solid var(--border-color);transition:border-color 0.3s ease}.mobile-menu-footer .theme-toggle-btn{width:100%;border-radius:8px;justify-content:flex-start;padding:var(--spacing-md);gap:var(--spacing-sm);font-size:1rem;font-weight:500;transition:border-color 0.3s ease}html[data-theme="dark"] .mobile-menu-panel{background-color:var(--background-light)}html[data-theme="dark"] .mobile-navigation>ul>li>a,html[data-theme="dark"] .mobile-navigation>ul>li>.accordion-toggle{background-color:var(--background-white);border:1px solid var(--border-color);border-radius:8px;padding:var(--spacing-md) var(--spacing-lg);margin-bottom:var(--spacing-sm)}html[data-theme="dark"] .mobile-menu-footer .theme-toggle-btn{background-color:var(--background-white);border:1px solid var(--border-color);margin-bottom:0}html[data-theme="dark"] .mobile-navigation>ul>li:last-child>*{margin-bottom:0}html[data-theme="dark"] .accordion-panel{background-color:#fff0;padding:var(--spacing-sm) 0 var(--spacing-sm) var(--spacing-md);border:1px solid var(--border-color);border-radius:8px;margin-top:-8px;padding-top:var(--spacing-md);border-top:none;border-top-left-radius:0;border-top-right-radius:0}html[data-theme="dark"] .accordion-panel a{border-color:#fff0}html[data-theme="dark"] .mobile-menu-footer{border-top-color:var(--border-color)}.search-overlay{position:fixed;inset:0;z-index:1100;background-color:var(--primary-color-pastel);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);display:flex;align-items:flex-start;justify-content:center;padding:10vh var(--container-padding) 0;opacity:0;visibility:hidden;transition:opacity 0.4s ease,visibility 0.4s}.search-overlay.search-overlay-active{opacity:1;visibility:visible}body.search-overlay-active{overflow:hidden}.search-overlay-content{width:100%;max-width:650px;transform:translateY(-20px);transition:transform 0.4s ease;background-color:var(--background-white);border-radius:12px;padding:var(--spacing-xl);box-shadow:var(--box-shadow-lg);border:1px solid var(--border-color)}body.search-overlay-active .search-overlay-content{transform:translateY(0)}.search-overlay-close-btn{position:absolute;top:var(--spacing-lg);right:var(--spacing-lg);background:none;border:none;font-size:2.5rem;color:var(--text-color-light);cursor:pointer;line-height:1;transition:transform 0.2s ease,color 0.2s ease;z-index:1101}.search-overlay-close-btn:hover{color:var(--primary-color-dark);transform:rotate(90deg)}.search-overlay-title{text-align:center;font-family:var(--font-family-branding);font-size:3.5rem;font-weight:400;color:var(--primary-color-dark);margin:0 0 var(--spacing-md) 0;line-height:1}.search-overlay-form{width:100%;position:relative}.search-overlay-input{width:100%;border:1px solid var(--border-color);background-color:var(--background-light);font-size:1.1rem;padding:var(--spacing-md) var(--spacing-lg);color:var(--text-color-dark);outline:none;border-radius:999px;font-family:var(--font-family-body);font-weight:500;transition:border-color 0.3s ease,box-shadow 0.3s ease}.search-overlay-input::placeholder{color:var(--text-color-light);opacity:.8}.search-overlay-input:focus{border-color:var(--primary-color);box-shadow:0 0 0 3px var(--primary-color-pastel)}.search-overlay-tip{text-align:center;font-size:.85rem;color:var(--text-color-light);margin-top:var(--spacing-sm)}.search-overlay-results{margin-top:var(--spacing-lg);width:100%;max-height:calc(90vh - 300px);overflow-y:auto}.search-overlay-results.visible{border-top:1px solid var(--border-color);padding-top:var(--spacing-md)}.search-overlay-results .search-result-item{padding:var(--spacing-md)}.search-overlay-results::-webkit-scrollbar{width:8px}.search-overlay-results::-webkit-scrollbar-track{background:#fff0}.search-overlay-results::-webkit-scrollbar-thumb{background:var(--primary-color-light);border-radius:4px}.search-overlay-results::-webkit-scrollbar-thumb:hover{background:var(--primary-color)}@media (max-width:640px){.search-overlay-content{padding:var(--spacing-lg)}.search-overlay-title{font-size:2.5rem}}``` ### 2. Mobil Menü Javítása Visszaállítjuk az "Összes Recept" linket a mobil menübe. ```php <?php // /var/www/izekesillatok/views/partials/header/_mobile_nav.php ?><div class="mobile-header-controls"><button class="mobile-search-toggle" aria-label="Keresés megnyitása"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" width="24px" height="24px"><path d="M15.5 14h-.79l-.28-.27A6.471 6.471 0 0 0 16 9.5 6.5 6.5 0 1 0 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"/></svg></button><button id="mobile-menu-open-btn" class="mobile-menu-toggle" aria-label="Menü megnyitása" aria-expanded="false" aria-controls="mobile-menu-panel"><span class="hamburger-icon"></span></button></div><div class="mobile-menu-panel" id="mobile-menu-panel" aria-hidden="true" role="dialog" aria-modal="true" aria-labelledby="mobile-menu-title"><div class="mobile-menu-content"><h2 id="mobile-menu-title" class="visually-hidden">Főmenü</h2><div class="js-live-search-form"><form action="/kereses" method="GET" class="search-form mobile-search-form" autocomplete="off"><input type="search" name="q" placeholder="Receptek keresése..." class="search-input" required><button type="submit" class="search-button" aria-label="Keresés"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" width="20px" height="20px"><path d="M15.5 14h-.79l-.28-.27A6.471 6.471 0 0 0 16 9.5 6.5 6.5 0 1 0 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"/></svg></button></form></div><nav class="mobile-navigation"><ul><li class="mobile-menu-accordion"><button type="button" class="accordion-toggle" aria-expanded="false" aria-controls="mobile-category-panel"><span>Receptek</span><svg class="accordion-toggle-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z" clip-rule="evenodd" /></svg></button><ul class="accordion-panel" id="mobile-category-panel"><!-- JAVÍTÁS:Az "Összes Recept" link visszaállítva --><li><a href="/receptek">Összes Recept</a></li><?php if (!empty($recipeCategories)):?><?php foreach ($recipeCategories as $category):?><li><a href="<?= category_url(../../../public/css/components/$category) ?>"><?=htmlspecialchars($category) ?></a></li><?php endforeach;?><?php endif;?></ul></li><li><a href="#">Életmód</a></li><li><a href="#">Alapanyagok</a></li></ul></nav><div class="mobile-user-nav"><a href="#" class="user-nav-link"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" width="24px" height="24px"><path d="M6 2c-1.1 0-2 .9-2 2v16c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2H6zm0 18V4h12v16H6zm2-2h8v-2H8v2zm0-4h8v-2H8v2zm0-4h8V8H8v2z"/></svg><span>Receptkönyvem</span></a><a href="#" class="user-nav-link"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" width="24px" height="24px"><path d="M12 12c2.76 0 5-2.24 5-5s-2.24-5-5-5-5 2.24-5 5 2.24 5 5 5zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"/></svg><span>Fiókom</span></a></div></div></div>.search-form-wrapper,.js-live-search-form{position:relative}.search-form{display:flex;align-items:center;background-color:var(--background-white);border:1px solid var(--border-color);border-radius:999px;overflow:hidden;box-shadow:var(--box-shadow-sm)}.search-input{border:none;background:#fff0;padding:.6rem 1.2rem;font-size:.95rem;color:var(--text-color-dark);outline:none;flex-grow:1;min-width:0}.header-right .search-form{max-width:220px;transition:max-width 0.3s ease-in-out,box-shadow 0.2s ease}.header-right .search-form:focus-within{max-width:300px;box-shadow:0 0 0 3px var(--primary-color-pastel)}.search-button{background-color:var(--primary-color);border:none;color:var(--text-color-white);padding:.7rem;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background-color 0.2s ease}.search-button:hover{background-color:var(--primary-color-dark)}.search-results-dropdown{position:absolute;top:calc(100% + 8px);right:0;width:320px;background-color:var(--background-white);border-radius:8px;box-shadow:var(--box-shadow-lg);border:1px solid var(--border-color);z-index:1100;overflow:hidden;opacity:0;visibility:hidden;transform:translateY(-10px);transition:opacity 0.2s ease,transform 0.2s ease,visibility 0.2s;display:flex;flex-direction:column;max-height:450px}.mobile-search-wrapper .search-results-dropdown{left:0;width:100%}.search-results-dropdown.visible{opacity:1;visibility:visible;transform:translateY(0)}.search-results-list{list-style:none;margin:0;flex-grow:1;overflow-y:auto;min-height:0;padding:var(--spacing-sm)}.search-result-header{font-size:.8rem;font-weight:700;color:var(--text-color-light);text-transform:uppercase;padding:var(--spacing-md) var(--spacing-sm) var(--spacing-xs);border-top:1px solid var(--border-color);margin-top:var(--spacing-xs)}.search-results-list>li:first-child.search-result-header{border-top:none;margin-top:0}.search-result-item{display:flex;align-items:center;padding:var(--spacing-sm);border-radius:6px;text-decoration:none;transition:background-color 0.2s ease}.search-result-item:hover{background-color:var(--background-light)}.search-result-image{width:40px;height:40px;object-fit:cover;border-radius:4px;margin-right:var(--spacing-md);flex-shrink:0}.search-result-title{font-size:.9rem;font-weight:500;color:var(--text-color-dark);line-height:1.3}.search-no-results{padding:var(--spacing-lg);text-align:center;color:var(--text-color-light)}.search-results-show-all{display:block;padding:var(--spacing-md);background-color:var(--primary-color-pastel);text-align:center;font-weight:700;color:var(--primary-color-dark);text-decoration:none;transition:background-color 0.2s ease;flex-shrink:0;border-top:1px solid var(--border-color)}.search-results-show-all:hover{background-color:var(--primary-color-light);color:var(--text-color-dark)}.search-notice{text-align:center;font-size:1.2rem;margin:var(--spacing-xl) 0}.breadcrumbs-nav{margin-bottom:var(--spacing-sm);text-align:center}.breadcrumbs-list{display:inline-flex;align-items:center;flex-wrap:wrap;list-style:none;padding:0;margin:0;font-size:.85rem;color:var(--text-color-light)}.breadcrumb-item a{color:var(--text-color-light);text-decoration:none;transition:color 0.2s ease}.breadcrumb-item a:hover{color:var(--primary-color-dark);text-decoration:underline}.breadcrumb-item:not(:last-child)::after{content:'/';margin:0 var(--spacing-sm);color:var(--border-color);pointer-events:none}.breadcrumb-item [aria-current="page"]{font-weight:500;color:var(--text-color-dark)}.recipe-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:var(--spacing-lg)}.recipe-card{background-color:var(--background-white);border-radius:12px;box-shadow:var(--box-shadow-md);overflow:hidden;display:flex;flex-direction:column;transition:transform 0.2s ease-out,box-shadow 0.2s ease-out;text-decoration:none}.recipe-card:hover{transform:translateY(-6px);box-shadow:var(--box-shadow-lg)}.recipe-card-image{width:100%;aspect-ratio:4 / 3;overflow:hidden;position:relative}.recipe-card-image img{width:100%;height:100%;object-fit:cover;transition:transform 0.4s ease,filter 0.4s ease;filter:brightness(.95)}.recipe-card:hover .recipe-card-image img{transform:scale(1.05);filter:brightness(1)}.recipe-card-category{position:absolute;top:var(--spacing-md);left:var(--spacing-md);background-color:rgb(0 0 0 / .6);color:var(--text-color-white);padding:var(--spacing-xs) var(--spacing-sm);border-radius:999px;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.5px;z-index:2}.recipe-card-content{padding:var(--spacing-md) var(--spacing-lg);flex-grow:1;display:flex;align-items:center;background-color:var(--primary-color-pastel);justify-content:center}.recipe-card-title{font-size:1.15rem;font-weight:700;line-height:1.4;color:var(--text-color-dark);margin:0;text-align:center}@media (max-width:640px){.recipe-grid{grid-template-columns:1fr;gap:var(--spacing-lg)}}.ad-placeholder{display:flex;align-items:center;justify-content:center;width:100%;min-height:250px;background-color:var(--border-color);border:2px dashed var(--text-color-light);border-radius:8px;margin:var(--spacing-lg) 0}.ad-placeholder-text{color:var(--text-color-light);text-align:center;font-weight:500}.ad-placeholder-text span{display:block;font-size:.9rem;font-weight:400;margin-top:var(--spacing-xs)}.home-leaderboard-ad{padding-top:var(--spacing-xl);padding-bottom:var(--spacing-xl)}.home-leaderboard-ad .ad-placeholder{min-height:250px;margin:0}.home-leaderboard-ad .ad-placeholder-text span::before{content:"970 x 250 (Leaderboard)"}.home-leaderboard-ad .ad-placeholder-text span{visibility:hidden;position:relative}.home-leaderboard-ad .ad-placeholder-text span::before{visibility:visible;position:absolute;top:0;left:50%;transform:translateX(-50%);width:100%}.ad-slot{display:flex;justify-content:center;align-items:center;width:100%;margin:var(--spacing-lg) auto;text-align:center;overflow:hidden}.ad-slot--sidebar-300x250{max-width:300px;min-height:250px}.ad-slot--leaderboard-970x250{max-width:970px;min-height:250px}@media (max-width:992px){.ad-slot--leaderboard-970x250{min-height:90px}}@media (max-width:767px){.ad-slot--leaderboard-970x250{max-width:300px;min-height:250px}}@media (max-width:320px){.ad-slot--leaderboard-970x250,.ad-slot--sidebar-300x250{min-height:100px}}.ribbon-carousel-section{width:100%;padding:var(--spacing-md) 0;background-color:var(--background-white);border-bottom:1px solid var(--border-color)}.ribbon-carousel-wrapper{overflow:hidden;width:100%}.ribbon-carousel{display:flex;width:max-content;will-change:transform;animation:ribbon-scroll 60s linear infinite}.ribbon-carousel-wrapper:hover .ribbon-carousel{animation-play-state:paused}.ribbon-item{display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-md);text-decoration:none;background-color:var(--background-light);border-radius:999px;margin-right:var(--spacing-md);transition:background-color 0.2s ease}.ribbon-item:hover{background-color:var(--primary-color-light)}.ribbon-item-image{width:40px;height:40px;border-radius:50%;object-fit:cover}.ribbon-item-title{font-size:.9rem;font-weight:700;color:var(--text-color-dark);white-space:nowrap}@keyframes ribbon-scroll{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}.hero-slider-container{position:relative;width:100%;overflow:hidden;border-radius:12px;box-shadow:var(--box-shadow-lg)}.hero-slider{display:flex;transition:transform 0.5s ease-in-out}.hero-slide{flex:0 0 100%;width:100%;position:relative}.hero-slide-link{display:block;width:100%;aspect-ratio:16 / 9}.hero-slide-image-wrapper{position:absolute;top:0;left:0;right:0;bottom:0}.hero-slide-image{width:100%;height:100%;object-fit:cover}.hero-slide-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(to top,rgb(0 0 0 / .7) 0%,#fff0 60%)}.hero-slide-content{position:absolute;bottom:0;left:0;right:0;padding:var(--spacing-xl);color:var(--text-color-white)}.hero-slide-title{font-size:2.2rem;color:var(--text-color-white);margin:0 0 var(--spacing-md) 0;text-shadow:0 2px 8px rgb(0 0 0 / .7);line-height:1.2}.hero-slide-cta{display:inline-block;font-weight:700;background-color:#fff0;border:2px solid var(--primary-color);color:var(--primary-color);padding:var(--spacing-sm) var(--spacing-lg);border-radius:999px;text-decoration:none;transition:all 0.3s ease}.hero-slide-link:hover .hero-slide-cta{background-color:var(--primary-color);color:var(--text-color-white);transform:scale(1.05)}.hero-slider-nav{position:absolute;top:50%;left:var(--spacing-md);right:var(--spacing-md);transform:translateY(-50%);display:flex;justify-content:space-between;pointer-events:none}.hero-nav-btn{pointer-events:all;background:linear-gradient(45deg,rgb(255 255 255 / .7),rgb(255 255 255 / .9));border:none;border-radius:50%;width:48px;height:48px;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 10px rgb(0 0 0 / .15);transition:all 0.2s ease;opacity:0}.hero-slider-container:hover .hero-nav-btn{opacity:1}.hero-nav-btn:hover{background:var(--text-color-white);transform:scale(1.1);box-shadow:0 6px 15px rgb(0 0 0 / .2)}.hero-nav-btn svg{width:32px;height:32px;color:var(--text-color-dark)}.hero-slider-dots{position:absolute;bottom:var(--spacing-md);left:50%;transform:translateX(-50%);display:flex;gap:var(--spacing-xs)}.hero-dot{position:relative;width:32px;height:32px;padding:0;border:none;background-color:#fff0;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center}.hero-dot::after{content:'';width:12px;height:12px;border-radius:50%;background-color:rgb(255 255 255 / .4);border:1px solid rgb(0 0 0 / .2);transition:background-color 0.3s ease,transform 0.3s ease}.hero-dot:hover::after{transform:scale(1.2)}.hero-dot.active::after{background-color:var(--text-color-white)}@media (max-width:767px){.hero-slide-title{font-size:1.6rem}.hero-slide-content{padding:var(--spacing-lg)}.hero-nav-btn{width:40px;height:40px}.hero-nav-btn svg{width:24px;height:24px}}.recipe-meta-card{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:var(--spacing-md);background-color:var(--primary-color-ultralight);border:1px solid var(--border-color);border-radius:12px;padding:var(--spacing-lg);margin-bottom:var(--spacing-xl);border-bottom:3px solid #e0e0e0;box-shadow:0 3px 6px rgb(0 0 0 / .04),0 8px 16px rgb(0 0 0 / .04);transition:transform 0.2s ease-out,box-shadow 0.2s ease-out}.recipe-meta-card:hover{transform:translateY(-5px);box-shadow:0 5px 8px rgb(0 0 0 / .06),0 12px 20px rgb(0 0 0 / .06)}html[data-theme="dark"] .recipe-meta-card{border-bottom-color:#3a475a}.recipe-meta-item{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-xs);text-align:center}.meta-icon{font-size:2.2rem;color:var(--primary-color-dark);margin-bottom:var(--spacing-xs)}.meta-label{font-size:.8rem;font-weight:700;color:var(--text-color-light);text-transform:uppercase;letter-spacing:.5px}.meta-value{font-size:1.1rem;font-weight:700;color:var(--text-color-dark)}@media (max-width:767px){.recipe-meta-card{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--spacing-lg)}.meta-icon{font-size:1.8rem}}.interactive-ingredients-section{position:relative}.ingredient-list-interactive{margin-bottom:var(--spacing-lg)}.ingredient-item{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-md);border-radius:8px;margin-bottom:var(--spacing-sm);cursor:pointer;transition:background-color 0.2s ease,box-shadow 0.2s ease,transform 0.2s ease;border:1px solid var(--border-color);background-color:var(--background-white);box-shadow:0 2px 4px rgb(0 0 0 / .04)}.ingredient-item:hover{background-color:var(--primary-color-pastel);transform:translateY(-2px);box-shadow:0 4px 8px rgb(0 0 0 / .06)}.checkbox-icon{width:24px;height:24px;border:2px solid var(--text-color-light);border-radius:50%;flex-shrink:0;transition:background-color 0.2s ease,border-color 0.2s ease;display:flex;align-items:center;justify-content:center}.checkbox-icon::after{content:'✓';font-size:14px;color:var(--text-color-white);opacity:0;transform:scale(.5);transition:opacity 0.2s ease,transform 0.2s ease}.ingredient-item[aria-checked="true"] .checkbox-icon{background-color:var(--primary-color);border-color:var(--primary-color)}.ingredient-item[aria-checked="true"] .checkbox-icon::after{opacity:1;transform:scale(1)}.ingredient-text{text-decoration:none;transition:text-decoration 0.2s ease}.ingredient-item[aria-checked="true"] .ingredient-text{text-decoration:line-through;opacity:.6}.shopping-list-header{cursor:pointer;font-size:1.2rem;font-weight:700;display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-md);background-color:var(--primary-color-pastel);border:1px solid var(--primary-color-light);border-radius:8px;transition:all 0.3s ease;box-shadow:0 2px 5px rgb(255 149 0 / .1);position:relative;z-index:2}.shopping-list-header:hover{background-color:var(--primary-color-light);color:var(--text-color-dark);box-shadow:0 4px 10px rgb(255 149 0 / .2)}.shopping-list-header .toggle-arrow{transition:transform 0.3s ease}.shopping-list-header.is-open .toggle-arrow{transform:rotate(180deg)}.shopping-list-header.is-open{border-bottom-left-radius:0;border-bottom-right-radius:0}.shopping-list-container{max-height:0;overflow:hidden;transition:max-height 0.4s ease-in-out,padding 0.4s ease-in-out,border 0.4s ease-in-out;background-color:var(--background-white);border-radius:0 0 8px 8px;padding:0 var(--spacing-lg);border:1px solid #fff0;border-top:none;box-shadow:var(--box-shadow-md);margin-top:-8px;position:relative;z-index:1}.shopping-list-container.is-open{max-height:500px;padding:var(--spacing-lg);padding-top:calc(var(--spacing-lg) + 8px);border-color:var(--border-color)}.shopping-list-container ul{list-style-type:disc;padding-left:var(--spacing-lg);margin-bottom:var(--spacing-lg)}.shopping-list-actions{display:flex;gap:var(--spacing-md)}.shopping-list-button{flex-grow:1;padding:var(--spacing-sm) var(--spacing-md);background-color:var(--primary-color);color:var(--text-color-white);border:none;border-radius:6px;cursor:pointer;font-weight:700;transition:background-color 0.2s ease}.shopping-list-button:hover{background-color:var(--primary-color-dark)}.allergens-section{margin-top:var(--spacing-xl);padding:var(--spacing-lg);background-color:var(--background-white);border-radius:12px;border:1px solid var(--border-color);box-shadow:0 4px 6px rgb(0 0 0 / .05),0 10px 20px rgb(0 0 0 / .05);border-bottom:3px solid #e0e0e0}html[data-theme="dark"] .allergens-section{border-bottom-color:#3a475a}.allergens-title{font-size:1.2rem;font-weight:700;margin-bottom:var(--spacing-md);text-align:center;color:var(--text-color-dark)}.allergens-list{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--spacing-lg)}.allergen-item{display:flex;align-items:center;gap:var(--spacing-sm);font-size:.9rem;font-weight:500;background-color:var(--background-light);padding:var(--spacing-xs) var(--spacing-md);border-radius:999px;border:1px solid var(--border-color)}.allergen-icon{color:var(--primary-color-dark)}.interactive-steps-section{position:relative}.steps-list-interactive{display:flex;flex-direction:column;gap:var(--spacing-lg)}.step-card{display:flex;gap:var(--spacing-lg);background-color:var(--background-white);border:1px solid var(--border-color);border-radius:12px;padding:var(--spacing-lg);cursor:pointer;box-shadow:0 4px 6px rgb(0 0 0 / .05),0 10px 20px rgb(0 0 0 / .05);border-bottom:3px solid #e0e0e0;transition:all 0.2s ease-out}html[data-theme="dark"] .step-card{border-bottom-color:#3a475a}.step-card:hover{transform:translateY(-5px);box-shadow:0 8px 12px rgb(0 0 0 / .07),0 15px 25px rgb(0 0 0 / .07)}.step-card.clicked{background-color:#e8f5e9;border-color:#a5d6a7;border-bottom-color:#81c784}html[data-theme="dark"] .step-card.clicked{background-color:#1c331d;border-color:#388e3c;border-bottom-color:#2e7d32}.step-number-container{flex-shrink:0;display:flex;flex-direction:column;align-items:center}.step-number{font-size:1.5rem;font-weight:700;color:var(--primary-color);line-height:1}.step-checkmark{font-size:1.5rem;color:#4caf50;opacity:0;transform:scale(0);transition:all 0.3s ease}.step-card.clicked .step-checkmark{opacity:1;transform:scale(1)}.step-details{flex-grow:1}.step-description{line-height:1.7;font-size:1.1rem;margin:0}.step-tip-interactive{margin-top:var(--spacing-md);padding:var(--spacing-md);background-color:var(--primary-color-pastel);border-left:4px solid var(--primary-color);border-radius:0 8px 8px 0;font-size:.95rem}html[data-theme="dark"] .step-tip-interactive{background-color:var(--background-white);border-color:var(--primary-color-dark)}@keyframes pulse-attention{0%{transform:scale(1);box-shadow:var(--box-shadow-lg)}50%{transform:scale(1.1);box-shadow:0 10px 25px rgb(0 0 0 / .2)}100%{transform:scale(1);box-shadow:var(--box-shadow-lg)}}.animate-attention{animation:pulse-attention 0.6s cubic-bezier(.68,-.55,.27,1.55) 0.2s 1}#floating-ingredients-panel-container{position:fixed;bottom:var(--spacing-lg);left:var(--spacing-lg);z-index:990;opacity:0;visibility:hidden;transform:translateY(20px);transition:opacity 0.4s ease,visibility 0.4s ease,transform 0.4s ease;pointer-events:none}#floating-ingredients-panel-container.is-visible{opacity:1;visibility:visible;transform:translateY(0);pointer-events:auto}.floating-toggle-btn{padding:var(--spacing-sm) var(--spacing-lg);background-color:var(--primary-color);color:var(--text-color-white);border:none;border-radius:999px;font-weight:700;box-shadow:var(--box-shadow-lg);cursor:pointer;transition:background-color 0.2s ease,transform 0.2s ease}.floating-toggle-btn:hover{background-color:var(--primary-color-dark);transform:scale(1.05)}.floating-panel{position:absolute;bottom:calc(100% + 10px);left:0;width:300px;max-height:70vh;background-color:var(--background-white);border-radius:12px;box-shadow:var(--box-shadow-lg);border:1px solid var(--border-color);display:flex;flex-direction:column;opacity:0;visibility:hidden;transform:translateY(20px);transition:all 0.3s ease;pointer-events:none}.floating-panel.is-visible{opacity:1;visibility:visible;transform:translateY(0);pointer-events:auto}.floating-panel-header{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-sm) var(--spacing-lg);border-bottom:1px solid var(--border-color)}.floating-panel-header h3{margin:0;font-size:1rem}.close-btn{background:none;border:none;font-size:1.5rem;cursor:pointer;color:var(--text-color-light)}.floating-panel-content{padding:var(--spacing-lg);overflow-y:auto}.floating-panel-content ul{list-style-type:none;padding:0;margin:0}.floating-panel-content li{padding:var(--spacing-xs) 0}.pagination-nav{display:flex;justify-content:center;margin-top:var(--spacing-xl)}.pagination-list{display:flex;flex-wrap:wrap;justify-content:center;list-style-type:none;padding:0;margin:0;border-radius:8px;box-shadow:var(--box-shadow-sm);overflow:hidden;border:1px solid var(--border-color)}.pagination-link{display:block;padding:.75rem 1.25rem;color:var(--primary-color-dark);background-color:var(--background-white);text-decoration:none;font-weight:700;transition:background-color 0.2s ease,color 0.2s ease;border-left:1px solid var(--border-color)}.pagination-list li:first-child .pagination-link{border-left:none}.pagination-link:not(.disabled):hover{background-color:var(--primary-color-pastel)}.pagination-link.active{background-color:var(--primary-color);color:var(--text-color-white);cursor:default}.pagination-link.disabled{color:var(--text-color-light);opacity:.6;cursor:not-allowed;background-color:var(--background-light)}.pagination-separator{display:flex;align-items:center;padding:.75rem 1rem;color:var(--text-color-light);background-color:var(--background-white);border-left:1px solid var(--border-color)}@media (max-width:640px){.pagination-list{border:none;box-shadow:none;background-color:#fff0}.pagination-link,.pagination-separator{padding:.6rem .85rem;min-height:36px;display:inline-flex;align-items:center;justify-content:center;font-size:.9rem;border-radius:6px;margin:2px;border:1px solid var(--border-color)}.pagination-link.prev-next{font-size:.8rem}.pagination-separator{border-radius:6px}}.recipe-accordion-list{margin-top:var(--spacing-lg)}.accordion-items-container{display:flex;flex-direction:column;gap:1px;background-color:var(--border-color);border:1px solid var(--border-color);border-radius:8px;overflow:hidden;box-shadow:var(--box-shadow-sm)}.accordion-item{background-color:var(--background-white)}.accordion-button{width:100%;background:none;border:none;display:flex;align-items:center;text-align:left;padding:var(--spacing-sm) var(--spacing-md);cursor:pointer;font-family:inherit;transition:background-color 0.2s ease}.accordion-button:hover{background-color:var(--primary-color-pastel)}.accordion-icon-wrapper{display:flex;align-items:center;justify-content:center;margin-right:var(--spacing-md);color:var(--primary-color);flex-shrink:0}.accordion-icon-wrapper svg{width:1em;height:1em;fill:currentColor;transition:transform 0.3s ease}.icon-plus{display:block}.icon-minus{display:none}.accordion-title{font-size:.95rem;font-weight:700;color:var(--text-color-light);line-height:1.4;transition:color 0.2s ease}.accordion-panel{max-height:0;overflow:hidden;transition:max-height 0.4s ease-in-out;background-color:var(--background-light)}.accordion-panel-content{padding:var(--spacing-md)}.accordion-preview-link{display:flex;align-items:center;gap:var(--spacing-md);text-decoration:none;background-color:var(--background-white);border-radius:8px;padding:var(--spacing-sm);border:1px solid var(--border-color);transition:background-color 0.2s ease,box-shadow 0.2s ease}.accordion-preview-link:hover{box-shadow:var(--box-shadow-md);border-color:var(--primary-color-light)}.accordion-preview-image img{width:80px;height:80px;object-fit:cover;border-radius:6px;display:block}.accordion-preview-title{font-size:.9rem;font-weight:700;line-height:1.4;color:var(--text-color-dark);margin:0}.accordion-item.is-open .accordion-button{background-color:var(--primary-color-pastel)}.accordion-item.is-open .accordion-title{color:var(--text-color-dark)}.accordion-item.is-open .icon-plus{display:none}.accordion-item.is-open .icon-minus{display:block}.accordion-item.is-open .accordion-panel{max-height:500px}html[data-theme="dark"] .accordion-items-container{background-color:var(--border-color);border-color:var(--border-color)}html[data-theme="dark"] .accordion-item{background-color:var(--background-white)}html[data-theme="dark"] .accordion-button:hover{background-color:var(--primary-color-pastel)}html[data-theme="dark"] .accordion-item.is-open .accordion-button{background-color:var(--primary-color-pastel)}html[data-theme="dark"] .accordion-panel{background-color:var(--background-light)}html[data-theme="dark"] .accordion-preview-link{background-color:var(--background-white);border-color:var(--border-color)}html[data-theme="dark"] .accordion-preview-link:hover{border-color:var(--primary-color-dark)}.category-showcase-section{margin-top:var(--spacing-xl);padding:var(--spacing-lg) 0;background-color:var(--primary-color-ultralight);border-top:1px solid var(--border-color);border-bottom:1px solid var(--border-color)}.category-showcase-title{font-size:1.5rem;text-align:center;margin-bottom:var(--spacing-lg);color:var(--text-color-dark)}.category-showcase-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--spacing-md);list-style:none;padding:0;margin:0}.category-showcase-item a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--spacing-sm);text-decoration:none;padding:var(--spacing-lg);background-color:var(--background-white);border-radius:12px;border:1px solid var(--border-color);box-shadow:var(--box-shadow-sm);transition:transform 0.2s ease,box-shadow 0.2s ease,border-color 0.2s ease;height:100%;text-align:center}.category-showcase-item a:hover{transform:translateY(-5px);box-shadow:var(--box-shadow-md);border-color:var(--primary-color-light)}.category-showcase-icon{font-size:2.5rem;color:var(--primary-color);margin-bottom:var(--spacing-xs)}.category-showcase-name{font-weight:700;color:var(--text-color-dark);line-height:1.4}@media (max-width:767px){.category-showcase-section{display:none}}.cookie-consent-banner{position:fixed;bottom:0;left:0;right:0;background-color:var(--background-white);padding:var(--spacing-lg);box-shadow:0 -4px 15px rgb(0 0 0 / .1);z-index:1200;display:flex;align-items:center;justify-content:center;gap:var(--spacing-lg);flex-wrap:wrap;transform:translateY(100%);transition:transform 0.5s cubic-bezier(.25,1,.5,1);border-top:1px solid var(--border-color)}.cookie-consent-banner.is-visible{transform:translateY(0)}.cookie-consent__text{flex-grow:1;min-width:300px;max-width:60%}.cookie-consent__text h3{margin:0 0 var(--spacing-xs) 0;font-size:1.2rem}.cookie-consent__text p{margin:0;font-size:.9rem;color:var(--text-color-light)}.cookie-consent__actions{display:flex;gap:var(--spacing-sm);flex-wrap:wrap}.cookie-consent__btn{padding:var(--spacing-sm) var(--spacing-lg);border:none;border-radius:999px;font-weight:700;cursor:pointer;transition:background-color 0.2s,color 0.2s,box-shadow 0.2s}.cookie-consent__btn--primary{background-color:var(--primary-color);color:#1A202C}.cookie-consent__btn--primary:hover{background-color:var(--primary-color-dark);box-shadow:var(--box-shadow-md)}.cookie-consent__btn--secondary{background-color:var(--background-light);color:var(--text-color-dark);border:1px solid var(--border-color)}.cookie-consent__btn--secondary:hover{background-color:var(--border-color)}.cookie-modal-overlay{position:fixed;inset:0;background-color:rgb(0 0 0 / .5);z-index:1210;opacity:0;visibility:hidden;transition:opacity 0.3s ease,visibility 0.3s ease}.cookie-modal-overlay.is-visible{opacity:1;visibility:visible}.cookie-modal{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%) scale(.95);background-color:var(--background-white);width:90%;max-width:600px;max-height:90vh;border-radius:12px;box-shadow:var(--box-shadow-lg);z-index:1220;display:flex;flex-direction:column;opacity:0;visibility:hidden;transition:opacity 0.3s ease,transform 0.3s ease,visibility 0.3s ease}.cookie-modal.is-visible{opacity:1;visibility:visible;transform:translate(-50%,-50%) scale(1)}.cookie-modal__header{padding:var(--spacing-lg);border-bottom:1px solid var(--border-color)}.cookie-modal__header h2{margin:0}.cookie-modal__header p{font-size:.9rem;color:var(--text-color-light);margin:var(--spacing-xs) 0 0 0}.cookie-modal__body{padding:var(--spacing-lg);overflow-y:auto}.cookie-modal__footer{padding:var(--spacing-lg);border-top:1px solid var(--border-color);display:flex;justify-content:flex-end}.cookie-category{padding:var(--spacing-md);border:1px solid var(--border-color);border-radius:8px;margin-bottom:var(--spacing-md)}.cookie-category__header{display:flex;justify-content:space-between;align-items:center}.cookie-category__title{font-weight:700;font-size:1.1rem;margin:0}.cookie-category__desc{font-size:.85rem;color:var(--text-color-light);margin-top:var(--spacing-sm)}.switch{position:relative;display:inline-block;width:44px;height:24px}.switch input{opacity:0;width:0;height:0}.slider{position:absolute;cursor:pointer;inset:0;background-color:#ccc;transition:.4s;border-radius:24px}.slider:before{position:absolute;content:"";height:16px;width:16px;left:4px;bottom:4px;background-color:#fff;transition:.4s;border-radius:50%}input:checked+.slider{background-color:var(--primary-color)}input:focus+.slider{box-shadow:0 0 1px var(--primary-color)}input:checked+.slider:before{transform:translateX(20px)}input:disabled+.slider{background-color:#e9e9e9;cursor:not-allowed}@media (max-width:768px){.cookie-consent-banner{flex-direction:column;text-align:center}.cookie-consent__text{max-width:100%}.cookie-consent__actions{justify-content:center}}body:has(.home-layout,.recipe-page-container) .main-content{padding-top:0}.home-layout{display:grid;gap:var(--spacing-xl);grid-template-columns:1fr 2.2fr 1fr;grid-template-areas:"left main right";margin-top:var(--spacing-xl)}.home-layout-left{grid-area:left}.home-layout-main{grid-area:main}.home-layout-right{grid-area:right}.recipe-list-column .recipe-card{margin-bottom:var(--spacing-lg)}.recipe-list-column .recipe-card:last-child{margin-bottom:0}.column-title{font-size:1.5rem;border-bottom:3px solid var(--primary-color);padding-bottom:var(--spacing-sm);margin-bottom:var(--spacing-lg)}.home-ad-section{margin-top:var(--spacing-xxl)}.home-ad-section .ad-placeholder{min-height:90px}.home-ad-section .ad-placeholder-text span{content:"728 x 90"}.home-section{margin-top:var(--spacing-xxl)}.section-title{text-align:center;font-size:2rem;margin-bottom:var(--spacing-xl)}.home-dessert-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}@media (max-width:1200px){.home-layout{grid-template-columns:1fr 1fr;grid-template-areas:"main main" "left right"}}@media (max-width:767px){.home-layout{grid-template-columns:1fr;grid-template-areas:"main" "left" "right"}.home-layout,.home-ad-section,.home-section,.home-leaderboard-ad{padding-left:var(--container-padding);padding-right:var(--container-padding)}}.recipe-page-container{padding-top:var(--spacing-xl);padding-bottom:var(--spacing-xl)}.recipe-layout-grid{display:grid;grid-template-columns:200px 1fr 200px;grid-template-areas:"sidebar-left main-content sidebar-right";gap:var(--spacing-xl)}.recipe-sidebar-left{grid-area:sidebar-left}.recipe-content-main{grid-area:main-content;min-width:0;background-color:var(--background-white);padding:var(--spacing-xl);border-radius:16px;box-shadow:0 8px 32px rgb(0 0 0 / .08)}.recipe-sidebar-right{grid-area:sidebar-right}.recipe-hero .container{padding-left:var(--container-padding);padding-right:var(--container-padding)}.recipe-featured-image-container{width:100%;border-radius:12px;margin:0 0 var(--spacing-lg) 0;overflow:hidden;box-shadow:var(--box-shadow-lg);border:1px solid var(--border-color)}.recipe-featured-image{width:100%;height:auto;display:block}.recipe-image-caption{padding:var(--spacing-md);background-color:var(--background-light);color:var(--text-color-light);font-size:.9rem;font-style:italic;text-align:center;line-height:1.5;border-top:1px solid var(--border-color)}.recipe-title-main{font-size:2.8rem;text-align:center;margin-bottom:var(--spacing-md)}.recipe-author-byline{text-align:center;font-style:italic;color:var(--text-color-light);margin-top:calc(-1 * var(--spacing-sm));margin-bottom:var(--spacing-lg);font-size:.9rem}.recipe-story-main{max-width:75ch;margin:0 auto var(--spacing-lg);line-height:1.8;font-size:1.1rem;color:var(--text-color-light)}.recipe-story-main p{margin-bottom:.75em}.recipe-story-main p:last-child{margin-bottom:0}.entity-category-tags{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--spacing-sm);margin-top:var(--spacing-md);margin-bottom:var(--spacing-xl)}.category-tag{background-color:var(--primary-color-pastel);color:var(--text-color-dark);padding:var(--spacing-xs) var(--spacing-md);border-radius:999px;font-size:.85rem;font-weight:700;text-decoration:none;transition:all 0.2s ease-in-out;border:1px solid var(--primary-color-light)}.category-tag:hover{background-color:var(--primary-color-light);color:var(--text-color-dark);transform:translateY(-2px);box-shadow:var(--box-shadow-sm)}html[data-theme="dark"] .category-tag{border-color:var(--border-color)}html[data-theme="dark"] .category-tag:hover{background-color:var(--primary-color-dark);color:var(--text-color-white)}.divider{height:3px;background:linear-gradient(to right,transparent,var(--primary-color),transparent);border:0;margin:var(--spacing-xxl) 0;opacity:.5}.section-title-underline{font-size:2.2rem;font-weight:700;margin-bottom:var(--spacing-lg);padding-bottom:var(--spacing-sm);border-bottom:4px solid var(--primary-color);display:inline-block}.sidebar-widget{margin-bottom:var(--spacing-xl)}.sidebar-title{font-size:1.2rem;margin-bottom:var(--spacing-md);padding-bottom:var(--spacing-sm);border-bottom:2px solid var(--primary-color)}.sidebar-recipe-list{display:flex;flex-direction:column;gap:var(--spacing-lg)}.recipe-ad-slot{margin-top:var(--spacing-xl);margin-bottom:var(--spacing-xl)}@media (max-width:1024px){.recipe-layout-grid{grid-template-columns:1fr;grid-template-areas:"main-content" "sidebar-left" "sidebar-right"}.recipe-sidebar-left,.recipe-sidebar-right{border-top:1px solid var(--border-color);padding-top:var(--spacing-xl)}}@media (max-width:767px){.recipe-title-main{font-size:2rem}.recipe-page-container>.recipe-layout-grid{padding-left:var(--container-padding);padding-right:var(--container-padding)}.recipe-content-main{padding:var(--spacing-lg);border-radius:0;margin:0 calc(-1 * var(--container-padding))}.related-recipes-section .container,.home-leaderboard-ad.container{padding-left:var(--container-padding);padding-right:var(--container-padding)}}.category-layout{display:grid;gap:var(--spacing-xl);grid-template-columns:1fr 2.2fr 1fr;grid-template-areas:"left main right";margin-top:var(--spacing-xl)}.category-layout-left{grid-area:left;min-width:0}.category-layout-main{grid-area:main;min-width:0}.category-layout-right{grid-area:right;min-width:0}.category-ad-section{margin:var(--spacing-xl) 0}.category-ad-section .ad-placeholder{min-height:90px}.category-ad-section .ad-placeholder-text span::before{content:"728 x 90 (Leaderboard)";visibility:visible;position:absolute;top:0;left:50%;transform:translateX(-50%);width:100%}.category-ad-section .ad-placeholder-text span{visibility:hidden;position:relative}@media (max-width:1200px){.category-layout{grid-template-columns:1fr 1fr;grid-template-areas:"main main" "left right"}}@media (max-width:767px){.category-layout{grid-template-columns:1fr;grid-template-areas:"main" "left" "right";padding-left:var(--container-padding);padding-right:var(--container-padding)}}.ingredient-page-container{padding-top:var(--spacing-xl);padding-bottom:var(--spacing-xl)}.ingredient-layout-grid{display:grid;grid-template-columns:250px 1fr 250px;grid-template-areas:"sidebar-left main-content sidebar-right";gap:var(--spacing-xl)}.ingredient-sidebar-left{grid-area:sidebar-left;min-width:0}.ingredient-content-main{grid-area:main-content;min-width:0;background-color:var(--background-white);padding:var(--spacing-xl);border-radius:16px;box-shadow:0 8px 32px rgb(0 0 0 / .08)}.ingredient-sidebar-right{grid-area:sidebar-right;min-width:0}.ingredient-featured-image-container{width:100%;border-radius:12px;overflow:hidden;box-shadow:var(--box-shadow-lg);margin:0 0 var(--spacing-lg) 0;border:1px solid var(--border-color)}.ingredient-featured-image{width:100%;height:auto;display:block}.ingredient-image-caption{padding:var(--spacing-md);background-color:var(--background-light);color:var(--text-color-light);font-size:.9rem;font-style:italic;text-align:center;line-height:1.5;border-top:1px solid var(--border-color)}.ingredient-title-main{font-size:2.5rem;text-align:center;margin-bottom:var(--spacing-lg)}.ingredient-content-layout{display:grid;grid-template-columns:2fr 1fr;gap:var(--spacing-xl);margin-top:var(--spacing-xl)}.ingredient-main-text h3{font-size:1.3rem;margin-top:var(--spacing-lg)}.ingredient-main-text p,.ingredient-main-text ul{margin-bottom:var(--spacing-md);line-height:1.7}.ingredient-main-text ul{list-style-position:inside;padding-left:var(--spacing-sm)}.nutrition-card{background-color:var(--primary-color-pastel);padding:var(--spacing-lg);border-radius:12px;border:1px solid var(--primary-color-light);font-size:.9rem;line-height:1.6}html[data-theme="dark"] .nutrition-card{border-color:var(--border-color)}.ingredient-card{display:block;background-color:var(--background-white);border-radius:12px;box-shadow:var(--box-shadow-md);overflow:hidden;transition:transform 0.2s ease-out,box-shadow 0.2s ease-out;text-decoration:none;margin-bottom:var(--spacing-lg)}.ingredient-card:hover{transform:translateY(-4px);box-shadow:var(--box-shadow-lg)}.ingredient-card-image{width:100%;aspect-ratio:4 / 3}.ingredient-card-image img{width:100%;height:100%;object-fit:cover}.ingredient-card-content{padding:var(--spacing-md)}.ingredient-card-title{font-size:1rem;font-weight:700;line-height:1.4;color:var(--text-color-dark);margin:0}.sidebar-ingredient-list{display:flex;flex-direction:column}@media (max-width:1024px){.ingredient-layout-grid{grid-template-columns:1fr;grid-template-areas:"main-content" "sidebar-left" "sidebar-right"}.ingredient-sidebar-left,.ingredient-sidebar-right{border-top:1px solid var(--border-color);padding-top:var(--spacing-xl)}}@media (max-width:767px){.ingredient-title-main{font-size:2rem}.ingredient-content-layout{grid-template-columns:1fr}.ingredient-content-main{padding:var(--spacing-lg)}}.static-page-container{max-width:900px;margin:var(--spacing-xl) auto;background-color:var(--background-white);padding:var(--spacing-xxl);border-radius:12px;box-shadow:var(--box-shadow-lg)}.static-page-content h2{font-size:1.8rem;margin-top:var(--spacing-xl);margin-bottom:var(--spacing-md);padding-bottom:var(--spacing-sm);border-bottom:2px solid var(--border-color)}.static-page-content h3{font-size:1.4rem;margin-top:var(--spacing-lg);margin-bottom:var(--spacing-sm)}.static-page-content p,.static-page-content li{line-height:1.8;color:var(--text-color-light)}.static-page-content ul{list-style-position:outside;padding-left:var(--spacing-lg);margin-bottom:var(--spacing-md)}.static-page-content a{font-weight:500;text-decoration:underline}.last-updated{font-style:italic;color:var(--text-color-light);opacity:.8;margin-bottom:var(--spacing-xl);border-bottom:1px solid var(--border-color);padding-bottom:var(--spacing-xl)}.contact-layout{display:grid;grid-template-columns:1fr 1.2fr;gap:var(--spacing-xxl)}.contact-details{margin:var(--spacing-lg) 0}.contact-form-container{padding-left:var(--spacing-xl);border-left:1px solid var(--border-color)}.contact-form .form-group{margin-bottom:var(--spacing-lg)}.contact-form label{display:block;font-weight:700;margin-bottom:var(--spacing-sm);color:var(--text-color-dark)}.contact-form input[type="text"],.contact-form input[type="email"],.contact-form textarea{width:100%;padding:var(--spacing-sm) var(--spacing-md);border:1px solid var(--border-color);border-radius:8px;font-size:1rem;background-color:var(--background-light);color:var(--text-color-dark);transition:border-color 0.2s ease,box-shadow 0.2s ease}.contact-form input[type="text"]:focus,.contact-form input[type="email"]:focus,.contact-form textarea:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px var(--primary-color-pastel)}.form-submit-btn{display:inline-block;width:100%;padding:var(--spacing-md);background-color:var(--primary-color);color:var(--text-color-white);border:none;border-radius:8px;font-size:1.1rem;font-weight:700;cursor:pointer;transition:background-color 0.2s ease}.form-submit-btn:hover{background-color:var(--primary-color-dark)}@media (max-width:767px){.static-page-container{padding:var(--spacing-xl) var(--container-padding)}.contact-layout{grid-template-columns:1fr;gap:var(--spacing-xl)}.contact-form-container{padding-left:0;border-left:none;border-top:1px solid var(--border-color);padding-top:var(--spacing-xl)}}