Update style.css

style.css

@@ -1,6 +1,3 @@
-/* ─────────────────────────────────────────
-   ZEN – Global Theme Variables
-────────────────────────────────────────── */
 :root {
   --zen-accent-h: 220;   /* Change for color theme */
   --zen-accent-s: 95%;
@@ -8,87 +5,44 @@
   --zen-font: "Inter", "Segoe UI", Arial, sans-serif;
 }
 
-/* ─────────────────────────────────────────
-   Base Typography & Layout
-────────────────────────────────────────── */
 html, body, * {
   font-family: var(--zen-font);
   font-size: 1.08em;
 }
 
-body {
-  background: #f7fafe;   /* light slate-blue backdrop */
-  color: #000;           /* default page text: black */
-}
-
-/* Markdown / rich-text blocks inherit black page text */
-.gr-markdown,
-.markdown-body,
-.gr-block,
-p,
-h1, h2, h3, h4, h5, h6 {
-  color: #000;
-}
-
-/* ─────────────────────────────────────────
-   Buttons
-────────────────────────────────────────── */
 .gr-button-primary {
   background: hsl(var(--zen-accent-h) var(--zen-accent-s) var(--zen-accent-l));
-  color: #ffffff;
+  color: white;
   border: none;
 }
-.gr-button-primary:hover {
-  filter: brightness(1.1);
-}
+.gr-button-primary:hover { filter: brightness(1.1); }
 
-/* ─────────────────────────────────────────
-   Chatbot Bubbles
-────────────────────────────────────────── */
+/* ───── Chatbot bubbles ───── */
 .gr-chatbot .message.user {
-  background: hsla(var(--zen-accent-h) var(--zen-accent-s) calc(var(--zen-accent-l) + 25%), 0.18);
+  background: hsla(var(--zen-accent-h) var(--zen-accent-s) calc(var(--zen-accent-l) + 25%), .18);
+  color: #fff;                       /* ← NEW */
 }
 .gr-chatbot .message.bot  {
-  background: hsla(var(--zen-accent-h) var(--zen-accent-s) calc(var(--zen-accent-l) + 15%), 0.13);
+  background: hsla(var(--zen-accent-h) var(--zen-accent-s) calc(var(--zen-accent-l) + 15%), .13);
+  color: #fff;                       /* ← NEW */
 }
 
-/* Force PURE-WHITE text inside every chatbot bubble (overrides anything else) */
-.gr-chatbot,
-.gr-chatbot .message,
-.gr-chatbot .message *,
-.gr-chatbot .markdown-body,
-.gr-chatbot .markdown-body * {
-  color: #ffffff !important;
+/* Make *everything* inside the bubbles white (links, bold, code, etc.) */
+.gr-chatbot .message.user *,
+.gr-chatbot .message.bot  * {
+  color: #fff !important;            /* ← NEW */
 }
 
-/* Optional: accent-colored links inside bubbles so they’re visible on white text */
-.gr-chatbot a {
-  color: hsl(var(--zen-accent-h) var(--zen-accent-s) 85%);
-}
-
-/* ─────────────────────────────────────────
-   Media & Inputs
-────────────────────────────────────────── */
-.gr-image,
-.gr-plot {
+.gr-image, .gr-plot {
   border-radius: 12px;
-  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.07);
+  box-shadow: 0 4px 16px rgba(0,0,0,.07);
   margin-top: 6px;
 }
 
-.gr-textbox,
-.gr-chatbot {
+.gr-textbox, .gr-chatbot {
   border-radius: 8px;
 }
 
-/* Black text inside the user input textarea */
-.gr-textbox textarea {
-  color: #000;
-}
-
-/* ─────────────────────────────────────────
-   General Links on the Page
-────────────────────────────────────────── */
-a {
-  color: hsl(var(--zen-accent-h) var(--zen-accent-s) var(--zen-accent-l));
+body {
+  background: #f7fafe;
 }