* {
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro Display", "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}


:root {
  /* Existing colors */
  --bg: #121212;
  --bg-panel: #1c1c1e;
  --bg-glass: rgba(255, 255, 255, 0.1);
  --bg-glass-dark: rgba(18,18,18,0.6);       /* Dark mode glass */

  --text-primary: #EEF1DA;
  --text-secondary: #999;
  --text-placeholder: #6e6e73;
  --text-dark: #1d1d1f; 

  --border: rgba(255,255,255,0.65);
  --shadow: 0 4px 12px rgba(0,0,0,0.5);

  --accent: #ff9500;
  --accent-hover: #f7bf31;
  --success: #34c759;
  --warning: #ff9500;
  --error: #ff3b30;
  --blue-accent: #3b82f6;        /* New blue accent */
  --blue-accent-hover: #2563eb; 

  --button-bg: #EEF1DA;
  --button-text: #222;
  --button-hover: #fff;

  /* New: App Icon Gradient & Shadow (preserve original look) */
  --icon-gradient-start: #ffffff;
  --icon-gradient-end: #e6e6e6;
  --icon-shadow-outset: 0 4px 6px rgba(0, 0, 0, 0.1);
  --icon-shadow-inset: inset 0 1px 2px rgba(255, 255, 255, 0.5);
  --icon-boxshadow: 0 4px 6px rgba(0, 0, 0, 0.1), inset 0 1px 2px rgba(255, 255, 255, 0.5);

  /* App Icon specific */
  --icon-gradient: linear-gradient(145deg, #ffffff, #e6e6e6);
}

/* Dark mode override (optional tweaks if needed) */
body.dark-theme {
  --bg: #121212;
  --bg-panel: #1c1c1e;
  --bg-glass: rgba(255, 255, 255, 0.1);

  --text-primary: #EEF1DA;
  --text-secondary: #999;

  --border: rgba(255,255,255,0.65);
  --shadow: 0 4px 12px rgba(0,0,0,0.5);

  --accent: #ff9500;
  --accent-hover: #f7bf31;

  --button-bg: #EEF1DA;
  --button-text: #222;
  --button-hover: #fff;

  --icon-gradient-start: #2a2a2a; /* optional dark gradient start */
  --icon-gradient-end: #3a3a3a;   /* optional dark gradient end */
  --icon-shadow-outset: 0 4px 6px rgba(0,0,0,0.5);
  --icon-shadow-inset: inset 0 1px 2px rgba(255,255,255,0.1);
}