/* ── Careers Table — Frontend Styles ─────────────────────────────────────── */
/* Color scheme: Green headers (white text) · White rows · Black buttons     */

/* Wrapper */
.cgs-careers-wrap {
	width: 100%;
	margin: 2em 0;
	font-family: inherit;
}

/* Scroll container for narrow viewports */
.cgs-table-responsive {
	width: 100%;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

/* ── Table base ─────────────────────────────────────────────────────────── */
.cgs-careers-table {
	width: 100%;
	border-collapse: collapse;
	border-spacing: 0;
	font-size: 0.95rem;
	line-height: 1.5;
	background: #ffffff;
	border-radius: 0;
}

/* ── Header row ─────────────────────────────────────────────────────────── */
.cgs-careers-table thead tr {
	border-bottom: 3px solid #000000;
}

/* Shared header cell — no border radius anywhere */
.cgs-th {
	padding: 14px 18px;
	text-align: left;
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #ffffff;
	white-space: nowrap;
	border-radius: 0;
}

/* ── Individual header column backgrounds — green shades, white text ─────── */
.cgs-th--title {
	background-color: #14532d;   /* darkest green */
	width: 38%;
}

.cgs-th--category {
	background-color: #166534;   /* dark green */
	width: 18%;
}

.cgs-th--apply {
	background-color: #15803d;   /* medium green */
	width: 22%;
}

.cgs-th--pdf {
	background-color: #16a34a;   /* bright green */
	width: 22%;
}

/* ── Body rows ──────────────────────────────────────────────────────────── */
.cgs-row {
	border-bottom: 1px solid #d1fae5;
	transition: background-color 0.15s ease;
}

.cgs-row:last-child {
	border-bottom: none;
}

.cgs-row:hover {
	background-color: #f0fdf4;   /* lightest green tint on hover */
}

/* Alternating rows */
.cgs-row:nth-child(even) {
	background-color: #f9fafb;   /* very light grey-white */
}

.cgs-row:nth-child(even):hover {
	background-color: #f0fdf4;
}

/* Shared body cell */
.cgs-td {
	padding: 14px 18px;
	vertical-align: middle;
	color: #000000;
	border-radius: 0;
}

/* ── Job Title cell ─────────────────────────────────────────────────────── */
.cgs-title-link {
	color: #14532d;              /* dark green — readable on white */
	font-weight: 600;
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	transition: color 0.15s ease;
}

.cgs-title-link:hover,
.cgs-title-link:focus {
	color: #000000;
	text-decoration: underline;
}

.cgs-title-text {
	font-weight: 600;
	color: #000000;
}

.cgs-pdf-icon {
	font-size: 0.9em;
	opacity: 0.6;
}

/* ── Category badge — light background, black text ──────────────────────── */
.cgs-badge {
	display: inline-block;
	background-color: #dcfce7;   /* light green bg */
	color: #000000;              /* black text on light bg */
	font-size: 0.75rem;
	font-weight: 700;
	padding: 3px 10px;
	border-radius: 0;            /* no border radius */
	white-space: nowrap;
	letter-spacing: 0.03em;
	border: 1px solid #bbf7d0;
}

/* ── Apply Now button — black background, white text ────────────────────── */
.cgs-btn-apply {
	display: inline-block;
	background-color: #000000;
	color: #ffffff !important;
	font-size: 0.8rem;
	font-weight: 700;
	padding: 7px 16px;
	border-radius: 0;            /* no border radius */
	text-decoration: none !important;
	white-space: nowrap;
	letter-spacing: 0.04em;
	border: 2px solid #000000;
	transition: background-color 0.15s ease, color 0.15s ease;
}

.cgs-btn-apply:hover,
.cgs-btn-apply:focus {
	background-color: #14532d;   /* dark green on hover */
	border-color: #14532d;
	color: #ffffff !important;
}

/* ── View PDF button — black outline, black text (light bg) ─────────────── */
.cgs-btn-pdf {
	display: inline-block;
	background-color: transparent;
	color: #000000 !important;
	font-size: 0.8rem;
	font-weight: 600;
	padding: 6px 14px;
	border-radius: 0;            /* no border radius */
	border: 2px solid #000000;
	text-decoration: none !important;
	white-space: nowrap;
	transition: background-color 0.15s ease, color 0.15s ease;
}

.cgs-btn-pdf:hover,
.cgs-btn-pdf:focus {
	background-color: #000000;
	color: #ffffff !important;
}

/* ── Empty cell placeholder ─────────────────────────────────────────────── */
.cgs-td--empty {
	color: #9ca3af;
	font-size: 0.9em;
}

/* ── No results message ─────────────────────────────────────────────────── */
.cgs-no-results {
	color: #6b7280;
	font-style: italic;
	padding: 1em 0;
}

/* ── Responsive: stack on mobile ────────────────────────────────────────── */
@media ( max-width: 640px ) {
	.cgs-careers-table,
	.cgs-careers-table thead,
	.cgs-careers-table tbody,
	.cgs-careers-table tr,
	.cgs-careers-table th,
	.cgs-careers-table td {
		display: block;
		width: 100%;
	}

	.cgs-careers-table thead tr {
		display: grid;
		grid-template-columns: 1fr 1fr;
		border-bottom: none;
	}

	.cgs-th {
		padding: 10px 14px;
		font-size: 0.72rem;
	}

	.cgs-row {
		border: 1px solid #d1fae5;
		border-radius: 0;
		margin-bottom: 10px;
		padding: 4px 0;
	}

	.cgs-td {
		padding: 10px 14px;
		border-bottom: 1px solid #f0f0f0;
	}

	.cgs-td:last-child {
		border-bottom: none;
	}

	.cgs-td::before {
		display: block;
		font-size: 0.7rem;
		font-weight: 700;
		letter-spacing: 0.07em;
		text-transform: uppercase;
		color: #6b7280;
		margin-bottom: 4px;
	}

	.cgs-td--title::before    { content: "Job Title"; }
	.cgs-td--category::before { content: "Category"; }
	.cgs-td--apply::before    { content: "Apply"; }
	.cgs-td--pdf::before      { content: "PDF"; }
}
