apps/ui/src/styles/themes/solarized.css

/* Solarized Theme */

.solarized {
  --background: oklch(0.2 0.02 230); /* #002b36 base03 */
  --background-50: oklch(0.2 0.02 230 / 0.5);
  --background-80: oklch(0.2 0.02 230 / 0.8);

  --foreground: oklch(0.75 0.02 90); /* #839496 base0 */
  --foreground-secondary: oklch(0.6 0.03 200); /* #657b83 base00 */
  --foreground-muted: oklch(0.5 0.04 200); /* #586e75 base01 */

  --card: oklch(0.23 0.02 230); /* #073642 base02 */
  --card-foreground: oklch(0.75 0.02 90);
  --popover: oklch(0.22 0.02 230);
  --popover-foreground: oklch(0.75 0.02 90);

  --primary: oklch(0.65 0.15 220); /* #268bd2 blue */
  --primary-foreground: oklch(0.2 0.02 230);

  --brand-400: oklch(0.7 0.15 220);
  --brand-500: oklch(0.65 0.15 220); /* #268bd2 */
  --brand-600: oklch(0.6 0.17 220);

  --secondary: oklch(0.25 0.02 230);
  --secondary-foreground: oklch(0.75 0.02 90);

  --muted: oklch(0.25 0.02 230);
  --muted-foreground: oklch(0.5 0.04 200);

  --accent: oklch(0.28 0.03 230);
  --accent-foreground: oklch(0.75 0.02 90);

  --destructive: oklch(0.55 0.2 25); /* #dc322f red */

  --border: oklch(0.35 0.03 230);
  --border-glass: oklch(0.65 0.15 220 / 0.3);

  --input: oklch(0.23 0.02 230);
  --ring: oklch(0.65 0.15 220);

  --chart-1: oklch(0.65 0.15 220); /* Blue */
  --chart-2: oklch(0.6 0.18 180); /* Cyan #2aa198 */
  --chart-3: oklch(0.65 0.2 140); /* Green #859900 */
  --chart-4: oklch(0.7 0.18 55); /* Yellow #b58900 */
  --chart-5: oklch(0.6 0.2 30); /* Orange #cb4b16 */

  --sidebar: oklch(0.18 0.02 230);
  --sidebar-foreground: oklch(0.75 0.02 90);
  --sidebar-primary: oklch(0.65 0.15 220);
  --sidebar-primary-foreground: oklch(0.2 0.02 230);
  --sidebar-accent: oklch(0.25 0.02 230);
  --sidebar-accent-foreground: oklch(0.75 0.02 90);
  --sidebar-border: oklch(0.35 0.03 230);
  --sidebar-ring: oklch(0.65 0.15 220);

  /* Action button colors - Solarized blue/cyan theme */
  --action-view: oklch(0.65 0.15 220); /* Blue */
  --action-view-hover: oklch(0.6 0.17 220);
  --action-followup: oklch(0.6 0.18 180); /* Cyan */
  --action-followup-hover: oklch(0.55 0.2 180);
  --action-commit: oklch(0.65 0.2 140); /* Green */
  --action-commit-hover: oklch(0.6 0.22 140);
  --action-verify: oklch(0.65 0.2 140); /* Green */
  --action-verify-hover: oklch(0.6 0.22 140);

  /* Running indicator - Blue */
  --running-indicator: oklch(0.65 0.15 220);
  --running-indicator-text: oklch(0.7 0.13 220);
}

/* ========================================
   GRUVBOX THEME
   Retro groove color scheme
   ======================================== */

/* Theme-specific overrides */

.solarized .animated-outline-gradient {
  background: conic-gradient(from 90deg at 50% 50%, #268bd2 0%, #2aa198 50%, #268bd2 100%);
}

.solarized .animated-outline-inner {
  background: oklch(0.2 0.02 230) !important;
  color: #268bd2 !important;
}

.solarized [data-slot='button'][class*='animated-outline']:hover .animated-outline-inner {
  background: oklch(0.25 0.03 230) !important;
  color: #2aa198 !important;
}

.solarized .slider-track {
  background: oklch(0.25 0.02 230);
}

.solarized .slider-range {
  background: linear-gradient(to right, #268bd2, #2aa198);
}

.solarized .slider-thumb {
  background: oklch(0.23 0.02 230);
  border-color: #268bd2;
}

.solarized .xml-highlight {
  color: oklch(0.75 0.02 90); /* #839496 */
}

.solarized .xml-tag-bracket {
  color: oklch(0.65 0.15 220); /* #268bd2 blue */
}

.solarized .xml-tag-name {
  color: oklch(0.65 0.15 220); /* Blue for tags */
}

.solarized .xml-attribute-name {
  color: oklch(0.6 0.18 180); /* #2aa198 cyan */
}

.solarized .xml-attribute-equals {
  color: oklch(0.75 0.02 90); /* Base text */
}

.solarized .xml-attribute-value {
  color: oklch(0.65 0.2 140); /* #859900 green */
}

.solarized .xml-comment {
  color: oklch(0.5 0.04 200); /* #586e75 */
  font-style: italic;
}

.solarized .xml-cdata {
  color: oklch(0.6 0.18 180); /* Cyan */
}

.solarized .xml-doctype {
  color: oklch(0.6 0.2 290); /* #6c71c4 violet */
}

.solarized .xml-text {
  color: oklch(0.75 0.02 90); /* Base text */
}