/**
 * IL SEGNAPOSTO DELLA FOTO MANCANTE — voce 181 di Gabriele, 23/9/2026.
 *
 * ┌────────────────────────────────────────────────────────────────────────┐
 * │ PERCHÉ ESISTE                                                          │
 * │                                                                        │
 * │ *«Assicurati che sia gli immobili che i professionisti abbiano         │
 * │ un'immagine: se non hanno immagini caricate, crea un'immagine che      │
 * │ indica che ancora non ci sono foto.»* Il markup lo stampa               │
 * │ `radar_segnaposto()` — `inc/elenco-carte.php` — su tutte le carte e su │
 * │ le tre schede singole (immobile, professionista, lavoro): questo       │
 * │ foglio dà la forma, un file solo perché la lingua è una sola.          │
 * └────────────────────────────────────────────────────────────────────────┘
 *
 * ⚠ I colori NON sono ripetuti a mano: sono gli stessi sei della mappa
 * (`radar-core/data/pin.php`, § affitto/vendita/case-vacanza/terreni/
 * servizi/lavoro), gli stessi che colorano i disegni SVG in
 * `assets/img/segnaposto/`. Qui si legge `[data-categoria]` e si sceglie il
 * fondo attenuato — lo stesso disegno, mai un riquadro grigio uguale per
 * tutti (`radar.css` non si tocca da questo file, i valori sono ridichiarati
 * qui apposta perché questo foglio deve reggersi anche da solo).
 *
 * @package radar-theme
 */

