/**
 * IC360 Community — market and sub-sector profile blocks.
 *
 * Scoped to .icd-profile so it cannot affect any other IC360 view. Colours resolve from the IC360 design tokens
 * when they exist and fall back to the same values when this stylesheet stands alone. Shared primitives (.icd-sr,
 * .icd-empty, .icd-method) come from community-market-explorer.css, which is declared as a dependency.
 */

.icd-profile {
	--icd-ink: var(--ic-ink, #0b1a2e);
	--icd-ink-2: var(--ic-ink-2, #3b4a5f);
	--icd-mute: var(--ic-mute, #56657a);
	--icd-line: var(--ic-line, #dbe3ec);
	--icd-surface: var(--ic-surface, #fff);
	--icd-accent: var(--ic-accent, #0a7a9e);
	--icd-accent-ink: var(--ic-accent-ink, #06627f);
	--icd-accent-2: var(--ic-accent-2, #22d3ee);
	--icd-warn: var(--ic-warn, #b45309);
	--icd-r: var(--ic-r, 12px);
	--icd-shadow: var(--ic-shadow, 0 1px 2px rgba(8, 20, 38, .06), 0 6px 18px rgba(8, 20, 38, .06));

	margin: 0 0 38px;
	color: var(--icd-ink);
	font-size: 16px;
	line-height: 1.55;
}

.icd-profile *,
.icd-profile *::before,
.icd-profile *::after {
	box-sizing: border-box;
}

.icd-profile a:focus-visible,
.icd-profile [tabindex]:focus-visible {
	outline: 3px solid var(--icd-accent-2);
	outline-offset: 2px;
	border-radius: 6px;
}

/* ---------- Head ---------- */

.icd-profile__head {
	margin: 0 0 20px;
	padding: 22px 24px 20px;
	border: 1px solid var(--icd-line);
	border-left: 4px solid var(--icd-accent);
	border-radius: var(--icd-r);
	background: linear-gradient(180deg, #f8fbfe 0%, var(--icd-surface) 100%);
	box-shadow: var(--icd-shadow);
}

.icd-profile__eyebrow {
	margin: 0 0 8px;
	font-size: .74rem;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--icd-accent-ink);
}

.icd-profile__head h2 {
	margin: 0 0 8px;
	font-size: clamp(1.3rem, 2.3vw, 1.7rem);
	line-height: 1.2;
	color: var(--icd-ink);
}

.icd-profile__lead {
	margin: 0;
	max-width: 820px;
	color: var(--icd-mute);
}

.icd-profile__values {
	margin: 10px 0 0;
	font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
	font-size: .82rem;
	color: var(--icd-ink-2);
	overflow-wrap: anywhere;
}

/* ---------- Key figures ---------- */

.icd-profile__stats {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 12px;
	margin: 0 0 16px;
}

.icd-profile__stat {
	margin: 0;
	padding: 14px 16px;
	border: 1px solid var(--icd-line);
	border-radius: var(--icd-r);
	background: var(--icd-surface);
	box-shadow: var(--icd-shadow);
}

.icd-profile__stat dt {
	margin: 0 0 4px;
	font-size: .78rem;
	font-weight: 600;
	letter-spacing: .02em;
	color: var(--icd-mute);
}

.icd-profile__stat-num {
	margin: 0;
	font-size: 1.5rem;
	font-weight: 700;
	line-height: 1.15;
	font-variant-numeric: tabular-nums;
	color: var(--icd-ink);
}

/* ---------- Context link ---------- */

.icd-profile__nav {
	margin: 0 0 22px;
}

.icd-profile__nav a {
	font-size: .9rem;
	font-weight: 700;
	color: var(--icd-accent-ink);
	text-decoration: none;
	border-bottom: 2px solid rgba(10, 122, 158, .25);
}

.icd-profile__nav a:hover,
.icd-profile__nav a:focus-visible {
	border-bottom-color: var(--icd-accent);
}

/* ---------- Group ---------- */

.icd-profile__group {
	margin: 0 0 22px;
}

.icd-profile__group-title {
	margin: 0 0 4px;
	font-size: 1.02rem;
	letter-spacing: .01em;
	color: var(--icd-ink);
}

.icd-profile__group-blurb {
	margin: 0 0 10px;
	max-width: 760px;
	font-size: .88rem;
	color: var(--icd-mute);
}

/* ---------- Table ---------- */

.icd-profile__table {
	width: 100%;
	margin: 0;
	border-collapse: collapse;
	border: 1px solid var(--icd-line);
	border-radius: var(--icd-r);
	background: var(--icd-surface);
	overflow: hidden;
}

.icd-profile__table th,
.icd-profile__table td {
	padding: 9px 12px;
	border-bottom: 1px solid var(--icd-line);
	text-align: left;
	vertical-align: middle;
}

.icd-profile__table thead th {
	font-size: .76rem;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--icd-mute);
	background: #f6f9fc;
}

.icd-profile__table tbody tr:last-child th,
.icd-profile__table tbody tr:last-child td {
	border-bottom: 0;
}

.icd-profile__term {
	font-weight: 600;
	color: var(--icd-ink);
}

.icd-profile__term a {
	color: var(--icd-ink);
	text-decoration: none;
	border-bottom: 1px solid transparent;
}

.icd-profile__term a:hover,
.icd-profile__term a:focus-visible {
	border-bottom-color: var(--icd-accent);
}

.icd-profile__col-count,
.icd-profile__count {
	width: 11rem;
	text-align: right;
	font-variant-numeric: tabular-nums;
}

.icd-profile__table thead .icd-profile__col-count {
	text-align: right;
}

.icd-profile__num {
	display: inline-block;
	min-width: 3.2rem;
	padding: 2px 8px;
	border-radius: 999px;
	background: rgba(10, 122, 158, .08);
	color: var(--icd-accent-ink);
	font-weight: 700;
	text-decoration: none;
}

.icd-profile__num:hover,
.icd-profile__num:focus-visible {
	background: rgba(10, 122, 158, .16);
}

.icd-profile__row.is-gap .icd-profile__term {
	color: var(--icd-mute);
	font-weight: 500;
}

.icd-profile__row.is-gap .icd-profile__count {
	color: var(--icd-warn);
}

/* A six-row market table does not need the full column width of a long sub-sector list. */

.icd-profile__table--markets {
	max-width: 780px;
}

.icd-profile__table--markets .icd-profile__term {
	width: 60%;
}

/* Misconfigured block: amber, not the normal accent, so an editor notices without reading the text. */

.icd-profile--unconfigured .icd-profile__head {
	border-left-color: var(--icd-warn);
	background: linear-gradient(180deg, #fdf8f1 0%, var(--icd-surface) 100%);
}

.icd-profile--sector .icd-profile__stat-num {
	font-size: 1.35rem;
}

/* ---------- Responsive ---------- */

@media (max-width: 720px) {
	.icd-profile__stats {
		grid-template-columns: 1fr;
	}

	.icd-profile__table th,
	.icd-profile__table td {
		padding: 8px 10px;
		font-size: .92rem;
	}

	.icd-profile__col-count,
	.icd-profile__count {
		width: 8.5rem;
	}
}

@media (max-width: 420px) {
	.icd-profile__head {
		padding: 18px 16px;
	}

	.icd-profile__stat-num {
		font-size: 1.3rem;
	}

	.icd-profile__num {
		min-width: 0;
	}
}

/* ---------- Motion ---------- */

@media (prefers-reduced-motion: reduce) {
	.icd-profile * {
		transition: none !important;
	}
}

/* ---------- Print ---------- */

@media print {
	.icd-profile__nav {
		display: none;
	}

	.icd-profile__table {
		box-shadow: none;
	}

	.icd-profile__num {
		background: none;
		color: var(--icd-ink);
	}
}