/*
 * Company profile
 *
 * This route is intentionally isolated from the general theme stylesheet.
 * The employer post type remains provided by WP Job Board Pro during the
 * migration, while all visible profile treatment belongs to the SASAL theme.
 */

.sasal-company-profile-page {
	background: var(--surface-page);
}

.sasal-company-profile-page__restricted {
	max-width: var(--container-narrow);
	margin-block: var(--section-y);
	padding: var(--space-10);
	border: 1px solid var(--border-subtle);
	border-radius: var(--radius-card);
	background: var(--surface-card);
	box-shadow: var(--shadow-xs);
}

.sasal-company-profile-page__restricted h1 {
	margin-top: var(--space-3);
	font: var(--type-h2);
}

.sasal-company-profile-page__restricted p:last-child {
	margin-top: var(--space-4);
	color: var(--text-muted);
}

.sasal-company-profile-panel {
	color: var(--text-body);
}

.sasal-company-profile-panel__media {
	min-width: 0;
	padding: var(--space-7);
	border: 1px solid var(--border-subtle);
	border-radius: var(--radius-card);
	background: var(--surface-card);
	box-shadow: var(--shadow-xs);
}

.sasal-company-profile-panel__eyebrow {
	font: var(--type-eyebrow);
	letter-spacing: var(--tracking-eyebrow);
	text-transform: uppercase;
	color: var(--text-muted);
}

.sasal-company-profile-panel__match-main {
	display: flex;
	align-items: center;
	gap: var(--space-5);
	margin-top: var(--space-5);
}

.sasal-company-profile-panel__match-main > div {
	min-width: 0;
}

.sasal-company-profile-panel__match-main strong {
	display: block;
	color: var(--text-primary);
	font: var(--type-h4);
}

.sasal-company-profile-panel__match-main p {
	margin-top: var(--space-2);
	color: var(--text-muted);
	font: var(--type-body-sm);
}

.sasal-company-profile-panel__media {
	margin-bottom: var(--space-6);
}

.sasal-company-profile-panel__score {
	position: relative;
	display: grid;
	place-content: center;
	width: 84px;
	height: 84px;
	flex: 0 0 84px;
	border-radius: var(--radius-circle);
	background: conic-gradient(var(--green-700) calc(var(--score, 0) * 1%), var(--paper-200) 0);
}

.sasal-company-profile-panel__score::after {
	position: absolute;
	inset: 6px;
	border-radius: inherit;
	background: var(--surface-card);
	content: '';
}

.sasal-company-profile-panel__score b,
.sasal-company-profile-panel__score small {
	position: relative;
	z-index: 1;
	display: block;
	text-align: center;
}

.sasal-company-profile-panel__score b {
	color: var(--text-primary);
	font: var(--weight-regular) var(--text-2xl)/1 var(--font-mono);
}

.sasal-company-profile-panel__score small {
	margin-top: 2px;
	color: var(--text-muted);
	font: var(--type-eyebrow);
	font-size: 9px;
	letter-spacing: 0.12em;
}

.sasal-company-profile-panel__match-main.is-pending .sasal-company-profile-panel__score {
	background: var(--paper-100);
}

.sasal-company-profile-panel__gallery {
	display: grid;
	grid-template-columns: 1.2fr 1fr;
	grid-template-rows: 90px 90px;
	gap: var(--space-2);
	margin-top: var(--space-5);
}

.sasal-company-profile-panel__gallery a {
	display: block;
	overflow: hidden;
	border-radius: var(--radius-md);
	background: var(--paper-100) center / cover no-repeat;
	box-shadow: inset 0 0 0 1px rgba(11, 31, 26, 0.04);
}

.sasal-company-profile-panel__gallery a:first-child {
	grid-row: 1 / 3;
}

.sasal-company-profile-panel__gallery a:hover {
	box-shadow: inset 0 0 0 2px var(--green-700);
}

.sasal-company-profile-tabs {
	grid-column: 1 / -1;
	min-width: 0;
	border: 1px solid var(--border-subtle);
	border-radius: var(--radius-card);
	background: var(--surface-card);
	box-shadow: var(--shadow-xs);
}

.sasal-company-profile-tabs__nav {
	display: flex;
	gap: var(--space-5);
	min-width: 0;
	overflow-x: auto;
	padding: 0 var(--space-7);
	border-bottom: 1px solid var(--border-subtle);
	scrollbar-width: thin;
}

.sasal-company-profile-tabs__nav button {
	position: relative;
	padding: var(--space-5) 0 calc(var(--space-4) + 1px);
	border: 0;
	border-radius: 0;
	background: transparent;
	color: var(--text-muted);
	font: var(--type-label);
	white-space: nowrap;
	cursor: pointer;
	transition: var(--transition-control);
}

