/* PhotoNorm Enroll — striscia di verdetto PRE/POST e tabella comparativa.
   Aggiunto il 24/09/2026, separato da style.css per non toccare la demo Base. */

.pn-tab-link {
    margin-left: auto;
    text-decoration: none;
    color: var(--pn-text-dim);
    font-size: .85rem;
    align-self: center;
    padding: .4rem .8rem;
}
.pn-tab-link:hover { color: #fff; }

.verdict-strip {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.5rem;
    padding: 1.25rem;
    margin-bottom: 1.5rem;
    background: var(--gray-50);
    border-radius: var(--radius);
    flex-wrap: wrap;
}
.verdict-col {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .35rem;
    min-width: 11rem;
}
.verdict-label {
    font-size: .72rem;
    letter-spacing: .08em;
    color: var(--gray-500);
    font-weight: 600;
}
.verdict-pill {
    font-size: 1.15rem;
    font-weight: 700;
    padding: .3rem 1rem;
    border-radius: 999px;
}
.verdict-pill.pass { background: rgba(22,163,74,.12); color: var(--success); }
.verdict-pill.fail { background: rgba(220,38,38,.12); color: var(--danger); }
.compliance-line {
    font-size: .78rem;
    color: var(--gray-700);
    text-align: center;
}
.verdict-arrow {
    font-size: 1.6rem;
    color: var(--gray-300);
}
#checksTable td.status-cell {
    text-align: center;
    font-weight: 600;
}
#checksTable td.status-cell.pass { color: var(--success); }
#checksTable td.status-cell.fail { color: var(--danger); }
#checksTable td.status-cell.na { color: var(--gray-300); font-weight: 400; font-size: .85rem; }
.status-pct { font-size: .74rem; font-weight: 400; color: var(--gray-500); margin-left: .15rem; }

/* Suggerimenti e badge di conformita' -- stile identico alla demo MorpheusICAO
   (MorpheusICAO.Web SuggestionsBox.tsx / ComplianceBadges.tsx), tradotto da Tailwind
   a CSS semplice, cosi' i tre demo si sentono la stessa famiglia (24/09/2026). */
.suggestions-box {
	margin-top: 1.5rem;
	padding: 1.1rem 1.25rem;
	border-radius: var(--radius);
	background: rgba(245, 158, 11, .06);
	border: 1px solid rgba(245, 158, 11, .25);
}
.suggestions-title {
	margin: 0 0 .75rem;
	font-size: .9rem;
	font-weight: 600;
	color: #b45309;
}
.suggestions-empty {
	margin: 0;
	font-size: .88rem;
	color: var(--success);
}
.suggestions-list { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: .5rem; }
.suggestions-list li { display: flex; gap: .55rem; font-size: .85rem; color: var(--gray-700); align-items: flex-start; }
.suggestions-dot { margin-top: .4rem; width: 6px; height: 6px; border-radius: 50%; background: #f59e0b; flex-shrink: 0; }

.suggestions-hint { margin: 1.4rem 0 0; font-size: .78rem; color: var(--gray-500); font-style: italic; }
.basic-scope-note { margin: 1.2rem 0 0; font-size: .78rem; color: var(--gray-500); font-style: italic; }
.compliance-badges { display: flex; flex-direction: column; gap: .6rem; margin-top: .6rem; }
.compliance-row {
	display: flex;
	gap: .65rem;
	align-items: flex-start;
	padding: .75rem 1rem;
	border-radius: var(--radius);
}
.compliance-row.pass { background: rgba(22,163,74,.08); border: 1px solid rgba(22,163,74,.25); }
.compliance-row.fail { background: rgba(220,38,38,.08); border: 1px solid rgba(220,38,38,.25); }
.compliance-icon { font-size: 1.05rem; font-weight: 700; margin-top: .1rem; }
.compliance-row.pass .compliance-icon { color: var(--success); }
.compliance-row.fail .compliance-icon { color: var(--danger); }
.compliance-title { margin: 0; font-size: .88rem; font-weight: 600; }
.compliance-row.pass .compliance-title { color: #15803d; }
.compliance-row.fail .compliance-title { color: #b91c1c; }
.compliance-subtitle { margin: .1rem 0 0; font-size: .78rem; color: var(--gray-500); }
.compliance-blocking { margin: .35rem 0 0; font-size: .75rem; color: #b91c1c; }
#checksTable tr.became-compliant td { background: rgba(22,163,74,.06); }