:root {
  /* Override UI/UX Pro Max variables for Dark Mode Nature Theme */
  --color-primary: #7CB342;
  --color-primary-hover: #689F38;
  --color-secondary: #0277BD;
  --color-accent: #0277BD; 
  --color-accent-hover: #01579B;

  --color-text-main: #EAF2EF;
  --color-text-muted: #B6C5C0;
  
  --color-background: #0F2A1E;
  --color-surface: #1A2F2A;
  --color-border: #203A34;

  --font-heading: "Lexend", sans-serif;
  --font-body: "Lexend", sans-serif;

  /* Dark Glass Effect */
  --glass-bg: rgba(16, 42, 36, 0.85); /* #102A24 with opacity */
  --glass-border: rgba(255, 255, 255, 0.1);
}

/* Ensure body uses the correct variables */
body {
  background-color: var(--color-background);
  color: var(--color-text-main);
}

/* Scrollbar styling for dark mode */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-track {
  background: var(--color-background);
}

::-webkit-scrollbar-thumb {
  background: var(--color-surface);
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--color-border);
}

/* Utility to hide scrollbar but keep functionality */
.hide-scrollbar::-webkit-scrollbar {
  display: none;
}
.hide-scrollbar {
  -ms-overflow-style: none;
  scrollbar-width: none;
}