/* ===== 1. GLOBAL TABLE STYLING (Desktop) ===== */
.tablepress {
	width: 100% !important;
	border-collapse: separate;
	border-spacing: 0;
	background: #ffffff;
	border-radius: 18px;
	overflow: hidden;
	box-shadow: 0 10px 30px rgba(0,40,68,0.10);
	border: 1px solid #E8EDF3;
	font-family: 'Inter', sans-serif;
	margin-bottom: 20px;
}

.tablepress thead th {
	background: #002844 !important;
	color: #ffffff !important;
	font-family: 'Franklin Gothic Condensed', sans-serif;
	font-size: 18px;
	font-weight: 700;
	padding: 18px 22px;
	text-align: left;
	border: none;
	letter-spacing: 1px;
	text-transform: uppercase;
}

.tablepress tbody td {
	padding: 18px 22px;
	font-size: 16px;
	line-height: 1.5;
	color: #1F2F3F;
	border: none;
	border-top: 1px solid #E8EDF3;
}

.tablepress tbody tr:nth-child(even) td {
	background: #F8FBFD;
}

.tablepress tbody tr:hover td {
	background: #EEF5FA;
	transition: background-color .2s ease;
}

.tablepress tbody td.column-1 {
	font-family: 'Franklin Gothic Condensed', sans-serif;
	font-size: 17px;
	font-weight: 700;
	color: #002844;
	letter-spacing: .5px;
}

.tablepress tbody td.column-2 {
	font-family: 'Franklin Gothic Condensed', sans-serif;
	font-size: 17px;
	font-weight: 600;
	color: #002844;
}

.tablepress tbody td.column-3 {
	font-family: 'Inter', sans-serif;
	color: #4A6078;
}

/* ===== 2. MOBILE CARD VIEW ===== */
@media screen and (max-width: 767px) {
	.tablepress,
	.tablepress tbody {
		display: block !important;
		width: 100% !important;
		background: transparent !important;
		border: none !important;
		box-shadow: none !important;
	}

	.tablepress thead {
		display: none !important;
	}

	/* Outer container as unified table */
	.tablepress tbody {
		background: #ffffff !important;
		border-radius: 18px !important;
		overflow: hidden !important;
		box-shadow: 0 10px 30px rgba(0,40,68,0.10) !important;
		border: 1px solid #C5D3DF !important;
	}

	/* Each case = one card, alternating shading */
	.tablepress tbody tr {
		display: block !important;
		margin-bottom: 0 !important;
		border: none !important;
		border-top: 1.5px solid #C5D3DF !important;
		border-radius: 0 !important;
		box-shadow: none !important;
		overflow: visible !important;
		padding: 14px 16px !important;
	}

	.tablepress tbody tr:first-child {
		border-top: none !important;
	}

	/* Alternating case background */
	.tablepress tbody tr:nth-child(odd) {
		background: #ffffff !important;
	}

	.tablepress tbody tr:nth-child(even) {
		background: #EDF2F7 !important;
	}

	/* All cells display as block, no internal borders */
	.tablepress tbody td {
		display: block !important;
		width: 100% !important;
		padding: 2px 0 !important;
		border: none !important;
		background: transparent !important;
		text-align: left !important;
		font-size: 14px;
		box-sizing: border-box !important;
	}

	/* Column 1 — Case ID: shown last, small label style */
	.tablepress td.column-1 {
		order: 3;
		font-family: 'Franklin Gothic Condensed', sans-serif !important;
		font-size: 12px !important;
		font-weight: 700 !important;
		color: #4A6078 !important;
		text-transform: uppercase !important;
		letter-spacing: .5px !important;
		margin-top: 6px !important;
	}

	/* Column 2 — Incident Type: shown first, prominent */
	.tablepress td.column-2 {
		order: 1;
		font-family: 'Franklin Gothic Condensed', sans-serif !important;
		font-size: 18px !important;
		font-weight: 700 !important;
		color: #002844 !important;
	}

	/* Column 3 — Location: shown second, softer */
	.tablepress td.column-3 {
		order: 2;
		font-family: 'Inter', sans-serif !important;
		font-size: 13px !important;
		color: #4A6078 !important;
	}

	/* Remove all ::before labels except Case ID */
	.tablepress td.column-1::before {
		content: "Case ID: ";
		font-family: 'Franklin Gothic Condensed', sans-serif;
		font-weight: 700;
		color: #4A6078;
		font-size: 12px;
		text-transform: uppercase;
		letter-spacing: .5px;
	}

	.tablepress td.column-2::before {
		content: none !important;
	}

	.tablepress td.column-3::before {
		content: none !important;
	}

	/* Make rows use flex to allow ordering */
	.tablepress tbody tr {
		display: flex !important;
		flex-direction: column !important;
	}

	/* Mobile pagination */
	.dt-container .dt-paging {
		display: flex !important;
		justify-content: center !important;
		flex-wrap: wrap;
		gap: 0;
	}

	.dt-container .dt-paging .dt-paging-button,
	.dt-container .dt-paging .ellipsis {
		font-size: 17px !important;
		margin: 0 6px !important;
	}

	.tablepress tbody tr:hover {
		background: #D6E0E8 !important;
		transition: background .2s ease;
	}
}

/* ===== 3. PAGINATION ===== */
.dt-container .dt-paging {
	margin-top: 30px;
	text-align: center;
	width: 100%;
}

.dt-container .dt-paging .dt-paging-button,
.dt-container .dt-paging .ellipsis {
	display: inline-block;
	margin: 0 12px;
	padding: 5px 0;
	background: transparent !important;
	color: #ffffff !important;
	border: none !important;
	font-family: 'Franklin Gothic Condensed', sans-serif;
	font-size: 20px;
	font-weight: 700;
	text-transform: uppercase;
	cursor: pointer;
	box-shadow: none !important;
}

.dt-container .dt-paging .dt-paging-button.current {
	border-bottom: 2px solid #FFB800 !important;
	color: #FFB800 !important;
}

.dt-container .dt-paging .dt-paging-button.disabled {
	opacity: .3;
	cursor: default;
}

/* ===== 4. TITLES & DESCRIPTIONS ===== */
.ea-table-title {
	font-family: 'Franklin Gothic Condensed', sans-serif;
	font-size: 32px;
	font-weight: 700;
	color: #002844;
	margin-bottom: 8px;
	text-transform: uppercase;
	letter-spacing: 1px;
}

.ea-table-description {
	font-family: 'Inter', sans-serif;
	font-size: 16px;
	color: #4A6078;
	margin-bottom: 24px;
	max-width: 720px;
}