/* ===== Archivio ===== */
const ArchivioView = ({data, onOpen, onRestore, onBack}) => {
  const archived = (data.cantieri||[]).filter(c => c.archived);

  const tipoLabel = c => {
    if(c.fase === 'cantiere') return null;
    return c.tipo === 'gara' ? 'Gara' : 'Preventivo diretto';
  };

  return (
    <div className="app-body no-right">
      <div className="content">
        <div className="page fade">
          <button className="back" onClick={onBack}><Icon name="arrowL" size={16}/> Home</button>
          <div style={{marginTop:20,marginBottom:24,display:'flex',alignItems:'center',gap:12}}>
            <h2 style={{fontFamily:'var(--ff)',fontWeight:700,fontSize:22,color:'var(--ink)',margin:0}}>Archivio</h2>
            {archived.length>0&&<span className="badge">{archived.length}</span>}
          </div>

          {archived.length===0
            ? <div className="card panel" style={{textAlign:'center',padding:'48px 24px'}}>
                <div style={{fontSize:28,marginBottom:12,opacity:.3}}>🗄</div>
                <div style={{fontSize:14,color:'var(--ink3)'}}>Nessun elemento archiviato</div>
              </div>
            : <div style={{display:'flex',flexDirection:'column',gap:10}}>
                {archived.map(c=>{
                  const tl = tipoLabel(c);
                  return (
                    <div key={c.id} className="card" style={{padding:'14px 18px',display:'flex',alignItems:'center',gap:14}}>
                      <Glyph c={c.color} glyph={c.glyph} size={42} r={10} fs={17}/>
                      <div style={{flex:1,minWidth:0}}>
                        <div style={{fontWeight:700,fontSize:15,color:'var(--ink)',
                          overflow:'hidden',textOverflow:'ellipsis',whiteSpace:'nowrap'}}>{c.nome}</div>
                        <div style={{display:'flex',gap:8,marginTop:5,alignItems:'center',flexWrap:'wrap'}}>
                          <FaseBadge c={c}/>
                          {tl&&<span className="badge slate" style={{fontSize:11}}>{tl}</span>}
                          {c.info?.dataFine&&
                            <span style={{fontSize:12,color:'var(--ink3)'}}>consegna {c.info.dataFine}</span>}
                        </div>
                      </div>
                      <div style={{display:'flex',gap:8,flexShrink:0}}>
                        <button className="btn sm ghost" onClick={()=>onOpen(c.id)}>Apri</button>
                        <button className="btn sm primary" onClick={()=>onRestore(c.id)}>Ripristina</button>
                      </div>
                    </div>
                  );
                })}
              </div>
          }
        </div>
      </div>
    </div>
  );
};