/**
 * ToBe Experience Checkout - stile.
 * Layout pulito, leggibile, mobile friendly.
 *
 * NOTA: l'ordine di visualizzazione e l'allineamento a due colonne sono forzati
 * qui via CSS (flexbox + proprieta' "order"), cosi' funzionano a prescindere dal
 * tema, da Elementor o da altri plugin che riordinano i campi.
 *
 * Le variabili permettono di adattare i colori al tema senza toccare il codice.
 */

:root {
	--tobe-accent: #111827;
	--tobe-accent-soft: #f3f4f6;
	--tobe-border: #e5e7eb;
	--tobe-text: #1f2937;
	--tobe-muted: #6b7280;
	--tobe-error: #dc2626;
	--tobe-radius: 12px;
	--tobe-gap: 16px;
}

/* ============================================================
   Card del form di fatturazione
   ============================================================ */
.woocommerce-checkout .woocommerce-billing-fields {
	background: #fff;
	border: 1px solid var(--tobe-border);
	border-radius: var(--tobe-radius);
	padding: 22px 24px 8px;
	box-shadow: 0 1px 2px rgba( 0, 0, 0, 0.04 );
}
.woocommerce-checkout .woocommerce-billing-fields h3 {
	display: none; /* nasconde eventuali titoli di sezione */
}

/* ============================================================
   LAYOUT A GRIGLIA (flexbox) + ORDINE FORZATO
   Il contenitore standard dei campi billing diventa una riga flessibile.
   ============================================================ */
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper,
.woocommerce-checkout #tobe-invoice-fields {
	display: flex;
	flex-wrap: wrap;
	gap: 0 var(--tobe-gap);
	width: 100%;
}

/* Ogni campo: di default a tutta larghezza, senza float ereditati dal tema */
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper > .form-row,
.woocommerce-checkout #tobe-invoice-fields > .form-row {
	width: 100%;
	float: none !important;
	margin: 0 0 var(--tobe-gap) 0 !important;
	padding: 0 !important;
	clear: none !important;
	box-sizing: border-box;
}

/* Coppie affiancate su desktop/tablet (50% ciascuna, riempiendo il 100%) */
@media ( min-width: 641px ) {
	.woocommerce-checkout .woocommerce-billing-fields__field-wrapper > .form-row-first,
	.woocommerce-checkout .woocommerce-billing-fields__field-wrapper > .form-row-last,
	.woocommerce-checkout #tobe-invoice-fields > .form-row-first,
	.woocommerce-checkout #tobe-invoice-fields > .form-row-last {
		width: calc( 50% - ( var(--tobe-gap) / 2 ) );
	}
}

/* ORDINE DI VISUALIZZAZIONE richiesto:
   Nome, Cognome, Email, Telefono, Provincia, Paese/Regione */
#billing_first_name_field { order: 1; }
#billing_last_name_field  { order: 2; }
#billing_email_field      { order: 3; }
#billing_phone_field      { order: 4; }
#billing_state_field      { order: 5; }
#billing_country_field    { order: 6; }

/* Gli input occupano sempre tutta la larghezza della loro colonna */
.woocommerce-checkout .form-row input.input-text,
.woocommerce-checkout .form-row select,
.woocommerce-checkout .form-row textarea,
.woocommerce-checkout .form-row .select2-container {
	width: 100% !important;
	box-sizing: border-box;
}

/* ============================================================
   Etichette e input
   ============================================================ */
.woocommerce form .form-row label {
	font-weight: 600;
	color: var(--tobe-text);
	margin-bottom: 6px;
	display: block;
}
.woocommerce form .form-row .required {
	color: var(--tobe-error);
	text-decoration: none;
}

/* Non mostrare "(facoltativo)": i campi non obbligatori non avranno l'asterisco */
.woocommerce form .form-row .optional {
	display: none !important;
}

.woocommerce form .form-row input.input-text,
.woocommerce form .form-row select,
.woocommerce form .form-row textarea,
.woocommerce-checkout .select2-container .select2-selection {
	border: 1px solid var(--tobe-border) !important;
	border-radius: 10px !important;
	padding: 12px 14px !important;
	height: auto !important;
	font-size: 1rem !important;
	min-height: 48px;
	color: var(--tobe-text);
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
	box-sizing: border-box;
}
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row select:focus,
.woocommerce form .form-row textarea:focus {
	border-color: var(--tobe-accent) !important;
	box-shadow: 0 0 0 3px rgba( 17, 24, 39, 0.08 ) !important;
	outline: none;
}

/* Stato di validazione */
.woocommerce form .form-row.woocommerce-invalid input.input-text,
.woocommerce form .form-row.woocommerce-invalid select {
	border-color: var(--tobe-error) !important;
}
.woocommerce form .form-row.woocommerce-validated input.input-text {
	border-color: #16a34a !important;
}

/* ============================================================
   Sezione fattura
   ============================================================ */
