/* ═══════════════════════════════════════════════════════════════════════════
   EMCC Attestati Manager — Frontend shortcode [emcc_attestati]
   CSS scritto in modo difensivo: usa !important sui valori visivi critici
   per evitare che il tema sovrascriva layout e stili del bottone.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Wrapper ─────────────────────────────────────────────────────────────── */

.emcc-sc-wrap {
	max-width: 780px;
	margin: 0 auto;
	font-family: inherit;
	box-sizing: border-box;
}

/* ── Titolo (div, non h2, per evitare stili del tema) ────────────────────── */

.emcc-sc-wrap .emcc-sc-heading {
	color: #1a3a6b !important;
	font-size: 1.5rem !important;
	font-weight: 700 !important;
	line-height: 1.3 !important;
	margin: 0 0 1.25rem !important;
	padding: 0 !important;
	background: transparent !important;
	border: none !important;
	text-transform: none !important;
	letter-spacing: normal !important;
}

/* ── Barra filtri ─────────────────────────────────────────────────────────── */

.emcc-sc-wrap .emcc-sc-filters {
	display: flex !important;
	flex-direction: row !important;
	flex-wrap: wrap !important;
	gap: 8px !important;
	align-items: center !important;
	margin: 0 0 1.25rem !important;
	padding: 12px 14px !important;
	background: #f7f8fa !important;
	border: 1px solid #e2e4e8 !important;
	border-radius: 8px !important;
	box-sizing: border-box !important;
}

.emcc-sc-wrap .emcc-sc-select,
.emcc-sc-wrap .emcc-sc-search {
	display: inline-block !important;
	height: 36px !important;
	padding: 0 10px !important;
	border: 1px solid #ccc !important;
	border-radius: 5px !important;
	font-size: 0.875rem !important;
	background: #fff !important;
	color: #333 !important;
	box-sizing: border-box !important;
	margin: 0 !important;
	width: auto !important;
	max-width: 100% !important;
	transition: border-color 0.15s !important;
	-webkit-appearance: auto !important;
	appearance: auto !important;
}

.emcc-sc-wrap .emcc-sc-search {
	min-width: 160px !important;
	flex: 1 1 160px !important;
}

.emcc-sc-wrap .emcc-sc-select:focus,
.emcc-sc-wrap .emcc-sc-search:focus {
	outline: none !important;
	border-color: #1a3a6b !important;
	box-shadow: 0 0 0 2px rgba(26,58,107,0.12) !important;
}

.emcc-sc-wrap .emcc-sc-btn-reset {
	display: inline-block !important;
	height: 36px !important;
	padding: 0 14px !important;
	background: #fff !important;
	border: 1px solid #ccc !important;
	border-radius: 5px !important;
	cursor: pointer !important;
	font-size: 0.8125rem !important;
	color: #666 !important;
	white-space: nowrap !important;
	box-sizing: border-box !important;
	margin: 0 !important;
	transition: border-color 0.15s, color 0.15s !important;
}

.emcc-sc-wrap .emcc-sc-btn-reset:hover {
	border-color: #1a3a6b !important;
	color: #1a3a6b !important;
}

/* ── Lista card ───────────────────────────────────────────────────────────── */

.emcc-sc-wrap .emcc-sc-list {
	display: flex !important;
	flex-direction: column !important;
	gap: 12px !important;
	list-style: none !important;
	margin: 0 !important;
	padding: 0 !important;
}

/* ── Singola card ─────────────────────────────────────────────────────────── */

/* La classe .emcc-hidden è usata dal JS per nascondere le card filtrate.
   Specificità più alta di .emcc-sc-item per vincere sull'!important di default. */
.emcc-sc-wrap .emcc-sc-item.emcc-hidden {
	display: none !important;
}

.emcc-sc-wrap .emcc-sc-item {
	display: block !important;
	background: #ffffff !important;
	border: 1px solid #dde1e8 !important;
	border-radius: 10px !important;
	padding: 20px 22px !important;
	box-shadow: 0 2px 8px rgba(0,0,0,0.06) !important;
	box-sizing: border-box !important;
	transition: box-shadow 0.2s, border-color 0.2s !important;
}

.emcc-sc-wrap .emcc-sc-item:hover {
	border-color: #b8c6da !important;
	box-shadow: 0 4px 16px rgba(26,58,107,0.10) !important;
}

/* ── Titolo attestato ─────────────────────────────────────────────────────── */

.emcc-sc-wrap .emcc-sc-item-title {
	font-size: 1.05rem !important;
	font-weight: 700 !important;
	color: #1a3a6b !important;
	line-height: 1.4 !important;
	margin: 0 0 8px !important;
	padding: 0 !important;
	background: transparent !important;
	border: none !important;
	text-transform: none !important;
}

/* ── Meta ─────────────────────────────────────────────────────────────────── */

.emcc-sc-wrap .emcc-sc-item-meta {
	font-size: 0.875rem !important;
	color: #666 !important;
	line-height: 1.5 !important;
	margin: 0 0 14px !important;
	padding: 0 !important;
}

/* ── Bottone Scarica PDF ──────────────────────────────────────────────────── */

.emcc-sc-wrap .emcc-sc-btn-download,
.emcc-sc-wrap .emcc-sc-btn-download:link,
.emcc-sc-wrap .emcc-sc-btn-download:visited {
	display: inline-block !important;
	padding: 8px 18px !important;
	background: #1a3a6b !important;
	color: #ffffff !important;
	border: none !important;
	border-radius: 6px !important;
	text-decoration: none !important;
	font-size: 0.8125rem !important;
	font-weight: 600 !important;
	letter-spacing: 0.02em !important;
	line-height: 1.4 !important;
	cursor: pointer !important;
	transition: background 0.15s, transform 0.1s !important;
	box-shadow: none !important;
}

.emcc-sc-wrap .emcc-sc-btn-download:hover,
.emcc-sc-wrap .emcc-sc-btn-download:focus {
	background: #122850 !important;
	color: #ffffff !important;
	text-decoration: none !important;
	transform: translateY(-1px) !important;
	outline: none !important;
}

/* ── Messaggi ─────────────────────────────────────────────────────────────── */

.emcc-sc-wrap .emcc-sc-empty.emcc-hidden,
.emcc-sc-wrap #emcc-sc-no-results.emcc-hidden {
	display: none !important;
}

.emcc-sc-wrap .emcc-sc-empty,
.emcc-sc-wrap .emcc-sc-login,
.emcc-sc-wrap #emcc-sc-no-results {
	color: #777 !important;
	font-style: italic !important;
	padding: 8px 0 !important;
	margin: 0 !important;
}

.emcc-sc-wrap .emcc-sc-login a {
	color: #1a3a6b !important;
	font-weight: 600 !important;
}

/* ── Responsive ───────────────────────────────────────────────────────────── */

@media (max-width: 560px) {
	.emcc-sc-wrap .emcc-sc-filters {
		flex-direction: column !important;
	}

	.emcc-sc-wrap .emcc-sc-select,
	.emcc-sc-wrap .emcc-sc-search,
	.emcc-sc-wrap .emcc-sc-btn-reset {
		width: 100% !important;
		flex: none !important;
	}

	.emcc-sc-wrap .emcc-sc-btn-download {
		width: 100% !important;
		text-align: center !important;
		box-sizing: border-box !important;
	}
}
