/* nxmh-css */

        .nxmh, .nxmh-spacer { display: none; }

        @media (max-width: 849px) {
            /* Đầu trang gốc của theme nhường chỗ cho khối này */
            #header .header-wrapper, #header .header-bg-container { display: none !important; }
            #header { min-height: 0 !important; }

            .nxmh {
                /* Băng chuyền, banner và dải nút của bộ dựng trang hay tự đặt z-index vài trăm,
                   nên đầu trang phải nằm trên hẳn một bậc chứ không chỉ hơn vài đơn vị. */
                display: block; position: fixed; top: 0; left: 0; right: 0; z-index: 9990;
                background: var(--nhatdx-primary, #C67930); border-bottom: 0; padding: 8px 12px 10px;
                box-shadow: 0 2px 10px rgba(53, 39, 28, 0);
                transition: box-shadow .2s ease;
            }
            .nxmh.is-stuck { box-shadow: 0 3px 14px rgba(53, 39, 28, .18); }
            .nxmh-spacer { display: block; }


            .nxmh-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }

            /* Nút Đăng nhập và Giỏ hàng: cùng một khối nền xanh bo tròn */
            /* Nền cụm đầu trang là màu chính, nên hai nút đảo lại thành nền trắng chữ xanh */
            .nxmh-btn {
                display: inline-flex; align-items: center; gap: 6px; flex: 0 0 auto;
                height: 36px; padding: 0 12px; border-radius: 999px;
                background: #fff; color: var(--nhatdx-primary, #C67930) !important;
                font-size: 12.5px; font-weight: 600; line-height: 1; text-decoration: none !important;
                box-shadow: 0 2px 8px rgba(50, 36, 26, .18);
                transition: filter .15s ease, transform .12s ease;
            }
            .nxmh-btn:hover, .nxmh-btn:active { filter: brightness(.96); color: var(--nhatdx-primary, #C67930) !important; }
            .nxmh-btn:active { transform: scale(.97); }
            .nxmh-cart, .nxmh-login { position: relative; width: 36px; padding: 0; justify-content: center; }

            .nxmh-logo { flex: 1 1 auto; display: flex; justify-content: center; align-items: center; min-width: 0; }
            /* Logo của bạn là hình chữ sẫm màu, đặt thẳng lên nền xanh sẽ chìm. Nền trắng bo góc này
               giữ cho logo đọc được. Nếu sau này bạn tải lên bản logo trắng thì xoá 3 dòng dưới. */
            .nxmh-logo-img {
                max-height: 40px; width: auto; display: block;
                background: #fff; border-radius: 8px; padding: 4px 10px;
            }
            .nxmh-logo-text { color: #fff; font-size: 17px; font-weight: 700; }

            .nxmh-count {
                position: absolute; top: -3px; right: -3px; min-width: 17px; height: 17px; padding: 0 4px;
                display: none; align-items: center; justify-content: center;
                background: #A95830; color: #fff; border: 1.5px solid #fff;
                border-radius: 999px; font-size: 10px; font-weight: 700; line-height: 1;
            }
            .nxmh-count.is-on { display: inline-flex; }

            /* Dải liền: nút 3 gạch + ô nhập + nút kính lúp */
            .nxmh-bar {
                display: flex; align-items: stretch; margin: 9px 0 0;
                background: #fff; border: 0; border-radius: 10px; overflow: hidden;
            }
            .nxmh-cats {
                display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto;
                width: 44px; padding: 0; margin: 0; min-height: 42px;
                background: #fff !important; border: 0 !important;
                border-right: 1px solid #F1EEE9 !important;
                border-radius: 0 !important; box-shadow: none !important;
                color: var(--nhatdx-primary, #C67930) !important;
            }
            .nxmh-burger { position: relative; width: 17px; height: 2px; background: currentColor; border-radius: 2px; }
            .nxmh-burger::before, .nxmh-burger::after {
                content: ''; position: absolute; left: 0; width: 17px; height: 2px;
                background: currentColor; border-radius: 2px; transition: transform .2s ease, opacity .2s ease;
            }
            .nxmh-burger::before { top: -5px; }
            .nxmh-burger::after  { top: 5px; }
            .nxmh.is-open .nxmh-burger { background: transparent; }
            .nxmh.is-open .nxmh-burger::before { transform: translateY(5px) rotate(45deg); }
            .nxmh.is-open .nxmh-burger::after  { transform: translateY(-5px) rotate(-45deg); }

            .nxmh-input {
                flex: 1 1 auto; min-width: 0; height: auto !important; min-height: 42px; margin: 0 !important;
                padding: 0 12px !important; background: #fff !important;
                border: 0 !important; border-radius: 0 !important; box-shadow: none !important;
                font-size: 14px; color: #342A22;
            }
            .nxmh-input::placeholder { color: #B0A69C; }
            .nxmh-input:focus { outline: none; box-shadow: none !important; }

            .nxmh-go {
                flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center;
                width: 46px; min-height: 42px; margin: 0; padding: 0;
                background: #fff !important; border: 0 !important; border-left: 1px solid #F1EEE9 !important;
                border-radius: 0 !important; box-shadow: none !important;
                color: var(--nhatdx-primary, #C67930) !important;
            }

            /* Panel danh mục */
            .nxmh-panel {
                position: relative; z-index: 2;
                max-height: 68vh; overflow-y: auto; -webkit-overflow-scrolling: touch;
                margin: 9px 0 2px; padding: 4px 2px;
                background: #fff; border: 1px solid #EDEAE7; border-radius: 12px;
                box-shadow: 0 14px 34px rgba(53, 39, 28, .13);
                animation: nxmhIn .22s ease;
            }
            @keyframes nxmhIn { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
            body.nxmh-lock { overflow: hidden; }

            .nxmh-menu, .nxmh-menu ul { list-style: none !important; margin: 0 !important; padding: 0 !important; }
            .nxmh-menu > li { position: relative; }
            .nxmh-menu > li + li { border-top: 1px solid #F8F6F3; }
            .nxmh-menu > li > a {
                display: block; padding: 13px 46px 13px 16px;
                color: #342A22 !important; font-size: 14.5px; font-weight: 600; line-height: 1.35;
                text-decoration: none !important;
            }
            .nxmh-menu > li.current-menu-item > a,
            .nxmh-menu > li.current-menu-parent > a,
            .nxmh-menu > li.current-menu-ancestor > a { color: var(--nhatdx-primary, #C67930) !important; }

            .nxmh-toggle {
                position: absolute; top: 6px; right: 6px; width: 38px; height: 38px; padding: 0; margin: 0;
                display: flex; align-items: center; justify-content: center;
                background: #F9F8F6 !important; border: 0 !important; border-radius: 9px !important;
                box-shadow: none !important; min-height: 0 !important;
            }
            .nxmh-toggle::before {
                content: ''; width: 7px; height: 7px; margin-top: -3px;
                border-right: 2px solid #93887C; border-bottom: 2px solid #93887C;
                transform: rotate(45deg); transition: transform .2s ease, border-color .2s ease;
            }
            .nxmh-menu li.is-open > .nxmh-toggle { background: #F8F3ED !important; }
            .nxmh-menu li.is-open > .nxmh-toggle::before {
                transform: rotate(-135deg); margin-top: 3px; border-color: var(--nhatdx-primary, #C67930);
            }

            .nxmh-menu ul.sub-menu {
                max-height: 0; overflow: hidden; background: #FDFCFA;
                transition: max-height .26s ease;
            }
            .nxmh-menu ul.sub-menu > li { position: relative; }
            .nxmh-menu ul.sub-menu > li > a {
                display: block; padding: 10px 46px 10px 30px;
                color: #6B6157 !important; font-size: 13.5px; font-weight: 400; line-height: 1.4;
                text-decoration: none !important;
            }
            .nxmh-menu ul.sub-menu > li > a::before {
                content: ''; position: absolute; left: 18px; top: 50%; width: 5px; height: 5px;
                margin-top: -2.5px; border-radius: 50%; border: 1px solid #D6CEC5; background: #fff;
            }
            .nxmh-menu ul.sub-menu > li.current-menu-item > a,
            .nxmh-menu ul.sub-menu > li.current-menu-parent > a,
            .nxmh-menu ul.sub-menu > li.current-menu-ancestor > a { color: var(--nhatdx-primary, #C67930) !important; }
            .nxmh-menu ul.sub-menu > li.current-menu-item > a::before,
            .nxmh-menu ul.sub-menu > li.current-menu-parent > a::before,
            .nxmh-menu ul.sub-menu > li.current-menu-ancestor > a::before {
                background: var(--nhatdx-primary, #C67930); border-color: var(--nhatdx-primary, #C67930);
            }
            .nxmh-menu ul.sub-menu ul.sub-menu > li > a { padding-left: 44px; font-size: 13px; color: #93887C !important; }
            .nxmh-menu ul.sub-menu ul.sub-menu > li > a::before { left: 32px; }
            .nxmh-menu ul.sub-menu .nxmh-toggle { width: 34px; height: 34px; top: 3px; }

            /* Liên kết thêm (Giới thiệu, Liên hệ, Tra cứu đơn…) — lưới 2 cột dưới danh mục */
            .nxmh-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; padding: 12px 10px 8px; margin-top: 4px; border-top: 1px solid #F4F2EF; }
            .nxmh-link { display: flex; align-items: center; gap: 8px; min-height: 44px; padding: 8px 10px; border-radius: 12px;
                         background: #FAF9F7; border: 1px solid #F1EEE9; color: #342A22 !important; font-size: 13.5px; font-weight: 600;
                         line-height: 1.25; text-decoration: none !important; }
            .nxmh-link-ic { flex: 0 0 auto; display: inline-flex; width: 30px; height: 30px; align-items: center; justify-content: center;
                            border-radius: 9px; background: #fff; color: var(--nhatdx-primary, #C67930); box-shadow: 0 1px 3px rgba(53,39,28,.08); }
            .nxmh-link:active { transform: scale(.97); }
        }