.tobe-invoice-block {
	margin-top: 22px;
	border-top: 2px dashed var(--tobe-border);
	padding-top: 16px;
}
.tobe-invoice-toggle label {
	font-weight: 700 !important;
	cursor: pointer;
	display: inline-flex !important;
	align-items: center;
	gap: 10px;
}
.tobe-invoice-toggle input[type="checkbox"] {
	width: auto !important;
	min-height: 0 !important;
	margin: 0 !important;
}
#tobe-invoice-fields {
	margin-top: 14px;
	background: var(--tobe-accent-soft);
	border-radius: var(--tobe-radius);
	padding: 18px 20px 6px;
}
/* Suggerimento leggibile sotto al campo (sovrascrive il tooltip del tema). */
#tobe-invoice-fields .description {
	position: static !important;
	display: block !important;
	float: none !important;
	clear: both !important;
	background: #fff !important;
	color: var(--tobe-muted) !important;
	border: 1px solid var(--tobe-border) !important;
	border-radius: 8px !important;
	padding: 8px 10px !important;
	margin: 6px 0 0 !important;
	font-size: 0.8rem !important;
	line-height: 1.4 !important;
	white-space: normal !important;
	max-width: 100% !important;
	box-shadow: none !important;
	opacity: 1 !important;
}
#tobe-invoice-fields .description::before,
#tobe-invoice-fields .description::after {
	display: none !important;
}

/* I contenitori dei campi per tipo occupano tutta la larghezza e i campi
   al loro interno riempiono e si allineano al 100% (desktop e mobile). */
#tobe-invoice-fields > .tobe-invoice-privato,
#tobe-invoice-fields > .tobe-invoice-azienda {
	width: 100%;
	flex: 0 0 100%;
}
#tobe-invoice-fields .tobe-invoice-privato > .form-row,
#tobe-invoice-fields .tobe-invoice-azienda > .form-row {
	width: 100% !important;
	float: none !important;
	margin: 0 0 var(--tobe-gap) 0 !important;
	padding: 0 !important;
	clear: none !important;
	box-sizing: border-box;
}

/* Tipo intestatario: controllo a due segmenti che riempie il contenitore. */
.tobe-invoice-tipo > label:first-child {
	font-weight: 700;
	display: block;
	margin-bottom: 8px;
}
.tobe-invoice-tipo .woocommerce-input-wrapper {
	display: flex;
	gap: 10px;
	width: 100%;
}
/* La radio nativa e' nascosta ma resta accessibile; l'etichetta e' la card. */
.tobe-invoice-tipo input[type="radio"] {
	position: absolute;
	opacity: 0;
	width: 1px;
	height: 1px;
	margin: 0 !important;
	min-height: 0 !important;
}
.tobe-invoice-tipo label.radio {
	flex: 1 1 0;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	min-height: 50px;
	margin: 0 !important;
	padding: 12px 10px;
	border: 1.5px solid var(--tobe-border);
	border-radius: 12px;
	background: #fff;
	cursor: pointer;
	font-weight: 600;
	line-height: 1.2;
	transition: border-color .12s ease, background-color .12s ease;
}
.tobe-invoice-tipo input[type="radio"]:checked + label.radio {
	border-color: var(--tobe-accent);
	background: var(--tobe-accent-soft);
	box-shadow: inset 0 0 0 1.5px var(--tobe-accent);
}
.tobe-invoice-tipo input[type="radio"]:focus-visible + label.radio {
	outline: 2px solid var(--tobe-accent);
	outline-offset: 2px;
}

/* Stati di validazione in tempo reale */
.tobe-invoice-field.tobe-valid input {
	border-color: #16a34a !important;
}
.tobe-invoice-field.tobe-invalid input {
	border-color: var(--tobe-error) !important;
}
.tobe-field-msg {
	display: block;
	margin-top: 5px;
	font-size: 0.8rem;
	line-height: 1.3;
	color: var(--tobe-error);
}
.tobe-invoice-field.tobe-valid .tobe-field-msg {
	color: #16a34a;
}

/* ============================================================
   Consensi privacy + newsletter (sopra il pulsante ordine)
   ============================================================ */
.tobe-consents {
	margin: 6px 0 18px;
	display: flex;
	flex-direction: column;
	gap: 12px;
}
/* Spunta in linea con il testo (la frase scorre come un paragrafo) */
.tobe-consent label {
	display: block !important;
	position: relative;
	padding-left: 30px;
	font-weight: 400 !important;
	color: var(--tobe-text);
	font-size: 0.92rem;
	line-height: 1.45;
	cursor: pointer;
	margin: 0;
}
.tobe-consent input[type="checkbox"] {
	position: absolute;
	left: 0;
	top: 2px;
	width: 20px !important;
	height: 20px !important;
	min-height: 0 !important;
	margin: 0 !important;
}
.tobe-consent a {
	color: var(--tobe-accent);
	text-decoration: underline;
}
.tobe-consent-privacy .required {
	color: var(--tobe-error);
}

