@import "tailwindcss";

@theme {
  /* Colors */
  --color-primary: #eeb425;
  --color-primary-hover: #cf9d15;
  --color-background: #f3f4f6;
  --color-surface: #ffffff;
  --color-dropdown: #ffffff;
  --color-navbar: #ffffff;
  --color-navbar-text: #1f2937;
  --color-text: #1f2937;
  --color-text-muted: #6b7280;
  --color-accent: #10b981;
  --color-accent-hover: #16a34a;
  --color-danger: #ef4444;
  --color-danger-hover: #dc2626;
  --color-secondary: #1a1a2e;

  /* Border */
  --color-border: #eeb425;
  --color-input-border: #4b5563;

  /* Font Family */
  --font-family-sans: "Poppins", sans-serif;

  /* Border Radius */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-full: 9999px;

  /* Shadows */
  --shadow-dropdown: 0 2px 8px rgba(0, 0, 0, 0.15);
  --shadow-card: 0 1px 3px rgba(0, 0, 0, 0.1);
}

/* Font import */
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700&display=swap");

/* Base styles */
body {
  font-family: var(--font-family-sans);
  background-color: var(--color-background);
  color: var(--color-text);
}

/* Button effects */
@keyframes sparkle {
  0%,
  100% {
    transform: scale(0) rotate(0deg);
    opacity: 0;
  }
  50% {
    transform: scale(1) rotate(180deg);
    opacity: 1;
  }
}

@keyframes float {
  0%,
  100% {
    transform: translateY(0px);
  }
  50% {
    transform: translateY(-3px);
  }
}

@keyframes pulse-glow {
  0%,
  100% {
    box-shadow:
      0 0 5px var(--color-primary),
      0 0 10px var(--color-primary);
  }
  50% {
    box-shadow:
      0 0 15px var(--color-primary),
      0 0 25px var(--color-primary);
  }
}