/* NEON GADGET HUB — approved desktop + mobile header, v1.0
 * Scoped styles: does not modify product pages, cart, footer or backend.
 */
.ngh-ap-announcement,
.ngh-ap-header,
.ngh-ap-header * { box-sizing: border-box; }
.ngh-ap-announcement { background: #fff5ec; color:#27211c; border-bottom:1px solid #ffe3d1; font-family:Arial,Helvetica,sans-serif; }
.ngh-ap-announcement .ngh-ap-ann-row { max-width:1480px; margin:auto; padding:10px 28px; display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:39px; font-size:12px; line-height:1.4; }
.ngh-ap-announcement .ngh-ap-ann-benefits { display:flex; align-items:center; gap:18px; flex-wrap:wrap; }
.ngh-ap-announcement .ngh-ap-ann-benefits span { display:flex; align-items:center; gap:7px; }
.ngh-ap-announcement .ngh-ap-ann-benefits span + span { padding-left:17px; border-left:1px solid #f7c9aa; }
.ngh-ap-announcement svg { width:17px; height:17px; color:#ff7100; flex:none; }
.ngh-ap-announcement .ngh-ap-ann-region { display:flex; align-items:center; gap:7px; font-weight:700; white-space:nowrap; }
.ngh-ap-header { position:sticky !important; top:0; z-index:1100; width:100%; background:#fff; border-bottom:1px solid #ececec; box-shadow:0 5px 18px rgba(12,14,19,.055); font-family:Arial,Helvetica,sans-serif; color:#141414; }
.ngh-ap-header a { text-decoration:none; color:inherit; }
.ngh-ap-header button { cursor:pointer; font:inherit; }
.ngh-ap-header .ngh-ap-top-row { max-width:1480px; min-height:94px; margin:auto; padding:15px 28px; display:grid; grid-template-columns:42px 245px minmax(200px,1fr) auto; gap:22px; align-items:center; }
.ngh-ap-header .ngh-ap-menu-btn { width:40px; height:40px; min-width:40px; display:grid !important; place-items:center; border:0; border-radius:10px; background:transparent; color:#141414; padding:8px; box-shadow:none; }
.ngh-ap-header .ngh-ap-menu-btn:hover { background:#fff1e5; color:#ff7100; }
.ngh-ap-header .ngh-ap-menu-btn svg { width:26px; height:26px; stroke:currentColor; }
.ngh-ap-header .ngh-ap-logo { justify-self:start; display:inline-flex !important; flex-direction:column; align-items:flex-start; line-height:1 !important; max-width:100%; white-space:nowrap; }
.ngh-ap-header .ngh-ap-logo-main { display:block; color:#080808; font-weight:950; font-size:39px; letter-spacing:-2.7px; line-height:0.94; font-family:Arial,Helvetica,sans-serif; }
.ngh-ap-header .ngh-ap-logo-power { color:#ff7100; }
.ngh-ap-header .ngh-ap-logo-sub { display:block; color:#101010; font-size:10px; font-weight:900; margin-top:7px; letter-spacing:4.8px; line-height:1.2; }
.ngh-ap-header .ngh-ap-search { height:49px !important; max-width:620px !important; width:100%; min-width:0; justify-self:center; display:flex !important; align-items:stretch; border:1px solid #dedfe2; border-radius:13px; background:#f9fafb; overflow:hidden; box-shadow:0 1px 2px rgba(0,0,0,.025); }
.ngh-ap-header .ngh-ap-search input { flex:1; min-width:0; width:auto; height:100%; border:0; outline:0; padding:0 14px 0 17px; color:#171717; background:transparent; font-size:14px; box-shadow:none; }
.ngh-ap-header .ngh-ap-search:focus-within { border-color:#ff7a00; box-shadow:0 0 0 3px rgba(255,122,0,.12); }
.ngh-ap-header .ngh-ap-search button { min-width:58px; width:58px; height:100%; border:0; background:#ff7900; color:#fff; display:grid; place-items:center; border-radius:10px; margin:0; }
.ngh-ap-header .ngh-ap-search button:hover { background:#e96f00; }
.ngh-ap-header .ngh-ap-search svg { width:21px; height:21px; }
.ngh-ap-header .ngh-ap-actions { display:flex; align-items:center; justify-content:flex-end; gap:18px; min-width:0; }
.ngh-ap-header .ngh-ap-action { position:relative; width:auto; min-width:50px; height:auto; min-height:51px; border-radius:10px; padding:2px 4px; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:5px; background:transparent; font-weight:600; color:#161616; }
.ngh-ap-header .ngh-ap-action:hover { color:#ff7100; background:#fff7ef; }
.ngh-ap-header .ngh-ap-action svg { width:25px; height:25px; fill:none; stroke:currentColor; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round; }
.ngh-ap-header .ngh-ap-action-label { font-size:11px; line-height:1.1; }
.ngh-ap-header .ngh-ap-badge { position:absolute; top:-3px; right:-4px; min-width:18px; height:18px; padding:0 4px; border-radius:18px; display:flex; align-items:center; justify-content:center; background:#ff7100; color:white; font-size:10px; font-weight:800; line-height:1; box-shadow:0 2px 4px rgba(255,113,0,.18); }
.ngh-ap-header .ngh-ap-bottom-nav { display:block !important; background:#111112; color:#fff; height:auto; min-height:56px; padding:0; position:relative; }
.ngh-ap-header .ngh-ap-nav-inner { max-width:1480px; margin:auto; padding:0 28px; display:flex; align-items:center; gap:24px; min-height:56px; }
.ngh-ap-header .ngh-ap-navlinks { display:flex; flex:1; align-items:center; gap:32px; min-width:0; height:56px; }
.ngh-ap-header .ngh-ap-navlinks > a { position:relative; display:inline-flex; align-items:center; justify-content:center; height:56px; padding:0 2px !important; font-size:14px; font-weight:700; color:#f6f6f7 !important; white-space:nowrap; border:0; }
.ngh-ap-header .ngh-ap-navlinks > a::after { content:""; position:absolute; left:0; right:0; bottom:0; height:3px; width:auto !important; background:transparent; transform:none !important; }
.ngh-ap-header .ngh-ap-navlinks > a:hover,
.ngh-ap-header .ngh-ap-navlinks > a.active,
.ngh-ap-header .ngh-ap-navlinks > a[aria-current="page"] { color:#ff8c32 !important; }
.ngh-ap-header .ngh-ap-navlinks > a:hover::after,
.ngh-ap-header .ngh-ap-navlinks > a.active::after,
.ngh-ap-header .ngh-ap-navlinks > a[aria-current="page"]::after { background:#ff7900; }
.ngh-ap-header .ngh-ap-categories { align-self:stretch; display:flex; align-items:center; position:relative; flex:none; }
.ngh-ap-header .ngh-ap-categories > summary { list-style:none; display:flex; align-items:center; gap:10px; min-height:42px; padding:0 19px; border-radius:9px; background:#ff7900; color:#fff; font-weight:800; font-size:14px; white-space:nowrap; user-select:none; cursor:pointer; }
.ngh-ap-header .ngh-ap-categories > summary::-webkit-details-marker { display:none; }
.ngh-ap-header .ngh-ap-categories > summary:hover,
.ngh-ap-header .ngh-ap-categories[open] > summary { background:#ea6a00; }
.ngh-ap-header .ngh-ap-categories > summary svg { width:17px; height:17px; flex:none; }
.ngh-ap-header .ngh-ap-cat-panel { position:absolute; top:calc(100% - 4px); left:0; min-width:226px; display:flex; flex-direction:column; gap:2px; background:#fff; color:#111; border:1px solid #e9e9e9; border-radius:13px; padding:9px; box-shadow:0 14px 32px rgba(0,0,0,.14); z-index:5; }
.ngh-ap-header .ngh-ap-cat-panel a { display:block; border-radius:7px; padding:11px 12px; font-size:13px; font-weight:700; color:#262626; }
.ngh-ap-header .ngh-ap-cat-panel a:hover { color:#f47700; background:#fff5ee; }
.ngh-ap-header .ngh-ap-mobile-drawer { display:none; }
.ngh-ap-header .ngh-ap-backdrop { display:none; }
.ngh-ap-header a:focus-visible,
.ngh-ap-header button:focus-visible,
.ngh-ap-header summary:focus-visible { outline:3px solid rgba(255,122,0,.42); outline-offset:2px; }
@media(max-width:1150px) and (min-width:861px) {
  .ngh-ap-header .ngh-ap-top-row { grid-template-columns:40px 170px minmax(160px,1fr) auto; gap:13px; padding-left:20px; padding-right:20px; }
  .ngh-ap-header .ngh-ap-logo-main { font-size:33px; }
  .ngh-ap-header .ngh-ap-logo-sub { font-size:9px; letter-spacing:3px; }
  .ngh-ap-header .ngh-ap-actions { gap:10px; }
  .ngh-ap-header .ngh-ap-nav-inner { padding:0 20px; gap:18px; }
  .ngh-ap-header .ngh-ap-navlinks { gap:23px; }
}
@media(max-width:860px) {
  .ngh-ap-announcement .ngh-ap-ann-row { min-height:28px; padding:7px 14px; justify-content:center; font-size:11px; text-align:center; }
  .ngh-ap-announcement .ngh-ap-ann-benefits span:not(:first-child),
  .ngh-ap-announcement .ngh-ap-ann-region { display:none; }
  .ngh-ap-header .ngh-ap-top-row { min-height:104px; padding:10px 14px 12px; display:grid; grid-template-columns:38px minmax(95px,1fr) auto; grid-template-areas:"menu logo actions" "search search search"; gap:8px 12px; }
  .ngh-ap-header .ngh-ap-menu-btn { grid-area:menu; width:36px; min-width:36px; height:36px; padding:5px; }
  .ngh-ap-header .ngh-ap-logo { grid-area:logo; }
  .ngh-ap-header .ngh-ap-logo-main { font-size:30px; letter-spacing:-2px; }
  .ngh-ap-header .ngh-ap-logo-sub { font-size:7.5px; letter-spacing:3.3px; margin-top:5px; }
  .ngh-ap-header .ngh-ap-actions { grid-area:actions; gap:9px; }
  .ngh-ap-header .ngh-ap-action { min-width:29px; min-height:34px; width:32px; height:34px; padding:2px; }
  .ngh-ap-header .ngh-ap-action svg { width:23px; height:23px; }
  .ngh-ap-header .ngh-ap-action-label { display:none; }
  .ngh-ap-header .ngh-ap-badge { top:-4px; right:-5px; min-width:16px; height:16px; font-size:9px; }
  .ngh-ap-header .ngh-ap-search { grid-area:search; justify-self:stretch; width:100%; max-width:none !important; height:39px !important; border-radius:10px; }
  .ngh-ap-header .ngh-ap-search input { font-size:12px; padding:0 12px; }
  .ngh-ap-header .ngh-ap-search button { min-width:43px; width:43px; border-radius:8px; }
  .ngh-ap-header .ngh-ap-search svg { width:18px; height:18px; }
  .ngh-ap-header .ngh-ap-bottom-nav { display:none !important; }
  .ngh-ap-header .ngh-ap-mobile-drawer { display:none; position:fixed !important; top:0; left:0; bottom:0; width:min(345px,86vw); max-width:100vw; height:100dvh; padding:20px 20px 28px; overflow-y:auto; overscroll-behavior:contain; background:#fff; color:#141414; box-shadow:10px 0 32px rgba(0,0,0,.2); z-index:1302; }
  .ngh-ap-header .ngh-ap-mobile-drawer.open { display:block !important; }
  .ngh-ap-header .ngh-ap-mobile-title { margin:0 0 12px; padding:0 0 16px; border-bottom:1px solid #eee; display:flex; align-items:center; justify-content:space-between; }
  .ngh-ap-header .ngh-ap-mobile-title strong { font-size:18px; }
  .ngh-ap-header .ngh-ap-mobile-title button { width:38px; height:38px; border:0; border-radius:9px; color:#333; background:#f8f8f8; font-size:23px; }
  .ngh-ap-header .ngh-ap-mobile-drawer > a { display:block; padding:13px 8px; font-size:15px; font-weight:700; color:#272727; border-bottom:1px solid #f1f1f1; }
  .ngh-ap-header .ngh-ap-mobile-drawer > a:hover,
  .ngh-ap-header .ngh-ap-mobile-drawer > a.active { color:#ff7100; background:#fff9f3; }
  .ngh-ap-header .ngh-ap-drawer-caption { display:block; padding:17px 8px 6px; font-size:11px; font-weight:800; color:#f57900; text-transform:uppercase; letter-spacing:1.4px; }
  .ngh-ap-header .ngh-ap-backdrop { display:none; position:fixed; inset:0; background:rgba(15,16,20,.40); z-index:1301; }
  .ngh-ap-header .ngh-ap-mobile-drawer.open + .ngh-ap-backdrop { display:block; }
}
@media(max-width:380px) {
  .ngh-ap-header .ngh-ap-top-row { padding:9px 10px 11px; gap:7px 7px; grid-template-columns:31px minmax(90px,1fr) auto; }
  .ngh-ap-header .ngh-ap-menu-btn { width:31px; min-width:31px; }
  .ngh-ap-header .ngh-ap-logo-main { font-size:25px; }
  .ngh-ap-header .ngh-ap-logo-sub { letter-spacing:2.2px; font-size:7px; }
  .ngh-ap-header .ngh-ap-actions { gap:5px; }
  .ngh-ap-header .ngh-ap-action { width:29px; }
  .ngh-ap-header .ngh-ap-action svg { width:21px; height:21px; }
}
@media(prefers-reduced-motion:reduce){.ngh-ap-header *{transition:none !important;}}
/* Ensure category dropdown is closed by default (native details + author CSS). */
.ngh-ap-header .ngh-ap-categories:not([open]) .ngh-ap-cat-panel { display:none; }
/* The menu button is also available on desktop. */
.ngh-ap-header .ngh-ap-mobile-drawer { position:fixed !important; top:0; left:0; bottom:0; width:min(345px,86vw); max-width:100vw; height:100dvh; padding:20px 20px 28px; overflow-y:auto; overscroll-behavior:contain; background:#fff; color:#141414; box-shadow:10px 0 32px rgba(0,0,0,.2); z-index:1302; }
.ngh-ap-header .ngh-ap-mobile-drawer.open { display:block !important; }
.ngh-ap-header .ngh-ap-mobile-title { margin:0 0 12px; padding:0 0 16px; border-bottom:1px solid #eee; display:flex; align-items:center; justify-content:space-between; }
.ngh-ap-header .ngh-ap-mobile-title strong { font-size:18px; }
.ngh-ap-header .ngh-ap-mobile-title button { width:38px; height:38px; border:0; border-radius:9px; background:#f7f7f7; font-size:22px; }
.ngh-ap-header .ngh-ap-mobile-drawer > a { display:block; padding:13px 8px; font-size:15px; font-weight:700; color:#272727; border-bottom:1px solid #f1f1f1; }
.ngh-ap-header .ngh-ap-mobile-drawer > a:hover,.ngh-ap-header .ngh-ap-mobile-drawer > a.active { color:#ff7100; background:#fff9f3; }
.ngh-ap-header .ngh-ap-drawer-caption { display:block; padding:17px 8px 6px; font-size:11px; font-weight:800; color:#f57900; text-transform:uppercase; letter-spacing:1.4px; }
.ngh-ap-header .ngh-ap-backdrop { position:fixed; inset:0; background:rgba(15,16,20,.40); z-index:1301; }
.ngh-ap-header .ngh-ap-mobile-drawer.open + .ngh-ap-backdrop { display:block; }
