/* ─────────────── Profile Page ─────────────── */

.rc-profile-header-row {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: var(--rc-space-24);
}

/* Mobile: Stack header row and center button */
@media (max-width: 767px) {
	.rc-profile-header-row {
		flex-direction: column;
		align-items: center;
		gap: var(--rc-space-16);
	}
}

.rc-profile-edit-action {
	flex-shrink: 0;
}

/* ─────────────── Dashboard ─────────────── */

/* Page Title (Hidden by default for clean layout) */
.rc-dashboard>h3:first-of-type {
	display: none;
}

/* Profile Header (Top section) - No card styling, transparent background */
.rc-profile-header {
	margin-bottom: var(--rc-space-32);
	border: 0;
	box-shadow: none;
	background: transparent;
	padding: 0;
}

.rc-profile-summary-grid {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: var(--rc-space-32);
	align-items: center;
}

.rc-summary-media {
	display: flex;
	align-items: center;
	justify-content: center;
}

.rc-summary-main {
	align-self: center;
}

/* Avatar styles moved to base.css for consistency */

#rc-profile-heading {
	font-family: var(--rc-typo-header-2-family);
	font-size: var(--rc-typo-header-2-size);
	font-weight: var(--rc-typo-header-2-weight);
	line-height: var(--rc-typo-header-2-line-height);
	letter-spacing: var(--rc-typo-header-2-spacing);
	color: var(--rc-secondary);
	margin: var(--rc-space-8) 0 0;
}

/* Profile Detail Grid */
.rc-profile-detail-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--rc-space-32);
	align-items: start;
	margin-top: var(--rc-space-32);
}

.rc-profile-detail-grid .rc-detail-right {
	display: grid;
	grid-template-rows: auto auto;
	gap: var(--rc-space-32);
}



/* Professional Information Card - Primary Grid Layout */
.rc-primary-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--rc-space-12) var(--rc-space-16);
}

.rc-primary-grid .rc-line-row--full {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	width: 100%;
	gap: var(--rc-space-8);
	align-self: start;
	justify-content: flex-start;
	height: auto;
}

.rc-primary-grid .rc-line-row--full .rc-line-label {
	font-family: var(--rc-typo-label-1-family);
	font-size: var(--rc-typo-label-1-size);
	font-weight: var(--rc-typo-label-1-weight);
	line-height: var(--rc-typo-label-1-line-height);
	color: var(--rc-typo-label-1-color);
	text-align: left;
	align-self: flex-start;
	margin-bottom: 0;
}

.rc-primary-grid .rc-line-row--full .rc-line-value {
	font-family: var(--rc-typo-text-2-family);
	font-size: var(--rc-typo-text-2-size);
	font-weight: var(--rc-typo-text-2-weight);
	line-height: var(--rc-typo-text-2-line-height);
	color: var(--rc-typo-text-2-color);
	display: flex;
	flex-wrap: wrap;
	gap: var(--rc-space-6);
	justify-content: flex-start;
	text-align: left;
	width: 100%;
}

/* Mobile Responsive: Collapse to single column */
@media (max-width: 767px) {
	.rc-primary-grid {
		grid-template-columns: 1fr;
		gap: var(--rc-space-12);
	}
}

/* Shared Row Layout (Personal Info etc) */
.rc-line-row {
	display: flex;
	align-items: baseline;
	width: 100%;
	margin-bottom: var(--rc-space-8);
}

.rc-line-row .rc-line-label {
	font-family: var(--rc-typo-label-1-family);
	font-size: var(--rc-typo-label-1-size);
	font-weight: var(--rc-typo-label-1-weight);
	color: var(--rc-typo-label-1-color);
	white-space: nowrap;
	margin-right: var(--rc-space-8);
}

.rc-line {
	flex: 1;
	border-bottom: 1px solid var(--rc-gray-300);
	margin: 0 var(--rc-space-4) 4px;
	min-width: 20px;
}

.rc-line-row .rc-line-value {
	font-family: var(--rc-typo-text-2-family);
	font-size: var(--rc-typo-text-2-size);
	font-weight: var(--rc-typo-text-2-weight);
	color: var(--rc-typo-text-2-color);
	text-align: right;
	margin-left: var(--rc-space-8);
}

.rc-line-value a {
	color: var(--rc-link-primary);
	text-decoration: underline !important;
	font-weight: var(--rc-font-weight-medium);
}

@media (hover: hover) {
	.rc-line-value a:hover {
		color: var(--rc-link-primary-hover);
		text-decoration: underline !important;
	}
}