/* ============================================================
   Pulsante d'ordine
   ============================================================ */
#place_order {
	background: var(--tobe-accent) !important;
	color: #fff !important;
	border-radius: 10px !important;
	padding: 14px 22px !important;
	font-size: 1.05rem !important;
	font-weight: 700 !important;
	width: 100%;
	transition: opacity 0.15s ease;
}
#place_order:hover {
	opacity: 0.9;
}

/* ============================================================
   Sezione "Crea un account": card distinta e ben visibile
   ============================================================ */
.woocommerce-checkout .woocommerce-account-fields {
	margin: 32px 0 0;
	background: #fff;
	border: 1px solid var(--tobe-border);
	border-radius: var(--tobe-radius);
	padding: 22px 24px;
	box-shadow: 0 1px 2px rgba( 0, 0, 0, 0.04 );
}

/* Intestazione iniettata via JS */
.tobe-account-heading {
	display: block;
	margin-bottom: 14px;
}
.tobe-account-title {
	display: block;
	font-size: 1.05rem;
	font-weight: 700;
	color: var(--tobe-accent);
	text-transform: none !important;
	letter-spacing: 0;
}
.tobe-account-sub {
	display: block;
	margin-top: 4px;
	font-size: 0.88rem;
	color: var(--tobe-muted);
	line-height: 1.45;
}

/* Spunta "Crea un account?" piu' leggibile */
.woocommerce-account-fields .create-account label,
.woocommerce-account-fields p.create-account > label {
	display: flex !important;
	align-items: center;
	gap: 10px;
	font-weight: 600 !important;
	color: var(--tobe-text);
	cursor: pointer;
}
.woocommerce-account-fields .create-account input[type="checkbox"] {
	width: 20px !important;
	height: 20px !important;
	min-height: 0 !important;
	margin: 0 !important;
	flex: 0 0 auto;
}

/* ============================================================
   Barre "Sei gia' cliente?" e "Hai un codice promozionale?"
   Trasformate da avvisi WooCommerce a barre pulite e coerenti.
   ============================================================ */
.woocommerce-checkout .woocommerce-form-login-toggle,
.woocommerce-checkout .woocommerce-form-coupon-toggle {
	margin: 0 0 16px;
}
.woocommerce-checkout .woocommerce-form-login-toggle .woocommerce-info,
.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info {
	background: var(--tobe-accent-soft) !important;
	border: 1px solid var(--tobe-border) !important;
	border-top: 1px solid var(--tobe-border) !important;
	border-radius: var(--tobe-radius) !important;
	padding: 14px 18px !important;
	margin: 0 !important;
	color: var(--tobe-text) !important;
	font-size: 0.95rem;
	display: flex;
	align-items: center;
	gap: 8px;
	flex-wrap: wrap;
	list-style: none !important;
}
/* Rimuove l'icona/segnaposto di default degli avvisi WooCommerce */
.woocommerce-checkout .woocommerce-form-login-toggle .woocommerce-info::before,
.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info::before {
	display: none !important;
}
.woocommerce-checkout .woocommerce-form-login-toggle .woocommerce-info a,
.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info a {
	color: var(--tobe-accent) !important;
	font-weight: 700;
	text-decoration: underline;
}

/* Form di accesso e form coupon: stesso stile a riquadro pulito */
.woocommerce-checkout form.woocommerce-form-login,
.woocommerce-checkout form.checkout_coupon {
	border: 1px solid var(--tobe-border);
	border-radius: var(--tobe-radius);
	padding: 18px 20px;
	background: #fff;
	margin: 0 0 16px;
	box-shadow: 0 1px 2px rgba( 0, 0, 0, 0.04 );
}
.woocommerce-checkout form.checkout_coupon .button,
.woocommerce-checkout form.woocommerce-form-login .button {
	background: var(--tobe-accent) !important;
	color: #fff !important;
	border-radius: 10px !important;
	padding: 12px 18px !important;
	font-weight: 700 !important;
	min-height: 48px;
}

/* ============================================================
   Nasconde la sezione "Note dell'ordine" / informazioni aggiuntive
   ============================================================ */
.woocommerce-checkout .woocommerce-additional-fields {
	display: none !important;
}

/* ============================================================
   Mobile: tutto a colonna piena, input al 100%
   ============================================================ */
@media ( max-width: 640px ) {
	.woocommerce-checkout .woocommerce-billing-fields__field-wrapper > .form-row,
	.woocommerce-checkout #tobe-invoice-fields > .form-row {
		width: 100% !important;
	}
	.woocommerce-checkout .woocommerce-billing-fields {
		padding: 18px 16px 6px;
	}
	#tobe-invoice-fields {
		padding: 16px 14px 4px;
	}
}

/* ============================================================
   LAYOUT A DUE COLONNE (costruito via JS: .tobe-col-left / .tobe-col-right)
   Il form resta a larghezza 100%: il limite si gestisce dal contenitore esterno.
   ============================================================ */
