@tailwind base;
@tailwind components;
@tailwind utilities;

:root {
  --background: 220 26% 14%;
  --foreground: 213 31% 91%;
  --card: 220 26% 14%;
  --card-foreground: 213 31% 91%;
  --popover: 220 26% 14%;
  --popover-foreground: 213 31% 91%;
  --primary: 217 91% 60%;
  --primary-foreground: 220 26% 14%;
  --secondary: 220 17% 20%;
  --secondary-foreground: 213 31% 91%;
  --muted: 220 17% 20%;
  --muted-foreground: 215 20% 65%;
  --accent: 220 17% 20%;
  --accent-foreground: 213 31% 91%;
  --destructive: 0 63% 31%;
  --destructive-foreground: 213 31% 91%;
  --border: 220 17% 20%;
  --input: 220 17% 20%;
  --ring: 217 91% 60%;
  --radius: 0.5rem;
  --chart-1: 220 70% 50%;
  --chart-2: 160 60% 45%;
  --chart-3: 30 80% 55%;
  --chart-4: 280 65% 60%;
  --chart-5: 340 75% 55%;
  --sidebar-background: 220 26% 14%;
  --sidebar-foreground: 213 31% 91%;
  --sidebar-primary: 213 31% 91%;
  --sidebar-primary-foreground: 220 26% 14%;
  --sidebar-accent: 220 17% 20%;
  --sidebar-accent-foreground: 213 31% 91%;
  --sidebar-border: 220 17% 20%;
  --sidebar-ring: 217 91% 60%;
}

* {
  border-color: hsl(var(--border));
}

body {
  color: hsl(var(--foreground));
  background: hsl(var(--background));
  font-feature-settings: "rlig" 1, "calt" 1;
}

@layer utilities {
  .text-balance {
    text-wrap: balance;
  }
}

/* Windows 10 Dark Blue Theme */
html,
body {
  margin: 0;
  padding: 0;
  height: 100%;
  overflow: hidden;
  font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
  background: #1a1d29;
  color: #e1e5f2;
}

* {
  box-sizing: border-box;
}

/* Scrollbar styling - Dark Blue Theme */
::-webkit-scrollbar {
  width: 12px;
}

::-webkit-scrollbar-track {
  background: rgba(26, 29, 41, 0.5);
}

::-webkit-scrollbar-thumb {
  background: rgba(59, 130, 246, 0.6);
  border-radius: 6px;
}

::-webkit-scrollbar-thumb:hover {
  background: rgba(59, 130, 246, 0.8);
}

/* Selection styling */
::selection {
  background: rgba(59, 130, 246, 0.3);
  color: #e1e5f2;
}

/* Focus styles */
button:focus,
input:focus,
textarea:focus {
  outline: 2px solid rgba(59, 130, 246, 0.5);
  outline-offset: 2px;
}