/* Climaction – Catalogo misure di adattamento.
   I colori vengono dalla palette del tema (theme.json); i valori dopo la virgola valgono se il tema non li definisce. */
.cc, .cc-barra {
	--cc-carta: var(--wp--preset--color--carta, #FAF8F5);
	--cc-bianco: var(--wp--preset--color--bianco, #FFFFFF);
	--cc-inchiostro: var(--wp--preset--color--inchiostro, #1A1A1A);
	--cc-grigio: var(--wp--preset--color--grigio, #6E6E6E);
	--cc-verde: var(--wp--preset--color--verde, #2F5D46);
	--cc-salvia: var(--wp--preset--color--salvia, #6B8F71);
	--cc-blu: var(--wp--preset--color--blu, #14415B);
	--cc-linea: var(--wp--preset--color--linea, #E2DDD6);
	--cc-verde-tenue: #E6EEE8;
}
.cc { display: flex; flex-direction: column; gap: 2rem; color: var(--cc-inchiostro); margin-block: 1.5rem; }
.cc *, .cc-barra * { box-sizing: border-box; }
.cc [hidden] { display: none !important; }
.cc p { margin: 0; }
.cc .cc-h1, .cc .cc-h2, .cc .cc-h3 { margin: 0; line-height: 1.2; text-wrap: balance; }
.cc .cc-h1 { font-size: clamp(1.7rem, 4vw, 2.4rem); }
.cc .cc-h2 { font-size: 1.3rem; }
.cc .cc-h3 { font-size: 1.05rem; }
.cc .cc-h3 a { color: inherit; text-decoration: none; }
.cc .cc-h3 a:hover { text-decoration: underline; }
.cc .cc-etichetta { display: block; margin: 0; font-size: .72rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--cc-grigio); line-height: 1.3; }
.cc button, .cc select { font: inherit; color: inherit; }
.cc button { cursor: pointer; }
.cc button:focus-visible, .cc select:focus-visible, .cc a:focus-visible, .cc input:focus-visible { outline: 2px solid var(--cc-blu); outline-offset: 2px; }
.cc .cc-link { background: none; border: 0; padding: 0; color: var(--cc-blu); text-decoration: underline; font-size: .9rem; }
.cc .cc-vuoto { grid-column: 1 / -1; border: 1px dashed var(--cc-linea); border-radius: 6px; padding: 1.75rem; color: var(--cc-grigio); text-align: center; }

.cc-titolo-pagina { text-wrap: balance; }
.cc-scopri { font-size: .95rem; }

.cc-passo { display: flex; flex-direction: column; gap: .9rem; }
.cc-testa { display: flex; flex-wrap: wrap; gap: .5rem 1rem; align-items: baseline; justify-content: space-between; }

/* Pericoli */
.cc-gruppi { display: grid; grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); gap: 1.1rem 1.4rem; }
.cc-gruppo { display: flex; flex-direction: column; gap: .5rem; min-width: 0; }
.cc-tessere { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; }
.cc .cc-tessera { display: flex; flex-direction: column; gap: .35rem; align-items: flex-start; text-align: left; background: var(--cc-bianco); border: 1px solid var(--cc-linea); border-radius: 6px; padding: .6rem; min-height: 5.75rem; font-size: .88rem; line-height: 1.25; }
.cc .cc-tessera svg { width: 30px; height: 30px; flex: none; }
.cc .cc-tessera small { font-size: .7rem; color: var(--cc-grigio); }
.cc .cc-tessera[aria-pressed="true"] { background: var(--cc-verde); border-color: var(--cc-verde); color: #fff; }
.cc .cc-tessera[aria-pressed="true"] small { color: #fff; }
.cc .cc-tessera.cc-senza { opacity: .55; }

/* Scala e filtri */
.cc-controlli { display: flex; flex-wrap: wrap; gap: 1rem 1.75rem; align-items: flex-end; }
.cc-campo { display: flex; flex-direction: column; gap: .4rem; }
.cc-seg { display: flex; flex-wrap: wrap; gap: .4rem; }
.cc .cc-seg button { display: flex; align-items: center; gap: .5rem; background: var(--cc-bianco); border: 1px solid var(--cc-linea); border-radius: 6px; padding: .5rem .9rem; font-size: .92rem; }
.cc .cc-seg svg { width: 22px; height: 22px; }
.cc .cc-seg button[aria-pressed="true"] { border-color: var(--cc-verde); background: var(--cc-verde-tenue); color: var(--cc-verde); font-weight: 600; }
.cc select { background: var(--cc-bianco); border: 1px solid var(--cc-linea); border-radius: 6px; padding: .5rem .6rem; max-width: 100%; }

/* Griglia */
.cc-griglia { display: grid; grid-template-columns: repeat(auto-fill, minmax(16.5rem, 1fr)); gap: 1rem; }
.cc-card { display: flex; flex-direction: column; background: var(--cc-bianco); border: 1px solid var(--cc-linea); border-radius: 6px; overflow: hidden; min-width: 0; }
.cc-card.cc-scelta { border-color: var(--cc-verde); box-shadow: 0 0 0 1px var(--cc-verde); }
.cc .cc-ill { display: block; background: var(--cc-carta); line-height: 0; }
.cc .cc-ill svg, .cc .cc-ill img { display: block; width: 100%; height: auto; }
.cc-card .cc-ill { border-bottom: 1px solid var(--cc-linea); }
.cc-card .cc-ill img { aspect-ratio: 16 / 10; object-fit: cover; }
.cc-corpo { display: flex; flex-direction: column; gap: .5rem; padding: .9rem; flex: 1; }
.cc-corpo p { font-size: .9rem; color: var(--cc-grigio); line-height: 1.45; }
.cc-haz { display: flex; flex-wrap: wrap; gap: .25rem; margin-top: auto; padding-top: .4rem; }
.cc-haz > span { display: inline-flex; border: 1px solid var(--cc-linea); border-radius: 4px; padding: 3px; color: var(--cc-grigio); }
.cc-haz > span.cc-attivo { background: var(--cc-verde); border-color: var(--cc-verde); color: #fff; }
.cc-haz svg { width: 18px; height: 18px; }
.cc .screen-reader-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.cc-piede { display: flex; justify-content: space-between; align-items: center; gap: .6rem; padding: .6rem .9rem; border-top: 1px solid var(--cc-linea); font-size: .88rem; }
.cc-piede a { color: var(--cc-blu); }
.cc-scegli { display: flex; align-items: center; gap: .4rem; cursor: pointer; }
.cc-scegli input { width: 17px; height: 17px; accent-color: var(--cc-verde); margin: 0; }

/* Scheda */
.cc-scheda-griglia { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1.6fr); gap: 2rem; }
.cc-lato, .cc-testo { display: flex; flex-direction: column; gap: 1.1rem; min-width: 0; }
.cc-testo { max-width: 42rem; }
.cc-lato .cc-ill { border: 1px solid var(--cc-linea); border-radius: 6px; overflow: hidden; }
.cc-blocco { display: flex; flex-direction: column; gap: .35rem; }
.cc-blocco p + p { margin-top: .5em; }
.cc .cc-titolo { margin: 0; font-size: 1.2em; font-weight: 700; line-height: 1.25; letter-spacing: 0; text-transform: none; }
.cc-blocco > p, .cc-blocco > ul { font-size: 1em; }
.cc .cc-breve { font-size: 1.1em; }
.cc .cc-cam-tipo { font-weight: 600; font-size: 1em; margin-top: .4rem; }
.cc .cc-pericoli { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .35rem; }
.cc .cc-pericoli li { display: flex; gap: .5rem; align-items: center; margin: 0; }
.cc .cc-pericoli svg { width: 20px; height: 20px; flex: none; }
.cc .cc-pericoli em { color: var(--cc-grigio); }
.cc .cc-bottone { background: var(--cc-verde); color: #fff; border: 1px solid var(--cc-verde); border-radius: 6px; padding: .6rem 1rem; font-weight: 600; align-self: flex-start; }
.cc .cc-bottone.cc-secondario, .cc .cc-bottone[aria-pressed="true"] { background: var(--cc-bianco); color: var(--cc-verde); }
.cc-indietro a { color: var(--cc-blu); font-size: .9rem; }
.cc a.cc-bottone { display: inline-block; text-decoration: none; }
.cc a.cc-bottone:hover { filter: brightness(1.1); }
.cc-contribuisci { display: flex; flex-wrap: wrap; gap: 1rem 2rem; align-items: center; justify-content: space-between; background: var(--cc-carta); border: 1px solid var(--cc-linea); border-left: 4px solid var(--cc-verde); border-radius: 6px; padding: 1.1rem 1.25rem; }
.cc-contribuisci > div { display: flex; flex-direction: column; gap: .4rem; flex: 1 1 22rem; max-width: 46rem; }
.cc-contribuisci .cc-bottone { align-self: center; flex: none; }

/* Logo nella selezione e nel PDF */
.cc-logo { display: inline-flex; align-items: center; gap: .5rem; font-weight: 700; color: var(--cc-verde); line-height: 1; }
.cc-logo img { display: block; height: 1.5rem; width: auto; }
.cc-logo-grande { font-size: 1.5rem; gap: .8rem; }
.cc-logo-grande img { height: 3.6rem; }
.cc-copertina-testa { display: flex; flex-direction: column; gap: 1.25rem; align-items: flex-start; }
.cc-pie { display: flex; flex-wrap: wrap; gap: .4rem 1rem; align-items: center; justify-content: space-between; margin-top: auto; padding-top: .7rem; border-top: 1px solid var(--cc-linea); font-size: .8rem; color: var(--cc-grigio); }

/* Selezione */
.cc-strumenti { display: flex; flex-direction: column; gap: .9rem; }
.cc-azioni { display: flex; flex-wrap: wrap; gap: .6rem 1rem; align-items: center; }
.cc-selezione [data-cc-fogli] { display: flex; flex-direction: column; gap: 1.5rem; }
.cc-foglio { display: flex; flex-direction: column; gap: 1rem; background: var(--cc-bianco); border: 1px solid var(--cc-linea); padding: clamp(1.25rem, 4vw, 2.5rem); max-width: 50rem; width: 100%; margin-inline: auto; }
.cc-copertina { gap: 2rem; }
.cc-copertina > div { display: flex; flex-direction: column; gap: .75rem; }
.cc-riga { height: 6px; width: 5rem; background: var(--cc-verde); }
.cc .cc-indice { margin: .25rem 0 0; padding-left: 1.3em; }
.cc .cc-nota { font-size: .85rem; color: var(--cc-grigio); }
.cc-foglio-testa { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: 1.25rem; }
.cc-foglio-testa > div { display: flex; flex-direction: column; gap: .8rem; min-width: 0; }
.cc-foglio-testa .cc-ill { border: 1px solid var(--cc-linea); align-self: start; }
.cc-ordina { display: flex; gap: .4rem; justify-content: flex-end; }
.cc .cc-ordina button { background: var(--cc-bianco); border: 1px solid var(--cc-linea); border-radius: 4px; padding: .25rem .65rem; font-size: .88rem; }
.cc .cc-ordina button:disabled { opacity: .35; cursor: default; }

/* Barra della selezione */
.cc-barra { position: fixed; left: 0; right: 0; bottom: 0; z-index: 50; background: var(--cc-inchiostro); color: #fff; padding: .7rem 1.25rem calc(.7rem + env(safe-area-inset-bottom, 0px)); display: flex; flex-wrap: wrap; gap: .4rem 1rem; justify-content: center; align-items: center; font-size: .95rem; }
.cc-barra[hidden] { display: none; }
.cc-barra a { background: #fff; color: var(--cc-inchiostro); border-radius: 6px; padding: .45rem .9rem; font-weight: 600; text-decoration: none; }
.cc-barra button { background: none; border: 0; color: #fff; text-decoration: underline; cursor: pointer; font: inherit; }
body.cc-con-barra { padding-bottom: 4.5rem; }

@media (max-width: 760px) {
	.cc-scheda-griglia, .cc-foglio-testa { grid-template-columns: minmax(0, 1fr); }
}

/* Stampa: resta solo la selezione, un foglio per misura. */
@media print {
	@page { size: A4; margin: 18mm 16mm; }
	body.cc-stampa header, body.cc-stampa footer, body.cc-stampa nav, body.cc-stampa .wp-block-post-title,
	body.cc-stampa #wpadminbar, .cc-nostampa, .cc-barra { display: none !important; }
	body.cc-stampa { background: #fff !important; padding: 0 !important; }
	.cc-selezione { margin: 0; gap: 0; font-size: 10.5pt; }
	.cc-selezione [data-cc-fogli] { display: block; }
	.cc-foglio { border: 0; padding: 0; max-width: none; break-after: page; page-break-after: always; }
	.cc-foglio:last-child { break-after: auto; page-break-after: auto; }
	.cc-copertina { min-height: 230mm; justify-content: space-between; }
	/* Altezza utile del foglio: il piè di pagina con il logo resta in fondo all'ultima pagina della misura. */
	.cc-selezione [data-cc-fogli] > .cc-foglio { min-height: 252mm; }
	.cc-pie, .cc-copertina-testa { break-inside: avoid; }
	.cc-logo img { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
	.cc-blocco, .cc-foglio-testa { break-inside: avoid; }
	.cc .cc-ill { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
	.cc-riga { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}
