const { Button, Eyebrow, Disclaimer } = (window.DestravaPesoDesignSystem_3cf4d5 || {});

const NAV=[['Método','#metodo'],['O que você recebe','#o-que-voce-vai-receber'],['Dr. Valter','#sobre'],['Acesso','#acesso']];

function Header(){
  const [solid,setSolid]=React.useState(false);
  React.useEffect(()=>{const h=()=>setSolid(window.scrollY>40);window.addEventListener('scroll',h);return()=>window.removeEventListener('scroll',h)},[]);
  return <header style={{position:'sticky',top:0,zIndex:50,background:solid?'rgba(247,245,240,.94)':'transparent',backdropFilter:solid?'saturate(180%) blur(12px)':'none',borderBottom:'1px solid '+(solid?'var(--rule-hairline)':'transparent'),transition:'background var(--dur-base) var(--ease-standard),border-color var(--dur-base) var(--ease-standard)'}}>
    <div style={{maxWidth:'var(--col-wide)',margin:'0 auto',padding:'0 var(--gutter)',height:'var(--header-h)',display:'flex',alignItems:'center',justifyContent:'space-between',gap:'16px'}}>
      <a href="#topo" style={{display:'flex',alignItems:'baseline',gap:'10px',border:0,color:'var(--ink-0)',minWidth:0}}>
        <span style={{fontFamily:'var(--font-display)',fontSize:'1.25rem',lineHeight:1,whiteSpace:'nowrap'}}>Dr. Valter Cardoso</span>
        <span className="crm-tag" style={{fontFamily:'var(--font-mono)',fontSize:'.625rem',letterSpacing:'.1em',color:'var(--ink-3)',whiteSpace:'nowrap'}}>CRM 19575 BA</span>
      </a>
      <nav style={{display:'flex',alignItems:'center',gap:'28px',flexShrink:0}}>
        <ul style={{display:'none',gap:'26px',listStyle:'none',margin:0,padding:0}} className="nav-links">
          {NAV.map(([l,h])=><li key={h}><a href={h} style={{border:0,fontSize:'var(--fs-body-sm)',color:'var(--ink-1)',fontWeight:'var(--wt-medium)'}}>{l}</a></li>)}
        </ul>
        <Button href="#o-que-voce-vai-receber" size="sm">Quero meu protocolo</Button>
      </nav>
    </div>
  </header>;
}