.woocommerce-checkout form.checkout.tobe-2col {
	width: 100% !important;
	max-width: 100% !important;
	margin: 0 !important;
}
.tobe-col-left,
.tobe-col-right {
	display: flex;
	flex-direction: column;
	gap: 22px;
	min-width: 0;
}
@media ( min-width: 981px ) {
	.woocommerce-checkout form.checkout.tobe-2col {
		display: grid;
		grid-template-columns: minmax( 0, 1.1fr ) minmax( 0, 0.9fr );
		column-gap: 32px;
		align-items: start;
	}
	.tobe-col-left  { grid-column: 1; }
	.tobe-col-right { grid-column: 2; }
}

.woocommerce-checkout #customer_details,
.woocommerce-checkout #customer_details .col-1,
.woocommerce-checkout #customer_details .col-2 {
	width: 100% !important;
	max-width: none !important;
	float: none !important;
	padding: 0 !important;
}
.woocommerce-checkout #customer_details .col-2:empty {
	display: none;
}

/* Titoli dei blocchi (Dati / Recap) */
.woocommerce-checkout .tobe-block-title,
.woocommerce-checkout #order_review_heading {
	font-size: 1.1rem;
	font-weight: 700;
	color: var(--tobe-accent);
	margin: 0 0 14px;
}
.woocommerce-checkout .woocommerce-billing-fields > h3:not(.tobe-block-title) {
	display: none !important;
}
.woocommerce-checkout .woocommerce-billing-fields h3.tobe-block-title {
	display: block !important;
}

/* --- Blocco "Sei gia' cliente" (accesso) come card --- */
.tobe-login-block {
	position: relative;
	background: #fff;
	border: 1px solid var(--tobe-border);
	border-radius: var(--tobe-radius);
	padding: 18px 20px;
	box-shadow: 0 1px 2px rgba( 0, 0, 0, 0.04 );
}
.tobe-login-block .woocommerce-form-login-toggle {
	margin: 0 !important;
}
.tobe-login-block .woocommerce-form-login-toggle .woocommerce-info {
	background: transparent !important;
	border: none !important;
	padding: 0 38px 0 0 !important;
	margin: 0 !important;
	font-size: 0.98rem;
	font-weight: 600;
	color: var(--tobe-text) !important;
}
.tobe-login-block form.woocommerce-form-login {
	border: none !important;
	box-shadow: none !important;
	background: transparent !important;
	padding: 16px 0 0 !important;
	margin: 14px 0 0 !important;
	border-top: 1px solid var(--tobe-border) !important;
	border-radius: 0 !important;
}
.tobe-login-block form.woocommerce-form-login .form-row {
	width: 100% !important;
	float: none !important;
	margin: 0 0 14px !important;
	padding: 0 !important;
}
.tobe-login-block form.woocommerce-form-login .button {
	width: 100%;
}
.tobe-login-close {
	position: absolute;
	top: 12px;
	right: 14px;
	width: 30px;
	height: 30px;
	line-height: 26px;
	text-align: center;
	border: 1px solid var(--tobe-border);
	border-radius: 8px;
	background: #fff;
	color: var(--tobe-muted);
	font-size: 18px;
	cursor: pointer;
	padding: 0;
	z-index: 5;
}
.tobe-login-close:hover {
	background: var(--tobe-accent-soft);
}

/* --- Express checkout (Google/Apple Pay) compatto in cima al pagamento --- */
.tobe-express-block {
	background: #fff;
	border: 1px solid var(--tobe-border);
	border-radius: var(--tobe-radius);
	padding: 14px 16px;
	box-shadow: 0 1px 2px rgba( 0, 0, 0, 0.04 );
}
.tobe-express-label {
	display: block;
	font-size: 0.8rem;
	font-weight: 600;
	color: var(--tobe-muted);
	text-transform: uppercase;
	letter-spacing: 0.03em;
	margin-bottom: 10px;
}
.tobe-express-block .wcpay-express-checkout-wrapper {
	margin: 0 !important;
}

/* --- Colonna destra: coupon + pagamento --- */
.woocommerce-checkout #order_review {
	display: flex;
	flex-direction: column;
	gap: 18px;
	background: transparent !important;
	border: none !important;
	padding: 0 !important;
	box-shadow: none !important;
}

