/* ═══ Le parti nuove delle pagine VEICOLO · 29/10/2026 ═══
   ⚠️ Ogni misura che conta è dichiarata !important: il foglio di stile del
   sito azzera margini, altezze e sfondi dei blocchi nuovi (trappola 1). */

/* ─── le tendine (richiami · reclami · coppie di serraggio) ─── */
details[data-ta-tendina] { margin: 10px 0 0 !important; }
.ta-tendina-s {
  display: flex !important; align-items: center !important; gap: 10px !important;
  cursor: pointer !important; list-style: none !important;
  font: 700 14.5px/1.3 system-ui, sans-serif !important; color: #1f6fb2 !important;
  background: #f3f7fb !important; border: 1px solid #d6e3ef !important;
  border-radius: 10px !important; padding: 13px 16px !important; margin: 0 !important;
}
.ta-tendina-s::-webkit-details-marker { display: none; }
.ta-tendina-s::before {
  content: '▸'; font-size: 15px; line-height: 1;
  transition: transform .15s ease; flex: 0 0 auto;
}
details[data-ta-tendina][open] > .ta-tendina-s::before { transform: rotate(90deg); }
details[data-ta-tendina][open] > .ta-tendina-s { border-radius: 10px 10px 0 0 !important; }
.ta-tendina-c {
  border: 1px solid #d6e3ef !important; border-top: 0 !important;
  border-radius: 0 0 10px 10px !important; padding: 14px 16px !important;
  margin: 0 !important; background: #fff !important;
}

/* ─── il comparatore pneumatici su due colonne (punto 2) ─── */
.ta-tyre-fila {
  display: flex !important; align-items: flex-start !important;
  gap: 22px !important; margin: 10px 0 0 !important; width: 100% !important;
}
.ta-tyre-sx { flex: 0 0 300px !important; max-width: 300px !important; margin: 0 !important; }
.ta-tyre-sx img {
  width: 100% !important; max-width: 300px !important; height: auto !important;
  max-height: 300px !important; object-fit: contain !important;
  display: block !important; margin: 0 !important; border-radius: 12px !important;
}
.ta-tyre-dx { flex: 1 1 0% !important; min-width: 0 !important; margin: 0 !important; }
.ta-tyre-dx > * { margin-top: 0 !important; }
@media (max-width: 760px) {
  .ta-tyre-fila { flex-direction: column !important; gap: 12px !important; }
  .ta-tyre-sx {
    flex: 0 0 auto !important; width: 100% !important; max-width: 100% !important;
    text-align: center !important;
  }
  .ta-tyre-sx img { max-width: 190px !important; max-height: 190px !important; margin: 0 auto !important; }
  /* 29/10 sera — riparazione: in colonna il lato destro restava largo quanto il suo
     contenuto (521 pt dentro 367) e DIAMETRO e i pulsanti finivano fuori schermo. */
  .ta-tyre-fila { align-items: stretch !important; }
  .ta-tyre-dx {
    flex: 0 0 auto !important; width: 100% !important; max-width: 100% !important;
    align-self: stretch !important; box-sizing: border-box !important;
  }
  .ta-tyre-dx .sel, .ta-tyre-dx .res, .ta-tyre-dx .mu, .ta-tyre-dx .grid,
  .ta-tyre-dx .row, .ta-tyre-dx .hint {
    max-width: 100% !important; box-sizing: border-box !important;
  }
  .ta-tyre-dx .grid > *, .ta-tyre-dx .off {
    flex: 1 1 100% !important; width: 100% !important; max-width: 100% !important;
    min-width: 0 !important; box-sizing: border-box !important;
  }
  .ta-tyre-dx .off > *, .ta-tyre-dx .sup, .ta-tyre-dx .nm, .ta-tyre-dx .pr {
    max-width: 100% !important; min-width: 0 !important; box-sizing: border-box !important;
    overflow-wrap: anywhere !important;
  }
}

