marketplaces/src/styles/themes/dexar.theme.scss

// Dexar Theme - Redesigned 2026 - Green/Teal Colors
:root {
  --primary-color: #497671;
  --primary-hover: #3d635f;
  --secondary-color: #a1b4b5;
  --secondary-hover: #8da3a4;
  --accent-color: #a7ceca;
  --accent-hover: #91b9b5;
  
  --gradient-primary: linear-gradient(360deg, #497671 0%, #a7ceca 100%);
  --gradient-secondary: linear-gradient(135deg, #a1b4b5 0%, #677b78 100%);
  --gradient-hero: linear-gradient(360deg, #497671 0%, #a7ceca 100%);
  
  --text-primary: #1e3c38;
  --text-secondary: #667a77;
  --text-light: #828e8d;
  
  --bg-primary: #ffffff;
  --bg-secondary: #f5f5f5;
  --bg-tertiary: #f0f0f0;
  --bg-header: rgba(117, 121, 124, 0.1);
  
  // WCAG AA remediation (2026-08-17): darkened, hue-preserving, to clear 4.5:1
  // as plain text against --bg-primary. Originals measured 2.15-3.76:1.
  --success-color: #0c855d;
  --warning-color: #a36907;
  --error-color: #eb1515;
  --info-color: #1e6ff5;

  // WCAG AA remediation (2026-08-17): darkened to clear 3:1 non-text/UI-component
  // contrast against --bg-primary. Original measured 1.42:1.
  --border-color: #859996;
  --border-dark: #677b78;
  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.1);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.15);
  --shadow-lg: 0 12px 32px rgba(73, 118, 113, 0.2);
  
  --radius-xs: 4px;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 13px;
  --radius-xl: 22px;
  --radius-full: 999px;
}

// Structural dark-mode overrides only (surface/text/border tokens). Brand
// colors (primary/secondary/accent/gradients) are unchanged - a distinct
// dark-mode brand palette is a design decision, not made here. See
// GAPS-AND-IMPROVEMENTS.md item "Dark mode selector does nothing".
:root[data-theme-mode="dark"] {
  --text-primary: #eef4f3;
  --text-secondary: #b7c4c2;
  --text-light: #8a9c9a;

  --bg-primary: #10201e;
  --bg-secondary: #16302c;
  --bg-tertiary: #1c3a35;
  --bg-header: rgba(0, 0, 0, 0.35);

  --border-color: #2c4a45;
  --border-dark: #3f6660;
  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.4);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.45);
  --shadow-lg: 0 12px 32px rgba(0, 0, 0, 0.55);
}

body {
  font-family: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}