.sasal-company-profile-tabs__nav button:hover,
.sasal-company-profile-tabs__nav button[aria-selected='true'] {
	color: var(--text-primary);
}

.sasal-company-profile-tabs__nav button[aria-selected='true']::after {
	position: absolute;
	right: 0;
	bottom: -1px;
	left: 0;
	height: 2px;
	background: var(--green-700);
	content: '';
}

.sasal-company-profile-tabs__panel {
	padding: var(--space-7);
	color: var(--text-body);
	font: var(--type-body);
}

.sasal-company-profile-tabs__panel[hidden] {
	display: none;
}

.sasal-company-profile-tabs__panel > p + p {
	margin-top: var(--space-4);
}

.sasal-company-profile-tabs__empty {
	color: var(--text-muted);
}

.sasal-company-profile-tabs__target-company {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--space-3);
	margin: 0;
}

.sasal-company-profile-tabs__target-company > div {
	min-width: 0;
	padding: var(--space-5);
	border: 1px solid var(--border-subtle);
	border-radius: var(--radius-panel);
	background: var(--surface-page);
}

.sasal-company-profile-tabs__target-company dt {
	margin: 0 0 var(--space-2);
	color: var(--text-muted);
	font: var(--type-eyebrow);
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.sasal-company-profile-tabs__target-company dd {
	margin: 0;
	color: var(--text-primary);
	font: var(--type-label);
	line-height: var(--leading-relaxed);
}

.sasal-company-profile-score-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: var(--space-3);
	margin-top: var(--space-4);
}

.sasal-company-profile-score-grid article {
	display: grid;
	gap: var(--space-2);
	min-width: 0;
	min-height: 108px;
	padding: var(--space-5);
	border: 1px solid var(--border-subtle);
	border-radius: var(--radius-panel);
	background: var(--surface-page);
}

.sasal-company-profile-score-grid article:first-child {
	border-color: var(--green-300);
	background: var(--green-50);
}

.sasal-company-profile-score-grid span {
	color: var(--text-muted);
	font: var(--type-label);
	font-size: var(--text-xs);
}

.sasal-company-profile-score-grid strong {
	align-self: end;
	overflow-wrap: anywhere;
	color: var(--text-primary);
	font: var(--weight-regular) var(--text-xl)/1.1 var(--font-mono);
}

.sasal-company-profile-score-grid article:first-child strong {
	color: var(--green-800);
}

.sasal-company-profile-tabs__opportunities {
	display: grid;
	gap: 0;
	margin: 0;
	padding: 0;
	list-style: none;
}

.sasal-company-profile-tabs__opportunities li {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--space-4);
	padding: var(--space-4) 0;
	border-bottom: 1px solid var(--border-subtle);
}

.sasal-company-profile-tabs__opportunities li:first-child {
	padding-top: 0;
}

.sasal-company-profile-tabs__opportunities li:last-child {
	border-bottom: 0;
}

.sasal-company-profile-tabs__opportunities a {
	color: var(--text-primary);
	font: var(--type-label);
}

.sasal-company-profile-tabs__opportunities a:hover {
	color: var(--text-link-hover);
}

.sasal-company-profile-tabs__opportunities span {
	flex: 0 0 auto;
	color: var(--text-muted);
	font: var(--type-eyebrow);
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.sasal-company-profile-tabs__case-studies {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--space-4);
}

.sasal-company-profile-tabs__case-studies article {
	overflow: hidden;
	border: 1px solid var(--border-subtle);
	border-radius: var(--radius-panel);
	background: var(--surface-card);
}

.sasal-company-profile-tabs__case-study-preview {
	position: relative;
	aspect-ratio: 1 / 1.22;
	overflow: hidden;
	border-bottom: 1px solid var(--border-subtle);
	background: var(--paper-100);
}

.sasal-company-profile-tabs__case-study-frame {
	display: block;
	width: 100%;
	height: 100%;
	border: 0;
	background: var(--surface-card);
	pointer-events: none;
}

.sasal-company-profile-tabs__case-study-preview > span {
	position: absolute;
	top: var(--space-3);
	left: var(--space-3);
	padding: 4px 8px;
	border-radius: var(--radius-pill);
	background: rgba(11, 31, 26, 0.84);
	color: var(--text-inverse);
	font: var(--type-eyebrow);
	font-size: 9px;
	letter-spacing: 0.08em;
}

.sasal-company-profile-tabs__case-study-details {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--space-4);
	padding: var(--space-4);
}

.sasal-company-profile-tabs__case-study-copy {
	display: flex;
	align-items: center;
	min-width: 0;
	gap: var(--space-2);
}

.sasal-company-profile-tabs__case-study-type {
	display: grid;
	place-items: center;
	min-width: 34px;
	height: 26px;
	padding: 0 6px;
	border-radius: var(--radius-sm);
	background: var(--green-50);
	color: var(--green-800);
	font: var(--type-eyebrow);
	font-size: 9px;
	letter-spacing: 0.08em;
}

