/* NIAWELL V69 — one coherent, accessible header/hero interaction layer. */
body.public-site #main-header.site-header{position:sticky!important;top:0!important;z-index:4000!important;overflow:visible!important;isolation:isolate;}
body.public-site #main-header.site-header .content,
body.public-site #main-header.site-header .buttons,
body.public-site #main-header.site-header .bottom{overflow:visible!important;}
body.public-site #main-header.site-header .products-nav-shell{position:static!important;}
body.public-site #main-header.site-header [data-products-trigger]{display:inline-flex;align-items:center;gap:7px;border:0;cursor:pointer;font:inherit;}
body.public-site #main-header.site-header .product-mega{z-index:4100!important;}
/* The old theme targeted only .products-nav-shell > a; V69 uses a button. */
body.public-site #main-header.site-header .products-nav-shell > [data-products-trigger]{
 min-height:42px;padding:8px 13px;border-radius:11px;background:transparent;
 color:#465163;font-weight:800;font-size:.82rem;line-height:1.3;
 text-decoration:none;transition:background-color .2s,color .2s;
}
body.public-site #main-header.site-header .products-nav-shell > [data-products-trigger]:hover,
body.public-site #main-header.site-header .products-nav-shell > [data-products-trigger][aria-expanded="true"]{
 background:#fff0f0;color:#a9222b;
}
body.public-site #main-header.site-header .products-nav-shell > [data-products-trigger] > i:first-child{width:22px;min-width:22px;display:inline-grid;place-items:center;}
@media(max-width:760px){body.public-site #main-header.site-header .products-nav-shell > [data-products-trigger]{width:100%;min-height:52px;justify-content:flex-start;padding:11px 14px;font-size:.93rem;}}
@media(min-width:761px){
 /* Native hover fallback also works when scripts are blocked or delayed. */
 body.public-site #main-header.site-header .products-nav-shell:hover .product-mega,
 html:not([data-niawell-ui='v69']) body.public-site #main-header.site-header .products-nav-shell:focus-within .product-mega,
 body.public-site #main-header.site-header .product-mega.is-open{
   display:block!important;opacity:1!important;visibility:visible!important;pointer-events:auto!important;
 }
 html[data-niawell-ui='v69'] body.public-site #main-header.site-header .products-nav-shell:not(:hover) .product-mega:not(.is-open),
 body.public-site #main-header.site-header .products-nav-shell:not(:hover):not(:focus-within) .product-mega:not(.is-open){
   display:none!important;opacity:0!important;visibility:hidden!important;pointer-events:none!important;
 }
}
body.public-site #main-header.site-header .product-mega__tab{display:flex!important;cursor:pointer!important;pointer-events:auto!important;text-decoration:none;}
body.public-site #main-header.site-header .product-mega__panel a{pointer-events:auto!important;}
/* A real details/summary profile menu: no JavaScript prerequisite. */
body.public-site #main-header.site-header details.header-panel-menu--native{display:flex;position:relative;z-index:4300!important;}
body.public-site #main-header.site-header details.header-panel-menu--native > summary{display:flex!important;list-style:none!important;cursor:pointer!important;user-select:none;}
body.public-site #main-header.site-header details.header-panel-menu--native > summary::-webkit-details-marker{display:none;}
body.public-site #main-header.site-header details.header-panel-menu--native:not([open]) .header-panel-menu__dropdown{display:none!important;}
body.public-site #main-header.site-header details.header-panel-menu--native[open] .header-panel-menu__dropdown{
 display:grid!important;visibility:visible!important;opacity:1!important;pointer-events:auto!important;z-index:4400!important;gap:4px!important;
}
body.public-site #main-header.site-header details.header-panel-menu--native[open] > summary{border-color:#d63f3e;color:#d63f3e;}
@media(max-width:760px){
 body.public-site #main-header.site-header details.header-panel-menu--native{display:flex!important;min-width:44px;}
 body.public-site #main-header.site-header details.header-panel-menu--native .header-panel-menu__dropdown{position:absolute!important;top:calc(100% + 8px)!important;width:min(290px,calc(100vw - 24px))!important;}
 body.public-site #main-header.site-header .product-mega.is-open{display:block!important;opacity:1!important;visibility:visible!important;pointer-events:auto!important;}
}
/* Hero controls must be above the slide overlay and remain independently clickable. */
body.home-page .home-hero--classic .home-hero__controls--classic{z-index:220!important;pointer-events:none!important;}
body.home-page .home-hero--classic .home-hero__dots,
body.home-page .home-hero--classic .home-hero__arrows,
body.home-page .home-hero--classic .home-hero__dots button,
body.home-page .home-hero--classic .home-hero__arrows button{pointer-events:auto!important;cursor:pointer!important;touch-action:manipulation!important;}
body.home-page .home-hero--classic .home-hero__arrows{display:flex!important;direction:ltr!important;justify-content:center!important;gap:6px!important;}
body.home-page .home-hero--classic .home-hero__arrows button{display:grid!important;place-items:center!important;flex:0 0 auto!important;}

/* V69 CSS-only reliable category preview: no JavaScript required for hover.
   The panel remains previewed while pointer is on its tab, and JS remembers it
   while pointer moves into the full product/model panel. */
@media (min-width:761px){
 body.public-site #main-header .product-mega__shell:has(.product-mega__tab[data-mega-tab="loadbank"]:is(:hover,:focus-visible)) .product-mega__panel,
 body.public-site #main-header .product-mega__shell:has(.product-mega__tab[data-mega-tab="power-conversion"]:is(:hover,:focus-visible)) .product-mega__panel,
 body.public-site #main-header .product-mega__shell:has(.product-mega__tab[data-mega-tab="industrial-parts"]:is(:hover,:focus-visible)) .product-mega__panel,
 body.public-site #main-header .product-mega__shell:has(.product-mega__tab[data-mega-tab="solar"]:is(:hover,:focus-visible)) .product-mega__panel {display:none!important;}
 body.public-site #main-header .product-mega__shell:has(.product-mega__tab[data-mega-tab="loadbank"]:is(:hover,:focus-visible)) #mega-panel-loadbank,
 body.public-site #main-header .product-mega__shell:has(.product-mega__tab[data-mega-tab="power-conversion"]:is(:hover,:focus-visible)) #mega-panel-power-conversion,
 body.public-site #main-header .product-mega__shell:has(.product-mega__tab[data-mega-tab="industrial-parts"]:is(:hover,:focus-visible)) #mega-panel-industrial-parts,
 body.public-site #main-header .product-mega__shell:has(.product-mega__tab[data-mega-tab="solar"]:is(:hover,:focus-visible)) #mega-panel-solar {display:block!important;}
}
