@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap');
@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400&display=swap');
@tailwind base;
@tailwind components;
@tailwind utilities;

:root {
  /* User Requested Colors */
  --background: #040A17;
  --foreground: hsl(210, 40%, 98%);
  --primary: hsl(217, 91%, 60%);
  --primary-foreground: hsl(220, 25%, 8%);
  --muted-foreground: hsl(215, 20%, 65%);
  --border: hsl(220, 15%, 20%);
  
  /* Primary Colors - Updated to match user request */
  --color-primary: hsl(217, 91%, 60%); /* Updated to user's primary */
  --color-primary-50: #EFF6FF;
  --color-primary-100: #DBEAFE;
  --color-primary-500: hsl(217, 91%, 60%);
  --color-primary-600: hsl(217, 91%, 60%);
  --color-primary-700: hsl(217, 91%, 50%);
  --color-primary-foreground: hsl(220, 25%, 8%);
  
  /* Secondary Colors */
  --color-secondary: hsl(215, 20%, 65%);
  --color-secondary-100: #F1F5F9;
  --color-secondary-200: #E2E8F0;
  --color-secondary-300: #CBD5E1;
  --color-secondary-400: hsl(215, 20%, 65%);
  --color-secondary-500: hsl(215, 20%, 65%);
  --color-secondary-600: #475569;
  
  /* Accent Colors */
  --color-accent: #059669;
  --color-accent-50: #ECFDF5;
  --color-accent-100: #D1FAE5;
  --color-accent-500: #10B981;
  --color-accent-600: #059669;
  
  /* Background Colors - Updated to user's dark theme */
  --color-background: #040A17; /* User's background */
  --color-surface: #0A1628; /* Slightly lighter than background */
  --color-surface-100: #1E293B;
  
  /* Text Colors - Updated for dark theme */
  --color-text-primary: hsl(210, 40%, 98%); /* User's foreground */
  --color-text-secondary: hsl(215, 20%, 65%); /* User's muted-foreground */
  --color-text-muted: hsl(215, 20%, 65%);
  
  /* Border Colors */
  --color-border: hsl(220, 15%, 20%); /* User's border */
  
  /* Status Colors */
  --color-success: #10B981;
  --color-success-50: #ECFDF5;
  --color-success-100: #D1FAE5;
  
  --color-warning: #F59E0B;
  --color-warning-50: #FFFBEB;
  --color-warning-100: #FEF3C7;
  
  --color-error: #EF4444;
  --color-error-50: #FEF2F2;
  --color-error-100: #FEE2E2;
  
  /* Shadows - Adjusted for dark theme */
  --shadow-minimal: 0 1px 3px rgba(0, 0, 0, 0.3);
  --shadow-card: 0 1px 3px rgba(0, 0, 0, 0.3), 0 1px 2px rgba(0, 0, 0, 0.2);
  --shadow-modal: 0 10px 15px -3px rgba(0, 0, 0, 0.3), 0 4px 6px -2px rgba(0, 0, 0, 0.2);
  
  /* Transitions */
  --transition-smooth: all 300ms cubic-bezier(0.4, 0, 0.2, 1);
  --transition-fast: all 150ms cubic-bezier(0.4, 0, 0.2, 1);
}

.legal-section{
  margin-bottom: 2rem;
  border-radius: 0.5rem;
  padding: 2rem;
  background-color: var(--color-surface);
  border: 1px solid var(--color-border);
}

.progress-disclosure{
  transition-property: all;
  transition-duration: 300ms;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

.border-accent{
  --tw-border-opacity: 1;
  border-color: rgb(5 150 105 / var(--tw-border-opacity, 1));
}

.border-error{
  --tw-border-opacity: 1;
  border-color: rgb(239 68 68 / var(--tw-border-opacity, 1));
}

.border-primary{
  --tw-border-opacity: 1;
  border-color: hsl(217 91% 60% / var(--tw-border-opacity, 1));
}

.border-secondary-200{
  --tw-border-opacity: 1;
  border-color: rgb(51 65 85 / var(--tw-border-opacity, 1));
}

.border-secondary-300{
  --tw-border-opacity: 1;
  border-color: rgb(71 85 105 / var(--tw-border-opacity, 1));
}

.border-transparent{
  border-color: transparent;
}

.border-white{
  --tw-border-opacity: 1;
  border-color: rgb(255 255 255 / var(--tw-border-opacity, 1));
}

.bg-accent-100{
  --tw-bg-opacity: 1;
  background-color: rgb(209 250 229 / var(--tw-bg-opacity, 1));
}

.bg-accent-50{
  --tw-bg-opacity: 1;
  background-color: rgb(236 253 245 / var(--tw-bg-opacity, 1));
}

.bg-background{
  --tw-bg-opacity: 1;
  background-color: rgb(4 10 23 / var(--tw-bg-opacity, 1));
}

.bg-error-50{
  --tw-bg-opacity: 1;
  background-color: rgb(254 242 242 / var(--tw-bg-opacity, 1));
}

.bg-primary{
  --tw-bg-opacity: 1;
  background-color: hsl(217 91% 60% / var(--tw-bg-opacity, 1));
}

.bg-primary-100{
  --tw-bg-opacity: 1;
  background-color: rgb(219 234 254 / var(--tw-bg-opacity, 1));
}

.bg-primary-50{
  --tw-bg-opacity: 1;
  background-color: rgb(239 246 255 / var(--tw-bg-opacity, 1));
}

.bg-secondary-100{
  --tw-bg-opacity: 1;
  background-color: rgb(30 41 59 / var(--tw-bg-opacity, 1));
}

.bg-secondary-200{
  --tw-bg-opacity: 1;
  background-color: rgb(51 65 85 / var(--tw-bg-opacity, 1));
}

.bg-secondary-400{
  --tw-bg-opacity: 1;
  background-color: hsl(215 20% 65% / var(--tw-bg-opacity, 1));
}

.bg-surface{
  --tw-bg-opacity: 1;
  background-color: rgb(10 22 40 / var(--tw-bg-opacity, 1));
}

.bg-surface-100{
  --tw-bg-opacity: 1;
  background-color: rgb(30 41 59 / var(--tw-bg-opacity, 1));
}

.bg-warning-100{
  --tw-bg-opacity: 1;
  background-color: rgb(254 243 199 / var(--tw-bg-opacity, 1));
}

.bg-white{
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}

.bg-gradient-to-r{
  background-image: linear-gradient(to right, var(--tw-gradient-stops));
}

.from-primary{
  --tw-gradient-from: hsl(217, 91%, 60%) var(--tw-gradient-from-position);
  --tw-gradient-to: hsl(217 91% 60% / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.from-primary-50{
  --tw-gradient-from: #EFF6FF var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(239 246 255 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.to-accent{
  --tw-gradient-to: #059669 var(--tw-gradient-to-position);
}

.to-accent-50{
  --tw-gradient-to: #ECFDF5 var(--tw-gradient-to-position);
}

.privacy-policy-content ul{
  list-style: unset;
}

.privacy-policy-content ul li {
    list-style: unset;
    margin: 0 15px;
}

.privacy-policy-content .legal-section p{
  margin: 10px 0;
}