const {Button,IconButton}=window.SollantVietnamDesignSystem_5eabe7;
function Header({page,go}){const [open,setOpen]=React.useState(false);const C=window.SV_CONTACT;const items=[['home','Trang chủ'],['products','Sản phẩm'],['home','Ứng dụng'],['home','Về Sollant'],['contact','Liên hệ']];
return <header style={{position:'sticky',top:0,zIndex:50,background:'#fff',boxShadow:'var(--shadow-header)'}}>
<div style={{background:'var(--surface-darkest)',color:'var(--text-on-dark-muted)',font:'400 12px/1 var(--font-sans)'}}><div className="wrap" style={{display:'flex',justifyContent:'flex-end',height:32,alignItems:'center'}}><span style={{display:'flex',gap:20,alignItems:'center'}}><span style={{display:'flex',gap:8,alignItems:'center'}}><a href={C.tel} style={{color:'inherit'}}>+84 981 760 783</a><a href={C.zalo} target="_blank" rel="noopener" aria-label="Zalo" style={{color:'inherit',display:'flex'}}><ChatIcon n="zalo" s={14}/></a><a href={C.wa} target="_blank" rel="noopener" aria-label="WhatsApp" style={{color:'inherit',display:'flex'}}><ChatIcon n="whatsapp" s={14}/></a></span><a href={C.mail} className="sv-hide-m" style={{color:'inherit'}}>tahien@sollantvietnam.com</a><span style={{color:'#fff',fontWeight:700}}>VI</span><span>EN</span></span></div></div>
<div className="wrap sv-head" style={{display:'flex',alignItems:'center',height:72,gap:32}}>
<a href="#" onClick={e=>{e.preventDefault();go('home')}} style={{display:'flex',alignItems:'center',gap:10,textDecoration:'none'}}><img src={R('logo-sollant')} alt="Sollant" style={{height:44}}/><span className="sv-brandtext" style={{font:'700 13px/1 var(--font-sans)',color:'var(--text-heading)',letterSpacing:'.02em',paddingLeft:12,borderLeft:'1px solid var(--border-default)'}}>sollantvietnam.com</span></a>
<nav className={'sv-nav'+(open?' open':'')} style={{display:'flex',gap:28,marginLeft:'auto'}}>{items.map(([p,l],i)=><a key={i} href="#" onClick={e=>{e.preventDefault();setOpen(false);go(p)}} style={{whiteSpace:'nowrap',font:'700 14px/1 var(--font-sans)',color:page===p&&(i===0||i===1||i===4)?'var(--brand-accent)':'var(--text-heading)',paddingBottom:4,borderBottom:'2px solid '+(page===p&&(i===0||i===1||i===4)?'var(--brand-accent)':'transparent')}}>{l}</a>)}</nav>
<div style={{display:'flex',gap:8,alignItems:'center'}}><span className="sv-hide-m"><IconButton label="Tìm kiếm"><Icon n="Search" s={20}/></IconButton></span><span className="sv-hide-s"><Button size="sm" onClick={()=>{setOpen(false);go('contact')}}>Báo giá nhanh</Button></span><button type="button" className="sv-menu-btn" aria-label="Menu" aria-expanded={open} onClick={()=>setOpen(!open)}><Icon n={open?'X':'Menu'} s={24}/></button></div>
</div></header>}
window.Header=Header;