/* Mobile: Ensure long text wraps nicely without breaking layout */
@media (max-width: 767px) {
	.rc-line-row .rc-line-value {
		overflow-wrap: anywhere;
		word-break: break-word;
		min-width: 0;
		flex-shrink: 1;
		text-align: right;
	}

	.rc-line {
		display: block;
	}
}

/* Profile Actions */
.rc-profile-actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--rc-space-16);
	text-align: left;
	margin-top: var(--rc-space-24);
}

.rc-status-list {
	display: flex;
	flex-direction: column;
	gap: var(--rc-space-6);
	font-size: var(--rc-text-sm);
	line-height: var(--rc-leading-snug);
}

.rc-status-item {
	display: flex;
	align-items: center;
	gap: var(--rc-space-8);
	padding: var(--rc-space-6) var(--rc-space-8);
	background: var(--rc-status-item-bg);
	border: 1px solid var(--rc-status-item-bg);
	border-radius: var(--rc-radius-sm);
}

.rc-status-dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
}

/* Profile Footer (Status Row + Actions) */
.rc-profile-footer {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-top: var(--rc-space-12);
	gap: var(--rc-space-24);
}

.rc-profile-status-row {
	display: flex;
	gap: var(--rc-space-24);
	align-items: center;
	flex-wrap: wrap;
}

.rc-profile-status-item {
	display: flex;
	align-items: center;
	gap: var(--rc-space-8);
	font-family: var(--rc-typo-text-2-family);
	font-size: var(--rc-typo-text-2-size);
	font-weight: var(--rc-typo-text-2-weight);
	line-height: var(--rc-typo-text-2-line-height);
	color: var(--rc-typo-text-2-color);
}

.rc-profile-edit-action {
	flex-shrink: 0;
}

/* Dashboard grid, snapshot card, chips moved to base.css */

/* Account Settings Cards - Migrated to .rc-card */
.rc-account-settings .rc-card__content {
	display: block;
	width: 100%;
}

/* Mobile: Stack fields vertically */
@media (max-width: 767px) {
	.rc-account-settings .rc-flex {
		flex-direction: column;
	}
}

/* Phone group styles in base.css */


/* ─────────────── Jobseeker Modal Styles Moved to modals.css ─────────────── */
/* All modal styles including .rc-modal-jos now in modals.css */

/* ─────────────── Matches Page ─────────────── */

/* Main Grid Container - 2 Column Layout on Desktop */
.rc-matches-page .rc-match-cards {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--rc-space-24);
	margin-top: var(--rc-space-24);
}

/* 2-column grid on desktop */
@media (min-width: 1024px) {
	.rc-matches-page .rc-match-cards {
		grid-template-columns: 1fr 1fr;
		gap: var(--rc-space-32);
	}
}

/* Individual Match Card */
.rc-match-card {
	position: relative;
	background: var(--rc-card-bg);
	border: 1px solid var(--rc-border);
	border-radius: var(--rc-radius-lg);
	padding: var(--rc-space-40);
	box-shadow: var(--rc-card-shadow);
	transition: box-shadow var(--rc-transition-base), transform var(--rc-transition-fast);
	display: flex;
	flex-direction: column;
	gap: 0;
}

@media (hover: hover) {
	.rc-match-card:hover {
		box-shadow: var(--rc-card-shadow-hover);
		transform: translateY(-1px);
	}
}

/* 2x2 Grid Inside Each Card */
.rc-match-card-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--rc-space-16);
}

/* Desktop: 2-column grid with horizontal divider */
@media (min-width: 768px) {
	.rc-match-card-grid {
		grid-template-columns: 1fr 1fr;
		gap: var(--rc-space-32);
		position: relative;
	}

	/* Single continuous divider line between top and bottom rows */
	.rc-match-card-grid::after {
		content: "";
		position: absolute;
		left: 0;
		right: 0;
		top: calc(50% - 1px);
		height: 1px;
		background: var(--rc-gray-300);
		z-index: 1;
	}

	/* Add vertical spacing around the divider */
	.rc-match-card-grid>*:nth-child(1),
	.rc-match-card-grid>*:nth-child(2) {
		padding-bottom: var(--rc-space-16);
	}

	.rc-match-card-grid>*:nth-child(3),
	.rc-match-card-grid>*:nth-child(4) {
		padding-top: var(--rc-space-16);
	}
}

/* ─────────────── Top Left: Company Identity ─────────────── */
.rc-match-cell-company-header {
	display: flex;
	align-items: center;
	gap: var(--rc-space-16);
}

.rc-company-logo {
	width: var(--rc-avatar-md);
	height: var(--rc-avatar-md);
	min-width: var(--rc-avatar-md);
	border-radius: 50%;
	object-fit: cover;
	border: 3px solid var(--rc-avatar-border-color);
	box-shadow: var(--rc-avatar-shadow);
}

