add themes and colors :D

src/ui/ui_core.h

@@ -58,11 +58,107 @@ struct UI_Theme {
     Clay_Color text_dim;
     Clay_Color accent;
     Clay_Color accent_hover;
+    Clay_Color button_text;
+    Clay_Color disabled_bg;
+    Clay_Color disabled_text;
     Clay_Color title_bar;
     Clay_Color scrollbar_bg;
     Clay_Color scrollbar_grab;
+
+    // Tab bar colors
+    Clay_Color tab_active_top;
+    Clay_Color tab_active_bottom;
+    Clay_Color tab_inactive;
+    Clay_Color tab_inactive_hover;
+    Clay_Color tab_text;       // Always light — readable on colored tab gradient
 };
 
 extern UI_Theme g_theme;
+extern S32 g_theme_id;
 
-void ui_init_theme();
+// Set theme by index: 0 = Dark, 1 = Light
+void ui_set_theme(S32 theme_id);
+
+// Accent color palette: 0=Blue, 1=Turquoise, 2=Orange, 3=Purple, 4=Pink, 5=Red, 6=Green
+extern S32 g_accent_id;
+void ui_set_accent(S32 accent_id);
+
+////////////////////////////////
+// UI scale (Cmd+/Cmd- zoom)
+
+extern F32 g_ui_scale;
+
+// Scale a float value (for CLAY_SIZING_FIXED, corner radii, etc.)
+static inline float uis(float x) { return x * g_ui_scale; }
+
+// Scale to uint16_t (for Clay_Padding, childGap, etc.)
+static inline uint16_t uip(float x) { return (uint16_t)(x * g_ui_scale + 0.5f); }
+
+// Scale to uint16_t font size
+static inline uint16_t uifs(float x) { return (uint16_t)(x * g_ui_scale + 0.5f); }
+
+////////////////////////////////
+// Tab styling
+
+#define TAB_ACTIVE_TOP       g_theme.tab_active_top
+#define TAB_ACTIVE_BOTTOM    g_theme.tab_active_bottom
+#define TAB_INACTIVE_BG      g_theme.tab_inactive
+#define TAB_INACTIVE_HOVER   g_theme.tab_inactive_hover
+#define TAB_HEIGHT           uis(26)
+#define TAB_CORNER_RADIUS    uis(5)
+#define TAB_PADDING_H        uip(10)
+
+////////////////////////////////
+// Custom render types (for gradient rects via CLAY_RENDER_COMMAND_TYPE_CUSTOM)
+
+enum CustomRenderType {
+    CUSTOM_RENDER_VGRADIENT = 1,
+};
+
+struct CustomGradientData {
+    CustomRenderType type;
+    Clay_Color top_color;
+    Clay_Color bottom_color;
+};
+
+////////////////////////////////
+// Font sizes
+
+#define FONT_SIZE_NORMAL     uifs(15)
+#define FONT_SIZE_SMALL      uifs(12)
+
+////////////////////////////////
+// Widget sizing
+
+#define WIDGET_BUTTON_HEIGHT    uis(30)
+#define WIDGET_CHECKBOX_HEIGHT  uis(28)
+#define WIDGET_CHECKBOX_SIZE    uis(18)
+#define WIDGET_RADIO_OUTER      uis(16)
+#define WIDGET_RADIO_INNER      uis(8)
+#define WIDGET_INPUT_HEIGHT     uis(30)
+#define WIDGET_DROPDOWN_HEIGHT  uis(30)
+#define WIDGET_DROPDOWN_ITEM_H  uis(28)
+
+////////////////////////////////
+// Corner radii
+
+#define CORNER_RADIUS_SM     uis(3)
+#define CORNER_RADIUS_MD     uis(6)
+#define CORNER_RADIUS_ROUND  uis(8)
+
+////////////////////////////////
+// Modal / window styling
+
+#define MODAL_OVERLAY_COLOR  Clay_Color{  0,   0,   0, 120}
+#define MODAL_WIDTH          uis(400)
+#define MODAL_CORNER_RADIUS  CORNER_RADIUS_MD
+
+#define WINDOW_CORNER_RADIUS CORNER_RADIUS_MD
+#define WINDOW_TITLE_HEIGHT  uis(32)
+
+////////////////////////////////
+// Panel sizing
+
+#define PANEL_BROWSER_WIDTH     uis(200)
+#define PANEL_RIGHT_COL_WIDTH   uis(250)
+#define PANEL_LOG_HEIGHT        uis(180)