/* --- Recap ordine (colonna sinistra): tabella come card --- */
.tobe-recap-slot {
	display: block;
}
/* Evita il "lampo" della tabella dentro #order_review prima dello spostamento */
.woocommerce-checkout form.checkout.tobe-2col #order_review > .woocommerce-checkout-review-order-table {
	display: none !important;
}
.woocommerce-checkout .woocommerce-checkout-review-order-table {
	background: #fff;
	border: 1px solid var(--tobe-border) !important;
	border-radius: var(--tobe-radius) !important;
	border-collapse: separate !important;
	border-spacing: 0 !important;
	overflow: hidden;
	padding: 0 !important;
	box-shadow: 0 1px 2px rgba( 0, 0, 0, 0.04 );
	margin: 0 !important;
}
.woocommerce-checkout .woocommerce-checkout-review-order-table thead th {
	background: transparent !important;
	color: var(--tobe-muted) !important;
	font-weight: 600;
	font-size: 0.78rem;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	border-bottom: 1px solid var(--tobe-border) !important;
}
.woocommerce-checkout .woocommerce-checkout-review-order-table td,
.woocommerce-checkout .woocommerce-checkout-review-order-table th {
	padding: 14px 18px !important;
	border-color: #f0f0ee !important;
	color: var(--tobe-text);
}
.woocommerce-checkout .woocommerce-checkout-review-order-table .order-total th,
.woocommerce-checkout .woocommerce-checkout-review-order-table .order-total td {
	font-size: 1.05rem;
	font-weight: 700;
	color: var(--tobe-accent) !important;
}

/* --- Coupon come card pulita (campo + pulsante in linea) --- */
.tobe-coupon-wrap {
	background: #fff;
	border: 1px solid var(--tobe-border);
	border-radius: var(--tobe-radius);
	padding: 16px 18px;
	box-shadow: 0 1px 2px rgba( 0, 0, 0, 0.04 );
	display: flex;
	flex-wrap: wrap;
	gap: 10px 12px;
	align-items: center;
}
.woocommerce-checkout .tobe-coupon-wrap .woocommerce-form-coupon-toggle {
	width: 100%;
	margin: 0 !important;
}
.woocommerce-checkout .tobe-coupon-wrap .woocommerce-form-coupon-toggle .woocommerce-info {
	background: transparent !important;
	border: none !important;
	padding: 0 !important;
	margin: 0 0 2px !important;
	color: var(--tobe-accent) !important;
	font-weight: 700 !important;
	font-size: 1rem !important;
}
.woocommerce-checkout .tobe-coupon-wrap .woocommerce-form-coupon-toggle .woocommerce-info::before {
	display: none !important;
}
/* Link "Fai clic qui" ridondante: i campi sono gia' sempre visibili */
.woocommerce-checkout .tobe-coupon-wrap .showcoupon {
	display: none !important;
}
.woocommerce-checkout .tobe-coupon-wrap .form-row {
	margin: 0 !important;
	padding: 0 !important;
}
.woocommerce-checkout .tobe-coupon-wrap .form-row-first {
	flex: 1 1 200px;
	width: auto !important;
}
.woocommerce-checkout .tobe-coupon-wrap .form-row-last {
	flex: 0 0 auto;
	width: auto !important;
}
.woocommerce-checkout .tobe-coupon-wrap #coupon_code {
	width: 100% !important;
	min-height: 48px;
}
.woocommerce-checkout .tobe-coupon-wrap .button {
	background: var(--tobe-accent) !important;
	color: #fff !important;
	border-radius: 10px !important;
	padding: 12px 18px !important;
	min-height: 48px;
	font-weight: 700 !important;
}
.woocommerce-checkout .tobe-coupon-wrap .clear {
	display: none !important;
}
/* Form coupon classico (se il tema lo usa) */
.woocommerce-checkout .tobe-coupon-wrap form.checkout_coupon {
	width: 100%;
	margin: 12px 0 0 !important;
}

/* Etichette consensi: evita colori ereditati dal tema */
.woocommerce-checkout .tobe-consent label,
.woocommerce-checkout .tobe-consent label * {
	color: var(--tobe-text) !important;
}
.woocommerce-checkout .tobe-consent a {
	color: var(--tobe-accent) !important;
	text-decoration: underline;
}
.woocommerce-checkout .tobe-consent-privacy .required {
	color: var(--tobe-error) !important;
}

/* --- Pagamento come card --- */
.woocommerce-checkout #payment {
	background: #fff !important;
	border: 1px solid var(--tobe-border) !important;
	border-radius: var(--tobe-radius) !important;
	padding: 18px 20px !important;
}
.woocommerce-checkout #payment ul.payment_methods {
	border: none !important;
	padding: 0 !important;
	margin: 0 0 4px !important;
}
.woocommerce-checkout #payment ul.payment_methods > li {
	border: 1px solid var(--tobe-border) !important;
	border-radius: 10px !important;
	padding: 13px 15px !important;
	margin: 0 0 10px 0 !important;
	background: #fff !important;
	list-style: none !important;
}
.woocommerce-checkout #payment ul.payment_methods > li > label {
	font-weight: 600 !important;
	display: inline-flex;
	align-items: center;
	gap: 8px;
}
.woocommerce-checkout #payment .payment_box {
	background: var(--tobe-accent-soft) !important;
	border-radius: 10px !important;
	margin: 12px 0 2px !important;
	padding: 14px 16px !important;
	font-size: 0.9rem;
}
.woocommerce-checkout #payment .payment_box::before {
	display: none !important;
}
.woocommerce-checkout #payment .payment_box input.input-text,
.woocommerce-checkout #payment .wc-credit-card-form input {
	border: 1px solid var(--tobe-border) !important;
	border-radius: 8px !important;
	background: #fff !important;
	padding: 10px 12px !important;
}
.woocommerce-checkout #payment .place-order {
	padding: 14px 0 0 !important;
	border: none !important;
	margin: 0 !important;
}

