const DS=window.GuiaDiabeteDesignSystem_9d1af3;
const { Button, IconButton, Icon, Input } = DS;
// resolves ShareBar at render time, so a not-yet-recompiled bundle degrades to nothing instead of crashing
function Share(props){ const C=DS.ShareBar; return C?<C {...props}/>:null; }
function useBreak(q){
  const [on,setOn]=React.useState(()=>window.matchMedia(q).matches);
  React.useEffect(()=>{const m=window.matchMedia(q),h=e=>setOn(e.matches);m.addEventListener('change',h);setOn(m.matches);return()=>m.removeEventListener('change',h)},[q]);
  return on;
}
const SITE_FALLBACK='https://www.alemdoacucar.blog.br/';
// Builds the link to share from wherever this page is actually running.
// file:// and blob: URLs cannot be opened by anyone else, so those fall back to the example domain.
function shareUrl(path){
  try{
    const p=location.protocol;
    if(p==='http:'||p==='https:'){
      if(window.__PATH_MODE) return location.origin+'/'+(path?path.replace(/\/+$/,'')+'/':'');
      const base=location.origin+location.pathname+location.search;
      return base+(path?'#/'+path:'');
    }
  }catch(e){}
  return SITE_FALLBACK+(path||'');
}
const useMobile=()=>useBreak('(max-width:1060px)');
const useNarrow=()=>useBreak('(max-width:600px)');
const SHELL_NAV=[["tipos","Tipos de diabete"],["socorros","Primeiros socorros"],["escola","Na escola"],["criancas","Para crianças"],["receitas","Receitas"],["projeto","O projeto"]];
function Header({route,go}){
  const [open,setOpen]=React.useState(false);
  const [menu,setMenu]=React.useState(false);
  const mobile=useMobile(),narrow=useNarrow();
  React.useEffect(()=>{setMenu(false);setOpen(false)},[route]);
  return <header style={{position:'sticky',top:0,zIndex:40,background:'rgba(251,252,251,.94)',backdropFilter:'var(--blur-overlay)',WebkitBackdropFilter:'var(--blur-overlay)',borderBottom:'1px solid var(--line-hairline)'}}>
    <div style={{maxWidth:'var(--width-max)',margin:'0 auto',padding:'0 var(--gutter-page-lg)',height:mobile?68:72,display:'flex',alignItems:'center',gap:mobile?'var(--space-5)':'var(--space-9)'}}>
      <a href="#" onClick={e=>{e.preventDefault();go('home')}} style={{fontFamily:'var(--font-ui)',fontSize:mobile?19:22,fontWeight:'var(--fw-semibold)',letterSpacing:'-0.02em',color:'var(--teal-700)',textDecoration:'none',flex:'0 0 auto',marginRight:'auto'}}>Além do <span style={{fontWeight:'var(--fw-light)',color:'var(--ink-400)'}}>Açúcar</span></a>
      {!mobile&&<nav style={{display:'flex',gap:'var(--space-7)',flex:'1 1 auto',minWidth:0,overflowX:'auto'}}>
        {SHELL_NAV.map(([id,l])=><a key={id} href="#" onClick={e=>{e.preventDefault();go(id)}} style={{fontFamily:'var(--font-ui)',fontSize:15,fontWeight:route===id?'var(--fw-semibold)':'var(--fw-medium)',color:route===id?'var(--text-strong)':'var(--text-muted)',textDecoration:'none',whiteSpace:'nowrap'}}>{l}</a>)}
      </nav>}
      <div style={{display:'flex',alignItems:'center',gap:'var(--space-4)',flex:'0 0 auto'}}>
        {open&&!mobile&&<form onSubmit={e=>{e.preventDefault();go('busca',null,e.target.q.value)}} style={{width:230}}><Input name="q" icon="search" placeholder="Buscar artigos…" autoFocus/></form>}
        <IconButton icon={open&&!mobile?'x':'search'} label="Buscar" size={mobile?'lg':'md'} onClick={()=>mobile?go('busca'):setOpen(!open)}/>
        {narrow
          ? <IconButton icon="phone-call" label="Emergência: ligar 192" variant="solid" size="lg" onClick={()=>go('socorros')} style={{background:'var(--coral-500)',border:'1px solid var(--coral-500)'}}/>
          : <Button size="sm" variant="urgent" icon="phone-call" onClick={()=>go('socorros')}>Emergência</Button>}
        {mobile&&<IconButton icon={menu?'x':'menu'} label="Menu" variant="outline" size="lg" onClick={()=>setMenu(!menu)}/>}
      </div>
    </div>
    {mobile&&menu&&<nav style={{borderTop:'1px solid var(--line-hairline)',background:'var(--surface-card)',padding:'var(--space-5) var(--gutter-page-lg) var(--space-7)',display:'flex',flexDirection:'column'}}>
      {[...SHELL_NAV,['sobre','Sobre']].map(([id,l])=><a key={id} href="#" onClick={e=>{e.preventDefault();go(id)}} style={{display:'flex',alignItems:'center',justifyContent:'space-between',minHeight:48,fontFamily:'var(--font-ui)',fontSize:17,fontWeight:route===id?'var(--fw-semibold)':'var(--fw-medium)',color:route===id?'var(--text-strong)':'var(--text-body)',textDecoration:'none',borderBottom:'1px solid var(--line-hairline)'}}>{l}<Icon name="chevron-right" size={16} color="var(--text-faint)"/></a>)}
    </nav>}
  </header>;
}
const SHELL_FOOTER=[['Conteúdo',[['tipos','Tipos de diabete'],['socorros','Primeiros socorros'],['escola','Na escola'],['criancas','Para crianças'],['receitas','Receitas']]],
 ['Sobre',[['projeto','O projeto'],['sobre','Quem revisa'],['sobre','Como escrevemos'],['sobre','Contato'],['ext:https://www.instagram.com/alemdoacucar15','Instagram'],['ext:https://lacos-vida-leve.base44.app','Laços Vida Leve']]],
 ['Emergência',[['socorros','Hipoglicemia'],['socorros','Hiperglicemia'],['socorros','Cetoacidose'],['socorros','Ligar 192']]]];