.sasal-company-profile-tabs__case-study-copy strong {
	overflow: hidden;
	color: var(--text-primary);
	font: var(--type-label);
	text-overflow: ellipsis;
	white-space: nowrap;
}

.sasal-company-profile-tabs__case-studies a {
	flex: 0 0 auto;
	font: var(--type-label);
	font-size: var(--text-xs);
}

/* Explore Synergy is a company-profile interaction, so its visual contract
 * lives with the profile rather than the messaging service. */
.sasal-company-profile-synergy {
	position: relative;
}

.sasal-company-profile-synergy > summary {
	list-style: none;
}

.sasal-company-profile-synergy > summary::-webkit-details-marker {
	display: none;
}

.sasal-company-profile-synergy__panel {
	position: absolute;
	z-index: 20;
	top: calc(100% + var(--space-3));
	right: 0;
	width: min(440px, calc(100vw - 32px));
	padding: var(--space-6);
	border: 1px solid var(--border-subtle);
	border-radius: var(--radius-card);
	background: var(--surface-card);
	box-shadow: var(--shadow-md);
}

.sasal-company-profile-synergy__panel h2 {
	margin: 0 0 var(--space-5);
	color: var(--text-primary);
	font: var(--type-h4);
}

.sasal-company-profile-synergy__prompt {
	margin-bottom: var(--space-5);
	padding: var(--space-4);
	border: 1px solid var(--green-300);
	border-radius: var(--radius-panel);
	background: var(--green-50);
	color: var(--green-800);
	line-height: var(--leading-relaxed);
}

.sasal-company-profile-synergy__prompt strong,
.sasal-company-profile-synergy__prompt span {
	display: block;
}

.sasal-company-profile-synergy__prompt strong {
	margin-bottom: var(--space-2);
	font: var(--type-label);
}

.sasal-company-profile-synergy__prompt span {
	font: var(--type-body-sm);
}

.sasal-company-profile-synergy .form-group {
	margin: 0 0 var(--space-4);
}

.sasal-company-profile-synergy .form-group label {
	display: block;
	margin-bottom: var(--space-2);
	color: var(--text-primary);
	font: var(--type-label);
}

.sasal-company-profile-synergy textarea {
	width: 100%;
	min-height: 250px;
	padding: var(--space-3);
	border: 1px solid var(--border-strong);
	border-radius: var(--radius-md);
	background: var(--surface-card);
	color: var(--text-primary);
	font: var(--type-body);
	resize: vertical;
}

.sasal-company-profile-synergy textarea:focus {
	border-color: var(--green-700);
	outline: 2px solid color-mix(in srgb, var(--green-700) 22%, transparent);
	outline-offset: 2px;
}

.sasal-company-profile-synergy__result {
	min-height: 1.25em;
	margin: var(--space-3) 0 0;
	color: var(--green-800);
	font: var(--type-body-sm);
}

.sasal-company-profile-synergy__result.is-error {
	color: #9a3f32;
}

@media (max-width: 980px) {
	.sasal-company-profile-score-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 680px) {
	.sasal-company-profile-page__restricted {
		margin-block: var(--space-10);
		padding: var(--space-6);
	}

	.sasal-company-profile-panel {
		gap: var(--space-4);
	}

	.sasal-company-profile-panel__media,
	.sasal-company-profile-tabs__panel {
		padding: var(--space-5);
	}

	.sasal-company-profile-panel__gallery {
		grid-template-rows: 74px 74px;
	}

	.sasal-company-profile-tabs__nav {
		gap: var(--space-4);
		padding-inline: var(--space-5);
	}

	.sasal-company-profile-tabs__nav button {
		padding-block: var(--space-4) calc(var(--space-3) + 1px);
		font-size: var(--text-xs);
	}

	.sasal-company-profile-tabs__target-company,
	.sasal-company-profile-tabs__case-studies {
		grid-template-columns: 1fr;
	}

	.sasal-company-profile-tabs__opportunities li {
		align-items: flex-start;
		flex-direction: column;
		gap: var(--space-2);
	}

	.sasal-company-profile-synergy__panel {
		position: fixed;
		top: 80px;
		right: 16px;
		left: 16px;
		width: auto;
		max-height: calc(100vh - 100px);
		overflow: auto;
	}
}

@media (max-width: 430px) {
	.sasal-company-profile-panel__match-main {
		align-items: flex-start;
		gap: var(--space-4);
	}

	.sasal-company-profile-panel__score {
		width: 72px;
		height: 72px;
		flex-basis: 72px;
	}

	.sasal-company-profile-score-grid {
		grid-template-columns: 1fr;
	}

	.sasal-company-profile-tabs__case-study-details {
		align-items: flex-start;
		flex-direction: column;
	}
}