/* ─── la scheda dell'abbonamento (punto 3) ─── */
.ta-abb {
  background: linear-gradient(100deg, #101a2c 0%, #17243c 55%, #1e3050 100%) !important;
  border: 1px solid #2b3f5e !important; border-radius: 14px !important;
  padding: 24px 26px !important; margin: 18px 0 !important; color: #e7eefb !important;
}
.ta-abb-occ {
  font: 800 11.5px/1.2 system-ui, sans-serif !important; letter-spacing: .17em !important;
  color: #ff8a82 !important; margin: 0 0 9px !important;
}
.ta-abb-tit {
  font: 800 25px/1.18 Montserrat, system-ui, sans-serif !important; color: #fff !important;
  margin: 0 0 8px !important; padding: 0 !important; border: 0 !important;
}
.ta-abb-riga {
  font: 400 15px/1.5 system-ui, sans-serif !important; color: #c6d4ea !important;
  margin: 0 0 16px !important;
}
.ta-abb-voci {
  display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 7px 22px !important; list-style: none !important; margin: 0 0 20px !important;
  padding: 0 !important;
}
.ta-abb-voci li {
  font: 600 14px/1.4 system-ui, sans-serif !important; color: #dbe6f7 !important;
  margin: 0 !important; padding: 0 0 0 23px !important; position: relative !important;
}
.ta-abb-voci li::before {
  content: '✓'; position: absolute; left: 0; top: 0;
  color: #4cc98a; font-weight: 800; font-size: 13.5px;
}
.ta-abb-cta {
  display: inline-flex !important; align-items: center !important;
  background: #e8473f !important; color: #fff !important; text-decoration: none !important;
  font: 800 15.5px/1 system-ui, sans-serif !important; padding: 15px 25px !important;
  border-radius: 10px !important; border: 0 !important;
}
@media (max-width: 760px) {
  .ta-abb { padding: 18px 16px !important; }
  .ta-abb-tit { font-size: 20px !important; }
  .ta-abb-voci { grid-template-columns: 1fr !important; gap: 6px !important; }
}

/* ─── gli spazi pubblicitari: segnaposto solo nell'anteprima ─── */
.ta-ad-spazio {
  display: flex !important; align-items: center !important; justify-content: center !important;
  /* 30/10 — ERA 108px: una MIA invenzione, e faceva credere che la pubblicità
     fosse una striscia. La misura VERA, già viva sulle 60.765 pagine codice
     (ta-pagina-nuova-r13: .ta-pn-spazio), è 280 punti sul computer e 250 sul
     telefono, con i margini a 22. L'anteprima deve mostrare quella. */
  min-height: 250px !important; margin: 22px 0 !important;
  border: 2px dashed #9bb7d4 !important; border-radius: 12px !important;
  background: #eef4fa !important;
}
@media (max-width: 760px) { .ta-ad-spazio { min-height: 280px !important; } }
.ta-ad-spazio span {
  font: 700 12.5px/1.4 system-ui, sans-serif !important; color: #5c7b9c !important;
  letter-spacing: .06em !important; text-align: center !important; padding: 0 14px !important;
}

/* ─── il banner dell'app segue la colonna, qui più larga che sulle pagine codice ─── */
.ta-asset-page .ta-appban2, .user-content .ta-appban2 {
  max-width: 100% !important;
}

/* ─── 29/10 sera — il collegamento in coda ai codici OBD2 era #1b2a4a su fondo
       blu scuro: invisibile in tutte e due le viste. Reso leggibile. ─── */
#codici p > a { color: #8fb6e8 !important; text-decoration: underline !important; }
#codici p > a:hover { color: #ffffff !important; }

/* ════════════════════════════════════════════════════════════════════
   30/10/2026 — LE RICHIESTE DEL PRESIDENTE DOPO LA PRIMA VISTA
   ════════════════════════════════════════════════════════════════════ */

/* ─── «problemi comuni»: una fila che scorre di lato, non una griglia alta ─── */
.problems-grid.ta-fila {
  display: flex !important;
  grid-template-columns: none !important;
  gap: 14px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scroll-snap-type: x mandatory !important;
  -webkit-overflow-scrolling: touch !important;
  padding-bottom: 10px !important;
  scrollbar-width: thin;
}
.problems-grid.ta-fila > * {
  flex: 0 0 340px !important;
  max-width: 340px !important;
  min-width: 0 !important;
  scroll-snap-align: start !important;
  box-sizing: border-box !important;
}
.problems-grid.ta-fila::-webkit-scrollbar { height: 8px; }
.problems-grid.ta-fila::-webkit-scrollbar-thumb { background: #2f4c7d; border-radius: 8px; }
.problems-grid.ta-fila::-webkit-scrollbar-track { background: #16233c; border-radius: 8px; }
.ta-fila-nota {
  margin: 6px 0 8px !important; font-size: 13px !important;
  color: #8fb6e8 !important; letter-spacing: .02em !important;
}
@media (max-width: 760px) {
  .problems-grid.ta-fila > * { flex: 0 0 84% !important; max-width: 84% !important; }
}

/* ─── le domande frequenti: tendina solo sul telefono ─── */
.ta-faq-tendina { margin-top: 10px !important; }
.ta-faq-tendina > .ta-faq-s { cursor: pointer !important; }
@media (min-width: 761px) {
  /* sul computer restano aperte e senza linguetta: nessun cambiamento visibile */
  .ta-faq-tendina > .ta-faq-s { display: none !important; }
}

/* ─── nell'anteprima l'avviso dei biscotti copre mezza schermata e non si può
       chiudere in una fotografia: nell'anteprima si nasconde (sul sito resta) ─── */
#cookie-notice { display: none !important; }

/* ════════════════════════════════════════════════════════════════════
   30/10/2026 sera — AGGIUNTE PER IL SITO VIVO (non servivano nella
   fotografia, servono qui). Trovate guardando le pagine vere.
   ════════════════════════════════════════════════════════════════════ */

/* i riquadri pubblicitari: scuri e bordati come le sezioni */
.ta-ad-spazio{
  background:linear-gradient(160deg,#101d38 0%,#13213f 100%)!important;
  border:1px solid #27385c!important;border-radius:14px!important;
  box-shadow:0 1px 0 rgba(255,255,255,.04) inset!important;
  display:flex!important;flex-direction:column!important;
  align-items:center!important;justify-content:center!important;
  margin:26px auto!important;position:relative!important;overflow:hidden!important;
}
.ta-ad-spazio::before{
  content:"Pubblicit\00E0";position:absolute;top:10px;left:14px;
  font:600 10px/1 system-ui,sans-serif;letter-spacing:.18em;color:#55688a;
}
.ta-ad-spazio ins{width:100%!important}
/* ⛔ un riquadro rimasto VUOTO non deve restare aperto: si chiude da solo */
.ta-ad-spazio[data-ta-vuoto]{display:none!important}

/* le linguette delle tendine */
.ta-tendina-s{
  display:block!important;cursor:pointer!important;list-style:none!important;
  background:#f3f7fc!important;color:#1b3f6b!important;
  border-radius:10px!important;padding:13px 16px!important;
  font:700 14px/1.3 system-ui,sans-serif!important;margin:10px 0 0!important;
}
.ta-tendina-s::-webkit-details-marker{display:none}
.ta-tendina-c{padding-top:10px!important}