style: add table style

app/globals.css

@@ -296,3 +296,69 @@ article.post .image-description {
 .post-body li > code {
   font-weight: 300;
 }
+
+/* Table Styles */
+article.post .post-body table {
+  width: 100%;
+  border-collapse: separate;
+  border-spacing: 0;
+  margin: 1.5em 0;
+  border-radius: 0.375rem; /* rounded-md */
+  overflow: hidden;
+  box-shadow: 0 0 4px rgba(0, 0, 0, 0.05);
+}
+
+article.post .post-body table thead {
+  background-color: rgba(0, 100, 0, 0.1);
+  font-weight: bold;
+}
+
+.dark article.post .post-body table thead {
+  background-color: rgba(100, 200, 100, 0.15);
+}
+
+article.post .post-body table th,
+article.post .post-body table td {
+  padding: 0.75em 1em;
+  text-align: left;
+  border: 1px solid #e0e0e0;
+}
+
+.dark article.post .post-body table th,
+.dark article.post .post-body table td {
+  border-color: rgba(255, 255, 255, 0.15);
+}
+
+article.post .post-body table th {
+  color: #006400;
+}
+
+.dark article.post .post-body table th {
+  color: #90ee90;
+}
+
+article.post .post-body table tbody tr:hover {
+  background-color: rgba(0, 100, 0, 0.03);
+}
+
+.dark article.post .post-body table tbody tr:hover {
+  background-color: rgba(100, 200, 100, 0.08);
+}
+
+article.post .post-body table th:first-child,
+article.post .post-body table td:first-child {
+  border-left: none;
+}
+
+article.post .post-body table th:last-child,
+article.post .post-body table td:last-child {
+  border-right: none;
+}
+
+article.post .post-body table thead tr:first-child th {
+  border-top: none;
+}
+
+article.post .post-body table tbody tr:last-child td {
+  border-bottom: none;
+}