/* JQN PATCH 07/10/2026 R2 — UI/cache-safe patch only. No price/product data. */
:root{--jqn-patch-dock-space:0px;--jqn-navy:#0c3550;--jqn-navy-2:#103e5c;--jqn-red:#cf2734;--jqn-line:#d6e1e8;--jqn-bg:#f6f8fa;--jqn-yellow:#f4c400}
html{scroll-padding-bottom:calc(var(--jqn-patch-dock-space) + env(safe-area-inset-bottom,0px))}
body.jqn-patch-has-dock{padding-bottom:calc(var(--jqn-patch-dock-space) + env(safe-area-inset-bottom,0px))!important}
body.jqn-patch-has-dock .u20-footer,body.jqn-patch-has-dock .editor-footer{padding-bottom:max(28px,env(safe-area-inset-bottom,0px))}
/* Sync cẩm nang visual language with the new storefront */
.editor-header{background:#fff!important;color:var(--jqn-navy)!important;border-bottom:1px solid var(--jqn-line)!important;box-shadow:0 1px 0 rgba(12,53,80,.03);padding:18px clamp(20px,4vw,48px)!important;display:flex!important;align-items:center!important;gap:24px!important;justify-content:space-between!important;position:relative;z-index:20}
.editor-brand{color:var(--jqn-navy)!important;text-decoration:none!important;font-weight:850!important;letter-spacing:.02em!important;font-size:clamp(18px,2.2vw,26px)!important;white-space:nowrap}
.editor-brand span{color:#d9a900!important}
.editor-nav{display:flex!important;gap:18px!important;align-items:center!important;flex-wrap:wrap!important}
.editor-nav a{color:var(--jqn-navy)!important;text-decoration:none!important;font-weight:700!important;border-bottom:2px solid transparent;padding:8px 0}
.editor-nav a:hover,.editor-nav a:focus-visible{border-bottom-color:var(--jqn-navy)}
.jqn-patch-quote-link{display:inline-flex!important;align-items:center;justify-content:center;border:2px solid var(--jqn-navy)!important;border-radius:12px!important;padding:11px 16px!important;text-decoration:none!important;font-weight:800!important;color:var(--jqn-navy)!important;background:#fff!important;white-space:nowrap}
.editor-main{max-width:1180px!important;margin-inline:auto!important;padding-inline:clamp(22px,4vw,54px)!important}
.guide-intro{padding-top:clamp(34px,6vw,72px)!important}
.editor-footer{background:#f1f5f8!important;color:var(--jqn-navy)!important;border-top:1px solid var(--jqn-line)!important;padding:40px clamp(24px,5vw,72px)!important}
.editor-footer a{color:var(--jqn-navy)!important}
.editor-contact{border-color:var(--jqn-line)!important;border-radius:18px!important;background:#f8fafb!important}
/* Consent readability: JS adds these classes by label, so this survives markup changes. */
.jqn-consent-allow{background:var(--jqn-navy)!important;color:#fff!important;-webkit-text-fill-color:#fff!important;opacity:1!important;border-color:var(--jqn-navy)!important;font-weight:800!important;text-shadow:none!important}
.jqn-consent-deny{background:#fff!important;color:var(--jqn-navy)!important;-webkit-text-fill-color:var(--jqn-navy)!important;opacity:1!important;border:2px solid var(--jqn-navy)!important;font-weight:750!important}
.jqn-consent-allow:focus-visible,.jqn-consent-deny:focus-visible{outline:3px solid #f4c400!important;outline-offset:3px!important}
/* Dock injected only on old editorial pages; current pages keep their existing dock. */
.jqn-patch-dock{position:fixed;left:14px;right:14px;bottom:max(12px,env(safe-area-inset-bottom,0px));z-index:9990;display:grid;grid-template-columns:repeat(4,1fr);background:#fff;border:1px solid #d7e1e8;border-radius:20px;box-shadow:0 8px 28px rgba(12,53,80,.16);overflow:hidden;min-height:72px}
.jqn-patch-dock a{display:flex;flex-direction:column;gap:5px;align-items:center;justify-content:center;text-align:center;color:#0c3550;text-decoration:none;font-weight:800;font-size:14px;padding:9px 4px;line-height:1.12}
.jqn-patch-dock a:nth-child(2){background:var(--jqn-red);color:#fff}
.jqn-patch-dock svg{width:25px;height:25px;display:block}
@media (min-width:761px){.jqn-patch-dock{display:none!important}}
@media (max-width:760px){
 .editor-header{padding:14px 18px!important;gap:12px!important;flex-wrap:wrap!important;position:sticky;top:0}
 .editor-brand{font-size:18px!important;order:1;max-width:58%}
 .jqn-patch-quote-link{order:2;margin-left:auto;padding:9px 12px!important;border-radius:10px!important}
 .editor-nav{order:3;width:100%;gap:16px!important;overflow-x:auto;flex-wrap:nowrap!important;padding-bottom:2px;scrollbar-width:none}
 .editor-nav::-webkit-scrollbar{display:none}
 .editor-nav a{white-space:nowrap;font-size:15px}
 .editor-main{padding-inline:22px!important}
 .editor-footer{padding-inline:28px!important}
 body.jqn-patch-has-dock{padding-bottom:calc(var(--jqn-patch-dock-space) + 18px + env(safe-area-inset-bottom,0px))!important}
}
