/* Stili di tutte le pagine del tool (non dell'offerta PDF, che ha il CSS in templates/offer.html). Token e componenti sullo stile di Delo (shadcn, base neutral, Geist + Newsreader, accento #2871cc). */ :root{--brand:#2871cc;--background:#fff;--foreground:oklch(.145 0 0);--muted:oklch(.975 .004 85);--muted-foreground:oklch(.48 .015 75);--secondary:oklch(.97 .004 85);--accent:oklch(.93 .02 85);--border:oklch(.9 .008 85);--destructive:oklch(.5 .16 25);--sidebar:oklch(.985 0 0);--radius:.25rem} *{box-sizing:border-box}html,body{margin:0;height:100%} body{font:14px/1.5 Geist,"Geist Variable",-apple-system,"Segoe UI",Helvetica,Arial,sans-serif;color:var(--foreground);background:var(--background);-webkit-font-smoothing:antialiased} .serif{font-family:Newsreader,Georgia,"Times New Roman",serif;letter-spacing:-.01em} a{color:inherit} /* shell */ .shell{display:flex;min-height:100vh} .sidebar{width:240px;flex:none;background:var(--sidebar);border-right:1px solid var(--border);display:flex;flex-direction:column;position:sticky;top:0;height:100vh} .wordmark{padding:24px 20px 18px;display:flex;align-items:flex-end;gap:6px;text-decoration:none;color:var(--brand)}.wordmark img{height:30px;display:block} .wordmark .qp{font-weight:600;font-size:13px;line-height:1;letter-spacing:-.01em;white-space:nowrap;margin-bottom:1px} /* «delo Quoting Process»: parte del marchio, piccolo, sulla linea di base delle lettere */ .nav{padding:0 12px}.nav a{display:block;padding:7px 12px;border-radius:calc(var(--radius)*.8);text-decoration:none;font-size:13.5px;color:var(--foreground)}.nav a:hover{background:var(--accent)}.nav a.on{background:var(--secondary);font-weight:500} .navlabel{padding:16px 20px 8px;font-size:11px;text-transform:uppercase;letter-spacing:.14em;color:var(--muted-foreground)} .sidefoot{margin-top:auto;padding:16px 20px;font-size:11px;color:var(--muted-foreground);border-top:1px solid var(--border);line-height:1.6} .sidefoot b{color:var(--foreground);font-weight:500} .page{flex:1;min-width:0} .phead{padding:32px 40px 8px;display:flex;justify-content:space-between;align-items:flex-end;gap:24px} .phead h1{margin:0;font-family:Newsreader,Georgia,serif;font-weight:400;font-size:2rem;line-height:1.1;letter-spacing:-.01em;border-left:2px solid var(--brand);padding-left:16px} .phead p{margin:6px 0 0 18px;font-size:13px;color:var(--muted-foreground)} .content{padding:16px 40px 80px} .cols{display:grid;grid-template-columns:400px minmax(0,1fr);gap:20px;align-items:start} /* card */ .card{background:var(--background);border:1px solid var(--border);border-radius:calc(var(--radius)*2.2);padding:20px;margin-bottom:16px} .card h2{margin:0 0 12px;font-size:11px;font-weight:500;text-transform:uppercase;letter-spacing:.14em;color:var(--muted-foreground);display:flex;align-items:center;gap:8px} .card h2 span{display:inline-flex;width:20px;height:20px;border:1px solid var(--border);border-radius:999px;align-items:center;justify-content:center;font-size:11px;color:var(--foreground);letter-spacing:0} .card h2 span.conf{display:inline;width:auto;height:auto;border:0;font-size:12px;color:var(--muted-foreground);text-transform:none;font-weight:400} /* form */ label{display:block;font-size:12px;color:var(--muted-foreground);margin-top:10px;margin-bottom:4px} input,select,textarea{width:100%;height:32px;padding:0 10px;border:1px solid var(--border);border-radius:calc(var(--radius)*.8);font:inherit;font-size:13.5px;background:var(--background);color:var(--foreground);outline:none;transition:border-color .15s,box-shadow .15s} textarea{height:auto;padding:8px 10px;resize:vertical}select{appearance:auto} input:focus,select:focus,textarea:focus{border-color:var(--brand);box-shadow:0 0 0 3px color-mix(in oklch,var(--brand),transparent 80%)} input[type=file]{height:auto;padding:5px 10px;font-size:12.5px}input[type=checkbox]{width:14px;height:14px;margin:0;accent-color:var(--brand)} .row{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px} .factors{display:grid;grid-template-columns:1fr 1fr;gap:4px 10px;margin-top:4px}.factors label{display:flex;gap:7px;align-items:center;margin:0;font-size:13px;color:var(--foreground)} button{font:inherit;font-size:13.5px;font-weight:500;height:32px;white-space:nowrap;padding:0 14px;border:1px solid transparent;border-radius:calc(var(--radius)*.8);background:var(--brand);color:#fff;cursor:pointer;margin-top:14px;transition:background .15s,transform .05s} button:hover{background:color-mix(in oklch,var(--brand),#fff 15%)}button:active{transform:translateY(1px)}button:disabled{opacity:.5;pointer-events:none} button.ghost{background:var(--background);color:var(--foreground);border-color:var(--border)}button.ghost:hover{background:var(--muted)} .thumbs{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}.thumbs img{height:64px;border:1px solid var(--border);border-radius:calc(var(--radius)*.8)} /* text */ .conf{font-size:12px;color:var(--muted-foreground)}.status{font-size:13px;color:var(--muted-foreground);margin-top:8px;min-height:1.4em}.err{color:var(--destructive)} .why{font-size:12.5px;line-height:1.55;color:var(--muted-foreground);border-left:2px solid var(--border);padding-left:10px;margin:10px 0}.why b{color:var(--foreground);font-weight:500} .badge{display:inline-flex;align-items:center;white-space:nowrap;height:20px;padding:0 8px;border-radius:999px;background:var(--secondary);font-size:11.5px;font-weight:500;margin-left:6px;color:var(--foreground)} /* kpi */ .kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin:4px 0 18px}.kpi small{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.14em;color:var(--muted-foreground)} .kpi b{display:block;font-family:Newsreader,Georgia,serif;font-weight:400;font-size:30px;letter-spacing:-.01em;margin:6px 0 2px}.kpi .sub{font-size:12px;color:var(--muted-foreground)} /* table */ table{width:100%;border-collapse:collapse;font-size:13.5px}th{font-size:11px;text-transform:uppercase;letter-spacing:.1em;font-weight:500;color:var(--muted-foreground)}th,td{text-align:left;padding:7px 8px;border-bottom:1px solid var(--border)}td.n,th.n{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}tr.tot td{font-weight:500;border-top:1px solid var(--foreground);border-bottom:0} /* comparabili */ .comp{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.comp .card{margin:0;padding:14px;font-size:12.5px;line-height:1.5;display:flex;gap:10px;align-items:flex-start}.comp .card>div{min-width:0}.comp b{display:block;font-weight:500;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .av{width:34px;height:34px;flex:none} .spin{display:inline-block;width:12px;height:12px;border:2px solid var(--border);border-top-color:var(--brand);border-radius:50%;animation:s .8s linear infinite;vertical-align:middle;margin-right:6px}@keyframes s{to{transform:rotate(360deg)}} #result:empty::before{content:"Compila i parametri a sinistra, o lascia che l'AI li proponga, e premi Stima.";color:var(--muted-foreground);font-size:13px} /* backtest */ .hist{display:grid;grid-template-columns:repeat(8,1fr);gap:8px;align-items:end;height:180px;margin-top:16px}.hist div{background:var(--brand);border-radius:3px 3px 0 0;position:relative;opacity:.85}.hist div span{position:absolute;bottom:100%;left:0;right:0;text-align:center;font-size:12px;color:var(--muted-foreground)} .lab{display:grid;grid-template-columns:repeat(8,1fr);gap:8px;font-size:11px;color:var(--muted-foreground);text-align:center;margin-top:6px} .lead{font-size:13.5px;line-height:1.6;color:var(--muted-foreground);max-width:72ch} @media (max-width:900px){.sidebar{display:none}.cols{grid-template-columns:1fr}.phead,.content{padding-left:16px;padding-right:16px}.kpis{grid-template-columns:1fr 1fr}.comp{grid-template-columns:1fr}} /* tab e griglie allineate */ .tabs{display:flex;gap:4px;border-bottom:1px solid var(--border);margin:8px 0 20px} .tab{margin:0;height:38px;padding:0 14px;background:none;border:0;border-bottom:2px solid transparent;border-radius:0;color:var(--muted-foreground);font-weight:500;display:inline-flex;align-items:center;gap:8px} .tab:hover{background:none;color:var(--foreground)}.tab.on{color:var(--foreground);border-bottom-color:var(--brand)} .tab span{display:inline-flex;width:20px;height:20px;border-radius:999px;border:1px solid var(--border);align-items:center;justify-content:center;font-size:11px}.tab.on span{background:var(--brand);border-color:var(--brand);color:#fff} .panel{display:none}.panel.on{display:block} .two{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start} .field{margin-top:12px}.field label{margin:0 0 5px;white-space:nowrap;color:var(--foreground);font-size:12.5px;font-weight:500}.field .hint{margin-top:4px} .hint{font-size:12px;color:var(--muted-foreground);line-height:1.4} .g2{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:start}.g3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;align-items:start} .factors{display:grid;grid-template-columns:1fr 1fr;gap:8px 12px;margin-top:2px}.factors label{white-space:nowrap;font-weight:400;font-size:13px} .actions{display:flex;gap:8px;align-items:center;margin-top:16px}.actions button{margin:0} .card .thumbs img{height:110px}.card .thumbs:empty{display:none} #result:empty::before{content:"Nessuna stima ancora: compila il passo 2 e premi Stima.";} @media (max-width:900px){.two{grid-template-columns:1fr}} /* utente in fondo alla sidebar */ .sidefoot{padding:12px}.user{display:flex;align-items:center;gap:8px;padding:6px 8px} .user .av{width:30px;height:30px;flex:none}.uname{min-width:0;flex:1;line-height:1.2;text-decoration:none;color:var(--foreground);padding:4px 6px;border-radius:calc(var(--radius)*.8)}.uname:hover{background:var(--accent)}.uname b{display:block;font-size:13px;font-weight:500}.uname small{display:block;font-size:11px;color:var(--muted-foreground)} .user .icon{width:28px;height:28px;display:inline-flex;align-items:center;justify-content:center;border-radius:calc(var(--radius)*.8);color:var(--muted-foreground);text-decoration:none;font-size:15px;flex:none}.user .icon:hover{background:var(--accent);color:var(--foreground)} /* configurazione: griglia a 4, separatore, proposta AI, preventivi salvati */ .g4{display:grid;grid-template-columns:repeat(4,1fr);gap:12px 16px} .sep{border-top:1px solid var(--border);margin:18px 0 4px} .actions.end{justify-content:flex-end}.actions.end .ghost{order:-1} .field label .conf{font-weight:400} .factors{grid-template-columns:1fr 1fr 1fr;gap:10px 12px;margin-top:6px} input.ai,select.ai,textarea.ai{border-color:var(--brand);background:color-mix(in oklch,var(--brand),#fff 94%)} .proposal{display:flex;justify-content:space-between;align-items:center;gap:16px;border:1px solid var(--brand);border-left-width:3px;border-radius:calc(var(--radius)*2.2);padding:12px 16px;margin-bottom:12px;background:color-mix(in oklch,var(--brand),#fff 96%)} .proposal .actions{flex:none}.proposal b{display:block;font-size:13.5px;font-weight:500}.proposal .conf{display:block;margin-top:2px} .nav.saved a{display:flex;padding:6px 12px}.nav.saved .t{display:block;font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.nav.saved .m{display:block;font-size:11px;color:var(--muted-foreground)}.nav .empty{display:block;padding:4px 12px} .sidebar{overflow:hidden}.nav.saved{overflow-y:auto;flex:1 1 0;min-height:0;mask-image:linear-gradient(#000 calc(100% - 28px),transparent)} /* recenti: tutto lo spazio fino al piede; la sfumatura dice che sotto ce ne sono altri */ .phead .actions button{margin:0} @media (max-width:1100px){.g4{grid-template-columns:1fr 1fr}.factors{grid-template-columns:1fr 1fr}} .alert{border:1px solid color-mix(in oklch,var(--destructive),transparent 70%);background:color-mix(in oklch,var(--destructive),transparent 90%);color:var(--destructive);border-radius:calc(var(--radius)*.8);padding:8px 12px;font-size:13px} /* login come Delo Demo: tela con agentini che girano sulle linee (login.js), card a destra */ .login{display:grid;grid-template-columns:3fr 2fr;min-height:100vh} .stage{position:relative;overflow:hidden;background-color:var(--background);background-image:radial-gradient(circle,color-mix(in oklab,var(--foreground) 9%,transparent) 1px,transparent 1px);background-size:24px 24px} .stage svg.lines{position:absolute;inset:0;width:100%;height:100%}.stage svg.lines path{fill:none;stroke:color-mix(in oklab,var(--foreground) 14%,transparent);stroke-width:1.2;stroke-dasharray:5 7} .stage .dot,.stage .bot{position:absolute;left:0;top:0;will-change:transform}.stage .dot{width:7px;height:7px;margin:-3.5px;border-radius:50%;background:var(--brand);opacity:.75}.stage .bot svg{display:block} .loginside{background:var(--sidebar);border-left:1px solid var(--border);display:flex;align-items:center;justify-content:center;padding:40px 16px} .logincard{width:100%;max-width:400px;background:var(--background);border:1px solid var(--border);border-radius:calc(var(--radius)*3);box-shadow:0 12px 32px -12px rgba(0,0,0,.12);padding:40px 36px 24px;text-align:center} .logincard .logo{height:52px;display:block;margin:0 auto}.logincard .mono{margin:12px 0 0;font-family:"Geist Mono",ui-monospace,Menlo,monospace;font-size:12px;letter-spacing:.12em;color:var(--muted-foreground)} .logincard .clerkbox{margin-top:28px;display:flex;justify-content:center;text-align:left}.logincard .clerkbox>*{width:100%}.logincard h1{margin:40px 0 4px;font-size:20px;font-weight:600}.logincard .sub{margin:0 0 28px;color:var(--muted-foreground)} .logincard form{display:flex;flex-direction:column;gap:6px;text-align:left}.logincard label{font-size:13px;font-weight:500;margin-top:10px}.logincard input{height:40px} .logincard form button{margin:22px 0 0;height:42px;background:var(--foreground);display:inline-flex;align-items:center;justify-content:center;gap:10px}.logincard form button:hover{background:color-mix(in oklch,var(--foreground),#fff 18%)}.logincard form button span{font-size:10px} .powered{margin-top:32px;padding-top:20px;border-top:1px solid var(--border);display:flex;align-items:center;justify-content:center;gap:12px;font-size:11px;text-transform:uppercase;letter-spacing:.14em;color:var(--muted-foreground);text-decoration:none}.powered:hover{color:var(--foreground)}.powered img{height:28px;width:auto} @media (max-width:900px){.login{grid-template-columns:1fr}.stage{display:none}.loginside{border-left:0}} /* icone in sidebar */ .nav a{display:flex;align-items:center;gap:10px}.ic{width:18px;height:18px;flex:none;color:var(--muted-foreground)}.nav a.on .ic{color:var(--brand)} .nav.saved a{align-items:flex-start;gap:9px}.nav.saved .sb{min-width:0;flex:1} /* scheda del preventivo storico (hover = anteprima, click = fissa) */ .comp .card.cc{cursor:pointer;transition:border-color .15s,box-shadow .15s}.comp .card.cc:hover{border-color:var(--brand);box-shadow:0 1px 2px rgba(0,0,0,.05)} .cdlg{border:1px solid var(--border);border-radius:calc(var(--radius)*2.2);padding:0;width:min(860px,92vw);max-height:88vh;box-shadow:0 16px 48px rgba(0,0,0,.14);background:var(--background);color:var(--foreground)} .cdlg:not([open]){display:none}.cdlg::backdrop{background:rgba(0,0,0,.25)} .cdlg-in{padding:18px 20px;overflow:auto;max-height:88vh} .cdlg-head{display:flex;align-items:center;gap:12px;margin-bottom:12px}.cdlg-head .av{width:40px;height:40px}.cdlg-head b{display:block;font-size:15px;font-weight:500}.cdlg-head .conf{display:block}.cdlg-head .x{margin:0 0 0 auto;width:32px;padding:0;font-size:18px;line-height:1} .cdlg-imgs{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px;margin-bottom:12px}.cdlg-imgs img{height:150px;border:1px solid var(--border);border-radius:calc(var(--radius)*.8);flex:none} .cdlg-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.cdlg-grid h2{margin-bottom:6px}.cdlg table td{padding:4px 6px;font-size:13px} /* archivio */ table.arch th,table.arch td{padding:9px 12px;vertical-align:middle} table.arch tbody tr{cursor:pointer}table.arch tbody tr:hover{background:var(--muted)}table.arch td .m{display:block;font-size:11px;color:var(--muted-foreground)}table.arch td b{font-weight:500} .rowav{display:inline-block;width:26px;height:26px;vertical-align:middle} .phead .field input{height:34px} .del{margin:0 0 0 auto;height:auto;padding:0 2px;border:0;background:none;color:var(--muted-foreground);font-size:16px;line-height:1;opacity:0;flex:none}.nav.saved a:hover .del,.arch tr:hover .del{opacity:1}.del:hover{background:none;color:var(--destructive)} .cdlg h2{margin:0 0 6px;font-size:11px;font-weight:500;text-transform:uppercase;letter-spacing:.14em;color:var(--muted-foreground)} .adlg{border:1px solid var(--border);border-radius:calc(var(--radius)*2.2);padding:24px;width:min(440px,92vw);background:var(--background);color:var(--foreground);box-shadow:0 16px 48px rgba(0,0,0,.16)}.adlg[open]{animation:adlg-in .15s ease-out}.adlg::backdrop{background:rgba(0,0,0,.45)} .adlg h3{margin:0 0 8px;font-size:17px;font-weight:600}.adlg p{margin:0;font-size:14px;line-height:1.5;color:var(--muted-foreground)}.adlg .actions{margin-top:20px} button.danger{background:var(--destructive)}button.danger:hover{background:color-mix(in oklch,var(--destructive),#fff 12%)} @keyframes adlg-in{from{opacity:0;transform:scale(.96)}} .arch .del{margin-left:6px;vertical-align:middle} button.loading{opacity:1}button .spin{border-color:color-mix(in oklch,#fff,transparent 55%);border-top-color:#fff}button.ghost .spin{border-color:var(--border);border-top-color:var(--brand)} .kpi.ref{border-left:1px solid var(--border);padding-left:20px} .stickybar{position:sticky;bottom:0;z-index:5;margin:16px -40px 0;padding:12px 40px;background:color-mix(in oklch,var(--background),transparent 10%);backdrop-filter:blur(6px);border-top:1px solid var(--border)} .pdfprev{display:block;width:100%;height:620px;margin-top:12px;border:1px solid var(--border);border-radius:var(--radius)} .thumbs img,.cdlg-imgs img{cursor:zoom-in}.imgdlg{border:0;padding:0;background:transparent;max-width:92vw;max-height:92vh;cursor:zoom-out}.imgdlg img{display:block;max-width:92vw;max-height:90vh;background:#fff;border-radius:var(--radius)}.imgdlg::backdrop{background:rgb(0 0 0/.6)} @media (max-width:900px){.stickybar{margin:16px -16px 0;padding:12px 16px}} .comp .card>div{flex:1}.sim{margin-left:auto;flex:none;text-align:right;font-family:Newsreader,Georgia,serif;font-size:22px;line-height:1;color:var(--muted-foreground)}.sim.hi{color:var(--brand)}.sim.mid{color:var(--foreground)} .sim i{display:block;width:44px;height:3px;margin-top:6px;border-radius:2px;background:linear-gradient(90deg,currentColor var(--w),var(--border) var(--w))} .reasons{display:flex;flex-wrap:wrap;gap:4px;margin-top:8px}.reasons span{font-size:11px;line-height:1.3;padding:2px 7px;border-radius:999px;border:1px solid var(--border)}.reasons .ok::before,.reasons .ko::before{display:inline-block;width:6px;height:6px;border-radius:50%;margin-right:5px;vertical-align:1px;content:""} .reasons .ok::before{background:oklch(.62 .14 150)}.reasons .ko{color:var(--muted-foreground)}.reasons .ko::before{background:oklch(.75 .13 70)} .imp .imphead{display:flex;gap:12px;align-items:flex-start;margin-bottom:12px}.verdict{flex:none;font-size:13px;font-weight:500;padding:3px 10px;border-radius:999px;border:1px solid var(--border)} .verdict.hi{color:var(--brand);border-color:var(--brand)}.verdict.mid{color:oklch(.55 .13 70);border-color:oklch(.75 .13 70)}.verdict.lo{color:var(--muted-foreground)}.imp.done{padding:12px 16px} .dropzone{display:flex;flex-direction:column;align-items:center;gap:4px;padding:28px 16px;border:1.5px dashed var(--border);border-radius:var(--radius);cursor:pointer;text-align:center;transition:border-color .15s,background .15s} .dropzone:hover,.dropzone.over{border-color:var(--brand);background:color-mix(in oklch,var(--brand),transparent 95%)}.dropzone.busy{opacity:.6;pointer-events:none}.dropzone b{font-weight:500} .dimfix{display:flex;align-items:center;gap:8px;margin-top:12px}.dimfix input{width:90px} /* errori sul campo */ input.bad,select.bad,textarea.bad{border-color:var(--destructive);background:color-mix(in oklch,var(--destructive),#fff 95%)}input.bad:focus,select.bad:focus,textarea.bad:focus{box-shadow:0 0 0 3px color-mix(in oklch,var(--destructive),transparent 80%)} .ferr{margin-top:4px;font-size:12px;line-height:1.35;color:var(--destructive)} /* proposta AI accanto ai campi */ .aichip{display:inline-flex;align-items:center;height:18px;padding:0 7px;border-radius:999px;border:1px solid var(--brand);color:var(--brand);font-size:10.5px;font-weight:500;letter-spacing:.01em;vertical-align:1px;white-space:nowrap} .aichip.media{border-color:oklch(.75 .13 70);color:oklch(.5 .12 70)}.aichip.bassa{border-color:var(--destructive);color:var(--destructive)} .field label:has(.aichip){white-space:normal} .aiwhy{margin-top:5px;font-size:12px;line-height:1.4;color:var(--muted-foreground);border-left:2px solid oklch(.75 .13 70);padding-left:8px} /* stima: una risposta in testa, poi i dettagli chiusi */ .hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:40px;align-items:end;margin:2px 0 18px} .hero small,.facts small{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.14em;color:var(--muted-foreground)} .hero .price{display:block;font-family:Newsreader,Georgia,serif;font-weight:400;font-size:52px;line-height:1.05;letter-spacing:-.015em;color:var(--brand);margin:6px 0 4px} .hero .sub{display:block;font-size:12.5px;color:var(--muted-foreground)} .bar{position:relative;height:8px;margin:18px 0 26px;border-radius:999px;background:var(--secondary);border:1px solid var(--border)} .bar .rng{position:absolute;top:-1px;bottom:-1px;border-radius:999px;background:color-mix(in oklch,var(--brand),#fff 70%)} .bar .dot,.bar .refm{position:absolute;top:50%}.bar .dot{margin:-7px 0 0 -7px}.bar .refm{margin:-6px 0 0 -6px} .dot{display:inline-block;width:14px;height:14px;border-radius:50%;background:var(--brand);border:2px solid #fff;box-shadow:0 0 0 1px var(--brand)} .refm{display:inline-block;width:12px;height:12px;transform:rotate(45deg);background:#fff;border:2px solid var(--foreground)} .lg{vertical-align:-1px;margin:0 3px 0 6px}.lg.dot{width:10px;height:10px}.lg.refm{width:8px;height:8px} .bar .bl{position:absolute;top:14px;transform:translateX(-50%);font-size:12px;color:var(--muted-foreground);white-space:nowrap;font-variant-numeric:tabular-nums} .facts{display:flex;flex-wrap:wrap;gap:12px 40px;padding:14px 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border)} .facts b{display:block;font-size:17px;font-weight:500;margin:3px 0 1px;font-variant-numeric:tabular-nums}.facts span{font-size:12px;color:var(--muted-foreground)} .facts .demo{padding-left:20px;border-left:1px dashed var(--border)}.chip{display:inline-block;margin-left:6px;padding:1px 7px;border-radius:999px;border:1px dashed var(--muted-foreground);font-size:10px;letter-spacing:.06em;color:var(--foreground)} .cxline{margin:14px 0 6px} details.sect>summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:8px;padding:10px 0;font-size:13.5px;font-weight:500} details.sect>summary::-webkit-details-marker{display:none}details.sect>summary::before{content:"";width:7px;height:7px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(-45deg);transition:transform .15s;margin:0 4px 0 2px} details.sect[open]>summary::before{transform:rotate(45deg)}#result details.sect{border-top:1px solid var(--border)} details.card.sect>summary{padding:0;font-size:11px;text-transform:uppercase;letter-spacing:.14em;color:var(--muted-foreground)}details.card.sect[open]>summary{margin-bottom:12px} /* stato del preventivo: chip in testata, sidebar e archivio; prossimo passo */ .st{display:inline-flex;align-items:center;height:22px;padding:0 9px;border-radius:999px;border:1px solid var(--border);background:var(--background);font-size:12px;font-weight:500;white-space:nowrap;color:var(--muted-foreground)} .st::before{content:"";width:7px;height:7px;border-radius:50%;margin-right:6px;background:currentColor} .st.offerta{color:var(--brand);border-color:color-mix(in oklch,var(--brand),#fff 55%)}.st.validato{color:oklch(.48 .12 150);border-color:oklch(.8 .08 150)}.st.forced{color:oklch(.5 .12 70);border-color:oklch(.78 .12 70)} .pstate{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0 0 18px}.pstate:empty{display:none}#pvers{margin-top:2px}#pvers:empty{display:none} .nav.saved .sts{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px}.nav.saved .st{height:18px;padding:0 7px;font-size:10.5px}.nav.saved .st::before{width:5px;height:5px;margin-right:5px} .pnext{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:10px 12px 10px 16px;margin:4px 0 6px;border:1px solid var(--border);border-radius:calc(var(--radius)*2.2);background:var(--muted);font-size:13.5px}.pnext[hidden]{display:none}.pnext b{font-weight:500}.pnext button{margin:0} .btnlink{display:inline-flex;align-items:center;height:32px;padding:0 14px;border-radius:calc(var(--radius)*.8);background:var(--brand);color:#fff;text-decoration:none;font-weight:500;font-size:13.5px;white-space:nowrap} .cxwhy{margin-top:6px} /* larghezze desktop strette (1200 px): niente che esca dalle card */ .comp{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))} .g2{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.factors{grid-template-columns:repeat(auto-fill,minmax(165px,1fr))}.factors label{white-space:normal} table.arch td:last-child{white-space:nowrap} .savewhy{display:block;max-width:220px;margin-top:4px;text-align:right;font-size:11.5px;line-height:1.3}.phead .actions{flex-direction:column;align-items:flex-end;gap:0} /* fasi della lettura AI */ .phases{display:flex;flex-direction:column;gap:6px;padding:4px 0}.ph{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--foreground)} .ph i{width:14px;height:14px;flex:none;border-radius:50%;border:2px solid var(--border)}.ph.run i{border-top-color:var(--brand);animation:s .8s linear infinite} .ph.ok i{border-color:var(--brand);background:var(--brand);box-shadow:inset 0 0 0 2px #fff}.ph.skip{color:var(--muted-foreground)}.ph.skip i{border-style:dashed} .comp b{white-space:normal;overflow:visible;overflow-wrap:anywhere} table.arch td b{overflow-wrap:anywhere}table.arch td:first-child{min-width:180px} table.arch th,table.arch td{padding:9px 10px} .lgi{white-space:nowrap} table.arch th .m{display:block;font-size:10px;letter-spacing:.1em;color:var(--muted-foreground);font-weight:500}table.arch td:first-child{min-width:160px} table.arch th,table.arch td{padding:9px 8px} #offerBox .field label,#valBox .field label{white-space:normal} .checkbox{font-size:13px;line-height:1.5;border:1px solid var(--border);border-left-width:3px;border-radius:calc(var(--radius)*2);padding:10px 14px;margin:6px 0 4px;background:var(--muted)}.checkbox[hidden]{display:none} .checkbox.warn{border-color:oklch(.78 .12 70);background:color-mix(in oklch,oklch(.85 .12 80),#fff 88%)}.checkbox ul{margin:6px 0 0;padding-left:18px}.checkbox li{margin:3px 0}.checkbox b{font-weight:500} .mailbox{margin-top:12px}.mailbox textarea{font-size:13px;line-height:1.5} .fu{border-top:1px solid var(--border);padding:10px 0}.fu:first-of-type{border-top:0}.fuhead{display:flex;justify-content:space-between;align-items:center;gap:12px}.fuhead .m{display:block;font-size:12px;color:var(--muted-foreground)}.fuhead button{margin:0} .valfields{border:0;padding:0;margin:0;min-width:0}.valfields:disabled{opacity:.5} .field.changed input,.field.changed select{border-color:var(--brand);box-shadow:0 0 0 1px var(--brand)}.field.changed .vp{color:var(--brand)} #valChanged{margin-right:auto;max-width:60%} #valBox .actions button{flex:none} /* preventivo aperto in sidebar: fondo pastello del brand e filo a sinistra, si trova a colpo d'occhio */ .nav.saved a.on{background:color-mix(in oklch,var(--brand),#fff 88%);box-shadow:inset 3px 0 0 var(--brand)}.nav.saved a.on .t{font-weight:500;color:var(--brand)} /* passo 1: file del cliente in una zona di trascinamento, chi fa cosa nella colonna di destra */ #dropFiles{margin-top:12px;padding:30px 16px}#dropFiles .filelist{margin-top:6px;font-size:12.5px;color:var(--brand);font-weight:500}#dropFiles .filelist:empty{display:none} /* validazione: righe a tre colonne con i campi allineati in basso, anche se un'etichetta va a capo */ .valrow{align-items:start}.valrow .field label{white-space:normal}.valnote{margin:6px 0 2px} .valfoot{display:grid;grid-template-columns:2fr 1fr;gap:16px} #p1 .two{align-items:stretch} /* assistente in chat: bottone Delo in basso a destra, pannello 380×520 sopra */ .stickybar{padding-right:104px} .chatpanel{position:fixed;right:24px;bottom:84px;z-index:50;width:380px;height:520px;max-height:calc(100vh - 110px);display:flex;flex-direction:column;overflow:hidden;background:var(--background);border:1px solid var(--border);border-radius:16px;box-shadow:0 24px 60px rgba(0,0,0,.16),0 4px 12px rgba(0,0,0,.06);font-size:13.5px;color:var(--foreground);transform-origin:bottom right;animation:chatin .22s cubic-bezier(.2,.8,.2,1)}.chatpanel[hidden]{display:none} @keyframes chatin{from{opacity:0;transform:translateY(10px) scale(.97)}} .chatav{width:32px;height:32px;flex:none;border-radius:50%}.chatav.sm{width:22px;height:22px;margin-top:1px} .chatlog{flex:1;overflow-y:auto;padding:16px 14px;display:flex;flex-direction:column;gap:12px;line-height:1.55;scroll-behavior:smooth} .chatwarn{margin:0 0 8px;padding:10px 12px;border:1px solid oklch(.85 .08 80);border-radius:10px;background:oklch(.98 .03 85);color:oklch(.42 .09 70);font-size:12.5px;line-height:1.45}.chatwarn b{font-weight:600} .chatempty{text-align:center;padding:18px 8px 4px}.chatempty img{width:48px;height:48px;border-radius:50%;box-shadow:0 6px 18px color-mix(in oklch,var(--brand),transparent 65%)}.chatempty h3{margin:12px 0 4px;font-size:21px;font-weight:400}.chatempty p{margin:0 auto;max-width:290px;font-size:12.5px;color:var(--muted-foreground)} .chatsugg{display:flex;flex-direction:column;gap:6px;margin-top:8px} .chatex{margin:0;height:auto;padding:9px 12px;display:flex;justify-content:space-between;align-items:center;gap:8px;text-align:left;font-weight:400;font-size:13px;line-height:1.35;background:var(--background);color:var(--foreground);border:1px solid var(--border);border-radius:12px;transition:border-color .15s,background .15s} .chatex span{color:var(--brand);opacity:0;transform:translateX(-4px);transition:opacity .15s,transform .15s}.chatex:hover{background:color-mix(in oklch,var(--brand),#fff 95%);border-color:color-mix(in oklch,var(--brand),#fff 55%)}.chatex:hover span{opacity:1;transform:none} .msg.u{align-self:flex-end;max-width:85%;background:var(--brand);color:#fff;border-radius:14px 14px 4px 14px;padding:7px 12px;box-shadow:0 1px 2px rgba(0,0,0,.08)} .msg.a{display:flex;gap:8px;align-items:flex-start}.msg.a .mb{min-width:0;flex:1}.msg.a p{margin:0 0 6px}.msg.a p:last-child{margin-bottom:0}.msg.a ul{margin:2px 0 8px;padding-left:18px}.msg.a li{margin:2px 0}.msg.a li::marker{color:var(--brand)}.msg.a b{font-weight:600} .chattool{display:inline-flex;align-items:center;gap:7px;margin-top:3px;font-size:13px;line-height:1.4} .chattool .g{width:12px;flex:none;text-align:center;color:var(--brand);font-size:14px}.chattool .g::before{content:"✻";animation:chatglyphc 1.2s steps(1) infinite} .chattool .tx{background:linear-gradient(90deg,var(--muted-foreground) 0%,var(--muted-foreground) 40%,var(--brand) 50%,var(--muted-foreground) 60%,var(--muted-foreground) 100%);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:chatshine 2s linear infinite} @keyframes chatshine{from{background-position:100% 0}to{background-position:-150% 0}} @keyframes chatglyphc{0%{content:"✢"}20%{content:"✳"}40%{content:"✶"}60%{content:"✻"}80%{content:"✽"}} @media (prefers-reduced-motion:reduce){.chattool .g::before,.chattool .tx{animation:none}.chattool .tx{color:var(--muted-foreground)}} .chatcard{display:flex;gap:10px;align-items:center;width:100%;height:auto;margin:6px 0;padding:8px 10px 8px 8px;text-align:left;font-weight:400;font-size:12.5px;line-height:1.4;background:var(--background);color:var(--foreground);border:1px solid var(--border);border-radius:12px;box-shadow:0 1px 2px rgba(0,0,0,.04);transition:border-color .15s,box-shadow .15s,transform .15s} .chatcard:hover{background:var(--background);border-color:var(--brand);box-shadow:0 4px 14px rgba(0,0,0,.08);transform:translateY(-1px)} .chatcard img,.chatcard .noimg{width:54px;height:54px;flex:none;object-fit:contain;border-radius:8px;background:var(--muted)}.chatcard .cb{min-width:0;flex:1;display:flex;flex-direction:column;gap:2px}.chatcard b{font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .chatcard .cr{display:flex;justify-content:space-between;align-items:center;gap:6px;margin-top:2px}.chatcard .eur{font-weight:500;font-variant-numeric:tabular-nums}.chatcard .st{height:18px;padding:0 7px;font-size:10.5px}.chatcard .arr{color:var(--muted-foreground);font-size:18px}.chatcard:hover .arr{color:var(--brand)} .chatin{padding:10px 12px 8px;border-top:1px solid var(--border)} .chatbox{display:flex;align-items:flex-end;gap:6px;padding:6px 6px 6px 12px;border:1px solid var(--border);border-radius:14px;background:var(--background);transition:border-color .15s,box-shadow .15s}.chatbox:focus-within{border-color:var(--brand);box-shadow:0 0 0 3px color-mix(in oklch,var(--brand),transparent 85%)} .chatbox textarea{border:0;box-shadow:none;padding:5px 0;min-height:30px;max-height:120px;resize:none;font-size:13.5px;line-height:1.4;background:transparent}.chatbox textarea:focus{box-shadow:none} #chatgo{width:32px;height:32px;padding:0;margin:0;flex:none;border-radius:10px;display:inline-flex;align-items:center;justify-content:center}#chatgo svg{width:16px;height:16px}#chatgo .stop,.chatpanel.busy #chatgo .go{display:none}.chatpanel.busy #chatgo .stop{display:block}.chatpanel.busy #chatgo{background:var(--foreground)} .chatfoot{margin:6px 2px 0;font-size:10.5px;color:var(--muted-foreground);text-align:center} .sheetcta{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 14px}.sheetcta button{margin:0} .sheetdlg{border:1px solid var(--border);border-radius:calc(var(--radius)*2.2);padding:0;width:96vw;max-width:none;height:92vh;max-height:none;background:var(--background);color:var(--foreground);box-shadow:0 16px 48px rgba(0,0,0,.16)} .sheetdlg[open]{display:flex;flex-direction:column}.sheetdlg::backdrop{background:rgba(0,0,0,.35)} .sheet-head{display:flex;align-items:center;gap:16px;padding:14px 18px;border-bottom:1px solid var(--border)}.sheet-head b{display:block;font-size:15px;font-weight:500}.sheet-head .conf{display:block} .sheet-tot{margin-left:auto;font-size:14px;white-space:nowrap}.sheet-foot{padding:12px 18px;border-top:1px solid var(--border);margin:0} .sheet-wrap{flex:1;overflow:auto;padding:0 0 8px} .xl{border-collapse:collapse;table-layout:fixed;width:max-content;font:12px/1.2 system-ui,sans-serif} .xl th{position:sticky;top:0;background:var(--muted);color:var(--muted-foreground);font-weight:400;font-size:11px;border:1px solid var(--border);padding:2px;z-index:1}.xl tr th:first-child{position:sticky;left:0;z-index:2} .xl td{border:1px solid #d9d9d9;padding:0;height:20px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;vertical-align:middle} .xl td.f{background:#f3f3f1;padding:0 4px;text-align:right;color:#333}.xl td.hid,.xl th.hid{padding:0;border:0;font-size:0} .xl input{all:unset;box-sizing:border-box;width:100%;height:100%;padding:0 4px;font:inherit;color:inherit}.xl input.n{text-align:right} .xl input:focus{outline:2px solid var(--brand);outline-offset:-2px;background:#fff}.xl input.ed{background:#fff6d6;font-weight:600} .st.bozza{border-style:dashed} #leavedlg{width:min(540px,92vw)}.adlg .actions{flex-wrap:wrap} /* carica offerte: una scheda con la zona di caricamento e i tre passi, i numeri dello storico in una riga */ .upcard{padding:24px}.dropzone.up{padding:40px 16px 32px;gap:6px;border-radius:calc(var(--radius)*2.2);background:color-mix(in oklch,var(--brand),#fff 98%)}.dropzone.up b{font-size:15px} .dzic{width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin-bottom:8px;color:var(--brand);background:color-mix(in oklch,var(--brand),#fff 88%);transition:transform .2s}.dzic svg{width:22px;height:22px}.dropzone:hover .dzic,.dropzone.over .dzic{transform:translateY(-2px)} .fmts{display:flex;gap:6px;margin-top:10px}.fmts span{font-size:11px;padding:2px 9px;border:1px solid var(--border);border-radius:999px;color:var(--muted-foreground);background:var(--background)} .upsteps{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin:22px 0 0;padding:20px 4px 0;border-top:1px solid var(--border)} .upsteps li{display:flex;gap:12px;align-items:flex-start}.upsteps .n{flex:none;width:24px;height:24px;border-radius:50%;border:1px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:12px;color:var(--brand)} .upsteps b{display:block;font-size:13.5px;font-weight:500;margin:2px 0 3px}.upsteps div>span{display:block;font-size:12.5px;line-height:1.5;color:var(--muted-foreground)} .upmeta{margin:-4px 2px 16px;font-size:12.5px;color:var(--muted-foreground)}.upmeta b{color:var(--foreground);font-weight:500} .recent .rr{display:grid;grid-template-columns:1fr auto;column-gap:12px;padding:8px 0;border-bottom:1px solid var(--border);font-size:13px}.recent .rr:last-child{border-bottom:0}.recent .t{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.recent .m{grid-column:1;font-size:11.5px;color:var(--muted-foreground)}.recent .eur{grid-row:1/3;grid-column:2;align-self:center;font-variant-numeric:tabular-nums} @media (max-width:900px){.upsteps{grid-template-columns:1fr;gap:14px}} /* «Parla con Delo»: la pagina è la chat. Barra sottile in alto (contesto, nuova conversazione), sotto la conversazione a tutta altezza in una colonna centrale, il campo in fondo. Stesso pannello, senza cornice. */ .chatmain{display:flex;flex-direction:column;height:100vh} .chattop{display:flex;align-items:center;gap:10px;padding:12px 24px;border-bottom:1px solid var(--border);font-size:12.5px}.chattop label{flex:none;color:var(--muted-foreground)} .chattop select{width:auto;max-width:440px;min-width:0;height:32px}.chattop a{flex:none}.chattop .new{margin:0 0 0 auto;height:32px;display:inline-flex;align-items:center;gap:6px}.chattop .new svg{width:15px;height:15px} #chathost{flex:1;min-height:0;display:flex;flex-direction:column} .chatpanel.chatpage{position:static;width:100%;flex:1;height:auto;max-height:none;border:0;border-radius:0;box-shadow:none;animation:none;background:transparent;font-size:14.5px} .chatpage .chatlog{padding:28px max(24px,calc((100% - 760px)/2)) 12px;gap:16px} .chatpage .chatin{border-top:0;padding:8px max(24px,calc((100% - 760px)/2)) 14px}.chatpage .chatbox{padding:8px 8px 8px 14px;border-radius:18px;box-shadow:0 2px 10px rgba(0,0,0,.05)}.chatpage .chatbox textarea{font-size:14.5px} .chatpage .chatempty{margin-top:auto;padding-top:0}.chatpage .chatempty h3{font-size:28px}.chatpage .chatempty p{max-width:440px;font-size:14px}.chatpage .chatsugg{max-width:560px;margin:16px auto auto;width:100%} .chatpage .msg.u{max-width:75%} /* pagina vuota: ultimi preventivi dell'archivio al posto della lettura (#readhint) */ .recent{display:flex;flex-direction:column;margin-top:8px}.recent a{display:flex;align-items:center;gap:14px;padding:10px 8px;border-bottom:1px solid var(--border);text-decoration:none;border-radius:calc(var(--radius)*.8)}.recent a:hover{background:var(--muted)} .recent .sb{flex:1;min-width:0}.recent b{display:block;font-weight:500;font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.recent .m{font-size:12px;color:var(--muted-foreground);font-variant-numeric:tabular-nums} .recent .pics{display:flex;gap:6px;flex:none}.recent .pics img{width:64px;height:48px;object-fit:contain;background:#fff;border:1px solid var(--border);border-radius:calc(var(--radius)*.8)} #readhint:not([style*=none])+h2{display:none} /* finché si vedono gli ultimi preventivi, niente titolo «Lettura» */ #readhint .more{display:inline-block;margin-top:12px;font-size:13px;color:var(--brand);text-decoration:none}#readhint .more:hover{text-decoration:underline} /* passo 5, Trattativa */ .tab em.beta{font-style:normal;display:inline-flex;align-items:center;height:18px;padding:0 7px;border-radius:999px;border:1px solid var(--brand);color:var(--brand);font-size:10.5px;font-weight:500;letter-spacing:.04em} .badge.warn{background:oklch(.95 .05 75);color:oklch(.45 .11 70)} .trsteps{display:grid;grid-template-columns:repeat(auto-fit,minmax(0,1fr));gap:12px} .trsteps:empty{display:none} .trstep{all:unset;box-sizing:border-box;cursor:pointer;display:flex;flex-direction:column;gap:2px;min-width:0;padding:14px 16px;border:1px solid var(--border);border-radius:calc(var(--radius)*1.6);background:var(--background);transition:border-color .15s} .trstep:hover,.trstep:focus-visible{border-color:var(--brand);background:var(--background)} /* è un