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

@source '../../vendor/laravel/framework/src/Illuminate/Pagination/resources/views/*.blade.php';
@source '../../storage/framework/views/*.php';
@source "../**/*.blade.php";
@source "../**/*.js";
@source "../**/*.vue";

@theme {
    --font-sans: 'Inter', ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji',
        'Segoe UI Symbol', 'Noto Color Emoji';
}

/* ASMR Planner Color Scheme */
:root {
  /* Primary Color */
  --color-primary: #5A8FDD;
  
  /* Secondary Colors */
  --color-secondary-lavender: #BFA2DB;
  --color-secondary-mint: #A3D9B1;
  
  /* Accent Colors */
  --color-accent-coral: #F7B7A3;
  --color-accent-yellow: #F9E79F;
  
  /* Neutral Colors */
  --color-neutral-light: #F2F2F2;
  --color-neutral: #9E9E9E;
  --color-neutral-dark: #4A4A4A;
}

/* Custom styles */
.btn-primary {
  @apply bg-primary hover:bg-primary-600 text-white font-medium py-2 px-4 rounded-md transition-colors duration-200;
}

.btn-secondary {
  @apply bg-secondary-lavender hover:bg-secondary-lavender-dark text-white font-medium py-2 px-4 rounded-md transition-colors duration-200;
}

.btn-accent {
  @apply bg-accent-coral hover:bg-accent-coral-dark text-white font-medium py-2 px-4 rounded-md transition-colors duration-200;
}

.btn-outline {
  @apply border border-primary text-primary hover:bg-primary hover:text-white font-medium py-2 px-4 rounded-md transition-colors duration-200;
}

.card {
  @apply bg-white shadow-md rounded-lg p-6 border border-neutral-light;
}

/* Loading spinner */
.spinner {
  @apply animate-spin rounded-full h-6 w-6 border-b-2 border-primary;
}

/* Form styles */
.form-input {
  @apply mt-1 block w-full rounded-md border-neutral focus:border-primary focus:ring focus:ring-primary-200 focus:ring-opacity-50 transition-colors duration-200;
}

.form-label {
  @apply block text-sm font-medium text-neutral-dark;
}

.form-error {
  @apply mt-2 text-sm text-accent-coral-dark;
}

/* Success message */
.success-message {
  @apply text-secondary-mint-dark bg-secondary-mint-light border border-secondary-mint rounded-md p-3;
}

/* Error message */
.error-message {
  @apply text-accent-coral-dark bg-accent-coral-light border border-accent-coral rounded-md p-3;
}

/* Info message */
.info-message {
  @apply text-primary-700 bg-primary-50 border border-primary-200 rounded-md p-3;
}

/* Warning message */
.warning-message {
  @apply text-accent-yellow-dark bg-accent-yellow-light border border-accent-yellow rounded-md p-3;
}

/* Transitions */
.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.3s ease;
}

.fade-enter-from,
.fade-leave-to {
  opacity: 0;
}

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

::-webkit-scrollbar-track {
  background: var(--color-neutral-light);
}

::-webkit-scrollbar-thumb {
  background: var(--color-neutral);
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--color-neutral-dark);
}
