:root{--color-bg: #fafaf8;--color-dark: #141413;--color-dark-hover: #484747;--color-accent: #d17557;--color-surface: #f0efeb;--color-text-muted: #475467;--color-text-subtle: #6b7280;--color-border: #d1d5db;--color-white: #ffffff;--color-off-white: #fafaf8;--font-main: "Tajawal", sans-serif;--font-size-sm: .875rem;--font-size-base: clamp(.9rem, 1.5vw, 1.25rem);--font-size-md: clamp(1rem, 1.3vw, 1.4rem);--font-size-lg: clamp(1.2rem, 1.2rem + 1vw, 1.7rem);--font-size-xl: clamp(1.5rem, 3vw, 2.2rem);--radius-sm: 6px;--radius-md: 8px;--radius-full: 20px;--shadow-xs: 0px 1px 2px 0px rgba(0, 0, 0, .05);--shadow-sm: 0px 1px 3px 0px rgba(0, 0, 0, .1), 0px 1px 2px 0px rgba(0, 0, 0, .06);--shadow-toast: 0 1px 4px rgba(0, 0, 0, .15)}*{box-sizing:border-box}body{margin:0;font-family:var(--font-main);background-color:var(--color-bg);font-size:var(--font-size-base)}button{white-space:nowrap;cursor:pointer;font-family:var(--font-main);border:none}main{padding:30px 16px 10px}@media(min-width:480px){main{padding:30px 30px 10px}}.tagline{text-align:center;padding-bottom:1.1rem;margin:0;font-size:var(--font-size-lg)}.err-msg{position:absolute;opacity:0;background-color:var(--color-dark);color:var(--color-white);padding:.6rem 1rem;display:flex;justify-content:center;align-items:center;border-radius:var(--radius-md);top:10px;left:50%;transform:translate(-50%);font-size:var(--font-size-sm);white-space:nowrap}.err-msg.visible{opacity:1}.ingredient-form{display:flex;justify-content:center;gap:12px;height:38px}.ingredient-form input{border-radius:var(--radius-sm);border:1px solid var(--color-border);padding:10px 13px;box-shadow:var(--shadow-xs);flex-grow:1;max-width:400px;min-width:120px;font-family:var(--font-main);font-size:var(--font-size-base)}.ingredient-form button{border-radius:var(--radius-sm);background-color:var(--color-dark);color:var(--color-off-white);font-size:var(--font-size-md);width:140px;font-weight:500;transition:background-color .2s ease-in-out}@media(min-width:480px){.ingredient-form button{width:150px}}.ingredient-form button:hover{background-color:var(--color-dark-hover)}.ingredient-form button:before{content:"+ ";margin-right:5px}header{display:flex;align-items:center;gap:16px;height:70px;box-shadow:var(--shadow-sm);background-color:var(--color-white);padding:0 1rem}@media(min-width:480px){header{height:80px;padding:0 2rem}}header>img{width:40px}@media(min-width:480px){header>img{width:50px}}header>h1{font-weight:400;white-space:nowrap;font-size:var(--font-size-xl)}.lang-toggle{display:flex;align-items:center;background-color:var(--color-surface);border-radius:var(--radius-full);padding:4px;gap:2px;margin-left:auto}.lang-toggle span{padding:4px 12px;border-radius:16px;font-size:var(--font-size-sm);font-weight:500;color:#888;transition:all .3s ease}.lang-toggle .active{background-color:var(--color-white);color:var(--color-dark);font-weight:700;box-shadow:var(--shadow-toast)}.ingredients-section h2{font-size:var(--font-size-lg)}.ingredients-list{margin-bottom:48px}.ingredients-list li{color:var(--color-text-muted);line-height:28px}.get-recipe-container{display:flex;flex-direction:column;border-radius:var(--radius-md);background:var(--color-surface);padding:16px 20px;gap:1rem}@media(min-width:480px){.get-recipe-container{flex-direction:row;justify-content:space-between;align-items:center;padding:16px 28px}}.get-recipe-container h3{font-weight:500;line-height:24px;font-size:var(--font-size-md);margin:0 0 4px}.get-recipe-container p{color:var(--color-text-subtle);line-height:20px;font-size:var(--font-size-md);margin:0}.get-recipe-container button{border-radius:var(--radius-sm);background:var(--color-accent);box-shadow:var(--shadow-xs);color:var(--color-off-white);padding:9px 14px;font-size:var(--font-size-md);transition:transform .2s ease-in-out;align-self:flex-start}@media(min-width:480px){.get-recipe-container button{align-self:center}}.get-recipe-container button:hover{transform:scale(1.05)}.suggested-recipe-container{padding:1rem 0;color:var(--color-text-muted);line-height:28px;font-size:var(--font-size-md);font-weight:400;display:flex;flex-direction:column}.suggested-recipe-container ul li,.suggested-recipe-container ol li{margin-bottom:8px}.loading{margin:0;font-weight:700}.reset-btn{border-radius:var(--radius-sm);background:var(--color-accent);box-shadow:var(--shadow-xs);color:var(--color-off-white);padding:6px 10px;font-size:var(--font-size-md);transition:transform .2s ease-in-out;width:max-content;align-self:center}.reset-btn:hover{transform:scale(1.05)}