/* Evita il maiuscolo forzato dal tema su account e consensi */
.woocommerce-checkout .tobe-account-title,
.woocommerce-checkout .tobe-account-sub,
.woocommerce-checkout .woocommerce-account-fields label,
.woocommerce-checkout .tobe-consent label {
	text-transform: none !important;
}

/* Rimuove il divisore "— OR —" dall'express checkout (resta solo il titoletto) */
#wcpay-express-checkout-button-separator {
	display: none !important;
}

/* ============================================================
   Separazione tra le colonne quando si impilano (mobile/tablet)
   ============================================================ */
@media ( max-width: 980px ) {
	.tobe-col-right {
		margin-top: 22px;
	}
}

/* ============================================================
   Pagina "Ordine ricevuto" (grazie / dettagli ordine):
   stesso stile a card del checkout.
   ============================================================ */
.woocommerce-order h2 {
	font-size: 1.15rem !important;
	font-weight: 700 !important;
	color: var(--tobe-accent) !important;
	margin: 0 0 14px !important;
}
.woocommerce-order .woocommerce-order-overview {
	list-style: none !important;
	margin: 0 0 24px !important;
	padding: 18px 22px !important;
	background: #fff !important;
	border: 1px solid var(--tobe-border) !important;
	border-radius: var(--tobe-radius) !important;
	box-shadow: 0 1px 2px rgba( 0, 0, 0, 0.04 ) !important;
	display: flex !important;
	flex-wrap: wrap !important;
	align-items: flex-start !important;
	gap: 0 !important;
}
.woocommerce-order .woocommerce-order-overview li {
	border: none !important;
	margin: 0 !important;
	padding: 0 !important;
	font-size: 0.72rem !important;
	color: var(--tobe-muted) !important;
	font-weight: 600 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.03em !important;
}
/* Spazio solo TRA gli elementi (dal secondo in poi), mai prima del primo */
.woocommerce-order .woocommerce-order-overview li + li {
	margin-left: 36px !important;
}
/* Mobile: impilati con spazio verticale, niente elementi attaccati */
@media ( max-width: 600px ) {
	.woocommerce-order .woocommerce-order-overview {
		flex-direction: column !important;
	}
	.woocommerce-order .woocommerce-order-overview li + li {
		margin-left: 0 !important;
		margin-top: 14px !important;
	}
}
.woocommerce-order .woocommerce-order-overview li strong {
	display: block !important;
	font-size: 1rem !important;
	color: var(--tobe-text) !important;
	font-weight: 700 !important;
	text-transform: none !important;
	letter-spacing: 0 !important;
	margin-top: 4px !important;
}
.woocommerce-order table.order_details {
	border: 1px solid var(--tobe-border) !important;
	border-radius: var(--tobe-radius) !important;
	border-collapse: separate !important;
	border-spacing: 0 !important;
	overflow: hidden !important;
	width: 100% !important;
	background: #fff !important;
	box-shadow: 0 1px 2px rgba( 0, 0, 0, 0.04 ) !important;
	margin: 0 0 24px !important;
}
.woocommerce-order table.order_details th,
.woocommerce-order table.order_details td {
	padding: 14px 18px !important;
	border-color: #f0f0ee !important;
	color: var(--tobe-text) !important;
}
.woocommerce-order table.order_details thead th {
	background: transparent !important;
	color: var(--tobe-muted) !important;
	text-transform: uppercase !important;
	font-size: 0.78rem !important;
	letter-spacing: 0.03em !important;
	font-weight: 600 !important;
	border-bottom: 1px solid var(--tobe-border) !important;
}
.woocommerce-order table.order_details tfoot th,
.woocommerce-order table.order_details tfoot td {
	font-weight: 700 !important;
}
.woocommerce-order table.order_details tfoot tr:last-child th,
.woocommerce-order table.order_details tfoot tr:last-child td {
	color: var(--tobe-accent) !important;
	font-size: 1.02rem !important;
}
/* Tabella meta partecipante (Event Tickets) leggibile */
.woocommerce-order table.tribe-attendee-meta {
	border: 1px solid var(--tobe-border) !important;
	border-radius: 10px !important;
	border-collapse: separate !important;
	border-spacing: 0 !important;
	overflow: hidden !important;
	width: 100% !important;
	background: var(--tobe-accent-soft) !important;
	margin: 10px 0 0 !important;
}
.woocommerce-order table.tribe-attendee-meta th,
.woocommerce-order table.tribe-attendee-meta td {
	padding: 10px 14px !important;
	color: var(--tobe-text) !important;
	border-color: var(--tobe-border) !important;
	background: transparent !important;
}
.woocommerce-order table.tribe-attendee-meta th {
	font-weight: 600 !important;
	color: var(--tobe-muted) !important;
}
/* Dati cliente / indirizzo come card */
.woocommerce-customer-details address {
	border: 1px solid var(--tobe-border) !important;
	border-radius: var(--tobe-radius) !important;
	padding: 18px 20px !important;
	background: #fff !important;
	box-shadow: 0 1px 2px rgba( 0, 0, 0, 0.04 ) !important;
	font-style: normal !important;
	color: var(--tobe-text) !important;
}

