/* shadcn/ui CSS Variables & Styles for EasyRecruit */

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

@layer base {
  :root {
    /* Typography */
    --font-sans: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
    --font-serif: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
    --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    --letter-spacing: 0em;
    
    /* Spacing */
    --spacing: 0.25rem;
    
    /* Radius */
    --radius: 0.625rem;
    
    /* Shadows */
    --shadow-opacity: 0.1;
    --shadow-blur: 3px;
    --shadow-spread: 0px;
    --shadow-offset-x: 0;
    --shadow-offset-y: 1px;
    --shadow-color: hsl(0 0% 0%);
    --shadow-2xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
    --shadow-xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
    --shadow-sm: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 1px 2px -1px hsl(0 0% 0% / 0.10);
    --shadow: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 1px 2px -1px hsl(0 0% 0% / 0.10);
    --shadow-md: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 2px 4px -1px hsl(0 0% 0% / 0.10);
    --shadow-lg: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 4px 6px -1px hsl(0 0% 0% / 0.10);
    --shadow-xl: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 8px 10px -1px hsl(0 0% 0% / 0.10);
    --shadow-2xl: 0 1px 3px 0px hsl(0 0% 0% / 0.25);
    
    /* Base colors */
    --background: 223.8136 -172.5242% 100.0000%;
    --foreground: 223.8136 0.0000% 3.9388%;
    
    /* Card */
    --card: 223.8136 -172.5242% 100.0000%;
    --card-foreground: 223.8136 0.0000% 3.9388%;
    
    /* Popover */
    --popover: 223.8136 -172.5242% 100.0000%;
    --popover-foreground: 223.8136 0.0000% 3.9388%;
    
    /* Primary brand color */
    --primary: 223.8136 0.0000% 9.0527%;
    --primary-foreground: 223.8136 0.0004% 98.0256%;
    
    /* Secondary */
    --secondary: 223.8136 0.0002% 96.0587%;
    --secondary-foreground: 223.8136 0.0000% 9.0527%;
    
    /* Muted */
    --muted: 223.8136 0.0002% 96.0587%;
    --muted-foreground: 223.8136 0.0000% 45.1519%;
    
    /* Accent */
    --accent: 223.8136 0.0002% 96.0587%;
    --accent-foreground: 223.8136 0.0000% 9.0527%;
    
    /* Destructive */
    --destructive: 351.7303 123.6748% 40.5257%;
    --destructive-foreground: 223.8136 -172.5242% 100.0000%;
    
    /* Success */
    --success: 142.1 76.2% 36.3%;
    --success-foreground: 355.7 100% 97.3%;
    
    /* Warning */
    --warning: 37.7 92.1% 50.2%;
    --warning-foreground: 26 83.3% 14.1%;
    
    /* Info */
    --info: 221.2 83.2% 53.3%;
    --info-foreground: 210 40% 98%;
    
    /* Border */
    --border: 223.8136 0.0001% 89.8161%;
    --input: 223.8136 0.0001% 89.8161%;
    --ring: 223.8136 0.0000% 63.0163%;
    
    /* Chart colors */
    --chart-1: 211.7880 101.9718% 78.6759%;
    --chart-2: 217.4076 91.3672% 59.5787%;
    --chart-3: 221.4336 86.3731% 54.0624%;
    --chart-4: 223.6587 78.7180% 47.8635%;
    --chart-5: 226.5426 70.0108% 39.9224%;
    
    /* Sidebar */
    --sidebar-background: 0 0% 98%;
    --sidebar-foreground: 240 5.3% 26.1%;
    --sidebar-primary: 240 5.9% 10%;
    --sidebar-primary-foreground: 0 0% 98%;
    --sidebar-accent: 240 4.8% 95.9%;
    --sidebar-accent-foreground: 240 5.9% 10%;
    --sidebar-border: 220 13% 91%;
    --sidebar-ring: 217.2 91.2% 59.8%;
  }

  .dark {
    /* Shadows remain the same */
    --shadow-opacity: 0.1;
    --shadow-blur: 3px;
    --shadow-spread: 0px;
    --shadow-offset-x: 0;
    --shadow-offset-y: 1px;
    --shadow-color: hsl(0 0% 0%);
    --shadow-2xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
    --shadow-xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
    --shadow-sm: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 1px 2px -1px hsl(0 0% 0% / 0.10);
    --shadow: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 1px 2px -1px hsl(0 0% 0% / 0.10);
    --shadow-md: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 2px 4px -1px hsl(0 0% 0% / 0.10);
    --shadow-lg: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 4px 6px -1px hsl(0 0% 0% / 0.10);
    --shadow-xl: 0 1px 3px 0px hsl(0 0% 0% / 0.10), 0 8px 10px -1px hsl(0 0% 0% / 0.10);
    --shadow-2xl: 0 1px 3px 0px hsl(0 0% 0% / 0.25);
    
    /* Dark mode colors */
    --background: 223.8136 0.0000% 3.9388%;
    --foreground: 223.8136 0.0004% 98.0256%;
    
    --card: 223.8136 0.0000% 9.0527%;
    --card-foreground: 223.8136 0.0004% 98.0256%;
    
    --popover: 223.8136 0.0000% 14.9382%;
    --popover-foreground: 223.8136 0.0004% 98.0256%;
    
    --primary: 223.8136 0.0001% 89.8161%;
    --primary-foreground: 223.8136 0.0000% 9.0527%;
    
    --secondary: 223.8136 0.0000% 14.9382%;
    --secondary-foreground: 223.8136 0.0004% 98.0256%;
    
    --muted: 223.8136 0.0000% 14.9382%;
    --muted-foreground: 223.8136 0.0000% 63.0163%;
    
    --accent: 223.8136 0.0000% 25.0471%;
    --accent-foreground: 223.8136 0.0004% 98.0256%;
    
    --destructive: 358.7594 101.8439% 69.8357%;
    --destructive-foreground: 223.8136 0.0004% 98.0256%;
    
    --success: 142.1 70.6% 45.3%;
    --success-foreground: 144.9 80.4% 10%;
    
    --warning: 37.7 92.1% 50.2%;
    --warning-foreground: 26 83.3% 14.1%;
    
    --info: 217.2 91.2% 59.8%;
    --info-foreground: 210 40% 98%;
    
    --border: 223.8136 0.0000% 15.5096%;
    --input: 223.8136 0.0000% 20.3885%;
    --ring: 223.8136 0.0000% 45.1519%;
    
    --chart-1: 211.7880 101.9718% 78.6759%;
    --chart-2: 217.4076 91.3672% 59.5787%;
    --chart-3: 221.4336 86.3731% 54.0624%;
    --chart-4: 223.6587 78.7180% 47.8635%;
    --chart-5: 226.5426 70.0108% 39.9224%;
    
    /* Sidebar dark mode */
    --sidebar-background: 240 5.9% 10%;
    --sidebar-foreground: 240 4.8% 95.9%;
    --sidebar-primary: 0 0% 98%;
    --sidebar-primary-foreground: 240 5.9% 10%;
    --sidebar-accent: 240 3.7% 15.9%;
    --sidebar-accent-foreground: 240 4.8% 95.9%;
    --sidebar-border: 240 3.7% 15.9%;
    --sidebar-ring: 217.2 91.2% 59.8%;
  }
}