.rc-company-logo--placeholder {
	background: linear-gradient(135deg, var(--rc-gray-50) 0%, var(--rc-gray-100) 100%);
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--rc-gray-400);
	font-size: 48px;
	border-radius: 50%;
}

.rc-company-logo--placeholder::before {
	content: "🏢";
}

.rc-company-identity {
	display: flex;
	flex-direction: column;
	gap: var(--rc-space-8);
	flex: 1;
	justify-content: center;
	/* Verification: Center vertically with avatar */
}

.rc-company-name {
	font-family: var(--rc-typo-header-2-family);
	font-size: var(--rc-typo-header-2-size);
	/* 22px */
	font-weight: var(--rc-typo-header-2-weight);
	line-height: var(--rc-typo-header-2-line-height);
	color: var(--rc-secondary);
	margin: 0;
}

/* ─────────────── Top Right: Company Details ─────────────── */
.rc-match-cell-company-details {
	display: flex;
	flex-direction: column;
	gap: var(--rc-space-8);
	justify-content: center;
}

/* ─────────────── Bottom Left: Recruiter Identity ─────────────── */
.rc-match-cell-recruiter-header {
	display: flex;
	align-items: center;
	gap: var(--rc-space-16);
}

.rc-recruiter-avatar {
	width: 80px;
	height: 80px;
	min-width: 80px;
	border-radius: 50%;
	object-fit: cover;
	border: 3px solid var(--rc-avatar-border-color);
	box-shadow: var(--rc-avatar-shadow);
	background: var(--rc-bg-light);
}

.rc-recruiter-avatar--sm {
	width: 80px;
	height: 80px;
	min-width: 80px;
}

.rc-recruiter-avatar--placeholder {
	background: linear-gradient(135deg, var(--rc-gray-50) 0%, var(--rc-gray-100) 100%);
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--rc-gray-400);
	font-size: 38px;
	border-radius: 50%;
}

.rc-recruiter-avatar--placeholder::before {
	content: "👤";
}

.rc-recruiter-identity {
	display: flex;
	flex-direction: column;
	gap: var(--rc-space-10);
	flex: 1;
	justify-content: center;
	/* Verification: Center vertically with avatar */
}

.rc-recruiter-name {
	font-family: var(--rc-typo-header-3-family);
	font-size: var(--rc-typo-body-size);
	/* 14px - using body size token */
	font-weight: var(--rc-typo-header-3-weight);
	color: var(--rc-secondary);
	margin: 0;
	line-height: 1.3;
}


/* ─────────────── Bottom Right: Recruiter Contacts ─────────────── */
.rc-match-cell-recruiter-contacts {
	display: flex;
	flex-direction: column;
	gap: var(--rc-space-8);
	justify-content: center;
}

/* ─────────────── Shared Styles ─────────────── */

/* Label Styling (COMPANY / RECRUITER) */
.rc-label-text {
	font-family: var(--rc-typo-label-1-family);
	font-size: var(--rc-text-xxs);
	font-weight: var(--rc-font-weight-bold);
	color: var(--rc-gray-600);
	text-transform: uppercase;
	letter-spacing: var(--rc-tracking-wide);
	margin-bottom: var(--rc-space-4);
}

/* Detail Items (Company Details + Recruiter Contacts) */
.rc-detail-item {
	display: flex;
	align-items: center;
}

.rc-detail-item .rc-typo-body {
	font-family: var(--rc-typo-text-2-family);
	font-size: var(--rc-typo-text-2-size);
	/* 14px */
	font-weight: var(--rc-typo-text-2-weight);
	/* 400 */
	line-height: var(--rc-typo-text-2-line-height);
	color: var(--rc-typo-text-2-color);
	/* Gray 600 */
	word-break: break-word;
}

.rc-detail-item .rc-link {
	color: var(--rc-link-primary);
	text-decoration: underline !important;
	font-weight: var(--rc-font-weight-medium);
}

@media (hover: hover) {
	.rc-detail-item .rc-link:hover {
		color: var(--rc-link-primary-hover);
		text-decoration: underline !important;
	}
}

/* Split Company Details Layout */
.rc-company-details-split {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--rc-space-24);
	margin-top: var(--rc-space-8);
}

@media (min-width: 1024px) {
	.rc-company-details-split {
		grid-template-columns: 1fr 1fr;
		gap: var(--rc-space-32);
		align-items: start;
	}
}

.rc-details-col-left,
.rc-details-col-right {
	display: flex;
	flex-direction: column;
	gap: var(--rc-space-8);
	/* Compact spacing */
}