/* Sezione "I tuoi ticket" (Event Tickets) come card coerente */
.woocommerce-order .tec-tickets__attendees-list-wrapper {
	background: #fff !important;
	border: 1px solid var(--tobe-border) !important;
	border-radius: var(--tobe-radius) !important;
	padding: 22px 24px !important;
	box-shadow: 0 1px 2px rgba( 0, 0, 0, 0.04 ) !important;
	margin: 0 0 24px !important;
}
.woocommerce-order .tec-tickets__attendees-list-wrapper h4 {
	font-size: 1.15rem !important;
	font-weight: 700 !important;
	color: var(--tobe-accent) !important;
	text-transform: none !important;
	letter-spacing: 0 !important;
	margin: 0 0 14px !important;
}
.woocommerce-order .tec-tickets__wallet-plus-component-pdf-button-link {
	display: inline-flex !important;
	align-items: center;
	gap: 8px;
	background: #fff !important;
	color: var(--tobe-accent) !important;
	border: 1px solid var(--tobe-border) !important;
	border-radius: 10px !important;
	padding: 11px 18px !important;
	font-weight: 700 !important;
	text-decoration: none !important;
	min-height: 46px;
	box-sizing: border-box;
}
.woocommerce-order .tec-tickets__wallet-plus-component-pdf-button-link:hover {
	background: var(--tobe-accent-soft) !important;
}

/* Spaziatura interna della sezione "I tuoi ticket" */
.woocommerce-order .tec-tickets__attendees-list-wrapper h4 {
	margin: 0 0 18px !important;
}
.woocommerce-order .tec-tickets__attendees-list-item {
	margin-bottom: 20px !important;
	padding-bottom: 20px !important;
	border-bottom: 1px solid #f0f0ee !important;
}
.woocommerce-order .tec-tickets__attendees-list-item:last-child {
	margin-bottom: 0 !important;
	padding-bottom: 0 !important;
	border-bottom: none !important;
}
.woocommerce-order .tec-tickets__attendees-list-item-attendee-details {
	margin-bottom: 16px !important;
	line-height: 1.5 !important;
}
.woocommerce-order .tec-tickets__wallet-plus-passes-container {
	display: flex !important;
	flex-wrap: wrap !important;
	align-items: center !important;
	gap: 18px !important;
	margin-top: 0 !important;
}

/* Pulsante Apple Wallet: nasconde il testo (resta per screen reader) e
   uniforma l'altezza al pulsante "PDF ticket" */
.woocommerce-order .tec-tickets__wallet-plus-component-apple-wallet-button-link {
	display: inline-flex !important;
	align-items: center !important;
	height: 46px !important;
}
.woocommerce-order .tec-tickets__wallet-plus-component-apple-wallet-button-image {
	height: 46px !important;
	width: auto !important;
	display: block !important;
}
.woocommerce-order .tec-tickets__wallet-plus-component-apple-wallet-button-link span {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	overflow: hidden !important;
	clip: rect( 0 0 0 0 ) !important;
	white-space: nowrap !important;
	border: 0 !important;
	padding: 0 !important;
	margin: -1px !important;
}

/* Indirizzo della location dell'evento su una sola riga
   (vale sia nel recap del checkout sia nei dettagli ordine) */
.tribe-event-details .tribe-address {
	display: inline !important;
}
.tribe-event-details .tribe-address br,
.tribe-event-details br:has( + .tribe-address ) {
	display: none !important;
}
.tribe-event-details .tribe-address .tribe-street-address::after,
.tribe-event-details .tribe-address .tribe-delimiter::after,
.tribe-event-details .tribe-address .tribe-region::after,
.tribe-event-details .tribe-address .tribe-postal-code::after {
	content: " ";
}

/* ============================================================
   Sezioni "Informazioni aggiuntive" (ordine) e "Le tue preferenze" (account)
   ============================================================ */
