بادی اسپلش

/* کانتینر ابزار */ .gc-scent-finder-wrapper { font-family: ‘Vazirmatn’, ‘Vazir’, ‘B Yekan’, Tahoma, sans-serif; background-color: #ffffff; border-radius: 28px; padding: 32px; border: 1px solid #EBE3D5; box-shadow: 0 8px 30px rgba(140, 106, 92, 0.04); max-width: 1100px; margin: 20px auto; box-sizing: border-box; } .gc-scent-finder-wrapper *, .gc-scent-finder-wrapper *::before, .gc-scent-finder-wrapper *::after { box-sizing: border-box; } /* هدر */ .gc-finder-header { text-align: center; max-width: 650px; margin: 0 auto 32px auto; display: flex; flex-direction: column; align-items: center; gap: 12px; } .gc-mini-badge { display: inline-flex; align-items: center; gap: 6px; background-color: #FAF6F0; border: 1px solid #EBE3D5; padding: 6px 14px; border-radius: 50px; font-size: 11px; font-weight: 900; color: #8C6A5C; } .gc-mini-badge svg { width: 14px; height: 14px; } .gc-main-title { font-size: 22px; font-weight: 900; color: #2D251E; margin: 0; } .gc-main-desc { font-size: 13px; color: #78716c; margin: 0; line-height: 1.8; } /* گرید دکمه‌ها */ .gc-mood-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-bottom: 32px; } .gc-mood-card { background-color: #FAF8F5; border: 1.5px solid transparent; border-radius: 20px; padding: 20px 16px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; cursor: pointer; transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1); outline: none; width: 100%; line-height: normal; } .gc-mood-card:hover { border-color: rgba(140, 106, 92, 0.3); transform: translateY(-2px); } /* دکمه فعال */ .gc-mood-card.active { border-color: #8C6A5C; background-color: #FFFDFB; box-shadow: 0 4px 15px rgba(140, 106, 92, 0.05); } /* دایره آیکون‌ها */ .gc-icon-circle { width: 44px; height: 44px; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin-bottom: 12px; transition: all 0.3s ease; } /* تم‌های اختصاصی برای آیکون هر بادی اسپلش */ .icon-bombshell { background-color: #fff1f2; color: #f43f5e; } .icon-manifesto { background-color: #faf5ff; color: #a855f7; } .icon-eilish { background-color: #fffbeb; color: #f59e0b; } .icon-goodgirl { background-color: #eef2ff; color: #4f46e5; } .icon-bloom { background-color: #f0fdf4; color: #22c55e; } .icon-chanel { background-color: #fdf2f8; color: #db2777; } .gc-mood-card.active .gc-icon-circle { transform: scale(1.1); } .gc-icon-circle svg { width: 20px; height: 20px; } .gc-mood-label { font-size: 13px; font-weight: 800; color: #2D251E; margin-bottom: 4px; } .gc-scent-name { font-size: 11px; color: #78716c; font-weight: 500; } /* کارت خروجی پویا */ .gc-scent-output-card { background: linear-gradient(135deg, #FAF8F5 0%, #FFFFFF 100%); border: 1px solid #EBE3D5; border-radius: 24px; padding: 28px; transition: all 0.45s cubic-bezier(0.25, 0.8, 0.25, 1); opacity: 1; transform: translateY(0); } .gc-output-content-grid { display: grid; grid-template-columns: 7fr 5fr; gap: 32px; align-items: center; } .gc-output-text-area { display: flex; flex-direction: column; gap: 12px; } .gc-output-meta { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; } .gc-output-badge-style { background-color: #8C6A5C; color: #ffffff; font-size: 10px; font-weight: 900; padding: 4px 12px; border-radius: 6px; } .gc-bullet-dot { color: #EBE3D5; } .gc-output-notes-style { font-size: 11.5px; color: #8C6A5C; font-weight: 700; } .gc-output-title-style { font-size: 17px; font-weight: 900; color: #2D251E; margin: 0; } .gc-output-desc-style { font-size: 12.5px; color: #78716c; line-height: 1.8; margin: 0; text-align: justify; } /* باکس فنی سمت چپ */ .gc-formula-detail-box { background-color: #ffffff; border: 1px solid #EBE3D5; border-radius: 16px; padding: 20px; display: flex; flex-direction: column; gap: 16px; } .gc-formula-item { display: flex; flex-direction: column; gap: 4px; border-bottom: 1px dashed #FAF6F0; padding-bottom: 10px; } .gc-formula-item:last-of-type { border-bottom: none; padding-bottom: 0; } .gc-formula-label { font-size: 10.5px; color: #a8a29e; font-weight: 700; } .gc-formula-value-style { font-size: 12.5px; font-weight: 900; color: #2D251E; } .gc-stars-container { display: flex; align-items: center; } .gc-stars-row { display: flex; gap: 2px; color: #f59e0b; } .gc-stars-row svg { width: 14px; height: 14px; } /* دکمه خرید */ .gc-scent-buy-btn { background-color: #8C6A5C; color: #ffffff !important; text-decoration: none !important; padding: 12px 16px; border-radius: 12px; font-size: 12.5px; font-weight: 900; display: flex; align-items: center; justify-content: center; gap: 8px; transition: all 0.3s ease; box-shadow: 0 4px 12px rgba(140, 106, 92, 0.15); margin-top: 4px; } .gc-scent-buy-btn:hover { background-color: #6F5144; transform: translateY(-2px); } .gc-scent-buy-btn svg { width: 15px; height: 15px; } /* واکنش‌گرایی */ @media (max-width: 900px) { .gc-mood-grid { grid-template-columns: repeat(2, 1fr); } .gc-output-content-grid { grid-template-columns: 1fr; gap: 24px; } } @media (max-width: 600px) { .gc-scent-finder-wrapper { padding: 20px; } .gc-mood-grid { grid-template-columns: 1fr; gap: 12px; } .gc-main-title { font-size: 18px; } } const GC_SCENT_DATABASE = { “bombshell”: { badge: “بمب انرژی، طراوت و شادابی تابستانه”, notes: “پشن‌فروت، گریپ‌فروت، ارکیده، رز زرد”, title: “بادی اسپلش زنانه ژل کد مدل عطر بامبشل (Bombshell)”, desc: “رایحه خنک و ترش بامبشل بلافاصله فرکانس خستگی مفرط روزانه را دفع کرده و اتمسفر فوق‌العاده شاداب، خنک و ترش و شیرینی ایجاد می‌کند. این بادی اسپلش شگفت‌انگیز بهترین انتخاب برای روزهای پرتحرک، بعد از باشگاه و ورزش، یا برای تزریق حس تازگی در صبح‌های گرم تابستان است تا حس تمیزی و شادابی مطلق را تجربه کنید.”, formula: “بافت فوق‌العاده سبک و آلوئه‌ورادار (جلوگیری از عرق‌سوز شدن پوست)”, stars: 5, link: “/product/body-splash-bombshell/” }, “manifesto”: { badge: “وقار و کاریزمای زنانه مطلق”, notes: “وانیل مخملی، یاسمن وحشی، انگور سیاه، چوب صندل”, title: “بادی اسپلش زنانه ژل کد مدل عطر مانیفستو (Manifesto)”, desc: “رایحه‌ای گرم، شیرین و کمی پودری که اعتمادبه‌نفس، استقلال و زنانگی مقتدرانه شما را در هر محیطی به تصویر می‌کشد. مانیفستو بوی عجیبی از تجمل، شیک‌پوشی و پختگی دارد و یکی از پرطرفدارترین گزینه‌ها برای حضور با پرستیژ بالا در محل کار یا جلسات رسمی روزانه است.”, formula: “فرمول غنی‌شده با رطوبت‌رسان‌های قوی جهت رفع خشکی و ایجاد لطافت ملموس”, stars: 5, link: “/product/body-splash-manifesto/” }, “eilish”: { badge: “آرامش گرم، شیرینی وانیل و حس صمیمیت”, notes: “دانه وانیل شیرین، کاکائو، ادویه گرم، عنبر متبلور”, title: “بادی اسپلش زنانه ژل کد مدل عطر بیلی آیلیش (Eilish)”, desc: “یک حس صمیمی، دنج و عمیق که مانند یک آغوش گرم در فصول سرد سال یا روزهای بارانی است. این بادی اسپلش با نت‌های برجسته وانیل شیرین و کاکائو، غدد عصبی را به سمت آرامش ذهنی فوق‌العاده‌ای سوق می‌دهد. ایده‌آل برای اسپری کردن بعد از دوش عصرگاهی، یا استفاده قبل از خواب برای یک خواب رویایی و با آرامش بی‌وصف.”, formula: “فاقد الکل سنگین با روغن مغذی جهت حفظ پایداری رایحه روی ملحفه و پوست”, stars: 4, link: “/product/body-splash-billie-eilish/” }, “goodgirl”: { badge: “رازآلودگی، جسارت و جذابیت شبانه”, notes: “قهوه تلخ، بادام، گل یاس رازقی، دانه تونکا، کاکائو گرم”, title: “بادی اسپلش زنانه ژل کد مدل عطر گودگرل (Good Girl)”, desc: “رایحه دوگانه، تیره و روشن، گرم و شیرین که حس جسارت، رمزآلود بودن و جذابیت بی حدومرزی را القا می‌کند. تضاد بین قهوه تلخ و بادام با گل یاس رازقی، ترکیبی خلق کرده که بهترین گزینه برای مهمانی‌های شبانه، قرارهای مهم دوستانه یا متمایز بودن در هر جمیعتی است.”, formula: “فرمول فشرده با اسانس خالص و وارداتی جهت انتشار ماندگار رایحه”, stars: 5, link: “/product/body-splash-good-girl/” }, “bloom”: { badge: “طراوت باغ گل و حس دوش آب سرد”, notes: “گل یاسمن سفید، ریشه زنبق، پیچ امین‌الدوله، مریم هندی”, title: “بادی اسپلش زنانه ژل کد مدل عطر گوچی بلوم (Gucci Bloom)”, desc: “حسی کاملاً نچرال و طبیعی مثل قدم زدن در میان هزاران گلبرگ سفید و با طراوت بهاری. گوچی بلوم با رایحه پودری و گلی خالص خود، یادآور بوی تمیزی لباس‌های نو، صابون‌های اشرافی و دوش آب سرد است. اگر از عطرهای تند یا شیرین بیزارید، این مدل بهترین انتخاب برای روزمرگی خنک و بی‌دغدغه شماست.”, formula: “ویتامینه سبک به همراه عصاره رزماری جهت شاداب نگه‌داشتن بافت پوست”, stars: 4, link: “/product/body-splash-gucci-bloom/” }, “chanel”: { badge: “پرستیژ، اصالت و اشرافیت بی‌رقیب”, notes: “پرتقال تازه، گل رز فرانسوی، نعناع هندی (پچولی)، وانیل دانه”, title: “بادی اسپلش زنانه ژل کد مدل عطر کوکو شنل (Coco Chanel)”, desc: “نماد اصالت، لوکس بودن و شیک‌پوشی فرانسوی. رایحه معتدل، شیرین و تلخ ملوکانه کوکو شنل، به محض اسپری شدن پرستیژ اجتماعی شما را چندین پله ارتقا می‌دهد. نت‌های پچولی و رز در ترکیب با پرتقال، فرکانسی جذاب، متین و باشکوه می‌سازد که برای تمامی فصول و استفاده ۲۴ ساعته بی‌رقیب است.”, formula: “فرمول ماندگار ۲۴ ساعته بدون ایجاد کوچک‌ترین چسبندگی یا احساس گرما روی پوست”, stars: 5, link: “/product/body-splash-coco-chanel/” } }; function selectScent(scentKey, element) { const data = GC_SCENT_DATABASE[scentKey]; if (!data) return; const card = document.getElementById(‘gc-scent-output-card’); const badge = document.getElementById(‘gc-output-badge’); const notes = document.getElementById(‘gc-output-notes’); const title = document.getElementById(‘gc-output-title’); const desc = document.getElementById(‘gc-output-desc’); const formula = document.getElementById(‘gc-formula-value’); const buyLink = document.getElementById(‘gc-buy-now-link’); const starsContainer = document.getElementById(‘gc-stars-row’); card.style.opacity = ‘0’; card.style.transform = ‘translateY(8px)’; card.style.transition = ‘all 0.25s cubic-bezier(0.25, 0.8, 0.25, 1)’; setTimeout(() => { badge.innerText = data.badge; notes.innerText = “نت‌ها: ” + data.notes; title.innerText = data.title; desc.innerText = data.desc; formula.innerText = data.formula; buyLink.setAttribute(‘href’, data.link); let starsMarkup = ”; for (let i = 0; i < 5; i++) { if (i < data.stars) { starsMarkup += '’; } else { starsMarkup += ”; } } starsContainer.innerHTML = starsMarkup; card.style.opacity = ‘1’; card.style.transform = ‘translateY(0)’; }, 220); const cards = element.parentNode.querySelectorAll(‘.gc-mood-card’); cards.forEach(c => c.classList.remove(‘active’)); element.classList.add(‘active’); }