@import "tailwindcss";

:root {
  /* Primary Colors - Mudah diubah dari sini */
  --primary: #c084fc;
  --primary-dark: #7c1fb8;
  --primary-light: #b347f0;
  --primary-50: #faf5ff;
  --primary-100: #f3e8ff;
  --primary-200: #e9d5ff;
  --primary-300: #d8b4fe;
  --primary-400: #c084fc;
  --primary-500: #9b27e3;
  --primary-600: #7c1fb8;
  --primary-700: #6b21a8;
  --primary-800: #581c87;
  --primary-900: #4c1d95;
  
  /* Background & Foreground */
  --background: #ffffff;
  --foreground: #171717;
  --muted: #f1f5f9;
  --muted-foreground: #64748b;
  
  /* Border & Ring */
  --border: #e2e8f0;
  --ring: var(--primary);
  
  /* Disable automatic dark mode */
  color-scheme: light;
}

@theme inline {
  /* Colors */
  --color-primary: var(--primary);
  --color-primary-dark: var(--primary-dark);
  --color-primary-light: var(--primary-light);
  --color-primary-50: var(--primary-50);
  --color-primary-100: var(--primary-100);
  --color-primary-200: var(--primary-200);
  --color-primary-300: var(--primary-300);
  --color-primary-400: var(--primary-400);
  --color-primary-500: var(--primary-500);
  --color-primary-600: var(--primary-600);
  --color-primary-700: var(--primary-700);
  --color-primary-800: var(--primary-800);
  --color-primary-900: var(--primary-900);
  
  --color-background: var(--background);
  --color-foreground: var(--foreground);
  --color-muted: var(--muted);
  --color-muted-foreground: var(--muted-foreground);
  --color-border: var(--border);
  
  /* Fonts */
  --font-poppins: var(--font-poppins), system-ui, sans-serif;
  --font-sans: var(--font-poppins), system-ui, sans-serif;
}

/* Hapus atau comment out bagian dark mode ini */
/*
@media (prefers-color-scheme: dark) {
  :root {
    --background: #0a0a0a;
    --foreground: #ededed;
    --muted: #1e293b;
    --muted-foreground: #94a3b8;
    --border: #334155;
  }
}
*/

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

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

/* Smooth scrolling */
html {
  scroll-behavior: smooth;
}

/* Focus styles */
*:focus-visible {
  outline: 2px solid var(--primary);
  outline-offset: 2px;
}

/* Selection styles */
::selection {
  background-color: var(--primary-200);
  color: var(--primary-900);
}

/* Custom scrollbar dengan warna primary */
::-webkit-scrollbar {
  width: 8px;
}

::-webkit-scrollbar-track {
  background: #f1f1f1;
  border-radius: 4px;
}

::-webkit-scrollbar-thumb {
  background: linear-gradient(135deg, var(--primary) 0%, var(--primary-dark) 100%);
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(135deg, var(--primary-dark) 0%, var(--primary-600) 100%);
}

/* Logo Spinning Animation */
@keyframes spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

.animate-spin {
  animation: spin 1s linear infinite;
}