@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=JetBrains+Mono:wght@300;400;500;600;700&display=swap');
@import url('system.css');

*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

:root {
  /* Mapped to Halo system variables */
  --bg-page: var(--color-background);
  --bg-sidebar: var(--color-background);
  --bg-card: var(--color-surface);
  --border: var(--color-border);
  --border-muted: var(--color-border-soft);
  
  --primary: var(--color-primary);
  --primary-hover: var(--color-primary-hover);
  --primary-light: var(--color-primary-soft);
  --primary-border: rgba(91, 107, 255, 0.15);
  
  --text-title: var(--color-text-primary);
  --text-body: var(--color-text-secondary);
  --text-muted: var(--color-text-muted);
  
  --success: var(--color-success);
  --success-bg: var(--color-success-soft);
  --success-border: rgba(43, 224, 140, 0.15);
  
  --danger: var(--color-danger);
  --danger-bg: var(--color-danger-soft);
  --danger-border: rgba(255, 58, 92, 0.15);
  
  --warning: var(--color-warning);
  --warning-bg: var(--color-warning-soft);
  --warning-border: rgba(245, 213, 71, 0.15);
  
  --sans: var(--font-body);
  --mono: var(--font-mono);
  
  --radius-sm: var(--radius-sm);
  --radius: var(--radius-md);
  --radius-lg: var(--radius-lg);
  
  --transition: all var(--motion-base) var(--easing-standard);

  /* Force dark color scheme so OS/browser renders native controls dark */
  color-scheme: dark;
}


html, body {
  min-height: 100%;
  background-color: var(--bg-page);
  color: var(--text-body);
  font-family: var(--sans);
  font-size: 14px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

button, input, select, textarea {
  font-family: inherit;
  font-size: inherit;
  color: inherit;
}

button {
  -webkit-tap-highlight-color: transparent;
  -webkit-appearance: none;
  appearance: none;
  -moz-appearance: none;
  background: none;
  background-color: transparent;
  border: none;
  outline: none;
}

/* Custom Scrollbar */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
::-webkit-scrollbar-track {
  background: var(--bg-page);
}
::-webkit-scrollbar-thumb {
  background: var(--border);
  border-radius: 3px;
}
::-webkit-scrollbar-thumb:hover {
  background: var(--text-muted);
}

/* Utilities */
.text-center { text-align: center; }
.text-right { text-align: right; }
.font-mono { font-family: var(--mono); }
.font-semibold { font-weight: 600; }
.font-bold { font-weight: 700; }

.d-none { display: none !important; }
.w-full { width: 100%; }

.relative { position: relative; }
.pointer { cursor: pointer; }
.user-none { user-select: none; }