/* Header toàn site – Quang Minh Tech. 2 tầng: thanh trên + thanh chính (nền trắng). */
.qmt-hd, .qmt-drawer {
	--qmt-accent: #0c47a0;
	--qmt-accent-dark: #093a7f;
	--qmt-ink: #141414;
	--qmt-muted: #5f636b;
	--qmt-line: #e6e8ec;
	--qmt-bg: #f3f4f6;
	--qmt-hd-top: 40px;
	--qmt-hd-bar: 84px;
	font-family: var(--qmt-font);
	color: var(--qmt-ink);
}
.qmt-hd *, .qmt-drawer * { box-sizing: border-box; }
.qmt-hd :where(ul), .qmt-drawer :where(ul) { list-style: none; margin: 0; padding: 0; }
.qmt-hd :where(li), .qmt-drawer :where(li) { margin: 0; }
.qmt-hd :where(a), .qmt-drawer :where(a) { color: inherit; text-decoration: none; }
.qmt-hd svg, .qmt-drawer svg { fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.qmt-hd .qmt-chev, .qmt-drawer .qmt-chev { width: 16px !important; height: 16px !important; }

/* Header cố định + khối đệm giữ chỗ */
/* Biến chiều cao khai báo ở :root để khối đệm (nằm ngoài header) cũng đọc được */
:root { --qmt-hd-top: 40px; --qmt-hd-bar: 84px; }
.qmt-hd-spacer { height: calc(var(--qmt-hd-top) + var(--qmt-hd-bar)); }
.qmt-hd { position: fixed; left: 0; right: 0; top: var(--wp-admin--admin-bar--height, 0px); z-index: 9990; }

/* ---------- Thanh trên ---------- */
.qmt-hd__top { height: var(--qmt-hd-top); background: #fff; color: var(--qmt-muted); font-size: 13.5px; border-bottom: 1px solid var(--qmt-line); overflow: hidden; transition: height .3s; }
.qmt-hd__top-in { display: flex; align-items: center; justify-content: space-between; gap: 24px; height: 100%; padding: 0 var(--qmt-edge); }
.qmt-hd__slogan { position: relative; padding-left: 18px; font-weight: 500; color: var(--qmt-ink); white-space: nowrap; }
.qmt-hd__slogan::before { content: ""; position: absolute; left: 0; top: 50%; width: 7px; height: 7px; margin-top: -3.5px; border-radius: 50%; background: var(--qmt-accent); box-shadow: 0 0 0 4px rgba(12, 71, 160, .25); }
.qmt-hd__top-right { display: flex; align-items: center; gap: 26px; }
.qmt-hd__meta { display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; }
.qmt-hd .qmt-hd__meta svg { width: 15px !important; height: 15px !important; color: var(--qmt-accent); }
a.qmt-hd__meta:hover { color: var(--qmt-accent); }
.qmt-hd__social { display: inline-flex; gap: 6px; padding-left: 20px; border-left: 1px solid var(--qmt-line); }
.qmt-hd__social a { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: var(--qmt-bg); color: var(--qmt-ink); font-size: 8.5px; transition: background .2s; }
.qmt-hd .qmt-hd__social svg { width: 13px !important; height: 13px !important; }
.qmt-hd__social a:hover { background: var(--qmt-accent); color: #fff; }

/* ---------- Thanh chính ---------- */
.qmt-hd__bar { position: relative; background: rgba(255, 255, 255, .97); backdrop-filter: saturate(1.4) blur(10px); box-shadow: 0 1px 0 var(--qmt-line); transition: box-shadow .3s; }
.qmt-hd.is-scrolled .qmt-hd__bar { box-shadow: 0 10px 30px rgba(10, 20, 40, .1); }
.qmt-hd__bar-in { display: flex; align-items: center; gap: 28px; height: var(--qmt-hd-bar); padding: 0 var(--qmt-edge); transition: height .3s; }
.qmt-hd.is-scrolled .qmt-hd__top { height: 0; }
.qmt-hd.is-scrolled .qmt-hd__bar-in { height: 70px; }

.qmt-hd__logo { flex: none; display: flex; align-items: center; height: 100%; }
.qmt-hd__logo img { width: auto; height: 62px; max-width: none; transition: height .3s; }
.qmt-hd.is-scrolled .qmt-hd__logo img { height: 52px; }

/* Menu */
.qmt-nav { flex: 1 1 auto; display: flex; justify-content: center; min-width: 0; }
.qmt-nav__list { display: flex; align-items: center; gap: 4px; }
.qmt-nav__item { position: relative; }
.qmt-nav__list > .qmt-nav__item > a {
	position: relative; display: flex; align-items: center; gap: 5px; height: var(--qmt-hd-bar); padding: 0 14px;
	font-size: 15.5px; font-weight: 500; color: var(--qmt-ink); white-space: nowrap; transition: color .2s, height .3s;
}
.qmt-hd.is-scrolled .qmt-nav__list > .qmt-nav__item > a { height: 70px; }
/* Nền xanh bo góc nhẹ khi rê chuột / trang đang xem */
.qmt-nav__list > .qmt-nav__item > a { isolation: isolate; }
.qmt-nav__list > .qmt-nav__item > a::after {
	content: ""; position: absolute; z-index: -1; left: 2px; right: 2px; top: 50%; height: 40px; border-radius: var(--qmt-radius, 5px);
	background: var(--qmt-accent); opacity: 0; transform: translateY(-50%) scale(.92); transition: opacity .2s, transform .2s;
}
.qmt-nav__list > .qmt-nav__item:hover > a, .qmt-nav__list > .qmt-nav__item.is-current > a { color: #fff; }
.qmt-nav__list > .qmt-nav__item:hover > a::after, .qmt-nav__list > .qmt-nav__item.is-current > a::after { opacity: 1; transform: translateY(-50%); }
.qmt-chev { transition: transform .25s; opacity: .6; }
.qmt-nav__list > .qmt-nav__item:hover > a .qmt-chev { transform: rotate(180deg); opacity: 1; }
.qmt-nav__toggle { display: none; }

/* Dropdown */
.qmt-nav__sub {
	position: absolute; top: calc(100% - 10px); left: 0; min-width: 260px; padding: 10px; background: #fff;
	border-radius: var(--qmt-radius, 5px); box-shadow: 0 24px 48px rgba(10, 20, 40, .14), 0 0 0 1px rgba(10, 20, 40, .04);
	opacity: 0; visibility: hidden; transform: translateY(12px); transition: opacity .2s, transform .2s, visibility .2s;
}
.qmt-nav__sub::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px; border-radius: var(--qmt-radius, 5px) var(--qmt-radius, 5px) 0 0; background: var(--qmt-accent); }
.qmt-nav__sub .qmt-nav__sub { top: -10px; left: calc(100% + 6px); }
.qmt-nav__item:hover > .qmt-nav__sub, .qmt-nav__item:focus-within > .qmt-nav__sub { opacity: 1; visibility: visible; transform: none; }
.qmt-nav__sub a { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 14px; border-radius: 4px; font-size: 14.5px; font-weight: 500; color: var(--qmt-ink); transition: background .15s, color .15s, padding .2s; }
.qmt-nav__sub .qmt-chev { transform: rotate(-90deg); }
.qmt-nav__sub a:hover, .qmt-nav__sub .is-current > a { color: var(--qmt-accent); background: #fdf1f1; padding-left: 18px; }

/* Công cụ bên phải */
.qmt-hd__tools { flex: none; display: flex; align-items: center; gap: 10px; }
.qmt-hd__icon-btn {
	position: relative; display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 50%;
	background: var(--qmt-bg); color: var(--qmt-ink); cursor: pointer; min-height: 0; transition: background .2s, color .2s;
}
.qmt-hd .qmt-hd__icon-btn svg { width: 20px !important; height: 20px !important; }
.qmt-hd__icon-btn:hover, .qmt-hd__icon-btn[aria-expanded="true"] { background: var(--qmt-ink); color: #fff; }
.qmt-hd__cart-count { position: absolute; top: -3px; right: -3px; min-width: 19px; height: 19px; padding: 0 5px; border: 2px solid #fff; border-radius: 10px; background: var(--qmt-accent); color: #fff; font-size: 10.5px; font-weight: 700; line-height: 15px; text-align: center; }

.qmt-hd__hotline { display: flex; align-items: center; gap: 10px; margin-left: 8px; padding-left: 18px; border-left: 1px solid var(--qmt-line); }
.qmt-hd__hotline-icon { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; background: rgba(12, 71, 160, .1); color: var(--qmt-accent); transition: background .2s, color .2s; }
.qmt-hd .qmt-hd__hotline-icon svg { width: 19px !important; height: 19px !important; }
.qmt-hd__hotline-txt { display: flex; flex-direction: column; line-height: 1.2; }
.qmt-hd__hotline-txt small { font-size: 11.5px; font-weight: 500; color: var(--qmt-muted); text-transform: uppercase; letter-spacing: .05em; }
.qmt-hd__hotline-txt b { font-family: var(--qmt-font-head); font-size: 17px; font-weight: 700; color: var(--qmt-ink); white-space: nowrap; }
.qmt-hd__hotline:hover .qmt-hd__hotline-icon { background: var(--qmt-accent); color: #fff; }
.qmt-hd__hotline:hover b { color: var(--qmt-accent); }

.qmt-hd__cta {
	display: inline-flex; align-items: center; gap: 10px; height: 46px; padding: 0 22px; margin-left: 6px;
	border-radius: var(--qmt-radius, 5px); background: var(--qmt-accent); color: #fff !important; white-space: nowrap;
	font-family: var(--qmt-font-head); font-size: 14.5px; font-weight: 700; letter-spacing: .02em;
	box-shadow: 0 8px 20px rgba(12, 71, 160, .28); transition: background .2s, transform .2s, box-shadow .2s;
}
.qmt-hd__cta i { width: 14px; height: 14px; background: #fff; transition: transform .3s; }
.qmt-hd__cta:hover { background: var(--qmt-accent-dark); transform: translateY(-1px); box-shadow: 0 12px 26px rgba(12, 71, 160, .35); }
.qmt-hd__cta:hover i { transform: translateX(4px); }

/* Ô tìm kiếm thả xuống */
.qmt-hd__search { position: absolute; left: 0; right: 0; top: 100%; background: #fff; box-shadow: 0 18px 30px rgba(10, 20, 40, .1); border-top: 1px solid var(--qmt-line); }
.qmt-hd__search[hidden] { display: none; }
.qmt-hd__search-in { display: flex; align-items: center; gap: 14px; max-width: 900px; margin: 0 auto; padding: 18px var(--qmt-gutter, 24px); }
.qmt-search { position: relative; display: flex; align-items: center; flex: 1; height: 54px; padding: 0 22px; margin: 0; background: var(--qmt-bg); border-radius: 999px; }
.qmt-hd .qmt-search svg, .qmt-drawer .qmt-search svg { width: 20px !important; height: 20px !important; color: #8f949b; flex: none; }
.qmt-search input[type="search"] {
	flex: 1; min-width: 0; height: 100%; margin: 0 0 0 12px; padding: 0; border: 0 !important; background: transparent !important;
	box-shadow: none !important; font: var(--qmt-w-body) 16px/1 var(--qmt-font); color: var(--qmt-ink); outline: none;
}
.qmt-search input::placeholder { color: #a3a8af; }
.qmt-search:focus-within { box-shadow: 0 0 0 2px rgba(12, 71, 160, .3); }
.qmt-hd__search-close { flex: none; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 50%; background: var(--qmt-bg); color: var(--qmt-ink); font-size: 24px; line-height: 1; cursor: pointer; min-height: 0; }
.qmt-hd__search-close:hover { background: var(--qmt-ink); color: #fff; }

/* Mobile controls (ẩn trên desktop) */
.qmt-hd__burger, .qmt-hd__call { display: none; }

/* ---------- Co giãn ---------- */
@media (max-width: 1440px) {
	.qmt-hd__bar-in { gap: 18px; }
	.qmt-nav__list > .qmt-nav__item > a { padding: 0 11px; font-size: 15px; }
}
@media (max-width: 1320px) {
	.qmt-hd__hotline-txt { display: none; }
	.qmt-hd__hotline { padding-left: 12px; margin-left: 2px; }
}
@media (max-width: 1240px) {
	.qmt-hd__slogan { display: none; }
	.qmt-hd__top-in { justify-content: flex-end; }
	.qmt-nav__list > .qmt-nav__item > a { padding: 0 9px; font-size: 14.5px; }
	.qmt-hd__cta { padding: 0 16px; }
}

/* Mobile / tablet */
@media (max-width: 1180px) {
	:root, .qmt-hd { --qmt-hd-top: 0px; --qmt-hd-bar: 68px; }
	.qmt-hd__top { display: none; }
	.qmt-hd__bar-in { display: grid; grid-template-columns: 56px 1fr 56px; gap: 0; height: 68px; padding: 0; }
	.qmt-hd.is-scrolled .qmt-hd__bar-in { height: 68px; }
	.qmt-hd .qmt-nav, .qmt-hd__tools { display: none; }
	.qmt-hd__logo { grid-column: 2; grid-row: 1; justify-content: center; }
	.qmt-hd__logo img, .qmt-hd.is-scrolled .qmt-hd__logo img { height: 52px; }
	.qmt-hd__burger { grid-column: 1; grid-row: 1; display: flex; flex-direction: column; justify-content: center; gap: 5px; width: 56px; height: 68px; padding: 0 16px; background: none; border: 0; cursor: pointer; min-height: 0; }
	.qmt-hd__burger span { display: block; height: 2px; background: var(--qmt-ink); border-radius: 2px; }
	.qmt-hd__burger span:nth-child(2) { width: 70%; }
	.qmt-hd__call { grid-column: 3; grid-row: 1; display: grid; place-items: center; width: 56px; height: 68px; color: var(--qmt-accent); }
	.qmt-hd .qmt-hd__call svg { width: 24px !important; height: 24px !important; }
}

/* Drawer mobile */
/* z-index cao hơn nút Zalo/gọi nổi và thanh menu đáy của theme. */
.qmt-drawer { position: fixed; inset: 0; z-index: 2147483000; }
.qmt-drawer[hidden] { display: none; }
.qmt-drawer__backdrop { position: absolute; inset: 0; background: rgba(10, 14, 24, .5); opacity: 0; transition: opacity .3s; }
.qmt-drawer__panel {
	position: absolute; top: 0; bottom: 0; left: 0; width: min(360px, 88vw); overflow-y: auto; background: #fff;
	padding: 18px 20px 30px; display: flex; flex-direction: column; gap: 18px; transform: translateX(-100%); transition: transform .3s ease;
}
.qmt-drawer.is-open .qmt-drawer__backdrop { opacity: 1; }
.qmt-drawer.is-open .qmt-drawer__panel { transform: none; }
.qmt-drawer__head { display: flex; align-items: center; justify-content: space-between; }
.qmt-drawer__head img { height: 56px; width: auto; }
.qmt-drawer__close { width: 44px; height: 44px; padding: 0; border: 0; background: var(--qmt-bg); border-radius: 50%; font-size: 26px; line-height: 1; color: var(--qmt-ink); cursor: pointer; min-height: 0; }
.qmt-drawer .qmt-search { width: 100%; height: 48px !important; flex: none; }
.qmt-drawer .qmt-search input[type="search"] { height: 100% !important; }
.qmt-drawer .qmt-search input[type="search"] { position: static; opacity: 1; pointer-events: auto; }
.qmt-nav--mobile .qmt-nav__list { display: block; }
.qmt-nav--mobile .qmt-nav__item { position: relative; border-bottom: 1px solid var(--qmt-line); }
.qmt-nav--mobile .qmt-nav__item > a { display: flex; height: auto; padding: 14px 48px 14px 0; font-size: 16px; font-weight: 400; color: var(--qmt-ink); }
.qmt-nav--mobile .qmt-nav__item > a .qmt-chev { display: none; }
.qmt-nav--mobile .qmt-nav__item.is-current > a { color: var(--qmt-accent); }
.qmt-nav--mobile .qmt-nav__toggle {
	display: grid; place-items: center; position: absolute; top: 4px; right: 0; width: 44px; height: 44px; padding: 0;
	background: none; border: 0; color: var(--qmt-ink); cursor: pointer; min-height: 0;
}
.qmt-nav--mobile .qmt-nav__toggle .qmt-chev { display: block; }
.qmt-nav--mobile .qmt-nav__toggle[aria-expanded="true"] .qmt-chev { transform: rotate(180deg); }
.qmt-nav--mobile .qmt-nav__sub { position: static; display: none; min-width: 0; padding: 0 0 8px 14px; border: 0; box-shadow: none; opacity: 1; visibility: visible; transform: none; }
.qmt-nav--mobile .qmt-nav__item.is-open > .qmt-nav__sub { display: block; }
.qmt-nav--mobile .qmt-nav__sub .qmt-nav__item { border-bottom: 0; }
.qmt-nav--mobile .qmt-nav__sub a { padding: 10px 48px 10px 0; font-size: 15px; background: none; }
.qmt-hd__cta--block { display: flex; height: 50px; margin: 0; }
.qmt-drawer__contact { display: grid; gap: 8px; font-size: 14px; color: var(--qmt-muted); }
.qmt-drawer__contact a:first-child { color: var(--qmt-accent); font-weight: 500; font-size: 16px; }
body.qmt-drawer-open { overflow: hidden; }
/* Ẩn nút Zalo/gọi nổi, thanh menu đáy và nút chọn ngôn ngữ khi drawer đang mở. */
body.qmt-drawer-open #button-contact-vr,
body.qmt-drawer-open .et-mobile-panel-wrapper,
body.qmt-drawer-open #trp-floater-ls { display: none !important; }

@media (prefers-reduced-motion: reduce) {
	.qmt-hd *, .qmt-drawer * { transition: none !important; }
}

/* Menu mobile (drawer): không dùng nền xanh dạng viên của menu desktop, danh sách sát lề trái */
.qmt-nav--mobile { display: block; width: 100%; justify-content: flex-start; }
.qmt-nav--mobile .qmt-nav__list { width: 100%; gap: 0; }
.qmt-nav--mobile .qmt-nav__list > .qmt-nav__item > a::after { display: none; }
.qmt-nav--mobile .qmt-nav__list > .qmt-nav__item:hover > a { color: var(--qmt-accent); }
.qmt-nav--mobile .qmt-nav__list > .qmt-nav__item.is-current > a { color: var(--qmt-accent); font-weight: 600; }
.qmt-drawer .qmt-hd__cta--block { justify-content: center; align-items: center; min-height: 50px; }
