/**
 * Il recesso online: il modulo del plugin WWU (SC-4513) nella tipografia e nei colori del sito.
 *
 * DOVE SI VEDE. La pagina «Recedere dal contratto» (/recedere-dal-contratto/), la scheda del
 * recesso in «Il mio account» e il pulsante nell'ordine. Il foglio lo carica inc/single-product.php
 * **solo dove il plugin carica il suo** (`webwakeupwdb-frontend`) e **dopo**, come sua dipendenza:
 * cosi' a parita' di peso vince l'ordine, e nelle altre pagine non arriva niente.
 *
 * PERCHE' NON NEL PLUGIN. Il plugin si aggiorna da WordPress.org: ogni ritocco ai suoi file
 * sparirebbe al primo aggiornamento. Il plugin stesso prevede che lo si vesta da fuori, con le
 * sue variabili `--webwakeupwdb-*` e le sue classi.
 *
 * I CINQUE DIFETTI CHE CORREGGE (schermate di Emiliano, 2026-10-23):
 *  1. il titolo del modulo (`h2.webwakeupwdb-form-title`, la formula di legge «recedere dal
 *     contratto qui») prendeva lo stile degli h2 del tema: enorme, minuscolo, spezzato;
 *  2. la larghezza cambiava fra le fasi: il plugin chiude il modulo in 540 px, ma nella ricerca
 *     dell'ordine l'avviso e il testo introduttivo ne restano fuori, a tutta pagina;
 *  3. «Trova Il Mio Ordine»: la regola del tema che mette maiuscola ogni parola dei pulsanti;
 *  4. nel recesso parziale la casella di spunta stava sopra il nome, spostata: il riquadro ha
 *     anche la classe `webwakeupwdb-field`, e la regola del plugin
 *     `.webwakeupwdb-field input { width: 100% }` allargava anche la casella;
 *  5. avviso, etichette e note nel grigio #666 del plugin, estraneo alla palette.
 *
 * Il 2026-10-26, dopo il controllo di Emiliano: larghezza piena invece di 720 px, campi e
 * pulsanti ridotti (il kit di Elementor li gonfiava), pulsanti come quelli di «Il mio account».
 * La formula di legge resta: si cambia solo come si vede. Colori da legali.css: #012F2B
 * testo, #D9D6D0 bordi.
 */

/* ------------------------------------------------------------- larghezza piena --- */

/*
 * Il plugin chiude il modulo in 540 px. Il 2026-10-26 l'avevo portato a 720 per tutte e tre
 * le fasi: era una scelta mia, non richiesta, e la stessa che legali.css racconta di aver gia'
 * sbagliato. Sul sito le pagine stanno a larghezza piena (Emiliano, 2026-10-26).
 */
:root {
	--webwakeupwdb-form-max-width: none;
}

/* ---------------------------------------------------------------------- i campi --- */

/*
 * Il kit di Elementor da' a tutti i campi `padding: 24px` per lato: quasi 80 px d'altezza.
 * La sua regola, `.elementor-kit-125 input:not([type="button"]):not([type="submit"])`, pesa
 * (0,3,1) perche' gli argomenti di :not contano; questa ne pesa (0,4,1). La casella di spunta
 * resta fuori. Il testo digitato in verde scuro e non nel grigio del kit: stessa ragione di
 * account.css, un dato inserito non deve sembrare un suggerimento.
 */
.webwakeupwdb-form-wrap .webwakeupwdb-field input:not([type="checkbox"]):not([type="radio"]),
.webwakeupwdb-form-wrap .webwakeupwdb-field textarea {
	padding: 12px 16px;
	border-radius: 12px;
	font-size: 16px;
	line-height: 1.5;
	color: var(--lds-testo, #012F2B);
}

/* ---------------------------------------------------------- testo nel colore del sito --- */

.webwakeupwdb-account-intro,
.webwakeupwdb-form-wrap {
	--webwakeupwdb-note-color: #012F2B;
	color: var(--lds-testo, #012F2B);
	font-family: Archivo, sans-serif;
	font-size: 16px;
	line-height: 1.6;
}

.webwakeupwdb-products-help,
.webwakeupwdb-guidance__help {
	opacity: .8;
}

/* ------------------------------------------------------------------------- l'avviso --- */

.webwakeupwdb-guidance {
	background: #FFFFFF;
	border-left-color: var(--lds-testo, #012F2B);
	border-radius: 0 12px 12px 0;
	padding: 16px 20px;
}

/* ------------------------------------------------------------- il titolo del modulo --- */

/*
 * La formula di legge resta, ma come titoletto del modulo e non come secondo titolo di
 * pagina: sopra c'e' gia' l'h1 «Recedere dal contratto». La maiuscola iniziale la mette il
 * CSS perche' il testo arriva minuscolo dal plugin, ed e' la dicitura della norma.
 */
.webwakeupwdb-form-wrap h2.webwakeupwdb-form-title {
	font-family: Archivo, sans-serif;
	font-size: 24px;
	font-weight: 600;
	line-height: 1.3;
	margin: 0 0 16px;
}

.webwakeupwdb-form-wrap h2.webwakeupwdb-form-title::first-letter {
	text-transform: uppercase;
}

/* ---------------------------------------------------------------------- i pulsanti --- */

/*
 * Come i pulsanti di «Il mio account» (account.css): pillola verde scuro, rossa al passaggio,
 * 16 px. Scelto da Emiliano il 2026-10-26. Il kit da' ai `button` il carattere «accent», quello
 * grande dei titoli, e il plugin ci calcola sopra il padding: ne usciva un pulsante enorme.
 * Le maiuscole su ogni parola si tolgono solo con !important, come in carrello.css.
 */
.webwakeupwdb-account-intro .webwakeupwdb-button,
.webwakeupwdb-form-wrap .webwakeupwdb-button,
.webwakeupwdb-button-wrap .webwakeupwdb-button {
	padding: 14px 30px;
	border: 0;
	border-radius: 999px;
	background: var(--lds-testo, #012F2B);
	color: #fff;
	font-family: Archivo, sans-serif;
	font-size: 16px;
	font-weight: 600;
	line-height: 1.2;
	text-transform: none !important;
}

.webwakeupwdb-account-intro .webwakeupwdb-button:hover,
.webwakeupwdb-account-intro .webwakeupwdb-button:focus-visible,
.webwakeupwdb-form-wrap .webwakeupwdb-button:hover,
.webwakeupwdb-form-wrap .webwakeupwdb-button:focus-visible,
.webwakeupwdb-button-wrap .webwakeupwdb-button:hover,
.webwakeupwdb-button-wrap .webwakeupwdb-button:focus-visible {
	background: var(--lds-rosso, #FF3B32);
	color: #fff;
	opacity: 1;
}

/* ----------------------------------------------------- il recesso parziale: i prodotti --- */

.webwakeupwdb-products {
	border-color: #D9D6D0;
	border-radius: 12px;
}

.webwakeupwdb-products-item {
	display: flex;
	align-items: center;
	gap: 10px;
}

.webwakeupwdb-field .webwakeupwdb-products-item input[type="checkbox"] {
	width: auto;
	flex: none;
	margin: 0;
}

/* ------------------------------------------------------------------------ telefono --- */

@media (max-width: 767px) {
	.webwakeupwdb-form-wrap h2.webwakeupwdb-form-title {
		font-size: 20px;
	}
}
