feat(footer): add social icons, centered layout, surface background

Replace inline-styled footer with structured layout using Feather Icons
(GitHub, Twitter, LinkedIn). Fix background by targeting #footer-custom
directly — cgit injects footer content without a div.footer wrapper.

1 files changed, 43 insertions, 8 deletions

diff --git a/cgit.css b/cgit.css
index 9114f17..dc4389b 100644
--- a/cgit.css
+++ b/cgit.css
@@ -1082,26 +1082,61 @@ td.lines pre code {
    ============================================================= */
 
 div.footer {
-  border-top: 1px solid var(--border);
-  background: rgba(var(--bg2-rgb), 0.6);
-  padding: 20px 32px;
+  /* cgit may or may not emit this wrapper depending on version */
+  padding: 0;
   margin-top: auto;
+}
+
+#footer-custom {
+  border-top: 1px solid var(--border);
+  background: var(--surface);
+  box-shadow: 0 -4px 24px rgba(var(--accent-rgb), 0.10);
+  padding: 24px 32px;
   font-family: 'IBM Plex Sans', sans-serif;
   font-size: 14px;
   color: var(--muted);
   display: flex;
+  flex-direction: column;
   align-items: center;
-  justify-content: space-between;
-  flex-wrap: wrap;
-  gap: 8px;
+  gap: 10px;
+  width: 100%;
+  text-align: center;
+}
+
+.footer-social {
+  display: flex;
+  gap: 20px;
+  align-items: center;
+}
+
+.footer-social-link {
+  color: var(--text-dim);
+  display: flex;
+  align-items: center;
+  transition: color 0.15s;
+}
+
+.footer-social-link:hover {
+  color: var(--accent);
+  opacity: 1;
+}
+
+.footer-copy,
+.footer-powered {
+  color: var(--muted);
+}
+
+.footer-copy a.footer-home {
+  color: var(--accent2);
+  font-weight: 600;
 }
 
-div.footer a {
+.footer-powered a {
   color: var(--text-dim);
   text-decoration: none;
 }
 
-div.footer a:hover {
+.footer-powered a:hover {
   color: var(--accent);
   opacity: 1;
 }