/*
 * Correzioni dei flussi pubblici (30/9 pomeriggio, kit rilascio/flussi-pubblico-30-9).
 * Difetti della galleria dei flussi 1–8 e 11 (https://claude.ai/artifact/2za9ohxnBMXSg175FL4hJY)
 * e D125.4 («Esci» nel menu del telefono). Ogni blocco dice flusso e passo.
 * Si carica per ultimo da mu-plugins/tbp-flussi-pubblico.php. Valori di linguaggio/02_STILE.md.
 * Colombo al telefono (D125.3) sta nel suo foglio: css/tbp-colombo-chat.css, blocco in fondo.
 */

/* ------------------------------------------------------------------ */
/* D125.4 · Menu del telefono: «Esci» e' una riga come le altre, con   */
/* la parola in rosso scuro e senza blocco pieno. Il bottone che chiude */
/* il menu e' una X su fondo neutro (prima una freccia su rosso pieno). */
/* ------------------------------------------------------------------ */
html body:not(#tbp-niente) .off-canvas-center .tbp-account-shortcuts a.tbp-account-shortcut--logout,
html body:not(#tbp-niente) .off-canvas-center .tbp-account-shortcuts a.tbp-account-shortcut--logout:is(:hover, :focus, :active, .tbp-drawer-current) {
  min-height: 80px !important;
  margin-top: 8px !important;
  padding: 0 10px !important;
  gap: 6px !important;
  background: transparent !important;
  color: var(--tbp-red-dark, #A91E2A) !important;
  box-shadow: none !important;
}
html body:not(#tbp-niente) .off-canvas-center a.tbp-account-shortcut--logout span {
  color: var(--tbp-red-dark, #A91E2A) !important;
  -webkit-text-fill-color: var(--tbp-red-dark, #A91E2A) !important;
}
html body:not(#tbp-niente) .off-canvas-center a.tbp-account-shortcut--logout:focus-visible {
  outline: 3px solid var(--tbp-green, #084828) !important;
  outline-offset: 3px !important;
}
/* Tema scuro: il rosso scuro sul nero non si legge; lo stesso rosso chiaro degli errori (#FF8A8F). */
html[data-tbp-theme="dark"] body:not(#tbp-niente) .off-canvas-center a.tbp-account-shortcut--logout span {
  color: #FF8A8F !important;
  -webkit-text-fill-color: #FF8A8F !important;
}

html body:not(#tbp-niente) .off-canvas-center .tbp-drawer-back,
html body:not(#tbp-niente) .mfp-wrap.off-canvas-center .tbp-drawer-back {
  background: #F1F4F2 !important;
  background-color: #F1F4F2 !important;
  color: var(--tbp-green, #084828) !important;
}
html body:not(#tbp-niente) .off-canvas-center .tbp-drawer-back:is(:hover, :focus-visible) {
  background: #E4E7E5 !important;
  background-color: #E4E7E5 !important;
  color: var(--tbp-green, #084828) !important;
}
html body:not(#tbp-niente) .off-canvas-center .tbp-drawer-back:focus-visible {
  outline: 3px solid var(--tbp-green, #084828) !important;
  outline-offset: 3px !important;
}
/* La freccia diventa una X, a tratto 1,8 px come gli altri segni dell'interfaccia. */
html body:not(#tbp-niente) .off-canvas-center .tbp-drawer-back svg {
  display: none !important;
}
html body:not(#tbp-niente) .off-canvas-center .tbp-drawer-back::before {
  content: "";
  display: block;
  width: 22px;
  height: 22px;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E") center / contain no-repeat;
}
html[data-tbp-theme="dark"] body:not(#tbp-niente) .off-canvas-center .tbp-drawer-back {
  background: #1E1E1E !important;
  background-color: #1E1E1E !important;
  color: #EDEDED !important;
  box-shadow: inset 0 0 0 1px #333333 !important;
}
html[data-tbp-theme="dark"] body:not(#tbp-niente) .off-canvas-center .tbp-drawer-back:is(:hover, :focus-visible) {
  background: #2B302D !important;
  background-color: #2B302D !important;
  color: #EDEDED !important;
}

/* ------------------------------------------------------------------ */
/* 2.4 · Catalogo al computer: i titoli delle schede interi, non       */
/* tagliati con i puntini dopo due righe. 20 px come al telefono.      */
/* ------------------------------------------------------------------ */
@media (min-width: 850px) {
  html body :is(#tbp-results-container, .tbp-exp-card-scope) .tbp-exp-card .tbp-exp-card__head :is(h3, .tbp-exp-card__title) {
    font-size: var(--tbp-titolo-sezione, 20px) !important;
    line-height: 1.22 !important;
    -webkit-line-clamp: 5 !important;
    text-wrap: balance;
  }
}

/* ------------------------------------------------------------------ */
/* 3.5 e 3.6 · «Controlla la tua email» / «Email confermata» al        */
/* computer: il bottone era verde con la scritta verde (vuoto). Oro    */
/* come al telefono: e' l'azione principale della pagina.              */
/* ------------------------------------------------------------------ */
html body.registrazione-confermata a.button.tbp-auth-flow__submit,
html body.registrazione-confermata a.button.tbp-auth-flow__submit:is(:hover, :focus, :active) {
  background: var(--tbp-cta-gold, linear-gradient(135deg, #F0BE00 0%, #A8821C 100%)) !important;
  color: var(--tbp-gold-label, #052b18) !important;
  -webkit-text-fill-color: var(--tbp-gold-label, #052b18) !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* ------------------------------------------------------------------ */
/* 4.4 · «Diventa professionista» (da cliente): in alto il marchio      */
/* della testata come nelle altre pagine (prima era nascosto e restava  */
/* uno spazio bianco); nella scheda non si ripete. Passi leggibili:     */
/* 13 px, non in maiuscolo, anche su due righe («Documento e IBAN»).    */
/* ------------------------------------------------------------------ */
html body.vendor-register.logged-in #masthead #logo {
  display: block !important;
}
html body.tbp-adesione.logged-in .tbp-adesione-testata__marchio,
html body.tbp-adesione.logged-in .tbp-adesione-claim {
  display: none !important;
}
html body.tbp-adesione .tbp-adesione-passo {
  flex: 1 1 0 !important;
  min-width: 0 !important;
  max-width: 120px !important;
}
html body.tbp-adesione .tbp-adesione-passo__nome {
  font-size: 13px !important;
  line-height: 1.3 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  text-align: center !important;
  text-wrap: balance;
}
/* Tema scuro: la scheda era bianca attorno al modulo scuro (una cornice bianca di 20 px). */
html[data-tbp-theme="dark"] body.tbp-adesione #wcfm-main-contentainer :is(#wcfm_membership_container, #wcfm_membership_registration_form.wcfm) {
  background: #141414 !important;
  background-color: #141414 !important;
  border-color: #333333 !important;
}
/* Meno aria fra la testata e la scheda: prima 115 px vuoti, ora 16 px come nelle altre pagine. */
html body.tbp-adesione.logged-in main#main {
  padding-top: 8px !important;
}
html body.tbp-adesione.logged-in #wcfm-main-contentainer {
  margin-top: 0 !important;
}

/* ------------------------------------------------------------------ */
/* 5.8 · «Il tuo ente»: i campi si vedono. Come i campi del sito:       */
/* riempimento #F1F4F2, senza bordo, raggio 12, fuoco = anello interno. */
/* Prima erano bianchi su bianco e sotto «Nome dell'ente» sembrava non  */
/* esserci nessuna casella.                                            */
/* ------------------------------------------------------------------ */
html body.woocommerce-account.logged-in #main > #content .tbp-ente-form form:not(#tbp-niente) :is(input[type="text"], input[type="url"], input[type="email"], input[type="tel"], textarea, select) {
  background-color: #F1F4F2 !important;
  border: 0 !important;
  border-radius: 12px !important;
  box-shadow: none !important;
}
/* Tema ToBePolo: la pagina e' gia' chiara (salvia su carta); i campi restano bianchi, come prima. */
html[data-tbp-theme="tobepolo"] body.woocommerce-account.logged-in #main > #content .tbp-ente-form form:not(#tbp-niente) :is(input[type="text"], input[type="url"], input[type="email"], input[type="tel"], textarea, select) {
  background-color: #FFFFFF !important;
}
html body.woocommerce-account.logged-in #main > #content .tbp-ente-form form:not(#tbp-niente) :is(input[type="text"], input[type="url"], input[type="email"], input[type="tel"], textarea, select):focus {
  outline: none !important;
  box-shadow: inset 0 0 0 2px var(--tbp-green, #084828) !important;
}

/* ------------------------------------------------------------------ */
/* 8.2 · Titoli dell'account con l'icona: icona e parole in fila, il    */
/* titolo va a capo come un blocco («Le mie / prenotazioni»), non dopo  */
/* la prima parola («Le / mie prenotazioni»).                           */
/* ------------------------------------------------------------------ */
html body.woocommerce-account :is(h1, h2):has(> img.tbp-title-icon) {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  text-wrap: balance;
}
html body.woocommerce-account :is(h1, h2) > img.tbp-title-icon {
  flex: 0 0 auto !important;
  margin: 0 !important;
}

/* ------------------------------------------------------------------ */
/* 8.5 · Dettaglio della prenotazione al computer: largo quanto la      */
/* colonna dell'account. Era al 60 % (vecchio modello a due colonne) e  */
/* «Cosa preferisci?» andava a capo quasi parola per parola.            */
/* ------------------------------------------------------------------ */
@media (min-width: 850px) {
  html body.woocommerce-view-order .wrapper-dettagli-ordine > .woocommerce-order-details {
    flex: 1 1 100% !important;
    width: 100% !important;
    max-width: none !important;
  }
}

/* ------------------------------------------------------------------ */
/* 8.9 · «Mestieri ed esperienze da recensire»: un titolo di sezione    */
/* (20 px), non piu' grande del titolo della pagina.                    */
/* ------------------------------------------------------------------ */
html body.woocommerce-account .woocommerce-MyAccount-content h2.tbp-recensioni-titoletto {
  margin: 24px 0 12px !important;
  font-size: var(--tbp-titolo-sezione, 20px) !important;
  line-height: 1.25 !important;
  font-weight: 800 !important;
  letter-spacing: -.01em !important;
}

/* ------------------------------------------------------------------ */
/* 8.14 e 8.15 · Metodi di pagamento e Saldo senza contenuto: lo stesso */
/* stato vuoto di «I miei coupon» (icona, frase, bottone) e il titolo   */
/* allineato come nelle altre pagine dell'account.                     */
/* ------------------------------------------------------------------ */
html body.woocommerce-account .woocommerce-MyAccount-content h1.tbp-account-section-title {
  justify-content: flex-start !important;
  text-align: left !important;
}
html body:not(#tbp-niente) .tbp-account-vuoto {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 12px !important;
  margin: 0 0 24px !important;
  padding: 20px !important;
  border: 1px solid var(--tbp-line, rgba(8, 72, 40, .14)) !important;
  border-radius: 16px !important;
  background: #fff !important;
  text-align: left !important;
}
html body:not(#tbp-niente) .tbp-account-vuoto p {
  margin: 0 !important;
  color: #123326 !important;
  font-size: 15px !important;
  line-height: 1.5 !important;
}
html body:not(#tbp-niente) .tbp-account-vuoto .tbp-empty-state__mark {
  margin: 0 !important;
}
html body:not(#tbp-niente) .tbp-account-vuoto a.tbp-btn {
  display: inline-flex !important;
  align-items: center !important;
  width: auto !important;
  padding: 0 20px !important;
  text-decoration: none !important;
}
html[data-tbp-theme="dark"] body:not(#tbp-niente) .tbp-account-vuoto {
  background: #1E1E1E !important;
  border-color: #333333 !important;
}
html[data-tbp-theme="dark"] body:not(#tbp-niente) .tbp-account-vuoto p {
  color: #EDEDED !important;
  -webkit-text-fill-color: #EDEDED !important;
}

/* ------------------------------------------------------------------ */
/* 8.16 · Foto del profilo: «Scegli una foto» e il nome del file nella  */
/* lingua della pagina, non «Choose File / No file chosen» del browser. */
/* Il campo vero resta raggiungibile con la tastiera.                  */
/* ------------------------------------------------------------------ */
html body .tbp-account-photo__scegli {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  margin: 4px 0 8px;
}
html body .tbp-account-photo__control input.tbp-account-photo__file {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  opacity: 0 !important;
  overflow: hidden !important;
  clip-path: inset(50%) !important;
}
html body.woocommerce-account.logged-in #main > #content .tbp-account-photo__control label.tbp-account-photo__bottone {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 44px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  border: 1px solid var(--tbp-line, rgba(8, 72, 40, .14)) !important;
  border-radius: 12px !important;
  background: #fff !important;
  color: var(--tbp-green, #084828) !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 1.2;
  cursor: pointer;
  transition: background-color var(--tbp-moto-breve, 160ms) var(--tbp-moto-curva, ease);
}
html body.woocommerce-account.logged-in #main > #content .tbp-account-photo__control label.tbp-account-photo__bottone:hover {
  background: #F1F4F2 !important;
}
html body .tbp-account-photo__scegli:has(.tbp-account-photo__file:focus-visible) .tbp-account-photo__bottone {
  outline: 3px solid var(--tbp-green, #084828);
  outline-offset: 3px;
}
html body .tbp-account-photo__nome {
  min-width: 0;
  color: #123326;
  font-size: 14px;
  line-height: 1.4;
  overflow-wrap: anywhere;
}
/* «Rimuovi la foto al salvataggio», quando c'e' una foto: casella e parole in fila. */
html body.woocommerce-account.logged-in #main > #content .tbp-account-photo__control label.tbp-account-photo__remove:not([hidden]) {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 8px 0 0 !important;
}
html body.woocommerce-account.logged-in #main > #content .tbp-account-photo__control label.tbp-account-photo__remove[hidden] {
  display: none !important;
}
html[data-tbp-theme="dark"] body.woocommerce-account.logged-in #main > #content .tbp-account-photo__control label.tbp-account-photo__bottone {
  background: #1E1E1E !important;
  border-color: #333333 !important;
  color: #9BDBB5 !important;
}
html[data-tbp-theme="dark"] body .tbp-account-photo__nome {
  color: #EDEDED;
}

/* ------------------------------------------------------------------ */
/* 8.17 · «Dati fiscali» al computer: il bottone va sotto il testo;     */
/* prima stringeva «Per i tuoi acquisti» in una colonna e ci stava      */
/* sopra.                                                              */
/* ------------------------------------------------------------------ */
html body .tbp-fiscal-todo__row {
  flex-wrap: wrap !important;
  row-gap: 12px !important;
}
html body .tbp-fiscal-todo__row > div {
  flex: 1 1 0 !important;
  min-width: 0 !important;
}
html body .tbp-fiscal-todo__row > a.button {
  flex: 1 0 100% !important;
  justify-content: center !important;
  margin: 0 !important;
}

/* ------------------------------------------------------------------ */
/* 7.1 e 7.9 · Cassa veloce: via tutta se nessun bottone di Apple Pay o */
/* Google Pay arriva in 5 s, o se la prenotazione e' gratuita           */
/* (classe messa da js/tbp-cassa.js). Prima restava un riquadro grigio. */
/* ------------------------------------------------------------------ */
html body .wc-stripe-banner-checkout.tbp-cassa-veloce--assente {
  display: none !important;
}

/* ------------------------------------------------------------------ */
/* 8.2 · «Le mie prenotazioni» al telefono: «Annullate» usciva dalla     */
/* sua linguetta di 2 px. Meno spazio fra le linguette, non testo piu'   */
/* piccolo.                                                            */
/* ------------------------------------------------------------------ */
@media (max-width: 849px) {
  html body.woocommerce-account .tbp-flow-orders__tabs {
    gap: 6px !important;
  }
  html body.woocommerce-account .tbp-flow-orders__tabs > .tbp-flow-orders__tab {
    min-width: 0 !important;
    padding-left: 2px !important;
    padding-right: 2px !important;
  }
}