/* NIP Header module: extracted from inc/frontend/header.php. */
body.home #header.header-wrapper {
	display: none;
}

.nip-mobile-bar,
		.nip-mobile-drawer,
		.nip-mobile-backdrop {
			display: none;
		}
		@media (max-width: 767px) {
			.nip6-top,
			.nip6-nav {
				display: none ;
			}
			header.nip5-header.nip6-header,
			body header.nip5-header.nip6-header {
				position: sticky ;
				top: 0 ;
				z-index: 1005 ;
				background: #ffffff ;
				border-bottom: 1px solid #edf2f7 ;
				transition: box-shadow 0.22s ease ;
			}
			header.nip5-header.nip6-header.nip-is-scrolled,
			body header.nip5-header.nip6-header.nip-is-scrolled {
				box-shadow: 0 3px 14px rgba(9, 39, 70, 0.12) ;
				border-bottom-color: #dbe4ee ;
			}
			.nip-mobile-bar {
				display: flex ;
				align-items: center ;
				justify-content: space-between ;
				height: 60px ;
				padding: 0 14px ;
				background: #ffffff ;
				position: relative ;
				z-index: 1006 ;
				gap: 10px ;
				box-sizing: border-box ;
			}
			.nip-mobile-logo {
				display: flex ;
				align-items: center ;
				line-height: 0 ;
				flex-shrink: 0 ;
				text-decoration: none ;
			}
			.nip-mobile-logo img {
				display: block ;
				height: 40px ;
				width: auto ;
				max-width: 105px ;
				object-fit: contain ;
			}
			.nip6-mobile-zalo {
				position: relative ;
				flex-shrink: 0 ;
				margin: 0 ;
			}
			.nip6-mobile-zalo summary {
				display: inline-flex ;
				align-items: center ;
				justify-content: center ;
				height: 35px ;
				padding: 0 13px ;
				border: 1.5px solid #0056b3 ;
				border-radius: 999px ;
				background: #f0f7ff ;
				color: #0056b3 ;
				font-size: 13px ;
				font-weight: 750 ;
				cursor: pointer ;
				list-style: none ;
				white-space: nowrap ;
				transition: all 0.2s ease ;
				box-sizing: border-box ;
			}
			.nip6-mobile-zalo summary::-webkit-details-marker {
				display: none ;
			}
			.nip6-mobile-zalo summary:before {
				display: inline-grid ;
				width: 17px ;
				height: 17px ;
				margin-right: 6px ;
				place-items: center ;
				content: 'Z' ;
				border-radius: 50% ;
				background: #0056b3 ;
				color: #ffffff ;
				font-size: 10px ;
				font-weight: 900 ;
				line-height: 1 ;
			}
			.nip6-mobile-zalo[open] summary {
				background: #0056b3 ;
				color: #ffffff ;
			}
			.nip6-mobile-zalo[open] summary:before {
				background: #ffffff ;
				color: #0056b3 ;
			}
			.nip6-mobile-zalo > .nip6-zalo-panel {
				position: fixed ;
				top: 64px ;
				left: 12px ;
				right: 12px ;
				width: auto ;
				max-width: 400px ;
				margin: 0 auto ;
				background: #ffffff ;
				border: 1px solid #d6e2ec ;
				border-radius: 16px ;
				box-shadow: 0 16px 44px rgba(9, 39, 70, 0.24) ;
				padding: 14px ;
				z-index: 1025 ;
				box-sizing: border-box ;
			}
			.nip6-mobile-zalo > .nip6-zalo-panel .nip6-zalo-heading {
				text-align: center ;
				margin-bottom: 12px ;
				padding-bottom: 8px ;
				border-bottom: 1px solid #edf2f7 ;
			}
			.nip6-mobile-zalo > .nip6-zalo-panel .nip6-zalo-heading strong {
				display: block ;
				color: #0b3768 ;
				font-size: 13px ;
				font-weight: 850 ;
				letter-spacing: 0.02em ;
			}
			.nip6-mobile-zalo > .nip6-zalo-panel .nip6-zalo-heading span {
				display: block ;
				color: #0056b3 ;
				font-size: 11px ;
				font-weight: 750 ;
				letter-spacing: 0.05em ;
			}
			.nip6-mobile-zalo > .nip6-zalo-panel .nip6-zalo-card,
			.nip6-mobile-zalo > .nip6-zalo-panel .nip6-zalo-branch-card {
				background: #f8fafc ;
				border: 1px solid #e2e8f0 ;
				border-radius: 10px ;
				padding: 10px 12px ;
				margin-bottom: 10px ;
			}
			.nip6-mobile-zalo > .nip6-zalo-panel .nip6-zalo-card:last-child,
			.nip6-mobile-zalo > .nip6-zalo-panel .nip6-zalo-branch-card:last-child {
				margin-bottom: 0 ;
			}
			.nip6-mobile-zalo > .nip6-zalo-panel .nip6-zalo-card-head,
			.nip6-mobile-zalo > .nip6-zalo-panel .nip6-zalo-branch-head {
				display: flex ;
				justify-content: space-between ;
				align-items: center ;
				margin-bottom: 5px ;
			}
			.nip6-mobile-zalo > .nip6-zalo-panel .nip6-zalo-branch-name,
			.nip6-mobile-zalo > .nip6-zalo-panel .nip6-zalo-branch-head strong {
				font-size: 13px ;
				font-weight: 800 ;
				color: #0f172a ;
			}
			.nip6-mobile-zalo > .nip6-zalo-panel .nip6-zalo-phone-link,
			.nip6-mobile-zalo > .nip6-zalo-panel .nip6-zalo-branch-phone-call {
				font-size: 13px ;
				font-weight: 800 ;
				color: #e11d48 ;
				text-decoration: none ;
				display: inline-flex ;
				align-items: center ;
				gap: 4px ;
			}
			.nip6-mobile-zalo > .nip6-zalo-panel .nip6-zalo-address,
			.nip6-mobile-zalo > .nip6-zalo-panel .nip6-zalo-branch-addr {
				display: flex ;
				align-items: flex-start ;
				gap: 5px ;
				font-size: 11.5px ;
				color: #64748b ;
				line-height: 1.4 ;
				margin: 0 0 8px ;
			}
			.nip6-mobile-zalo > .nip6-zalo-panel .nip6-zalo-chat,
			.nip6-mobile-zalo > .nip6-zalo-panel .nip6-zalo-branch-btn {
				display: flex ;
				align-items: center ;
				justify-content: center ;
				gap: 6px ;
				width: 100% ;
				height: 34px ;
				border-radius: 7px ;
				background: #0068ff ;
				color: #ffffff ;
				font-size: 12px ;
				font-weight: 750 ;
				text-decoration: none ;
				box-sizing: border-box ;
			}
			.nip-mobile-menu-btn {
				display: inline-flex ;
				align-items: center ;
				justify-content: center ;
				width: 38px ;
				height: 38px ;
				padding: 0 ;
				margin: 0 ;
				background: #f1f5f9 ;
				border: 1px solid #dce4ee ;
				border-radius: 9px ;
				cursor: pointer ;
				position: relative ;
				flex-shrink: 0 ;
				transition: all 0.22s ease ;
				box-sizing: border-box ;
			}
			.nip-mobile-menu-btn:active {
				background: #e2e8f0 ;
				transform: scale(0.96) ;
			}
			.nip-burger-box {
				width: 20px ;
				height: 14px ;
				display: block ;
				position: relative ;
			}
			.nip-burger-inner,
			.nip-burger-inner::before,
			.nip-burger-inner::after {
				width: 20px ;
				height: 2.2px ;
				background-color: #0c2340 ;
				border-radius: 2px ;
				position: absolute ;
				transition: transform 0.28s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.28s cubic-bezier(0.4, 0, 0.2, 1), top 0.28s cubic-bezier(0.4, 0, 0.2, 1), background-color 0.28s ease ;
			}
			.nip-burger-inner {
				top: 50% ;
				transform: translateY(-50%) ;
				left: 0 ;
			}
			.nip-burger-inner::before {
				content: '' ;
				top: -6px ;
				left: 0 ;
			}
			.nip-burger-inner::after {
				content: '' ;
				top: 6px ;
				left: 0 ;
			}
			.nip-mobile-menu-btn.is-active {
				background: #eef4ff ;
				border-color: #bcd0f7 ;
			}
			.nip-mobile-menu-btn.is-active .nip-burger-inner {
				transform: translateY(-50%) rotate(45deg) ;
				background-color: #004cb8 ;
			}
			.nip-mobile-menu-btn.is-active .nip-burger-inner::before {
				top: 0 ;
				opacity: 0 ;
			}
			.nip-mobile-menu-btn.is-active .nip-burger-inner::after {
				top: 0 ;
				transform: rotate(-90deg) ;
				background-color: #004cb8 ;
			}
			.nip-mobile-drawer {
				display: block ;
				position: fixed ;
				top: 60px ;
				left: 0 ;
				right: 0 ;
				width: 100% ;
				max-height: calc(100vh - 60px) ;
				overflow-y: auto ;
				background: #ffffff ;
				box-shadow: 0 16px 36px rgba(9, 39, 70, 0.18) ;
				z-index: 1004 ;
				transform: translateY(-8px) ;
				opacity: 0 ;
				visibility: hidden ;
				pointer-events: none ;
				transition: transform 0.26s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.26s cubic-bezier(0.4, 0, 0.2, 1), visibility 0.26s ;
				border-bottom: 3px solid #0056b3 ;
			}
			.nip-mobile-drawer.is-open {
				transform: translateY(0) ;
				opacity: 1 ;
				visibility: visible ;
				pointer-events: auto ;
			}
			.nip-mobile-drawer-inner {
				padding: 16px 14px 24px ;
			}
			.nip-mobile-search-wrap {
				margin-bottom: 16px;
				position: relative;
				z-index: 20;
			}
			.nip-mobile-search-wrap .nip5-search {
				display: grid;
				grid-template-columns: minmax(0, 1fr) 44px;
				align-items: center;
				min-height: 52px;
				padding: 4px;
				position: relative;
				border: 1px solid #b9d8f2;
				border-radius: 14px;
				background: linear-gradient(180deg, #ffffff 0%, #f5faff 100%);
				box-shadow: 0 9px 24px rgba(0, 86, 179, 0.10), inset 0 1px 0 rgba(255, 255, 255, 0.95);
				transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
				overflow: visible;
			}
			.nip-mobile-search-wrap .nip5-search:focus-within {
				border-color: #079cf2;
				box-shadow: 0 0 0 3px rgba(7, 156, 242, 0.13), 0 12px 28px rgba(0, 86, 179, 0.14);
				transform: translateY(-1px);
			}
			.nip-mobile-search-wrap .nip5-search input[type="search"] {
				width: 100%;
				min-width: 0;
				height: 42px;
				margin: 0;
				padding: 0 12px;
				border: 0;
				background: transparent;
				box-shadow: none;
				color: #082f55;
				font-family: inherit;
				font-size: 15px;
				font-weight: 600;
				line-height: 1;
				outline: 0;
			}
			.nip-mobile-search-wrap .nip5-search input[type="search"]::placeholder {
				color: #7890a8;
				font-weight: 500;
				opacity: 1;
			}
			.nip-mobile-search-wrap .nip5-search button {
				display: grid;
				place-items: center;
				width: 42px;
				height: 42px;
				margin: 0;
				padding: 0;
				border: 1px solid rgba(255,255,255,.55);
				border-radius: 11px;
				background: linear-gradient(145deg, #15aef4 0%, #0065c8 72%);
				box-shadow: 0 5px 11px rgba(0, 86, 179, .28), inset 0 1px 0 rgba(255,255,255,.35);
				color: #ffffff;
				cursor: pointer;
				transition: transform .18s ease, box-shadow .18s ease;
			}
			.nip-mobile-search-wrap .nip5-search button:active {
				transform: translateY(1px) scale(.97);
				box-shadow: 0 2px 6px rgba(0, 86, 179, .24);
			}
			.nip-mobile-search-wrap .nip5-search button svg {
				width: 18px;
				height: 18px;
			}
			.nip-mobile-search-wrap .nip5-search-dropdown {
				display: none;
				position: absolute;
				inset: calc(100% + 8px) 0 auto;
				z-index: 140;
				max-height: 320px;
				padding: 6px;
				overflow-y: auto;
				border: 1px solid #c8dff2;
				border-radius: 14px;
				background: #ffffff;
				box-shadow: 0 18px 42px rgba(6, 55, 99, .20);
			}
			.nip-mobile-search-wrap .nip5-search-dropdown.is-open { display: block; }
			.nip-mobile-search-wrap .nip5-search-dropdown ul { list-style: none; margin: 0; padding: 0; }
			.nip-mobile-search-wrap .nip5-search-dropdown li + li { border-top: 1px solid #edf3f8; }
			.nip-mobile-search-wrap .nip5-search-dropdown li a {
				display: grid;
				grid-template-columns: 52px minmax(0, 1fr);
				align-items: center;
				gap: 10px;
				min-height: 62px;
				padding: 6px;
				border-radius: 10px;
				color: #092f55;
				text-decoration: none;
			}
			.nip-mobile-search-wrap .nip5-search-dropdown li a:active { background: #eef8ff; }
			.nip-mobile-search-wrap .nip5-search-dropdown img {
				width: 52px;
				height: 52px;
				border-radius: 9px;
				background: #eef7fd;
				object-fit: cover;
			}
			.nip-mobile-search-wrap .nip5-search-dropdown li span { font-size: 14px; font-weight: 750; line-height: 1.32; }
			.nip-mobile-search-wrap .nip5-search-loading,
			.nip-mobile-search-wrap .nip5-search-empty { padding: 15px 12px; color: #587087; font-size: 13px; line-height: 1.45; }
			.nip-mobile-search-wrap .nip5-search-footer { padding: 8px 7px 4px; border-top: 1px solid #e8f1f8; }
			.nip-mobile-search-wrap .nip5-search-footer a {
				display: block;
				padding: 10px 12px;
				border-radius: 9px;
				background: #edf8ff;
				color: #0068c9;
				font-size: 13px;
				font-weight: 750;
				text-align: center;
				text-decoration: none;
			}
			/* Mobile Section Label */
			.nip-m-section-label {
				font-size: 11px ;
				font-weight: 800 ;
				letter-spacing: 0.08em ;
				color: #64748b ;
				text-transform: uppercase ;
				margin: 18px 2px 10px ;
			}
			.nip-mobile-drawer-inner .nip-m-section-label:first-of-type {
				margin-top: 6px ;
			}
			/* Mobile Category List */
			.nip-m-list {
				display: flex ;
				flex-direction: column ;
				width: 100% ;
				list-style: none ;
				margin: 0 ;
				padding: 0 ;
				gap: 7px ;
			}
			.nip-m-item {
				display: block ;
				width: 100% ;
				margin: 0 ;
				padding: 0 ;
				background: #ffffff ;
				border: 1px solid #e5eaf0 ;
				border-radius: 10px ;
				overflow: hidden ;
				transition: all 0.2s ease ;
			}
			.nip-m-item.is-expanded {
				background: #f8fafc ;
				border-color: #cbd5e1 ;
				box-shadow: 0 4px 12px rgba(9, 39, 70, 0.05) ;
			}
			.nip-m-head {
				display: flex ;
				align-items: center ;
				justify-content: space-between ;
				width: 100% ;
				box-sizing: border-box ;
			}
			.nip-m-main-link {
				display: flex ;
				align-items: center ;
				gap: 11px ;
				flex: 1 ;
				min-width: 0 ;
				padding: 10px 12px ;
				color: #0f172a ;
				text-decoration: none ;
				box-sizing: border-box ;
			}
			.nip-m-icon {
				display: inline-grid ;
				place-items: center ;
				width: 34px ;
				height: 34px ;
				border-radius: 8px ;
				flex-shrink: 0 ;
			}
			.nip-m-title {
				font-size: 14px ;
				font-weight: 750 ;
				color: #1e293b ;
				line-height: 1.25 ;
			}
			.nip-m-toggle-btn {
				display: inline-grid ;
				place-items: center ;
				width: 44px ;
				height: 44px ;
				padding: 0 ;
				margin: 0 ;
				background: transparent ;
				border: 0 ;
				cursor: pointer ;
				color: #64748b ;
				flex-shrink: 0 ;
			}
			.nip-m-chevron {
				transition: transform 0.24s cubic-bezier(0.4, 0, 0.2, 1), color 0.2s ease ;
			}
			.nip-m-item.is-expanded .nip-m-chevron {
				transform: rotate(180deg) ;
				color: #0056b3 ;
			}
			/* Subpanel */
			.nip-m-subpanel {
				display: none ;
				padding: 4px 10px 12px 10px ;
				border-top: 1px dashed #e2e8f0 ;
				background: #ffffff ;
			}
			.nip-m-item.is-expanded .nip-m-subpanel {
				display: block ;
			}
			.nip-m-sublist {
				display: grid ;
				grid-template-columns: repeat(2, minmax(0, 1fr)) ;
				gap: 6px ;
			}
			.nip-m-sublink {
				display: flex ;
				align-items: center ;
				min-height: 36px ;
				padding: 6px 10px ;
				background: #f8fafc ;
				border: 1px solid #edf2f7 ;
				border-radius: 6px ;
				font-size: 12px ;
				font-weight: 650 ;
				color: #334155 ;
				text-decoration: none ;
				line-height: 1.3 ;
				box-sizing: border-box ;
				transition: all 0.15s ease ;
			}
			.nip-m-sublink:hover,
			.nip-m-sublink:active {
				background: #eff6ff ;
				border-color: #bfdbfe ;
				color: #0056b3 ;
			}
			.nip-m-sublink.nip-m-viewall {
				grid-column: 1 / -1 ;
				justify-content: space-between ;
				background: #eff6ff ;
				border-color: #bfdbfe ;
				color: #0056b3 ;
				font-weight: 750 ;
				font-size: 12.5px ;
				padding: 8px 12px ;
			}
			/* Badge In Nhanh 2h */
			.nip-m-badge {
				display: grid;
				grid-template-columns: 84px minmax(0, 1fr);
				align-items: center;
				gap: 10px;
				margin: 18px 0 14px;
				padding: 9px 12px 9px 7px;
				border: 1px solid #a9daf7;
				border-radius: 14px;
				background: linear-gradient(135deg, #f8fcff 0%, #dff4ff 100%);
				box-shadow: 0 8px 20px rgba(0, 86, 179, .09), inset 0 1px 0 rgba(255,255,255,.9);
				box-sizing: border-box;
			}
			.nip-m-badge-truck {
				display: flex;
				align-items: center;
				justify-content: center;
				width: 84px;
				height: 58px;
				flex-shrink: 0;
			}
			.nip-m-badge-truck img {
				display: block;
				width: 82px;
				height: auto;
				max-height: 58px;
				object-fit: contain;
				filter: drop-shadow(0 6px 6px rgba(0, 65, 132, .20));
			}
			.nip-m-badge-text {
				display: flex;
				min-width: 0;
				flex-direction: column;
				gap: 3px;
			}
			.nip-m-badge-text strong { color: #004cb8; font-size: 12.5px; font-weight: 800; letter-spacing: .01em; line-height: 1.25; }
			.nip-m-badge-text span { color: #087cb9; font-size: 11.5px; font-weight: 600; line-height: 1.3; }
			/* Branches */
			.nip-m-branches {
				margin-top: 14px ;
			}
			.nip-m-card {
				background: #ffffff ;
				border: 1px solid #e2e8f0 ;
				border-radius: 12px ;
				padding: 12px 14px ;
				margin-bottom: 10px ;
				box-shadow: 0 2px 8px rgba(9, 39, 70, 0.04) ;
				box-sizing: border-box ;
			}
			.nip-m-card-top {
				display: flex ;
				justify-content: space-between ;
				align-items: center ;
				margin-bottom: 6px ;
			}
			.nip-m-card-name {
				display: flex ;
				align-items: center ;
				gap: 5px ;
				font-size: 13.5px ;
				color: #0f172a ;
			}
			.nip-m-card-tag {
				font-size: 11px ;
				font-weight: 750 ;
				color: #0056b3 ;
				background: #eff6ff ;
				padding: 2px 8px ;
				border-radius: 99px ;
				border: 1px solid #dbeafe ;
			}
			.nip-m-card-addr {
				display: flex ;
				align-items: flex-start ;
				gap: 6px ;
				font-size: 12px ;
				color: #64748b ;
				line-height: 1.45 ;
				margin-bottom: 10px ;
			}
			.nip-m-card-addr svg {
				flex-shrink: 0 ;
				margin-top: 2px ;
			}
			.nip-m-actions {
				display: grid ;
				grid-template-columns: 1fr 1fr ;
				gap: 8px ;
			}
			.nip-m-btn {
				display: inline-flex ;
				align-items: center ;
				justify-content: center ;
				gap: 6px ;
				height: 36px ;
				padding: 0 10px ;
				border-radius: 8px ;
				font-size: 12.5px ;
				font-weight: 750 ;
				text-decoration: none ;
				box-sizing: border-box ;
				transition: opacity 0.15s ease ;
			}
			.nip-m-btn:active {
				opacity: 0.85 ;
			}
			.nip-m-call {
				background: #e11d48 ;
				color: #ffffff ;
			}
			.nip-m-zalo {
				background: #0068ff ;
				color: #ffffff ;
			}
			.nip-mobile-backdrop {
				display: block ;
				position: fixed ;
				inset: 60px 0 0 0 ;
				background: rgba(0, 15, 35, 0.45) ;
				z-index: 1003 ;
				opacity: 0 ;
				visibility: hidden ;
				pointer-events: none ;
				backdrop-filter: blur(2px) ;
				-webkit-backdrop-filter: blur(2px) ;
				transition: opacity 0.25s ease, visibility 0.25s ;
			}
			.nip-mobile-backdrop.is-open {
				opacity: 1 ;
				visibility: visible ;
				pointer-events: auto ;
			}
			body.nip-drawer-open {
				overflow: hidden ;
			}
		}

		/* Mega Menu Desktop & Tablet Flush Alignment (0px gap) */
		@media (min-width: 768px) {
			.nip6-nav {
				position: relative ;
			}
			.nip6-nav .nip5-header-shell {
				position: static ;
			}
			.nip6-nav nav,
			.nip6-nav nav > ul,
			.nip6-nav nav > ul > li {
				position: static ;
			}
			.nip6-mega {
				position: absolute ;
				top: 100% ;
				left: 0 ;
				right: 0 ;
				width: 100% ;
				margin: 0 ;
				box-sizing: border-box ;
			}
			.nip6-nav .nip6-mega-parent > .nip6-mega::before {
				top: -12px ;
				height: 14px ;
				pointer-events: auto ;
			}
		}
		
		/* 3D Delivery Truck (Desktop & Tablet) */
		.nip6-shipping,
		.nip5-scope .nip6-shipping,
		header .nip6-shipping {
			display: flex ;
			flex-direction: row ;
			align-items: center ;
			justify-content: flex-start ;
			gap: 10px ;
			min-width: 0 ;
			grid-template-columns: none ;
			padding: 0 ;
			background: transparent ;
			border: none ;
		}
		.nip6-shipping:before,
		.nip5-scope .nip6-shipping:before,
		header .nip6-shipping:before {
			order: 1 ;
			display: inline-block ;
			width: 68px ;
			height: 46px ;
			margin: 0 ;
			content: "" ;
			border: none ;
			border-radius: 0 ;
			background: url('/wp-content/themes/shop2/assets/delivery-truck-3d.webp') center center / contain no-repeat ;
			filter: drop-shadow(0 4px 6px rgba(0, 53, 111, 0.18)) ;
			flex-shrink: 0 ;
		}
		@media (min-width: 768px) and (max-width: 1080px) {
			.nip6-shipping:before,
			.nip5-scope .nip6-shipping:before,
			header .nip6-shipping:before {
				width: 52px ;
				height: 35px ;
			}
		}