.segnaposto {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: .4rem;
	width: 100%;
	height: 100%;
	text-align: center;
	/*
	 * 23/9/2026, rimisura ui-qa-expert D5: il fondo più chiaro (case-vacanza,
	 * servizi) dava un contrasto di 4,54:1 col testo — sopra la soglia AA
	 * (4,5:1) ma appena. Il tetto scende da un range 12-18% a un 8% fisso:
	 * un fondo più chiaro tiene il contrasto lontano dal filo del rasoio su
	 * tutti e sei i colori: rifatto il conto con questo fondo, il più basso
	 * è 7,32:1 (affitto), il più alto 7,75:1 (case-vacanza) — ben sopra la
	 * soglia AA di 4,5:1.
	 */
	background: color-mix(in srgb, var(--segnaposto-tinta, var(--testo-2, #6B625C)) 8%, var(--superficie-alt, #F1EAE1));
}

.segnaposto[data-categoria="affitto"]      { --segnaposto-tinta: #0072B2; }
.segnaposto[data-categoria="vendita"]      { --segnaposto-tinta: #D55E00; }
.segnaposto[data-categoria="case-vacanza"] { --segnaposto-tinta: #56B4E9; }
.segnaposto[data-categoria="terreni"]      { --segnaposto-tinta: #009E73; }
.segnaposto[data-categoria="servizi"]      { --segnaposto-tinta: #E69F00; }
.segnaposto[data-categoria="lavoro"]       { --segnaposto-tinta: #CC79A7; }

/*
 * 🚨 23/9/2026, quarta rimisura ui-qa-expert — punto 7: il tratto misurato
 * SUI PIXEL dava 3,21:1, non il 3,42 calcolato sui soli colori dichiarati —
 * la differenza era proprio questa `opacity: .85`, che sul fondo chiaro
 * abbassa il tratto effettivo. Tolta: il tratto torna al colore pieno
 * dichiarato (`#6B625C` o la tinta di categoria), niente più margine sul
 * filo del 3:1.
 */
.segnaposto__disegno {
	display: block;
}

/*
 * Il testo visibile: sempre, non solo per lo screen reader — «un'immagine
 * che indica» era la richiesta, e un'icona muta indica poco.
 *
 * 23/9/2026, rimisura ui-qa-expert D5: 12px era sotto i 15 della scheda
 * dello sguardo. Sale a 13px sulle carte (resta leggibile in una griglia
 * fitta) e il colore usa `--segnaposto-testo`, un bruno più scuro del
 * `--testo-2` generico apposta per questo componente: tiene il contrasto
 * lontano dal filo del rasoio anche sul fondo più chiaro (case-vacanza).
 */
.segnaposto__testo {
	font-weight: 600;
	color: var(--segnaposto-testo, #4A433D);
	letter-spacing: .01em;
	font-size: .9375rem;
}

/* --- Sulla carta (elenchi: annunci, imprese, luogo) ------------------------
   Compatta: l'icona non deve pesare più della foto vera che sostituisce. */
.segnaposto--carta {
	gap: .35rem;
	padding: .5rem;
}

.segnaposto--carta .segnaposto__disegno {
	width: 2.75rem;
	height: 2.75rem;
}

.segnaposto--carta .segnaposto__testo {
	font-size: .8125rem;
}

/* La carta d'impresa non aveva mai avuto un riquadro foto (nota storica in
   `inc/elenco-carte.php`): riusa la stessa proporzione 4:3 di
   `.annuncio-carta__foto` (elenco-annunci.css), qui solo il colore di fondo
   di riserva prima che il segnaposto carichi. */
.annuncio-carta__foto--impresa {
	background: var(--superficie-alt, #F1EAE1);
}

/*
 * --- Sulla scheda singola (single-lavoro.php) -------------------------------
 * Sta DENTRO `.scheda-lavoro__principale`, la colonna del contenuto — non
 * più a tutta larghezza fuori dalla griglia.
 *
 * 🚨 23/9/2026, rimisura ui-qa-expert — D1: la prima versione (fuori dalla
 * colonna, `aspect-ratio: 16/9` su tutta la larghezza dello schermo) dava
 * un riquadro di 1406×790px a 1440 — l'elemento più grande della pagina, con
 * la scritta sotto la piega. Qui l'aspect-ratio è più basso (3:2, una foto
 * normale) E c'è un `max-height` fisso: anche dentro una colonna larga il
 * riquadro non supera i 320px, quindi «Foto in arrivo» resta nel primo
 * schermo a 1440, 768 e 375 (a 375 la colonna è già stretta, l'aspect-ratio
 * da solo basta).
 */
.scheda-lavoro__foto {
	margin: 0 0 1.5rem;
	border: 1px solid var(--bordo, #E7DFD5);
	border-radius: var(--raggio-scheda, var(--raggio-grande, 14px));
	overflow: hidden;
	aspect-ratio: 3 / 2;
	max-height: 320px;
}

.scheda-lavoro__foto-img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.segnaposto--scheda {
	min-block-size: 8rem;
	padding: clamp(14px, 2.5vw, 28px);
}

.segnaposto--scheda .segnaposto__disegno {
	width: clamp(52px, 7vw, 84px);
	height: auto;
}

.segnaposto--scheda .segnaposto__testo {
	font-size: .9375rem;
}

/*
 * 🚨 23/9/2026, quarta rimisura ui-qa-expert — punto 6: a 768 il segnaposto
 * della testata professionista stava appiccicato al bordo di sopra (0px
 * contro i 35px di 1440): `.testata-categoria--riquadro` (scheda.css, non
 * questo file) ha un `aspect-ratio: 86/23`, e a 768 quel rettangolo è più
 * basso di quanto serva al segnaposto (icona + gap + testo) più l'etichetta
 * del mestiere e l'invito che vengono dopo — il totale supera l'altezza
 * disponibile e il riquadro trabocca, con `overflow: hidden` che taglia il
 * margine superiore. Non tocco `scheda.css` (non è mio): qui si stringe
 * solo il SEGNAPOSTO in quella fascia di larghezza, cosi il totale torna a
 * stare nel rettangolo e il padding sopra riappare.
 */
@media (min-width: 40rem) and (max-width: 63.999rem) {
	.segnaposto--scheda {
		min-block-size: 0;
		padding: 10px;
		gap: .25rem;
	}

	.segnaposto--scheda .segnaposto__disegno {
		width: clamp(40px, 6vw, 60px);
	}
}

/*
 * --- Dentro la galleria dell'immobile (single-immobile.php) ----------------
 * `.sa-galleria__vuota` (annuncio.css, non questo file) posiziona e
 * dimensiona già il riquadro (`position:absolute; inset:0`, dentro
 * `.sa-galleria__vetrina` che ha il suo `aspect-ratio`): qui basta riempirlo.
 *
 * 🚨 23/9/2026, rimisura ui-qa-expert — D6: prima questo caso usava
 * `.mn-foto-ripiego` (mappa-nuova.css), un'altra icona e un'altra frase —
 * due segnaposto diversi per la stessa cosa nello stesso sito. Ora la
 * galleria vuota usa lo stesso `radar_segnaposto()` delle carte e delle
 * altre due schede: un disegno, un testo, un solo posto dove impararli.
 */
.segnaposto--galleria {
	padding: 24px;
}

.segnaposto--galleria .segnaposto__disegno {
	width: clamp(48px, 8vw, 88px);
	height: auto;
}

/* --- Il testo visibile sulla testata del professionista senza copertina ---
   `single-professionista.php`, dentro `.testata-categoria--riquadro`
   (scheda.css, non questo file): qui solo la riga nuova che quel foglio non
   conosce ancora. */
.testata-categoria__foto-avviso {
	font: 600 .875rem/1.3 var(--font, inherit);
	color: var(--segnaposto-testo, #4A433D);
}

/*
 * --- Il riquadro 60×60 di «Vicino a questo» (inc/fiducia.php) --------------
 * 🚨 23/9/2026, rimisura ui-qa-expert (seconda) — D6b: prima questo caso
 * usava `.mn-foto-ripiego` (mappa-nuova.css), un secondo segnaposto diverso
 * da quello di tutto il resto del sito. Qui il riquadro è troppo piccolo per
 * un testo leggibile (Gabriele, seconda rimisura: «variante piccola, anche
 * senza scritta») — il disegno da solo, sul fondo tenue della categoria,
 * basta a dire «non è una foto rotta».
 */
.segnaposto--mini {
	gap: 0;
	padding: 6px;
}

.segnaposto--mini .segnaposto__disegno {
	width: 28px;
	height: 28px;
}

.segnaposto--mini .segnaposto__testo {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

/* --- Le tre carte «Altri artigiani» della home -----------------------------
   `template-parts/home/artigiani.php`: la carta non aveva mai un riquadro
   foto (D4 della rimisura del 23/9). `home-artigiani.css` non è mio: qui
   solo la misura del nuovo riquadro, autosufficiente come il resto di
   questo foglio. */
.artigiani__carta-foto {
	aspect-ratio: 4 / 3;
	border-radius: var(--raggio-grande, 14px);
	overflow: hidden;
	margin: 0 0 .75rem;
}