/**
 * SWIMS page styles
 * Senarai Majikan table – desktop & mobile friendly
 */

#swims-majikan {
	padding: 0 0 60px;
}

#swims-majikan .headline {
	font-size: 1.35em;
	line-height: 1.3;
}

.swims-state {
	padding: 24px 16px;
	text-align: center;
	color: #5a6c7d;
	font-size: 15px;
}

.swims-error {
	color: #c0392b;
}

.swims-table {
	width: 100%;
	border-collapse: collapse;
	background: #fff;
	box-shadow: 0 1px 3px rgba(0,0,0,0.08);
}

.swims-table thead {
	background: #2c3e50;
	color: #fff;
}

.swims-table th {
	padding: 12px 14px;
	text-align: left;
	font-weight: 600;
	font-size: 13px;
}

.swims-table td {
	padding: 12px 14px;
	border-bottom: 1px solid #ecf0f1;
	font-size: 13px;
}

.swims-table tbody tr:hover {
	background: #f8f9fa;
}

.swims-table tbody tr:last-child td {
	border-bottom: none;
}

/* ----- Mobile: card layout ----- */
@media (max-width: 768px) {
	#swims-majikan {
		padding: 0 0 40px;
		padding-left: env(safe-area-inset-left, 0);
		padding-right: env(safe-area-inset-right, 0);
	}

	#swims-majikan .headline {
		font-size: 1.15em;
		margin-bottom: 4px;
	}

	#swims-majikan .line {
		margin-bottom: 20px !important;
	}

	.swims-state {
		padding: 20px 12px;
		font-size: 14px;
	}

	#swims-table-wrap {
		overflow-x: visible;
		margin: 0 -12px;
		padding: 0 12px;
	}

	.swims-table,
	.swims-table thead,
	.swims-table tbody,
	.swims-table tr,
	.swims-table th,
	.swims-table td {
		display: block;
	}

	.swims-table thead {
		position: absolute;
		width: 1px;
		height: 1px;
		padding: 0;
		margin: -1px;
		overflow: hidden;
		clip: rect(0, 0, 0, 0);
		border: 0;
	}

	.swims-table tbody tr {
		background: #fff;
		border: 1px solid #e0e0e0;
		border-radius: 8px;
		margin-bottom: 12px;
		padding: 14px 16px;
		box-shadow: 0 1px 2px rgba(0,0,0,0.06);
	}

	.swims-table tbody tr:hover {
		background: #fff;
		box-shadow: 0 2px 6px rgba(0,0,0,0.08);
	}

	.swims-table td {
		padding: 10px 0;
		border: none;
		border-bottom: 1px solid #f0f0f0;
		font-size: 14px;
		line-height: 1.4;
	}

	.swims-table td:last-child {
		border-bottom: none;
		padding-bottom: 0;
	}

	.swims-table td:first-child {
		padding-top: 0;
	}

	.swims-table td::before {
		content: attr(data-label);
		display: block;
		font-weight: 600;
		font-size: 11px;
		text-transform: uppercase;
		letter-spacing: 0.02em;
		color: #7f8c8d;
		margin-bottom: 4px;
	}

	.swims-table tr.swims-empty td {
		text-align: center;
		padding: 24px 16px;
		border: none;
	}

	.swims-table tr.swims-empty td::before {
		display: none;
	}
}

/* Small phones */
@media (max-width: 480px) {
	#swims-majikan .headline {
		font-size: 1.05em;
	}

	.swims-table tbody tr {
		padding: 12px 14px;
	}

	.swims-table td {
		font-size: 13px;
	}
}