function Footer(){
  return <footer style={{background:'var(--surface-inverse-alt)',color:'var(--text-on-inverse-muted)',padding:'clamp(56px,8vw,96px) 0 40px'}}>
    <div style={{maxWidth:'var(--col-wide)',margin:'0 auto',padding:'0 var(--gutter)',display:'grid',gap:'40px'}}>
      <div style={{display:'grid',gap:'12px'}}>
        <span style={{fontFamily:'var(--font-display)',fontSize:'clamp(1.5rem,1.3rem + 1vw,2rem)',color:'var(--text-on-inverse)',lineHeight:1.15}}>Desafio Destrava Peso</span>
        <span style={{fontSize:'var(--fs-body-sm)',lineHeight:1.6}}>Dr. Valter da Silva Cardoso Filho · Médico Radiologista · Especialista em Medicina Esportiva · CRM 19575 BA</span>
      </div>
      <div style={{display:'grid',gridTemplateColumns:'repeat(auto-fit,minmax(200px,1fr))',gap:'32px',borderTop:'1px solid var(--rule-on-inverse)',paddingTop:'36px'}}>
        <div style={{display:'grid',gap:'12px',alignContent:'start'}}>
          <Eyebrow tone="onInverse">Navegação</Eyebrow>
          {NAV.map(([l,h])=><a key={h} href={h} style={{border:0,color:'var(--text-on-inverse-muted)',fontSize:'var(--fs-body-sm)',minHeight:'32px',display:'inline-flex',alignItems:'center'}}>{l}</a>)}
        </div>
        <div style={{display:'grid',gap:'12px',alignContent:'start'}}>
          <Eyebrow tone="onInverse">Documentos</Eyebrow>
          <a href="#" style={{border:0,color:'var(--text-on-inverse-muted)',fontSize:'var(--fs-body-sm)',minHeight:'32px',display:'inline-flex',alignItems:'center'}}>Política de Privacidade</a>
          <a href="#" style={{border:0,color:'var(--text-on-inverse-muted)',fontSize:'var(--fs-body-sm)',minHeight:'32px',display:'inline-flex',alignItems:'center'}}>Termos de Uso</a>
        </div>
        <div style={{display:'grid',gap:'12px',alignContent:'start'}}>
          <Eyebrow tone="onInverse">Contato</Eyebrow>
          <a href="https://wa.me/5573999910911" style={{border:0,color:'var(--text-on-inverse-muted)',fontSize:'var(--fs-body-sm)',minHeight:'32px',display:'inline-flex',alignItems:'center'}}>WhatsApp (73) 99991-0911 · Dr. Valter</a>
          <a href="https://wa.me/5571996292706" style={{border:0,color:'var(--text-on-inverse-muted)',fontSize:'var(--fs-body-sm)',minHeight:'32px',display:'inline-flex',alignItems:'center'}}>(71) 99629-2706 · Dra. Camila Porto</a>
        </div>
      </div>
      <div style={{borderTop:'1px solid var(--rule-on-inverse)',paddingTop:'28px',display:'grid',gap:'18px'}}>
        <Disclaimer tone="onInverse">Este material tem caráter educativo e não substitui consulta médica individualizada. Resultados variam de pessoa para pessoa e dependem da adesão ao protocolo.</Disclaimer>
        <span style={{fontFamily:'var(--font-mono)',fontSize:'var(--fs-caption)',color:'var(--moss-300)'}}>© 2026 Desafio Destrava Peso · Todos os direitos reservados</span>
      </div>
    </div>
  </footer>;
}
function MediaPanel({children,caption,style}){
  return <figure style={{margin:0,position:'relative',display:'grid',gap:'14px',...style}}>
    <div style={{position:'relative'}}>
      <div aria-hidden="true" className="panel-moss" style={{position:'absolute',inset:'10% -5% -5% 10%',background:'var(--moss-800)'}} />
      <div aria-hidden="true" className="panel-line" style={{position:'absolute',inset:'7% -2% -2% 13%',border:'1px solid var(--moss-300)',pointerEvents:'none'}} />
      <div style={{position:'relative',border:'1px solid var(--rule-strong)',overflow:'hidden',background:'var(--paper-0)'}}>{children}</div>
    </div>
    {caption&&<figcaption style={{fontSize:'var(--fs-caption)',lineHeight:1.5,color:'var(--text-muted)',maxWidth:'44ch'}}>{caption}</figcaption>}
  </figure>;
}
function WhatsAppFab(){
  const [show,setShow]=React.useState(false);
  React.useEffect(()=>{
    const onScroll=()=>{
      const past=window.scrollY>500;
      const acesso=document.getElementById('acesso');
      let overAcesso=false;
      if(acesso){const r=acesso.getBoundingClientRect();overAcesso=r.top<window.innerHeight&&r.bottom>0}
      setShow(past&&!overAcesso);
    };
    window.addEventListener('scroll',onScroll,{passive:true});onScroll();
    return()=>window.removeEventListener('scroll',onScroll);
  },[]);
  return <a href="https://wa.me/5573999910911?text=Ol%C3%A1%2C+Dr.+Valter!+Tenho+interesse+no+Desafio+Destrava+Peso."
    aria-label="Tirar dúvidas no WhatsApp"
    style={{position:'fixed',right:'18px',bottom:'18px',zIndex:60,display:'inline-flex',alignItems:'center',gap:'10px',minHeight:'var(--tap-min)',padding:'11px 16px',background:'var(--paper-0)',color:'var(--ink-0)',border:'1px solid var(--rule-strong)',borderRadius:'var(--radius-2)',boxShadow:'var(--shadow-lift)',fontFamily:'var(--font-body)',fontSize:'var(--fs-caption)',fontWeight:'var(--wt-semibold)',opacity:show?1:0,transform:show?'none':'translateY(8px)',pointerEvents:show?'auto':'none',transition:'opacity var(--dur-base) var(--ease-standard),transform var(--dur-base) var(--ease-standard)'}}>
    <span aria-hidden="true" style={{width:'8px',height:'8px',borderRadius:'999px',background:'var(--moss-600)'}}></span>
    Dúvidas? WhatsApp
  </a>;
}
Object.assign(window,{Header,Footer,NAV,MediaPanel,WhatsAppFab});