/* Copied minimal GroveDesk Design System CSS for Grovelink */

:root {
  /* Light theme variables */
  --primary: #ffffff;
  --secondary: #f3f4f6;
  --tertiary: #e5e7eb;
  --accent: #00c853;
  --accent-hover: #00e676;
  --border: #d1d5db;
  --muted: #4b5563;
  --text: #111827;
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
  --shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
  --shadow-md: 0 4px 8px rgba(0, 0, 0, 0.15);
  --shadow-lg: 0 10px 20px rgba(0, 0, 0, 0.2);
  --transition-fast: 0.15s ease;
  --transition-normal: 0.2s ease;
  --transition-slow: 0.3s ease;
  --font-family: 'Inter', system-ui, -apple-system, sans-serif;
}

/* Dark theme overrides */
:root.dark {
  --primary: #1e1e1e;
  --secondary: #252525;
  --tertiary: #2c2c2c;
  --accent: #00c853;
  --accent-hover: #00e676;
  --border: #333333;
  --muted: #a0a0a0;
  --text: #ffffff;
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.1);
  --shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
  --shadow-md: 0 4px 8px rgba(0, 0, 0, 0.2);
  --shadow-lg: 0 10px 20px rgba(0, 0, 0, 0.2);
}

body { font-family: var(--font-family); }

.bg-primary { background-color: var(--primary) !important; }
.bg-secondary { background-color: var(--secondary) !important; }
.bg-tertiary { background-color: var(--tertiary) !important; }
.bg-accent { background-color: var(--accent) !important; }

.text-text { color: var(--text) !important; }
.text-muted { color: var(--muted) !important; }
.text-accent { color: var(--accent) !important; }

.border-border { border-color: var(--border) !important; }
.border-accent { border-color: var(--accent) !important; }

/* Interactive cards/buttons */
.card-interactive { transition: transform var(--transition-normal), box-shadow var(--transition-normal), border-color var(--transition-normal); }
.card-interactive:hover { transform: translateY(-2px); box-shadow: var(--shadow-lg); border-color: var(--accent); }

.btn-primary { background-color: var(--accent); color: #111827; transition: background-color var(--transition-fast), transform var(--transition-fast); }
.btn-primary:hover { background-color: var(--accent-hover); transform: translateY(-1px); }
.btn-secondary { background-color: var(--tertiary); color: var(--text); border-color: var(--border); }
.btn-secondary:hover { filter: brightness(1.1); }

/* Scrollbar styling */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: #f3f4f6; }
::-webkit-scrollbar-thumb { background: #d1d5db; border-radius: 6px; }
::-webkit-scrollbar-thumb:hover { background: #9ca3af; }
.dark::-webkit-scrollbar-track { background: #252525; }
.dark::-webkit-scrollbar-thumb { background: #333333; }
.dark::-webkit-scrollbar-thumb:hover { background: #00c853; }

/* Utility */
.backdrop-blur-sm { backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