function Footer({go}){
  return <footer style={{marginTop:'var(--section-gap)',borderTop:'1px solid var(--line-hairline)',background:'var(--surface-sunken)'}}>
    <div style={{maxWidth:'var(--width-max)',margin:'0 auto',padding:'var(--space-11) var(--gutter-page-lg)',display:'grid',gridTemplateColumns:'repeat(auto-fit,minmax(180px,1fr))',gap:'var(--space-10)'}}>
      <div style={{display:'flex',flexDirection:'column',gap:'var(--space-5)'}}>
        <a href="#" onClick={e=>{e.preventDefault();go('home')}} style={{fontFamily:'var(--font-ui)',fontSize:19,fontWeight:'var(--fw-semibold)',color:'var(--teal-700)',textDecoration:'none'}}>Além do <span style={{fontWeight:'var(--fw-light)',color:'var(--ink-400)'}}>Açúcar</span></a>
        <p style={{fontFamily:'var(--font-editorial)',fontSize:'var(--fs-body-sm)',lineHeight:'var(--lh-body-sm)',color:'var(--text-muted)',maxWidth:'var(--measure-narrow)'}}>Conteúdo informativo sobre diabete, revisado por profissionais de saúde. Não substitui consulta médica.</p>
      </div>
      {SHELL_FOOTER.map(([t,items])=>
        <div key={t} style={{display:'flex',flexDirection:'column',gap:'var(--space-5)'}}>
          <span className="eyebrow">{t}</span>
          {items.map(([r,l])=>r.startsWith('ext:')
            ? <a key={l} href={r.slice(4)} target="_blank" rel="noopener noreferrer" style={{display:'inline-flex',alignItems:'center',gap:5,fontFamily:'var(--font-ui)',fontSize:'var(--fs-body-sm)',color:'var(--text-body)',textDecoration:'none'}}>{l}<Icon name="external-link" size={12} color="var(--text-faint)"/></a>
            : <a key={l} href="#" onClick={e=>{e.preventDefault();go(r)}} style={{fontFamily:'var(--font-ui)',fontSize:'var(--fs-body-sm)',color:'var(--text-body)',textDecoration:'none'}}>{l}</a>)}
        </div>)}
    </div>
    <div style={{borderTop:'1px solid var(--line-hairline)',padding:'var(--space-6) var(--gutter-page-lg)',maxWidth:'var(--width-max)',margin:'0 auto',display:'flex',flexWrap:'wrap',gap:'var(--space-5)',justifyContent:'space-between',fontFamily:'var(--font-ui)',fontSize:'var(--fs-caption)',color:'var(--text-faint)'}}>
      <span>Última revisão editorial: agosto de 2026</span>
      <a href="#" onClick={e=>{e.preventDefault();go('home-hero')}} style={{color:'var(--text-faint)',textDecoration:'none'}}>Home (versão hero)</a>
      <a href="#" onClick={e=>{e.preventDefault();go('sobre')}} style={{color:'var(--text-faint)',textDecoration:'none'}}>Sobre o Além do Açúcar</a>
    </div>
  </footer>;
}
function ensurePrintStyles(){
  if(document.getElementById('__print_styles')) return;
  const st=document.createElement('style');st.id='__print_styles';
  st.textContent='@media print{header,footer,nav,[data-no-print]{display:none !important}main{padding:0 !important}body{background:#fff !important}a[href]:after{content:""}*{box-shadow:none !important}}';
  document.head.appendChild(st);
}
function printPage(){ensurePrintStyles();window.print()}
function Page({children,route,go}){
  React.useEffect(ensurePrintStyles,[]);
  return <div style={{minHeight:'100vh',background:'var(--surface-page)'}}><Header route={route} go={go}/><main>{children}</main><Footer go={go}/></div>;
}
function Container({children,width='var(--width-wide)',style}){
  return <div style={{maxWidth:width,margin:'0 auto',padding:'0 var(--gutter-page-lg)',...style}}>{children}</div>;
}
function Breadcrumb({items=[],go}){
  return <nav style={{display:'flex',flexWrap:'wrap',alignItems:'center',gap:'var(--space-4)',marginBottom:'var(--space-6)'}}>
    {items.map(([r,l],i)=><React.Fragment key={l}>
      {i>0&&<Icon name="chevron-right" size={13} color="var(--text-faint)"/>}
      {r?<a href="#" onClick={e=>{e.preventDefault();go(r)}} style={{fontFamily:'var(--font-ui)',fontSize:'var(--fs-caption)',color:'var(--text-muted)',textDecoration:'none'}}>{l}</a>
        :<span style={{fontFamily:'var(--font-ui)',fontSize:'var(--fs-caption)',color:'var(--text-faint)'}}>{l}</span>}
    </React.Fragment>)}
  </nav>;
}
Object.assign(window,{Header,Footer,Page,Container,Breadcrumb,Share,useMobile,useNarrow,useBreak,shareUrl,printPage});
