{"product_id":"hoe-hin-white-flower-embrocation-traditional-formula-20ml","title":"Hoe Hin White Flower Embrocation - Traditional Formula (20ml)","description":"\u003c!-- =========================================================\n     HOE HIN WHITE FLOWER EMBROCATION \/ PAK FAH YEOW\n     PRODUCT INFORMATION ACCORDION\n\n     TYPOGRAPHY:\n     - Font family comes from Shopify theme\n     - Font size comes from Shopify theme\n     - Font weight comes from Shopify theme\n     - No custom typography is forced\n\n     FEATURES:\n     - First section open by default\n     - Only one section open at a time\n     - Responsive on desktop, tablet and mobile\n     - Uses #00A779 and different shades of green\n     - No external libraries required\n     ========================================================= --\u003e\n\n\n\u003cstyle\u003e\n\n\/* =========================================================\n   1. MAIN ACCORDION CONTAINER\n   ========================================================= *\/\n\n.lavender-accordion {\n    width: 100%;\n    max-width: 1200px;\n    margin: 0 auto;\n    padding: 20px 0;\n    color: inherit;\n    box-sizing: border-box;\n\n    font-family: inherit;\n    font-size: inherit;\n    font-weight: inherit;\n}\n\n\n\/* =========================================================\n   2. INDIVIDUAL ACCORDION ITEM\n   ========================================================= *\/\n\n.lavender-accordion-item {\n    margin-bottom: 14px;\n    border: 1px solid #dcefe9;\n    border-radius: 12px;\n    overflow: hidden;\n    background: #ffffff;\n    box-sizing: border-box;\n}\n\n\n\/* =========================================================\n   3. ACCORDION HEADER \/ BUTTON\n   ========================================================= *\/\n\n.lavender-accordion-header {\n    width: 100%;\n    border: none;\n    outline: none;\n    cursor: pointer;\n\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n\n    padding: 20px 24px;\n\n    text-align: left;\n\n    font-family: inherit;\n    font-size: inherit;\n    font-weight: inherit;\n    line-height: inherit;\n\n    color: #006b50;\n    background: #f0faf7;\n\n    transition:\n        background-color 0.25s ease,\n        color 0.25s ease;\n\n    box-sizing: border-box;\n}\n\n\n\/* =========================================================\n   4. ACCORDION HEADER HOVER\n   ========================================================= *\/\n\n.lavender-accordion-header:hover {\n    background: #e3f6f0;\n    color: #005d46;\n}\n\n\n\/* =========================================================\n   5. DIFFERENT GREEN SHADES FOR EACH SECTION\n   ========================================================= *\/\n\n.lavender-item-function .lavender-accordion-header {\n    background: #eaf8f4;\n}\n\n.lavender-item-directions .lavender-accordion-header {\n    background: #e2f5ef;\n}\n\n.lavender-item-ingredients .lavender-accordion-header {\n    background: #d0eee5;\n}\n\n.lavender-item-caution .lavender-accordion-header {\n    background: #d9f2eb;\n}\n\n\n\/* =========================================================\n   6. ACTIVE ACCORDION HEADER\n   ========================================================= *\/\n\n.lavender-accordion-header.active {\n    background: #00a779 !important;\n    color: #ffffff !important;\n}\n\n\n\/* =========================================================\n   7. ACCORDION TITLE\n   ========================================================= *\/\n\n.lavender-accordion-title {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n\n    font-family: inherit;\n    font-size: inherit;\n    font-weight: inherit;\n    line-height: inherit;\n}\n\n\n\/* =========================================================\n   8. SMALL GREEN TITLE INDICATOR\n   ========================================================= *\/\n\n.lavender-title-indicator {\n    width: 8px;\n    height: 8px;\n    flex: 0 0 8px;\n\n    background: #00a779;\n    border-radius: 50%;\n}\n\n.lavender-accordion-header.active .lavender-title-indicator {\n    background: #ffffff;\n}\n\n\n\/* =========================================================\n   9. PLUS \/ MINUS ICON\n   ========================================================= *\/\n\n.lavender-accordion-icon {\n    position: relative;\n\n    width: 28px;\n    height: 28px;\n\n    flex: 0 0 28px;\n\n    border: 1px solid #00a779;\n    border-radius: 50%;\n\n    display: flex;\n    align-items: center;\n    justify-content: center;\n\n    color: #00a779;\n\n    transition:\n        background-color 0.3s ease,\n        border-color 0.3s ease,\n        color 0.3s ease;\n}\n\n\n\/* =========================================================\n   10. HORIZONTAL LINE\n   ========================================================= *\/\n\n.lavender-accordion-icon::before {\n    content: \"\";\n\n    position: absolute;\n\n    width: 10px;\n    height: 2px;\n\n    background: currentColor;\n\n    border-radius: 2px;\n}\n\n\n\/* =========================================================\n   11. VERTICAL LINE\n   ========================================================= *\/\n\n.lavender-accordion-icon::after {\n    content: \"\";\n\n    position: absolute;\n\n    width: 2px;\n    height: 10px;\n\n    background: currentColor;\n\n    border-radius: 2px;\n\n    transition: transform 0.25s ease;\n}\n\n\n\/* =========================================================\n   12. ACTIVE PLUS\/MINUS ICON\n   ========================================================= *\/\n\n.lavender-accordion-header.active .lavender-accordion-icon {\n    color: #ffffff;\n    border-color: #ffffff;\n}\n\n.lavender-accordion-header.active .lavender-accordion-icon::after {\n    transform: rotate(90deg);\n}\n\n\n\/* =========================================================\n   13. ACCORDION CONTENT\n   ========================================================= *\/\n\n.lavender-accordion-content {\n    max-height: 0;\n    overflow: hidden;\n\n    background: #ffffff;\n\n    transition:\n        max-height 0.35s ease;\n}\n\n\n\/* =========================================================\n   14. OPEN ACCORDION CONTENT\n   ========================================================= *\/\n\n.lavender-accordion-content.active {\n    max-height: 2000px;\n}\n\n\n\/* =========================================================\n   15. CONTENT INNER AREA\n   ========================================================= *\/\n\n.lavender-accordion-inner {\n    padding: 26px 28px 28px;\n    box-sizing: border-box;\n}\n\n\n\/* =========================================================\n   16. INTRODUCTORY TEXT\n   ========================================================= *\/\n\n.lavender-info-text {\n    margin: 0 0 18px;\n\n    font-family: inherit;\n    font-size: inherit;\n    font-weight: inherit;\n    line-height: inherit;\n\n    color: inherit;\n}\n\n\n\/* =========================================================\n   17. STANDARD BULLET LIST\n   ========================================================= *\/\n\n.lavender-info-list {\n    list-style: none;\n\n    margin: 0;\n    padding: 0;\n}\n\n\n\/* =========================================================\n   18. BULLET LIST TEXT\n   ========================================================= *\/\n\n.lavender-info-list li {\n    position: relative;\n\n    padding: 8px 0 8px 30px;\n\n    font-family: inherit;\n    font-size: inherit;\n    font-weight: inherit;\n    line-height: inherit;\n\n    color: inherit;\n}\n\n\n\/* =========================================================\n   19. GREEN CHECK ICON\n   ========================================================= *\/\n\n.lavender-info-list li::before {\n    content: \"✓\";\n\n    position: absolute;\n\n    left: 0;\n    top: 9px;\n\n    width: 18px;\n    height: 18px;\n\n    display: flex;\n    align-items: center;\n    justify-content: center;\n\n    background: #00a779;\n    color: #ffffff;\n\n    border-radius: 50%;\n\n    font-size: 11px;\n    font-weight: 700;\n}\n\n\n\/* =========================================================\n   20. DIRECTIONS — NUMBERED STEPS\n   ========================================================= *\/\n\n.lavender-directions-list {\n    list-style: none;\n\n    margin: 0;\n    padding: 0;\n\n    counter-reset: lavender-step;\n}\n\n\n\/* =========================================================\n   21. DIRECTIONS TEXT\n   ========================================================= *\/\n\n.lavender-directions-list li {\n    counter-increment: lavender-step;\n\n    position: relative;\n\n    padding: 10px 0 10px 50px;\n\n    font-family: inherit;\n    font-size: inherit;\n    font-weight: inherit;\n    line-height: inherit;\n\n    color: inherit;\n}\n\n\n\/* =========================================================\n   22. NUMBER CIRCLE\n   ========================================================= *\/\n\n.lavender-directions-list li::before {\n    content: counter(lavender-step);\n\n    position: absolute;\n\n    left: 0;\n    top: 10px;\n\n    width: 32px;\n    height: 32px;\n\n    display: flex;\n    align-items: center;\n    justify-content: center;\n\n    background: #00a779;\n    color: #ffffff;\n\n    border-radius: 50%;\n\n    font-size: 14px;\n    font-weight: 700;\n}\n\n\n\/* =========================================================\n   23. CAUTION CONTENT BOX\n   ========================================================= *\/\n\n.lavender-caution-content {\n    background: #f3fbf8;\n\n    border-left: 4px solid #00a779;\n\n    padding: 18px 20px;\n\n    border-radius: 6px;\n\n    box-sizing: border-box;\n}\n\n\n\/* =========================================================\n   24. ACTIVE INGREDIENTS TABLE\n   ========================================================= *\/\n\n.lavender-ingredients-table {\n    width: 100%;\n\n    border-collapse: collapse;\n\n    margin-top: 10px;\n\n    border: 1px solid #cce9df;\n\n    border-radius: 8px;\n\n    overflow: hidden;\n}\n\n\n\/* =========================================================\n   25. TABLE HEADER\n   ========================================================= *\/\n\n.lavender-ingredients-table th {\n    padding: 15px 18px;\n\n    text-align: left;\n\n    background: #e4f6f1;\n\n    color: #006b50;\n\n    font-family: inherit;\n    font-size: inherit;\n    font-weight: inherit;\n    line-height: inherit;\n\n    border-bottom: 1px solid #cce9df;\n}\n\n\n\/* =========================================================\n   26. TABLE CELLS\n   ========================================================= *\/\n\n.lavender-ingredients-table td {\n    padding: 15px 18px;\n\n    font-family: inherit;\n    font-size: inherit;\n    font-weight: inherit;\n    line-height: inherit;\n\n    color: inherit;\n\n    border-bottom: 1px solid #e5f1ed;\n}\n\n\n\/* Remove bottom border from final row *\/\n\n.lavender-ingredients-table tr:last-child td {\n    border-bottom: none;\n}\n\n\n\/* =========================================================\n   27. PERCENTAGE COLUMN\n   ========================================================= *\/\n\n.lavender-ingredients-table th:last-child,\n.lavender-ingredients-table td:last-child {\n    text-align: right;\n}\n\n\n\/* =========================================================\n   28. INGREDIENT HIGHLIGHT\n   ========================================================= *\/\n\n.lavender-highlight {\n    margin-top: 18px;\n\n    padding: 14px 18px;\n\n    background: #f0faf7;\n\n    border-left: 4px solid #00a779;\n\n    border-radius: 6px;\n\n    font-family: inherit;\n    font-size: inherit;\n    font-weight: inherit;\n    line-height: inherit;\n\n    color: inherit;\n\n    box-sizing: border-box;\n}\n\n\n\/* =========================================================\n   29. TABLET RESPONSIVE\n   ========================================================= *\/\n\n@media (max-width: 1024px) {\n\n    .lavender-accordion {\n        padding: 15px 0;\n    }\n\n    .lavender-accordion-header {\n        padding: 18px 20px;\n    }\n\n    .lavender-accordion-inner {\n        padding: 24px 24px 26px;\n    }\n\n}\n\n\n\/* =========================================================\n   30. MOBILE RESPONSIVE\n   ========================================================= *\/\n\n@media (max-width: 767px) {\n\n    .lavender-accordion {\n        padding: 10px 0;\n    }\n\n    .lavender-accordion-item {\n        margin-bottom: 10px;\n        border-radius: 9px;\n    }\n\n    .lavender-accordion-header {\n        padding: 16px 17px;\n    }\n\n    .lavender-accordion-title {\n        gap: 9px;\n    }\n\n    .lavender-title-indicator {\n        width: 7px;\n        height: 7px;\n        flex-basis: 7px;\n    }\n\n    .lavender-accordion-icon {\n        width: 25px;\n        height: 25px;\n        flex-basis: 25px;\n    }\n\n    .lavender-accordion-icon::before {\n        width: 9px;\n    }\n\n    .lavender-accordion-icon::after {\n        height: 9px;\n    }\n\n    .lavender-accordion-inner {\n        padding: 20px 17px 22px;\n    }\n\n    .lavender-info-list li {\n        padding: 7px 0 7px 27px;\n    }\n\n    .lavender-info-list li::before {\n        top: 8px;\n\n        width: 17px;\n        height: 17px;\n    }\n\n    .lavender-directions-list li {\n        padding: 8px 0 8px 44px;\n    }\n\n    .lavender-directions-list li::before {\n        top: 9px;\n\n        width: 28px;\n        height: 28px;\n    }\n\n    .lavender-caution-content {\n        padding: 15px 16px;\n    }\n\n    .lavender-ingredients-table th,\n    .lavender-ingredients-table td {\n        padding: 12px 10px;\n    }\n\n    .lavender-highlight {\n        padding: 12px 14px;\n    }\n\n}\n\n\n\/* =========================================================\n   31. VERY SMALL MOBILE DEVICES\n   ========================================================= *\/\n\n@media (max-width: 480px) {\n\n    .lavender-accordion-header {\n        padding: 15px 14px;\n    }\n\n    .lavender-accordion-inner {\n        padding: 18px 14px 20px;\n    }\n\n    .lavender-ingredients-table th,\n    .lavender-ingredients-table td {\n        padding: 10px 8px;\n    }\n\n}\n\n\n\/* =========================================================\n   32. ACCESSIBILITY — REDUCE MOTION\n   ========================================================= *\/\n\n@media (prefers-reduced-motion: reduce) {\n\n    .lavender-accordion-content,\n    .lavender-accordion-icon,\n    .lavender-accordion-icon::after,\n    .lavender-accordion-header {\n        transition: none;\n    }\n\n}\n\n\u003c\/style\u003e\n\n\n\u003c!-- =========================================================\n     MAIN ACCORDION\n     ========================================================= --\u003e\n\n\u003cdiv class=\"lavender-accordion\"\u003e\n\n\n    \u003c!-- =====================================================\n         1. FUNCTION \u0026 INDICATION\n         ===================================================== --\u003e\n\n    \u003cdiv class=\"lavender-accordion-item lavender-item-function\"\u003e\n\n        \u003cbutton type=\"button\" class=\"lavender-accordion-header active\" aria-expanded=\"true\"\u003e\n\n            \u003cspan class=\"lavender-accordion-title\"\u003e\n\n                \u003cspan class=\"lavender-title-indicator\"\u003e\u003c\/span\u003e\n\n                \u003cspan\u003e\n                    Function \u0026amp; Indication\n                \u003c\/span\u003e\n\n            \u003c\/span\u003e\n\n            \u003cspan class=\"lavender-accordion-icon\"\u003e\u003c\/span\u003e\n\n        \u003c\/button\u003e\n\n\n        \u003cdiv class=\"lavender-accordion-content active\"\u003e\n\n            \u003cdiv class=\"lavender-accordion-inner\"\u003e\n\n                \u003cp class=\"lavender-info-text\"\u003e\n                    Dispel wind and heat, relieve pain, diffuse\n                    orifices and activate the mind.\n                \u003c\/p\u003e\n\n                \u003cul class=\"lavender-info-list\"\u003e\n\n                    \u003cli\u003e\n                        Provide relief from the stuffed-up feeling\n                        associated with cold.\n                    \u003c\/li\u003e\n\n                    \u003cli\u003e\n                        Relieve dizziness and headaches\n                    \u003c\/li\u003e\n\n                    \u003cli\u003e\n                        Relieve muscular pain\n                    \u003c\/li\u003e\n\n                    \u003cli\u003e\n                        Disperse swelling\n                    \u003c\/li\u003e\n\n                    \u003cli\u003e\n                        Relieve travel and motion sickness\n                    \u003c\/li\u003e\n\n                    \u003cli\u003e\n                        Stop itching resulted from insect and\n                        mosquito bites\n                    \u003c\/li\u003e\n\n                    \u003cli\u003e\n                        Refreshing\n                    \u003c\/li\u003e\n\n                \u003c\/ul\u003e\n\n            \u003c\/div\u003e\n\n        \u003c\/div\u003e\n\n    \u003c\/div\u003e\n\n\n\n    \u003c!-- =====================================================\n         2. DIRECTIONS\n         ===================================================== --\u003e\n\n    \u003cdiv class=\"lavender-accordion-item lavender-item-directions\"\u003e\n\n        \u003cbutton type=\"button\" class=\"lavender-accordion-header\" aria-expanded=\"false\"\u003e\n\n            \u003cspan class=\"lavender-accordion-title\"\u003e\n\n                \u003cspan class=\"lavender-title-indicator\"\u003e\u003c\/span\u003e\n\n                \u003cspan\u003e\n                    Directions\n                \u003c\/span\u003e\n\n            \u003c\/span\u003e\n\n            \u003cspan class=\"lavender-accordion-icon\"\u003e\u003c\/span\u003e\n\n        \u003c\/button\u003e\n\n\n        \u003cdiv class=\"lavender-accordion-content\"\u003e\n\n            \u003cdiv class=\"lavender-accordion-inner\"\u003e\n\n                \u003cp class=\"lavender-info-text\"\u003e\n                    \u003cstrong\u003eFor External Application Only –\u003c\/strong\u003e\n                \u003c\/p\u003e\n\n\n                \u003col class=\"lavender-directions-list\"\u003e\n\n                    \u003cli\u003e\n                        Apply 2 to 3 drops on affected area,\n                        massage gently.\n                    \u003c\/li\u003e\n\n                    \u003cli\u003e\n                        Can be applied below nostril. If necessary,\n                        repeat the process every two hours. Consult\n                        a Chinese medicine practitioner or seek\n                        advice from a doctor before the use of this\n                        product by children.\n                    \u003c\/li\u003e\n\n                    \u003cli\u003e\n                        Avoid contacts with eyes and mucous\n                        membranes when in use.\n                    \u003c\/li\u003e\n\n                \u003c\/ol\u003e\n\n            \u003c\/div\u003e\n\n        \u003c\/div\u003e\n\n    \u003c\/div\u003e\n\n\n\n    \u003c!-- =====================================================\n         3. ACTIVE INGREDIENTS\n         ===================================================== --\u003e\n\n    \u003cdiv class=\"lavender-accordion-item lavender-item-ingredients\"\u003e\n\n        \u003cbutton type=\"button\" class=\"lavender-accordion-header\" aria-expanded=\"false\"\u003e\n\n            \u003cspan class=\"lavender-accordion-title\"\u003e\n\n                \u003cspan class=\"lavender-title-indicator\"\u003e\u003c\/span\u003e\n\n                \u003cspan\u003e\n                    Active Ingredients (% w\/w)\n                \u003c\/span\u003e\n\n            \u003c\/span\u003e\n\n            \u003cspan class=\"lavender-accordion-icon\"\u003e\u003c\/span\u003e\n\n        \u003c\/button\u003e\n\n\n        \u003cdiv class=\"lavender-accordion-content\"\u003e\n\n            \u003cdiv class=\"lavender-accordion-inner\"\u003e\n\n                \u003cp class=\"lavender-info-text\"\u003e\n                    Hoe Hin White Flower Embrocation, commonly known\n                    as Pak Fah Yeow, is a blend of several essential\n                    oils including eucalyptus oil and lavender oil,\n                    methyl salicylate and menthol. Most ingredients\n                    containing natural elements are imported from\n                    France, China and Australia, and purchased in\n                    compliance with the specifications set forth in\n                    British Pharmacopoeia or Chinese Pharmacopoeia.\n                \u003c\/p\u003e\n\n\n                \u003ctable class=\"lavender-ingredients-table\"\u003e\n\n                    \u003cthead\u003e\n\n                        \u003ctr\u003e\n\n                            \u003cth\u003e\n                                Active Ingredient\n                            \u003c\/th\u003e\n\n                            \u003cth\u003e\n                                Amount (% w\/w)\n                            \u003c\/th\u003e\n\n                        \u003c\/tr\u003e\n\n                    \u003c\/thead\u003e\n\n\n                    \u003ctbody\u003e\n\n                        \u003ctr\u003e\n                            \u003ctd\u003eMethyl Salicylate\u003c\/td\u003e\n                            \u003ctd\u003e40%\u003c\/td\u003e\n                        \u003c\/tr\u003e\n\n                        \u003ctr\u003e\n                            \u003ctd\u003eMenthol\u003c\/td\u003e\n                            \u003ctd\u003e30%\u003c\/td\u003e\n                        \u003c\/tr\u003e\n\n                        \u003ctr\u003e\n                            \u003ctd\u003eEucalyptus Oil\u003c\/td\u003e\n                            \u003ctd\u003e18%\u003c\/td\u003e\n                        \u003c\/tr\u003e\n\n                        \u003ctr\u003e\n                            \u003ctd\u003eLavender Oil\u003c\/td\u003e\n                            \u003ctd\u003e6%\u003c\/td\u003e\n                        \u003c\/tr\u003e\n\n                        \u003ctr\u003e\n                            \u003ctd\u003eRacemic Camphor\u003c\/td\u003e\n                            \u003ctd\u003e6%\u003c\/td\u003e\n                        \u003c\/tr\u003e\n\n                    \u003c\/tbody\u003e\n\n                \u003c\/table\u003e\n\n\n                \u003cdiv class=\"lavender-highlight\"\u003e\n\n                    \u003cstrong\u003eComposition:\u003c\/strong\u003e\n                    Methyl Salicylate 40% \/-\n                    Menthol 30% \/\n                    Eucalyptus Oil 18% \/\n                    Lavender Oil 6% \/\n                    Racemic Camphor 6%\n\n                \u003c\/div\u003e\n\n            \u003c\/div\u003e\n\n        \u003c\/div\u003e\n\n    \u003c\/div\u003e\n\n\n\n    \u003c!-- =====================================================\n         4. CAUTION\n         ===================================================== --\u003e\n\n    \u003cdiv class=\"lavender-accordion-item lavender-item-caution\"\u003e\n\n        \u003cbutton type=\"button\" class=\"lavender-accordion-header\" aria-expanded=\"false\"\u003e\n\n            \u003cspan class=\"lavender-accordion-title\"\u003e\n\n                \u003cspan class=\"lavender-title-indicator\"\u003e\u003c\/span\u003e\n\n                \u003cspan\u003e\n                    Caution\n                \u003c\/span\u003e\n\n            \u003c\/span\u003e\n\n            \u003cspan class=\"lavender-accordion-icon\"\u003e\u003c\/span\u003e\n\n        \u003c\/button\u003e\n\n\n        \u003cdiv class=\"lavender-accordion-content\"\u003e\n\n            \u003cdiv class=\"lavender-accordion-inner\"\u003e\n\n                \u003cdiv class=\"lavender-caution-content\"\u003e\n\n                    \u003cul class=\"lavender-info-list\"\u003e\n\n                        \u003cli\u003e\n                            For external application only.\n                        \u003c\/li\u003e\n\n                        \u003cli\u003e\n                            If redness, swelling, or pain develops,\n                            stop using immediately.\n                        \u003c\/li\u003e\n\n                        \u003cli\u003e\n                            If symptom or redness persists, consult\n                            a doctor immediately.\n                        \u003c\/li\u003e\n\n                        \u003cli\u003e\n                            No contact with the eyes or mucous\n                            membranes. If contact occurs, rinse\n                            with cold water.\n                        \u003c\/li\u003e\n\n                        \u003cli\u003e\n                            Not to be used on infants and pregnant\n                            women.\n                        \u003c\/li\u003e\n\n                        \u003cli\u003e\n                            Avoid to use product containing methyl\n                            salicylate on children who have flu,\n                            chicken pox or fever.\n                        \u003c\/li\u003e\n\n                        \u003cli\u003e\n                            People who are allergic to salicylate acid\n                            should Consult a Chinese medicine\n                            practitioner or a doctor before using\n                            this product.\n                        \u003c\/li\u003e\n\n                        \u003cli\u003e\n                            Store at 30 degree Celsius or below.\n                        \u003c\/li\u003e\n\n                        \u003cli\u003e\n                            (Keep out of reach of children)\n                        \u003c\/li\u003e\n\n                    \u003c\/ul\u003e\n\n                \u003c\/div\u003e\n\n            \u003c\/div\u003e\n\n        \u003c\/div\u003e\n\n    \u003c\/div\u003e\n\n\n\u003c\/div\u003e\n\n\n\u003c!-- =========================================================\n     ACCORDION JAVASCRIPT\n\n     FEATURES:\n     - First accordion starts open\n     - Only one accordion can be open at a time\n     - Clicking another accordion closes the current one\n     - Clicking the open accordion closes it\n     - Updates aria-expanded\n     ========================================================= --\u003e\n\n\u003cscript\u003e\n\ndocument.addEventListener(\"DOMContentLoaded\", function () {\n\n    const accordionHeaders = document.querySelectorAll(\n        \".lavender-accordion-header\"\n    );\n\n\n    accordionHeaders.forEach(function (header) {\n\n        header.addEventListener(\"click\", function () {\n\n            const isOpen =\n                header.classList.contains(\"active\");\n\n\n            \/* Close all accordions *\/\n\n            accordionHeaders.forEach(function (otherHeader) {\n\n                otherHeader.classList.remove(\"active\");\n\n                otherHeader.setAttribute(\n                    \"aria-expanded\",\n                    \"false\"\n                );\n\n\n                const otherContent =\n                    otherHeader.nextElementSibling;\n\n\n                if (otherContent) {\n\n                    otherContent.classList.remove(\"active\");\n\n                }\n\n            });\n\n\n            \/* Open clicked accordion if it was closed *\/\n\n            if (!isOpen) {\n\n                header.classList.add(\"active\");\n\n                header.setAttribute(\n                    \"aria-expanded\",\n                    \"true\"\n                );\n\n\n                const content =\n                    header.nextElementSibling;\n\n\n                if (content) {\n\n                    content.classList.add(\"active\");\n\n                }\n\n            }\n\n        });\n\n    });\n\n});\n\n\u003c\/script\u003e","brand":"My Store","offers":[{"title":"Default Title","offer_id":48961396572235,"sku":"39569_39567_39568","price":69.0,"currency_code":"HKD","in_stock":true}],"thumbnail_url":"\/\/cdn.shopify.com\/s\/files\/1\/0684\/9010\/0811\/files\/pfy-20ml-1200.jpg?v=1790684386","url":"https:\/\/igitk0-b0.myshopify.com\/products\/hoe-hin-white-flower-embrocation-traditional-formula-20ml","provider":"White Flower","version":"1.0","type":"link"}