const DAYS=[['Mon',12],['Tue',13],['Wed',14],['Thu',15],['Fri',16],['Sat',17],['Sun',18]].map(([d,n],i)=>({d,n,we:i>4}));
const ALL_SLOTS=(()=>{const a=[];for(let h=7;h<=19;h++){for(const m of[0,30]){if(h===7&&m===0)continue;if(h===19&&m===30){a.push('19:30');break}a.push(String(h).padStart(2,'0')+':'+(m?'30':'00'))}}return a})();
function slotsFor(clin,day){if(clin==='zuzanna'&&day<2)return[];const seed=(clin.length*7+day*13)%5;return ALL_SLOTS.filter((_,i)=>(i+seed)%3===0||(i+seed)%7===0)}

const SESSION_TYPES={first:{t:'Introduction',min:()=>PD.PRICING.introMinutes,mult:0},continue:{t:'Session',min:()=>PD.PRICING.sessionMinutes,mult:1},debrief:{t:'Energy Load Index debrief',min:()=>25,mult:0.5},cofounder:{t:'Co-founder session',min:()=>PD.PRICING.coFounderMinutes,mult:PD.PRICING.coFounderMultiplier}};
const sessionLabel=k=>{const x=SESSION_TYPES[k]||SESSION_TYPES.continue;return x.t+', '+x.min()+' minutes'};
const sessionPrice=(k,c)=>{const x=SESSION_TYPES[k]||SESSION_TYPES.continue;return x.mult?PD.priceLabel(c,x.mult):'Free'};
function Booking({q}){const[s,set]=useStore();const returning=!!(s.booking||q.clin);
 const[step,setStep]=useState(+q.step||(q.type?3:1));const[type,setType]=useState(q.type||'first');const[clin,setClin]=useState(q.clin||(+q.step>=3?'steven':null));
 const[day,setDay]=useState(q.soon?0:0);const[slot,setSlot]=useState(q.soon?'16:30':(+q.step>=3&&(!q.clin||q.clin==='steven')?'11:00':null));const[lang,setLang]=useState('English');const[phone,setPhone]=useState('+351 ');const[modal,setModal]=useState(+q.step===4);const[co2,setCo2]=useState('');const[done,setDone]=useState(false);
 useEffect(()=>{if(q.step)setStep(+q.step)},[q.step]);
 const c=clin?PD.clin(clin):null;
 const slots0=c?(q.soon&&day===0?['16:30','17:00',...slotsFor(clin,day).filter(x=>x>'17:00')]:slotsFor(clin,day)):[];const slots=type==='cofounder'?slots0.filter((t,i)=>i%2===0&&t<='18:00'):slots0;const coOk=type!=='cofounder'||/\S+@\S+\.\S+/.test(co2);
 const steps=['Choose session','Clinician','Time','Confirm'];
 const Crumb=()=><nav className="crumb" aria-label="Booking steps">{steps.map((l,i)=><React.Fragment key={l}>{i>0&&<Icon n="chev" s={12}/>}<span className={i+1<step?'done':i+1===step?'cur':''}>{i+1<step&&<Icon n="check" s={13} w={2.2}/>}{l}</span></React.Fragment>)}</nav>;
 const phoneOk=/^\+\d{1,3}\s?\d[\d\s]{7,}$/.test(phone.trim());
 const confirm=()=>{const dd=DAYS[day];set({booking:{clin,type,date:`${dd.d} ${dd.n} Oct 2026`,time:slot,lang,co2:type==='cofounder'?co2:undefined}});setModal(false);setDone(true)};
 if(done){const b=store.s.booking;return <div style={{minHeight:'100vh',display:'grid',placeItems:'center',padding:'40px 20px'}}><div style={{maxWidth:620,width:'100%'}} className="reveal"><div style={{textAlign:'center'}}><Logo href="#/app"/><h1 className="h1" style={{marginTop:36}}>Booked.</h1><p className="lead" style={{margin:'12px auto 0'}}>A confirmation is in your inbox. You will find this session under My sessions.</p></div>
 <div className="card float" style={{marginTop:32,padding:28}}><div style={{display:'flex',gap:18}}><div style={{width:72,flex:'none'}}><Portrait c={c} size={72} radius={12}/></div><div><p className="serif" style={{fontSize:24,lineHeight:1.2}}>{SESSION_TYPES[type].t} with {c.name}</p><p className="small" style={{color:'var(--ink2)',marginTop:4}}>{c.bio?c.bio.split('.')[0]+'.':c.works} <a href={'#/clinicians/'+c.id}>Read {c.id==='zuzanna'?'her':c.rep?'the':'his'} full profile.</a></p></div></div>
 <hr style={{border:0,borderTop:'1px solid var(--border2)',margin:'20px 0'}}/><span className="tiny" style={{textTransform:'uppercase',letterSpacing:2,fontWeight:600}}>Time and date</span><p style={{marginTop:4}}>{b.date} at {b.time} (Europe/Lisbon), {SESSION_TYPES[type].min()} minutes</p>{type==='cofounder'&&b.co2&&<p className="small" style={{marginTop:4}}>Invitation sent to {b.co2}</p>}
 <CalMenu/><hr style={{border:0,borderTop:'1px solid var(--border2)',margin:'20px 0'}}/><p style={{fontSize:14}}>Language: {b.lang}</p><p style={{fontSize:14}}>{type==='first'?'Cost to you: €0. The introduction is free.':'Your share: shown before you confirm.'}</p><p className="small" style={{marginTop:4}}>If it does not fit, the next introduction is on us.</p>
 <p className="small" style={{marginTop:14}}>Need to move it? Reschedule or cancel free until 24 hours before.</p></div>
 <div className="card" style={{marginTop:16,padding:20}}><span className="chip chip-out">Optional</span><p style={{fontSize:15,fontWeight:600,marginTop:8}}>Take the Energy Load Index before your first paid session.</p><p className="small" style={{marginTop:4}}>We measure it again after your sixth. You see the change. Your investor never does.</p><p style={{marginTop:10,fontSize:14}}><a href="#/app/index">Take the Index</a></p></div><div className="row" style={{justifyContent:'center',marginTop:24}}><Btn href="#/app/sessions">Go to My sessions</Btn></div></div></div>}
 return <AppShell active="find"><div style={{maxWidth:820,margin:'0 auto'}}><Crumb/>
 {step===1&&<><h1 className="q" style={{fontSize:'clamp(28px,3vw,36px)'}}>What kind of session?</h1><p className="hint">Not sure? Start with the first one.</p>
 <div style={{display:'grid',gap:10,marginTop:24}}>{[['first','spark','First session with a psychologist','A free 15-minute introduction to check the fit.'],['cofounder','users','Co-founder session','Both co-founders with one psychologist. 80 minutes.'],...(s.booking?[['continue','redo','Continue with '+PD.clin(s.booking.clin).name,'Same person, no re-explaining.']]:[]),['debrief','gauge','Energy Load Index debrief','Twenty-five minutes to go through your result and decide what to do with it.']].map(([k,ic,t,d])=><button key={k} className={'srow'+(type===k?' on':'')} onClick={()=>{setType(k);if(k==='continue'){setClin(s.booking.clin);setStep(3)}else setStep(2)}}><span className="stile"><Icon n={ic} s={22}/></span><span style={{flex:1}}><b style={{fontWeight:600,display:'block'}}>{t}</b><span className="small" style={{color:'var(--ink2)'}}>{d}</span></span><span className="small" style={{whiteSpace:'nowrap',color:'var(--ink2)'}}>{sessionPrice(k,k==='continue'?PD.clin(s.booking.clin):null)}</span><Icon n="chev" s={18}/></button>)}</div>
 <p className="small" style={{marginTop:24,display:'flex',gap:8}}><Icon n="shield" s={15}/>Your fund never sees that you booked.</p></>}
 {step===2&&<><h1 className="q" style={{fontSize:'clamp(28px,3vw,36px)'}}>Who would you like to see?</h1><p className="hint">Your three matches from the intake.</p>
 <div className="grid3" style={{marginTop:24}}>{MATCHES.map(m=>{const cc=PD.clin(m.id);return <div key={m.id} className="card cl-card" style={{borderColor:clin===m.id?'var(--green)':undefined}}><div style={{display:'grid',gridTemplateColumns:'64px minmax(0,1fr)',gap:12,alignItems:'center'}}><Portrait c={cc}/><div><b className="serif" style={{fontSize:22,fontWeight:500}}>{cc.name}</b><p className="tiny">{cc.city}</p></div></div><p className="reason">{m.r1}</p><p className="reason p">{m.r2}</p><Btn sm onClick={()=>{setClin(m.id);setStep(3)}} style={{marginTop:'auto'}}>Choose {cc.name.split(' ')[0]}</Btn></div>})}</div>
 <p style={{marginTop:20}}><a href="#/clinicians">Browse the whole network instead</a></p></>}
 {step===3&&c&&<><h1 className="q" style={{fontSize:'clamp(28px,3vw,36px)'}}>Pick a day and a time</h1><p className="hint">Times shown are your clinician's actual availability.</p>
 <div style={{marginTop:24}}><div className="week"><div className="week-top"><button aria-label="Previous week"><Icon n="chevl" s={14}/></button><span>Mon 12 Oct, week 42</span><button aria-label="Next week"><Icon n="chev" s={14}/></button></div>
 <div className="days">{DAYS.map((d,i)=><button key={d.d} className={'day'+(d.we?' we':'')+(day===i?' on':'')} onClick={()=>{setDay(i);setSlot(null)}}>{d.d}<b>{d.n}</b></button>)}</div></div>
 <div className="cal-panel"><div className="row" style={{justifyContent:'space-between',marginBottom:18,gap:10}}><div className="row" style={{gap:16,fontSize:13,color:'var(--ink2)'}}><span><b style={{fontWeight:600}}>{SESSION_TYPES[type].t+', '+SESSION_TYPES[type].min()+' min'}</b> with {c.name}</span><span className="row" style={{gap:6}}><Icon n="globe" s={15}/>{lang}</span></div><span className="chip">(UTC+1:00) Lisbon</span></div>
 {slots.length?<div className="slots">{slots.map(t=><button key={t} className={'slot'+(slot===t?' on':'')} onClick={()=>setSlot(t)}>{t}</button>)}</div>
 :<div className="inline-note">Nothing within 24 hours with this psychologist. Two others with similar experience have an introduction slot tomorrow. <button className="tlink" onClick={()=>{setClin('mariana');setDay(1)}}>See them</button></div>}
 <div style={{marginTop:24}}><span className="lbl">Session language</span><div className="lang-pills" style={{marginTop:8}}>{['English','Português'].map(l=>{const can=c.langs.includes(l);return can?<button key={l} className={'fchip'+(lang===l?' on':'')} onClick={()=>setLang(l)}>{l}</button>:null})}</div><p className="tiny" style={{marginTop:8}}>Need another language? <a href="mailto:hello@pausa.pt">Tell us and we will look.</a></p></div></div></div>
 <div className="sticky-cta"><Btn disabled={!slot} onClick={()=>setModal(true)}>Book session</Btn></div></>}
 </div>
 {modal&&<div className="scrim"><div className="modal" role="dialog" aria-modal="true" aria-labelledby="ph-t" style={{maxWidth:460}}><h2 id="ph-t" className="serif" style={{fontSize:28,fontWeight:400}}>One detail before we book</h2><p className="body" style={{marginTop:10,fontSize:14}}>A mobile number lets us send a reminder two hours before. It is used for nothing else, and it never reaches your fund.</p>
 <div className="field" style={{marginTop:18}}><label htmlFor="ph">Mobile number</label><input id="ph" className="inp" inputMode="tel" value={phone} onChange={e=>setPhone(e.target.value)} placeholder="+351 912 345 678" autoFocus/></div>
 {type==='cofounder'&&<div className="field" style={{marginTop:14}}><label htmlFor="co2">Your co-founder's email</label><input id="co2" className="inp" type="email" value={co2} onChange={e=>setCo2(e.target.value)} placeholder="name@company.com"/><p className="tiny" style={{marginTop:6}}>They receive their own invitation.</p></div>}<p className="small" style={{marginTop:14}}>{type==='first'?'The introduction is free.':'Price: '+sessionPrice(type,c)+'. Your share is shown before you confirm.'} If it does not fit, the next introduction is on us.</p>
 <div className="row" style={{justifyContent:'flex-end',marginTop:22}}><button className="btn btn-ghost btn-sm" onClick={()=>setModal(false)}>Cancel</button><Btn sm disabled={!phoneOk||!slot||!coOk} onClick={confirm} arrow={false}>Confirm</Btn></div></div></div>}
 </AppShell>}
function CalMenu(){const[o,setO]=useState(false);return <div style={{position:'relative',marginTop:14,display:'inline-block'}}><button className="btn btn-sm" onClick={()=>setO(!o)} style={{background:'var(--green-l)',color:'var(--green)'}}>Add to calendar<Icon n="chevd" s={14}/></button>{o&&<div className="menu" style={{left:0,right:'auto'}}>{['Google','Apple','Outlook','.ics file'].map(l=><button key={l} onClick={()=>setO(false)}>{l}</button>)}</div>}</div>}

Object.assign(window,{Booking,CalMenu,SESSION_TYPES,sessionLabel,sessionPrice});