/* AIPart A7 - pagina «Fai valutare la tua bolletta all'AI» */
.mesr_ai .mesr_ai_informativa { font-size: .8em; line-height: 1.4; padding: .5em 0; }
.mesr_ai .mesr_ai_informativa input { margin-right: .4em; }
.mesr_ai .mesr_ai_box { margin: .8em 0; padding: .7em 1em; border-radius: 6px; font-size: .9em; }
.mesr_ai #mesr_ai_attesa { background: #fff6e5; border: 1px solid #f0b350; }
.mesr_ai .mesr_ai_ok { background: #eaf6ee; border: 1px solid #5aa874; }
.mesr_ai .mesr_ai_errore { background: #fdecec; border: 1px solid #d36a6a; }
.mesr_ai .mesr_ai_box ul { margin: 0; padding-left: 1.2em; }
.mesr_ai .mesr_ai_fornitura { margin-left: .5em; padding: .3em .9em; border: 1px solid var(--color-1); background: #fff; border-radius: 4px; cursor: pointer; }
.mesr_ai .mesr_ai_fornitura.attiva { background: var(--color-1); color: #fff; }
.mesr_ai_da_completare { border: 2px solid #e08a00 !important; background: #fff8ec !important; }
/* R9.2 (14/10/2026) - grafica e testi definitivi del Cliente: stesso stile del modulo «Verifica la tua bolletta» della homepage
   (riquadro inner-contents-box con bordo var(--color-1), titolo main_title arancione, righe row mono etichetta/valore,
   campi form-control con bordo arancione, pulsante custom-btn-primary). Qui solo gli elementi propri del modulo AI. */
.mesr_ai .mesr_ai_testata { margin-bottom: 20px; }
.mesr_ai .mesr_ai_sottotitolo { font-size: .8em; font-weight: bold; color: #212529; }
.mesr_ai .mesr_ai_file { display: flex; align-items: center; gap: 10px; height: auto; min-height: calc(1.5em + .75rem + 2px); margin: 0; cursor: pointer; color: #495057; background: #fff; min-width: 0; font-weight: normal; }
.mesr_ai .mesr_ai_file span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mesr_ai .mesr_ai_icona { flex: none; }
.mesr_ai .mesr_ai_file_input { position: absolute; width: 1px; height: 1px; opacity: 0; overflow: hidden; }
.mesr_ai .mesr_ai_file_input:focus-visible + .mesr_ai_file { box-shadow: 0 0 0 .2rem rgba(228, 102, 39, .25); }
.mesr_ai .mesr_ai_nota { font-size: .85em; color: #495057; line-height: 1.45; margin: 0 0 18px; }
.mesr_ai .mesr_ai_nota strong { color: #212529; }
.mesr_ai .mesr_ai_consenso { display: flex; align-items: center; gap: 10px; font-size: .85em; color: #212529; margin: 0 0 10px; font-weight: normal; cursor: pointer; }
.mesr_ai .mesr_ai_consenso input { width: 20px; height: 20px; flex: none; margin: 0; accent-color: var(--color-orange); }
.mesr_ai .simulatore_risparmio_submit_btn_container .mesr_ai_invia { max-width: 100%; white-space: normal; }
@media (max-width: 575px) { .mesr_ai .simulatore_risparmio_submit_btn_container .mesr_ai_invia { width: 100%; } }
/* R9.3 (14/10/2026) - indicazioni del Cliente: nessun bordo e nessun titolo, il blocco si integra nella pagina WordPress */
.calcola_risparmio_section.mesr_ai .inner-contents-box.mesr_ai_riquadro { border: 0; box-shadow: none; }
/* Collaudo rev.01 (17/10/2026), immagini del Cliente «Blocco superiore comparatore» e «Modulo automatico AI»:
   schede «Inserisci i dati» / «Carica la bolletta con l'AI» sopra il comparatore, modulo AI con lo stesso riquadro della
   compilazione manuale, area di caricamento celeste, pulsante arrotondato e riga «100% sicuro». */
.mesr_schede_wrap { margin-bottom: 0; }
.mesr_schede { display: flex; gap: 4px; background: var(--color-1); padding: 6px 6px 0; border-radius: 10px 10px 0 0; }
.mesr_scheda { flex: 1 1 50%; display: flex; align-items: center; justify-content: center; gap: 8px; min-width: 0; padding: 12px 10px; border: 0; border-radius: 8px 8px 0 0;
  background: #e9edf2; color: #1f2d3d; font-weight: bold; font-size: .95em; line-height: 1.2; cursor: pointer; text-align: center; }
.mesr_scheda span { overflow-wrap: anywhere; }
.mesr_scheda svg { flex: none; }
.mesr_scheda .mesr_stellina { color: #f0a020; }
.mesr_scheda.attiva { background: var(--color-orange); color: #fff; }
.mesr_scheda.attiva .mesr_stellina { color: #fff; }
.mesr_scheda:focus-visible { outline: 3px solid #fff; outline-offset: -5px; }
.mesr_schede_wrap .mesr_pannello > .calcola_risparmio_section .inner-contents-box:first-child,
.mesr_schede_wrap #mesr_pannello_manuale .inner-contents-box:first-of-type { border-top-left-radius: 0; border-top-right-radius: 0; }
.mesr_ai.mesr_ai_scheda .inner-contents-box.mesr_ai_riquadro { border: 3px solid var(--color-1); }
.mesr_ai.mesr_ai_scheda .mesr_ai_testata .mesr_ai_sottotitolo { font-size: .7em; }
.mesr_ai .mesr_ai_pdf_etichetta { margin-bottom: 8px; }
.mesr_ai .mesr_ai_obbligatorio { color: #d9381e; }
.mesr_ai .mesr_ai_zona { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; width: 100%; margin: 0; padding: 22px 14px;
  background: #eaf4fc; border: 1px dashed #9cc3e6; border-radius: 8px; color: #1f5d99; text-align: center; cursor: pointer; font-weight: normal; }
.mesr_ai .mesr_ai_zona.trascina { background: #d7ebfa; border-color: #1f5d99; }
.mesr_ai .mesr_ai_zona_titolo { font-weight: bold; color: #1f3f66; overflow-wrap: anywhere; max-width: 100%; }
.mesr_ai .mesr_ai_zona_testo { font-size: .8em; color: #5b6878; }
.mesr_ai .mesr_ai_file_input:focus-visible + .mesr_ai_zona { box-shadow: 0 0 0 .2rem rgba(31, 93, 153, .35); }
.mesr_ai .simulatore_risparmio_submit_btn_container .mesr_ai_invia { width: 100%; border-radius: 999px; padding-top: .8em; padding-bottom: .8em; }
.mesr_ai .mesr_ai_sicuro { margin: 10px 0 0; font-size: .8em; color: #3c4858; display: flex; align-items: center; justify-content: center; gap: 6px; }
@media (max-width: 575px) { .mesr_scheda { font-size: .82em; padding: 10px 6px; gap: 5px; } }
/* Collaudo rev.01, verifica in TEST del 17/10: lo stile dei pulsanti del tema (sfondo, bordo arrotondato, hover/focus)
   prevaleva sulle schede; barra delle schede larga quanto il riquadro del comparatore. */
.mesr_schede_wrap .mesr_schede { margin: 0; }
.mesr_schede_wrap .mesr_schede button.mesr_scheda,
.mesr_schede_wrap .mesr_schede button.mesr_scheda:hover,
.mesr_schede_wrap .mesr_schede button.mesr_scheda:focus { background: #e9edf2 !important; color: #1f2d3d !important; border: 0 !important;
  border-radius: 8px 8px 0 0 !important; box-shadow: none !important; text-transform: none !important; margin: 0 !important; }
.mesr_schede_wrap .mesr_schede button.mesr_scheda.attiva,
.mesr_schede_wrap .mesr_schede button.mesr_scheda.attiva:hover,
.mesr_schede_wrap .mesr_schede button.mesr_scheda.attiva:focus { background: var(--color-orange) !important; color: #fff !important; }
.mesr_schede_wrap .mesr_schede button.mesr_scheda:hover:not(.attiva) { background: #f6f8fa !important; }
.mesr_schede_wrap .mesr_schede button.mesr_scheda { white-space: normal !important; overflow: hidden; line-height: 1.2 !important; height: auto !important; }
.mesr_ai .simulatore_risparmio_submit_btn_container input.mesr_ai_invia { padding: .75em 1.2em !important; border-radius: 999px !important; width: 100%; font-size: 1em; height: auto !important; line-height: 1.3 !important; }
/* Collaudo rev.02 (R2-04a, 19/10/2026) - responsive verificato in TEST:
   smartphone (fino a 575 px) schede su due righe e della stessa altezza; tablet (768-1024 px) il comparatore usciva in una
   colonna di circa 300 px: le colonne della sezione che lo contiene vanno a tutta larghezza e il comparatore resta centrato. */
@media (max-width: 575px) {
  .mesr_schede_wrap .mesr_schede { align-items: stretch; }
  .mesr_schede_wrap .mesr_schede button.mesr_scheda { font-size: 13px !important; padding: 9px 6px !important; gap: 5px !important; }
  .mesr_schede_wrap .mesr_schede button.mesr_scheda svg { width: 15px; height: 15px; }
}
@media (min-width: 768px) and (max-width: 1024px) {
  .elementor-container:has(> .elementor-column .mesr_schede_wrap) { flex-wrap: wrap; }
  .elementor-container:has(> .elementor-column .mesr_schede_wrap) > .elementor-column { width: 100% !important; }
  .elementor-widget:has(> .elementor-widget-container .mesr_schede_wrap) { width: 100% !important; max-width: 560px !important; margin-left: auto !important; margin-right: auto !important; }
}
/* Collaudo rev.02 (R2-04b, 19/10/2026) - grafica delle schede richiesta dal Cliente (immagine «Manuale / Con l'AI»):
   riquadro bianco unico con angoli arrotondati e ombra, scheda attiva bianca unita al riquadro, scheda non attiva color crema,
   testi e icone blu scuro. Il contenuto del comparatore e del modulo AI resta invariato.
   Collaudo rev.03 (integrazioni funzionali 5, 20/10/2026): la scheda non attiva passa dal crema al celeste del sito (#329FDA
   schiarito al 25%: #CCE7F6, al passaggio del mouse #B7DDF2), più evidente sul bianco e in armonia con lo sfondo blu delle pagine;
   la scheda attiva resta bianca, unita al riquadro, con una linea blu del sito sul bordo superiore. */
.mesr_schede_wrap { background: #fff; border: 1px solid #b9dcf3; border-radius: 18px; box-shadow: 0 10px 30px rgba(10, 60, 120, .18); overflow: hidden; }
.mesr_schede_wrap .mesr_schede { gap: 0; padding: 0; background: #cce7f6; border-radius: 0; }
.mesr_schede_wrap .mesr_schede button.mesr_scheda,
.mesr_schede_wrap .mesr_schede button.mesr_scheda:hover,
.mesr_schede_wrap .mesr_schede button.mesr_scheda:focus { position: relative; overflow: visible; background: #cce7f6 !important; color: #16244f !important; border-radius: 0 !important;
  padding: 18px 12px !important; font-size: 1.15em !important; font-weight: 700 !important; gap: 12px !important; }
.mesr_schede_wrap .mesr_schede button.mesr_scheda:hover:not(.attiva) { background: #b7ddf2 !important; }
/* rev.03 (20/10 sera): al passaggio del mouse sulla scheda non attiva si colora anche l'angolo sopra il raccordo curvo,
   che lascia vedere lo sfondo della barra delle schede */
.mesr_schede_wrap .mesr_schede:has(button.mesr_scheda:not(.attiva):hover) { background: #b7ddf2; }
.mesr_schede_wrap .mesr_schede button.mesr_scheda.attiva,
.mesr_schede_wrap .mesr_schede button.mesr_scheda.attiva:hover,
.mesr_schede_wrap .mesr_schede button.mesr_scheda.attiva:focus { background: #fff !important; color: #16244f !important; z-index: 1; box-shadow: inset 0 4px 0 #329fda !important; }
.mesr_schede_wrap .mesr_schede button.mesr_scheda[data-scheda="manuale"].attiva { border-top-right-radius: 22px !important; }
.mesr_schede_wrap .mesr_schede button.mesr_scheda[data-scheda="ai"].attiva { border-top-left-radius: 22px !important; }
.mesr_schede_wrap .mesr_schede button.mesr_scheda svg { width: 26px; height: 26px; color: #16244f; }
.mesr_schede_wrap .mesr_scheda .mesr_stellina { display: none; }
.mesr_schede_wrap .mesr_scheda:focus-visible { outline: 3px solid #329fda; outline-offset: -5px; }
/* raccordo curvo tra la scheda attiva e quella non attiva */
.mesr_schede_wrap .mesr_scheda.attiva::after { content: ""; position: absolute; bottom: 0; width: 22px; height: 22px; pointer-events: none; }
.mesr_schede_wrap .mesr_scheda[data-scheda="manuale"].attiva::after { right: -22px; background: radial-gradient(circle at 100% 0, transparent 21px, #fff 22px); }
.mesr_schede_wrap .mesr_scheda[data-scheda="ai"].attiva::after { left: -22px; background: radial-gradient(circle at 0 0, transparent 21px, #fff 22px); }
.mesr_schede_wrap .mesr_pannello .inner-contents-box,
.mesr_ai.mesr_ai_scheda .inner-contents-box.mesr_ai_riquadro { border: 0 !important; border-radius: 0 !important; box-shadow: none !important; }
@media (max-width: 575px) {
  .mesr_schede_wrap .mesr_schede button.mesr_scheda,
  .mesr_schede_wrap .mesr_schede button.mesr_scheda:hover,
  .mesr_schede_wrap .mesr_schede button.mesr_scheda:focus { font-size: 15px !important; padding: 14px 8px !important; gap: 8px !important; }
  .mesr_schede_wrap .mesr_schede button.mesr_scheda svg { width: 20px; height: 20px; }
}
/* Fix revisione 01 (Cliente, 23/10/2026) - comparatore a schede piu' compatto in basso:
   «Manuale» senza spazio bianco sotto «Clicca QUI per azzerare i campi»; «Con l'AI» con i messaggi sopra il pulsante
   «Analizza senza registrarti», senza la riga «100% sicuro» e senza spazio bianco sotto il pulsante.
   Il modulo senza schede (ai="no") resta invariato; dentro il comparatore il secondo blocco del modulo manuale
   (periodo, costi e consumi) resta separato da una linea sottile. */
.mesr_schede_wrap .mesr_pannello .calcola_risparmio_section .inner-contents-box { margin-bottom: 0; padding-bottom: 12px; }
.mesr_schede_wrap #mesr_pannello_manuale .inner-contents-box-content > .row.mono:last-child { padding: .5em 0 0 !important; margin-bottom: 0; border-bottom: 0; }
.mesr_schede_wrap #mesr_pannello_manuale #data_container > .inner-contents-box { border-top: 1px solid #f4f4f4 !important; }
.mesr_ai [data-mesr-ai="azioni"] { padding-bottom: 0; margin-bottom: 0; border-bottom: 0; }
.mesr_ai [data-mesr-ai="azioni"] .simulatore_risparmio_submit_btn_container { margin-bottom: 0 !important; }
.mesr_ai .mesr_ai_box { margin: 0 0 12px; }