@layer base {
  * {
    @apply border-border;
  }
  
  body {
    @apply bg-background text-foreground;
  }
}

@layer utilities {
  /* Background utilities */
  .bg-background { background-color: hsl(var(--background)); }
  .bg-foreground { background-color: hsl(var(--foreground)); }
  .bg-card { background-color: hsl(var(--card)); }
  .bg-popover { background-color: hsl(var(--popover)); }
  .bg-primary { background-color: hsl(var(--primary)); }
  .bg-secondary { background-color: hsl(var(--secondary)); }
  .bg-muted { background-color: hsl(var(--muted)); }
  .bg-accent { background-color: hsl(var(--accent)); }
  .bg-destructive { background-color: hsl(var(--destructive)); }
  .bg-success { background-color: hsl(var(--success)); }
  .bg-warning { background-color: hsl(var(--warning)); }
  .bg-info { background-color: hsl(var(--info)); }
  
  /* Sidebar background utilities */
  .bg-sidebar { background-color: hsl(var(--sidebar-background)); }
  .bg-sidebar-primary { background-color: hsl(var(--sidebar-primary)); }
  .bg-sidebar-accent { background-color: hsl(var(--sidebar-accent)); }
  
  /* Text utilities */
  .text-foreground { color: hsl(var(--foreground)); }
  .text-card-foreground { color: hsl(var(--card-foreground)); }
  .text-popover-foreground { color: hsl(var(--popover-foreground)); }
  .text-primary { color: hsl(var(--primary)); }
  .text-primary-foreground { color: hsl(var(--primary-foreground)); }
  .text-secondary { color: hsl(var(--secondary)); }
  .text-secondary-foreground { color: hsl(var(--secondary-foreground)); }
  .text-muted-foreground { color: hsl(var(--muted-foreground)); }
  .text-accent-foreground { color: hsl(var(--accent-foreground)); }
  .text-destructive { color: hsl(var(--destructive)); }
  .text-destructive-foreground { color: hsl(var(--destructive-foreground)); }
  .text-success { color: hsl(var(--success)); }
  .text-success-foreground { color: hsl(var(--success-foreground)); }
  .text-warning { color: hsl(var(--warning)); }
  .text-warning-foreground { color: hsl(var(--warning-foreground)); }
  .text-info { color: hsl(var(--info)); }
  .text-info-foreground { color: hsl(var(--info-foreground)); }
  
  /* Sidebar text utilities */
  .text-sidebar-foreground { color: hsl(var(--sidebar-foreground)); }
  .text-sidebar-primary { color: hsl(var(--sidebar-primary)); }
  .text-sidebar-primary-foreground { color: hsl(var(--sidebar-primary-foreground)); }
  .text-sidebar-accent-foreground { color: hsl(var(--sidebar-accent-foreground)); }
  
  /* Border utilities */
  .border-border { border-color: hsl(var(--border)); }
  .border-input { border-color: hsl(var(--input)); }
  .border-primary { border-color: hsl(var(--primary)); }
  .border-secondary { border-color: hsl(var(--secondary)); }
  .border-muted { border-color: hsl(var(--muted)); }
  .border-sidebar-border { border-color: hsl(var(--sidebar-border)); }
  
  /* Ring utilities */
  .ring-ring { --tw-ring-color: hsl(var(--ring)); }
  .ring-primary { --tw-ring-color: hsl(var(--primary)); }
  
  /* Radius utilities */
  .rounded-lg { border-radius: var(--radius); }
  .rounded-md { border-radius: calc(var(--radius) - 2px); }
  .rounded-sm { border-radius: calc(var(--radius) - 4px); }
}

/* shadcn/ui component base styles */
@layer components {
  .card {
    @apply rounded-lg border bg-card text-card-foreground shadow-sm;
  }
  
  .card-header {
    @apply flex flex-col space-y-1.5 p-6;
  }
  
  .card-content {
    @apply p-6 pt-0;
  }
  
  .card-footer {
    @apply flex items-center p-6 pt-0;
  }
}