.woocommerce-order .tobe-order-extra,
.woocommerce-account .tobe-account-panel {
	background: #fff;
	border: 1px solid var(--tobe-border);
	border-radius: var(--tobe-radius);
	padding: 20px 22px;
	box-shadow: 0 1px 2px rgba( 0, 0, 0, 0.04 );
	margin: 24px 0 0;
}
.woocommerce-order .tobe-order-extra h2,
.woocommerce-account .tobe-account-panel h3 {
	font-size: 1.1rem !important;
	font-weight: 700 !important;
	color: var(--tobe-accent) !important;
	margin: 0 0 12px !important;
}
.woocommerce-order .tobe-order-extra p,
.woocommerce-account .tobe-account-panel p {
	margin: 0 0 6px;
	color: var(--tobe-text);
}
.tobe-account-newsletter-form {
	margin: 0 0 8px;
}
.tobe-account-check {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	margin: 0 0 12px;
	color: var(--tobe-text);
	cursor: pointer;
}
.tobe-account-check input[type="checkbox"] {
	width: 20px;
	height: 20px;
	margin: 2px 0 0;
	flex: 0 0 auto;
}
.tobe-account-save {
	background: var(--tobe-accent) !important;
	color: #fff !important;
	border: none !important;
	border-radius: 10px !important;
	padding: 11px 20px !important;
	font-weight: 700 !important;
	cursor: pointer;
}
.tobe-account-invoice {
	margin-top: 16px;
	padding-top: 14px;
	border-top: 1px solid var(--tobe-border);
}
.tobe-account-invoice h4 {
	font-size: 0.95rem !important;
	font-weight: 700 !important;
	color: var(--tobe-text) !important;
	margin: 0 0 8px !important;
}

/* Accesso con Google: centrato e separato dal login con email */
.woocommerce-form-login .googlesitekit-sign-in-with-google__frontend-output-button {
	display: flex !important;
	justify-content: center !important;
	align-items: center !important;
	width: 100% !important;
	max-width: 100% !important;
	margin: 0 auto 4px !important;
	text-align: center !important;
}
.woocommerce-form-login .googlesitekit-sign-in-with-google__frontend-output-button > * {
	margin-left: auto !important;
	margin-right: auto !important;
	float: none !important;
}
.tobe-login-or {
	display: flex;
	align-items: center;
	text-align: center;
	color: var(--tobe-muted);
	font-size: 0.8rem;
	font-weight: 600;
	margin: 16px 0;
}
.tobe-login-or::before,
.tobe-login-or::after {
	content: "";
	flex: 1;
	height: 1px;
	background: var(--tobe-border);
}
.tobe-login-or span {
	padding: 0 12px;
	text-transform: uppercase;
	letter-spacing: 0.05em;
}

/* Box carta WooPayments: rimuove il bordo/padding del fieldset interno
   per dare piu' spazio ai campi */
.woocommerce-checkout #payment .payment_box fieldset.wc-payment-form,
.woocommerce-checkout #payment .payment_box .wc-payment-form {
	border: none !important;
	padding: 0 !important;
	margin: 0 !important;
	border-radius: 0 !important;
}

/* Mobile: pulsante "Applica codice promozionale" a tutta larghezza */
@media ( max-width: 640px ) {
	.woocommerce-checkout .tobe-coupon-wrap .form-row-last {
		flex: 1 1 100% !important;
		width: 100% !important;
	}
	.woocommerce-checkout .tobe-coupon-wrap .button {
		width: 100% !important;
	}
}

/* --- Slot coupon (colonna sinistra, sotto il recap) --- */
.tobe-coupon-slot:empty {
	display: none;
}

/* --- Blocco backlink "Dimenticato qualcosa?" (colonna destra, sotto pagamento) --- */
.tobe-backlinks-block {
	background: #fff;
	border: 1px solid var(--tobe-border);
	border-radius: var(--tobe-radius);
	padding: 18px 20px;
	box-shadow: 0 1px 2px rgba( 0, 0, 0, 0.04 );
}
.tobe-backlinks-title {
	font-size: 1.05rem;
	font-weight: 700;
	color: var(--tobe-accent);
	margin: 0 0 12px;
}
.tobe-backlinks-block .tribe-checkout-backlinks {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 0 !important;
}

/* ============================================================
   Ottimizzazione browser in-app (Instagram/Facebook/TikTok…)
   Apple/Google Pay non funzionano nei webview in-app: si nascondono
   e si mostra un avviso con "Apri nel browser".
   ============================================================ */
body.tobe-inapp .wcpay-express-checkout-wrapper,
body.tobe-inapp .tobe-express-block {
	display: none !important;
}
.tobe-inapp-banner {
	display: flex;
	align-items: center;
	gap: 12px;
	flex-wrap: wrap;
	background: #fff8e1;
	border: 1px solid #f3d27a;
	border-radius: var(--tobe-radius);
	padding: 12px 16px;
	margin: 0 0 18px;
	color: #5b4500;
	font-size: 0.92rem;
	line-height: 1.4;
}
.tobe-inapp-text {
	flex: 1 1 200px;
	min-width: 160px;
}
.tobe-inapp-open {
	background: var(--tobe-accent);
	color: #fff;
	border: none;
	border-radius: 8px;
	padding: 9px 16px;
	font-weight: 700;
	cursor: pointer;
	white-space: nowrap;
}
.tobe-inapp-dismiss {
	background: transparent;
	border: none;
	font-size: 20px;
	line-height: 1;
	cursor: pointer;
	color: #5b4500;
	padding: 0 4px;
}