/* Ensure rows are compact */
.rc-company-details-split .rc-line-row {
	margin-bottom: 0;
}

/* Remove old columns layout styles */
.rc-company-details {
	margin-top: 0;
}

.rc-unlocked-badge-footer {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: var(--rc-space-8);
	margin-top: auto;
	text-align: center;
	background: var(--rc-bg-light);
	border-radius: var(--rc-radius-md);
	padding: var(--rc-space-10) var(--rc-space-16);
}

.rc-unlocked-badge-footer>span {
	display: flex;
	align-items: center;
	gap: var(--rc-space-6);
	font-size: var(--rc-text-sm);
	font-weight: var(--rc-font-weight-semibold);
	color: var(--rc-success-text-strong);
}

.rc-unlocked-badge-footer svg {
	flex-shrink: 0;
	width: 16px;
	height: 16px;
	color: var(--rc-success-text);
}

.rc-unlocked-timestamp {
	font-size: var(--rc-text-xs);
	color: var(--rc-muted);
	border-left: 1px solid var(--rc-divider);
	padding-left: var(--rc-space-8);
}

/* Responsive */
@media (max-width: 767px) {
	.rc-match-card {
		padding: var(--rc-space-16);
	}

	/* Smaller avatars on mobile for better proportion */
	.rc-match-card .rc-company-logo {
		width: 64px;
		height: 64px;
		min-width: 64px;
	}

	.rc-match-card .rc-recruiter-avatar {
		width: 56px;
		height: 56px;
		min-width: 56px;
	}

	/* Smaller placeholder emoji sizes */
	.rc-match-card .rc-company-logo--placeholder {
		font-size: 32px;
	}

	.rc-match-card .rc-recruiter-avatar--placeholder {
		font-size: 28px;
	}
}

/* Responsive */
@media (max-width:1024px) {
	.rc-profile-summary-grid {
		grid-template-columns: 1fr;
		gap: var(--rc-space-20);
		text-align: center;
	}

	.rc-summary-media {
		grid-row: 1;
	}

	.rc-summary-main {
		grid-row: 2;
	}

	.rc-profile-detail-grid {
		grid-template-columns: 1fr;
	}
}

/* Mobile: Stack profile cards and center them */
@media (max-width: 767px) {
	.rc-profile-header {
		margin-bottom: var(--rc-space-24);
	}

	.rc-profile-summary-grid {
		grid-template-columns: 1fr;
		gap: var(--rc-space-16);
	}

	.rc-summary-main {
		display: flex;
		flex-direction: column;
		align-items: center;
		width: 100%;
	}

	/* Smaller avatar on mobile */
	.rc-jobseeker-avatar--lg {
		width: 100px;
		height: 100px;
	}

	/* Center name and chips */
	#rc-profile-heading {
		text-align: center;
		font-size: var(--rc-text-2xl);
		margin-top: 0;
		margin-bottom: var(--rc-space-8);
	}

	.rc-chip-wrap {
		justify-content: center;
	}

	/* Break out status row children to be direct grid items */
	.rc-profile-footer {
		display: contents;
	}

	/* Header row: center content (Order 1) */
	.rc-profile-header-row {
		display: flex;
		flex-direction: column;
		align-items: center;
		width: 100%;
		order: 1;
	}

	/* Status Row: (Order 2) */
	.rc-profile-status-row {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		gap: var(--rc-space-12) var(--rc-space-16);
		width: 100%;
		margin-top: var(--rc-space-4);
		margin-bottom: var(--rc-space-12);
		order: 2;
	}

	/* Status items center aligned */
	.rc-profile-status-item {
		justify-content: center;
		font-size: var(--rc-text-xs);
	}

	.rc-profile-status-item .rc-badge {
		width: 14px;
		height: 14px;
		font-size: 10px;
		line-height: 14px;
	}

	.rc-profile-status-item .rc-typo-body {
		font-size: var(--rc-text-xs);
	}

	/* Progress bar wrapper (Order 3) */
	.rc-profile-progress {
		width: 100%;
		max-width: 400px;
		order: 3;
	}

	/* Edit button: full width (Order 4) */
	.rc-profile-edit-action {
		margin-left: 0;
		width: 100%;
		max-width: 400px;
		order: 4;
	}

	.rc-profile-edit-action .rc-btn-pill {
		width: 100%;
		text-align: center;
	}

	/* Profile cards: Flex column for perfect centering */
	.rc-profile-detail-grid {
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: var(--rc-space-24);
		margin-top: var(--rc-space-24);
		width: 100%;
	}

	.rc-profile-detail-grid>* {
		width: 100%;
		max-width: 600px;
		box-sizing: border-box;
	}
}