/* 04/10/2026 — le fasi a schede (vedi assets/dpitip-fasi.js e includes/class-dpitip-fasi.php) */
.dpitip-w .dpitip-fasi{display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:6px;margin:0 0 18px;padding:4px;background:#F2F6FB;border-radius:12px}
.dpitip-w .dpitip-fasi button{all:unset;box-sizing:border-box;cursor:pointer;display:grid;grid-template-columns:auto 1fr;column-gap:6px;align-items:start;align-content:start;min-width:0;padding:8px 10px;border-radius:9px;color:#0B1F45;transition:background .15s,box-shadow .15s}
.dpitip-w .dpitip-fasi button:hover{background:#FFFFFF80}
.dpitip-w .dpitip-fasi button:focus-visible{outline:2px solid #2364A4;outline-offset:1px}
.dpitip-w .dpitip-fasi button[aria-selected=true]{background:#FFFFFF;box-shadow:0 1px 3px rgba(11,31,69,.14)}
.dpitip-w .dpitip-fasi__n{display:inline-grid;place-items:center;width:18px;height:18px;border-radius:50%;background:#C3CCDA;color:#FFFFFF;font-size:11px;font-weight:700;line-height:1;margin-top:1px}
.dpitip-w .dpitip-fasi button[aria-selected=true] .dpitip-fasi__n{background:#0B1F45}
.dpitip-w .dpitip-fasi__tit{font-size:13px;font-weight:600;line-height:1.2}
.dpitip-w .dpitip-fasi__val{grid-column:1/-1;margin-top:3px;font-size:12px;line-height:1.3;color:#5A6B85;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.dpitip-w .dpitip-fasi button[aria-selected=true] .dpitip-fasi__val{color:#2364A4}
.dpitip-w .dpitip-fasi:not([hidden]) ~ #dpitip-cfg .dpitip-passo__testa,
.dpitip-w .dpitip-fasi:not([hidden]) ~ #dpitip-cfg .dpitip-parte__tit,
.dpitip-w .dpitip-fasi:not([hidden]) ~ #dpitip-cfg .dpitip-fasi-via{display:none}
/* le tre carte: tessere grandi (vedi carte3) */
.dpitip-w .dpitip-carte3 .dpitip-parte__bottoni{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.dpitip-w .dpitip-carte3 .dpitip-parte__bottoni > button{display:flex;flex-direction:column;align-items:stretch;gap:8px;height:auto;padding:10px 10px 12px;border-radius:12px;background:#FFFFFF;color:#0B1F45;border:1.5px solid #DFE6EF;text-align:left;position:relative;transition:border-color .15s,box-shadow .15s}
.dpitip-w .dpitip-carte3 .dpitip-parte__bottoni > button:hover{border-color:#2364A4}
.dpitip-w .dpitip-carte3 .dpitip-parte__bottoni > button[aria-pressed=true]{background:#FFFFFF;color:#0B1F45;border:2px solid #0B1F45;box-shadow:0 4px 14px rgba(11,31,69,.12)}
.dpitip-w .dpitip-carte3 .dpitip-parte__bottoni > button[aria-pressed=true]::after{content:"";position:absolute;top:8px;right:8px;width:20px;height:20px;border-radius:50%;background:#0B1F45 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5.5 10.5l3 3 6-6.5' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/20px no-repeat}
.dpitip-w .dpitip-carte3__campione{display:block;background:#F2F6FB;border-radius:8px;padding:6px 4px}
.dpitip-w .dpitip-carte3__campione svg{display:block;width:100%;height:auto;max-height:64px}
.dpitip-w .dpitip-carte3 .dpitip-parte__bottoni > button > span:not([class]){font-size:15px;font-weight:700;line-height:1.2}
.dpitip-w .dpitip-carte3 .dpitip-parte__bottoni > button > span:not([class])::first-letter{text-transform:uppercase}
.dpitip-w .dpitip-carte3__note{margin:0;padding:0;list-style:none;font-size:12px;line-height:1.35;color:#5A6B85;font-weight:400}
.dpitip-w .dpitip-carte3__note li{padding-left:12px;position:relative;margin-top:3px}
.dpitip-w .dpitip-carte3__note li::before{content:"";position:absolute;left:2px;top:.55em;width:4px;height:4px;border-radius:50%;background:#2364A4}
.dpitip-w .dpitip-carte3 .dpitip-parte__nota{display:none}
/* il materiale per grammatura (vedi materiali) */
.dpitip-w .dpitip-grammi .dpitip-parte__bottoni{display:grid;grid-template-columns:repeat(auto-fill,minmax(112px,1fr));gap:8px}
.dpitip-w .dpitip-grammi .dpitip-parte__bottoni > button{display:flex;flex-direction:column;align-items:flex-start;gap:2px;height:auto;padding:10px 12px;border-radius:10px;text-align:left;position:relative}
.dpitip-w .dpitip-grammi .dpitip-parte__bottoni > button > span:not([class]){display:none}
.dpitip-w .dpitip-grammi__g{font-size:13px;line-height:1.1}
.dpitip-w .dpitip-grammi__g b{font-size:22px;font-weight:800;letter-spacing:-.01em}
.dpitip-w .dpitip-grammi__resto{font-size:12px;line-height:1.3;opacity:.8}
.dpitip-w .dpitip-grammi__eco{position:absolute;top:8px;right:8px;font-size:10px;font-weight:700;letter-spacing:.03em;padding:2px 6px;border-radius:999px;background:#E3F3E8;color:#1E7A3E}
/* la consegna: tre tessere (vedi consegne) */
.dpitip-w .dpitip-cons{display:grid;grid-template-columns:repeat(auto-fill,minmax(128px,1fr));gap:10px}
.dpitip-w .dpitip-cons > button{display:flex;flex-direction:column;align-items:flex-start;gap:6px;height:auto;padding:12px;border-radius:12px;background:#FFFFFF;color:#0B1F45;border:1.5px solid #DFE6EF;text-align:left;position:relative}
.dpitip-w .dpitip-cons > button:hover{border-color:#2364A4}
.dpitip-w .dpitip-cons > button[aria-pressed=true]{background:#FFFFFF;color:#0B1F45;border:2px solid #0B1F45;box-shadow:0 4px 14px rgba(11,31,69,.12)}
.dpitip-w .dpitip-cons > button[aria-pressed=true]::after{content:"";position:absolute;top:8px;right:8px;width:20px;height:20px;border-radius:50%;background:#0B1F45 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5.5 10.5l3 3 6-6.5' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/20px no-repeat}
.dpitip-w .dpitip-cons__fig{color:#0B1F45}.dpitip-w .dpitip-cons__fig svg{display:block;width:44px;height:31px}
.dpitip-w .dpitip-cons > button > span:not([class]){font-size:15px;font-weight:700;line-height:1.2}
.dpitip-w .dpitip-cons__info{display:flex;flex-direction:column;gap:4px;font-size:12px;line-height:1.35;color:#5A6B85;font-weight:400}
.dpitip-w .dpitip-cons__righe{white-space:pre-line}
.dpitip-w .dpitip-cons__prezzo{font-size:13px;font-weight:700;color:#0B1F45;line-height:1.3}
.dpitip-w .dpitip-cons__prezzo:empty,.dpitip-w .dpitip-cons__righe:empty{display:none}
/* il configuratore dal vivo (vedi vivoPannello) */
.dpitip-w .dpitip-vivo{margin:0 0 4px;transition:opacity .15s}
.dpitip-w .dpitip-vivo .dpitip-parte__tit{display:none}
.dpitip-w .dpitip-vivo--attesa{opacity:.45;pointer-events:none}
/* le fasce di spessore sopra i grammi (vedi fasce) */
.dpitip-w .dpitip-fasce{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:0 0 10px}
.dpitip-w .dpitip-fasce > button{display:flex;flex-direction:column;align-items:center;gap:1px;height:auto;padding:10px 8px;border-radius:10px;text-align:center}
.dpitip-w .dpitip-fasce > button > b{font-size:15px;font-weight:800}
.dpitip-w .dpitip-fasce__g{font-size:12px;font-weight:600}
.dpitip-w .dpitip-fasce__nota{font-size:11.5px;opacity:.75}
/* 04/10 — Ale: « bianche? » — il bottone prendeva il bianco su bianco del tema: colori espliciti */
.dpitip-w .dpitip-parte .dpitip-fasce > button{background:#FFFFFF;color:#0B1F45;border:1.5px solid #D5DEEA;box-shadow:none;cursor:pointer;min-height:0;line-height:1.25;text-transform:none;letter-spacing:0}
.dpitip-w .dpitip-parte .dpitip-fasce > button:hover{border-color:#2364A4}
.dpitip-w .dpitip-parte .dpitip-fasce > button[aria-pressed=true]{background:#0B1F45;color:#FFFFFF;border-color:#0B1F45}
.dpitip-w .dpitip-parte .dpitip-fasce > button > *{color:inherit;display:block;visibility:visible;position:static}
.dpitip-w .dpitip-grammi .dpitip-parte__bottoni > button[hidden]{display:none}
/* il formato e il modello in tessere (vedi formati) */
.dpitip-w .dpitip-parte__bottoni.dpitip-formati,.dpitip-w .dpitip-parte__bottoni.dpitip-sagome{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:8px}   /* 04/10 collaudo: batte :has(.dpitip-parte--fig) del foglio pubblico */
.dpitip-w .dpitip-formati > button,.dpitip-w .dpitip-sagome > button{display:flex;flex-direction:column;align-items:center;gap:4px;height:auto;padding:10px 8px;border-radius:10px;text-align:center}
.dpitip-w .dpitip-formati > button > span:not([class]){display:none}
.dpitip-w .dpitip-formati__vano{display:flex;align-items:flex-end;justify-content:center;width:64px;height:60px}
.dpitip-w .dpitip-formati__foglio{display:block;background:#FFFFFF;border:1.5px solid currentColor;border-radius:2px;box-shadow:2px 2px 0 rgba(11,31,69,.12)}
.dpitip-w .dpitip-formati__nome{font-size:14px;font-weight:700;line-height:1.2}
.dpitip-w .dpitip-formati__misure{font-size:11.5px;opacity:.8}
.dpitip-w .dpitip-sagoma svg{display:block;width:40px;height:40px}
.dpitip-w .dpitip-sagome > button > span:not([class]){font-size:13px;font-weight:600;line-height:1.25}
.dpitip-w .dpitip-sagome > button > span:not([class])::first-letter{text-transform:uppercase}
@media (max-width:520px){
  .dpitip-w .dpitip-cons{grid-template-columns:1fr}
  .dpitip-w .dpitip-cons > button{display:grid;grid-template-columns:52px 1fr;column-gap:12px;align-items:center}
  .dpitip-w .dpitip-cons__fig{grid-row:span 2}
  .dpitip-w .dpitip-carte3 .dpitip-parte__bottoni{grid-template-columns:1fr}
  .dpitip-w .dpitip-carte3 .dpitip-parte__bottoni > button{display:grid;grid-template-columns:96px 1fr;column-gap:12px;align-items:center}
  .dpitip-w .dpitip-carte3__campione{grid-row:span 2}
  .dpitip-w .dpitip-fasi{display:flex;overflow-x:auto;scrollbar-width:none}
  .dpitip-w .dpitip-fasi button{flex:0 0 auto;min-width:118px;max-width:170px}
}

/* 0.28.3 — la striscia dei passi scorre dentro la scheda, non allarga la pagina sul telefono */
.dpitip-w .dpitip-carta-cfg{min-width:0;max-width:100%}

/* 09/10 — la foto grande segue il motivo scelto (dpitip-fasi.js, mostraFoto) */
.dpitip-sc__foto img{transition:opacity .18s ease}
.dpitip-sc__foto img.dpitip-sc__cambia{opacity:.35}
.dpitip-sc__foto--motivo{position:relative}
.dpitip-sc__foto--motivo img{object-fit:contain;background:#fff}
.dpitip-sc__foto--motivo::after{content:attr(data-motivo);position:absolute;left:16px;bottom:16px;max-width:calc(100% - 32px);padding:8px 14px;border-radius:10px;background:rgba(11,31,69,.86);color:#fff;font-weight:700;font-size:15px;line-height:1.25;pointer-events:none}
