feat(wikitable): ✨ add border to wikitables

Adding borders to wikitables to promote better readability.
This is a complete rewrite of the styles so there might be unexpected issues.

resources/skins.citizen.styles/skinning/content.tables.less

@@ -4,12 +4,12 @@
  * Module: mediawiki.skinning.content.tables
  * Version: REL1_39
  *
- * Date: 2022-11-14
+ * Date: 2024-02-26
 */
 
 .wikitable {
 	margin: var( --space-md ) 0;
-	border-collapse: collapse;
+	border-spacing: 0;
 
 	caption {
 		padding-right: var( --space-sm );
@@ -24,11 +24,6 @@
 	}
 
 	tbody tr {
-		// Divider
-		+ tr {
-			border-top: 1px solid var( --border-color-base );
-		}
-
 		&:hover {
 			background-color: var( --background-color-quiet--hover );
 		}
@@ -50,4 +45,61 @@
 	td {
 		padding: var( --space-xs ) var( --space-sm );
 	}
+
+	tr {
+		th,
+		td {
+			border-top: 1px solid var( --border-color-base );
+
+			&:first-of-type {
+				border-left: 1px solid var( --border-color-base );
+			}
+
+			&:last-of-type {
+				border-right: 1px solid var( --border-color-base );
+			}
+		}
+
+		&:first-of-type {
+			th,
+			td {
+				border-top: 0;
+
+				&:not( :first-child ):not( :last-child ) {
+					border-top: 1px solid var( --border-color-base );
+				}
+
+				&:first-child {
+					border-top: 1px solid var( --border-color-base );
+					border-top-left-radius: var( --border-radius--medium );
+				}
+
+				&:last-child {
+					border-top: 1px solid var( --border-color-base );
+					border-top-right-radius: var( --border-radius--medium );
+				}
+			}
+		}
+
+		&:last-of-type {
+			th,
+			td {
+				&:first-child {
+					border-left: 1px solid var( --border-color-base );
+					border-bottom:  1px solid var( --border-color-base );
+					border-bottom-left-radius: var( --border-radius--medium );
+				}
+
+				&:not(:first-child):not(:last-child) {
+					border-bottom: 1px solid var( --border-color-base );
+				}
+
+				&:last-child {
+					border-right: 1px solid var( --border-color-base );
+					border-bottom: 1px solid var( --border-color-base );
+					border-bottom-right-radius: var( --border-radius--medium );
+				}
+			}
+		}
+	}
 }