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

/*
 * Custom Hatmada Color Definitions
 * These colors are used throughout the application
 */

@layer base {
  :root {
    --hatmada-primary: #172554;
    --hatmada-secondary: #75bfeb;
    --hatmada-accent: #e8541f;
    --hatmada-blue-1: #2987d6;
    --hatmada-blue-2: #3ba6f0;
    --hatmada-blue-3: #75bfeb;
    --hatmada-blue-4: #77cdf5;
    /* Legacy aliases for backwards compatibility */
    --hatmada-blue-light: #75bfeb;
    --hatmada-blue-medium: #2987d6;
    --hatmada-orange: #e8541f;
  }
  
  /* Configuration des polices par défaut */
  html {
    font-family: 'Raleway', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  }
  
  h1, h2, h3, h4, h5, h6 {
    font-family: 'Aria Pro', 'Arimo', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  }
}

@layer components {
  .btn-primary {
    @apply py-2 px-4 text-white rounded transition-colors font-raleway;
    background-color: var(--hatmada-primary);
  }
  
  .btn-primary:hover {
    background-color: var(--hatmada-blue-1);
  }
  
  .btn-secondary {
    @apply py-2 px-4 text-white rounded transition-colors font-raleway;
    background-color: var(--hatmada-blue-1);
  }
  
  .btn-secondary:hover {
    background-color: var(--hatmada-primary);
  }
  
  .text-hatmada-primary {
    color: var(--hatmada-primary);
  }
  
  .text-hatmada-secondary {
    color: var(--hatmada-secondary);
  }
  
  .text-hatmada-accent {
    color: var(--hatmada-accent);
  }
  
  .bg-hatmada-primary {
    background-color: var(--hatmada-primary);
  }
  
  .bg-hatmada-secondary {
    background-color: var(--hatmada-secondary);
  }
  
  .bg-hatmada-accent {
    background-color: var(--hatmada-accent);
  }
  
  .bg-hatmada-blue-medium {
    background-color: var(--hatmada-blue-medium);
  }
  
  .bg-hatmada-blue-light {
    background-color: var(--hatmada-blue-light);
  }
  
  .bg-hatmada-orange {
    background-color: var(--hatmada-orange);
  }
  
  /* Classes utilitaires pour les polices */
  .font-raleway {
    font-family: 'Raleway', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  }
  
  .font-aria-pro {
    font-family: 'Aria Pro', 'Arimo', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  }
  
  .heading {
    @apply font-aria-pro;
  }
}

@layer utilities {
  .hover\:text-hatmada-primary:hover {
    color: var(--hatmada-primary);
  }
  
  .hover\:text-hatmada-secondary:hover {
    color: var(--hatmada-secondary);
  }
  
  .hover\:bg-hatmada-primary:hover {
    background-color: var(--hatmada-primary);
  }
  
  .hover\:bg-hatmada-blue-medium:hover {
    background-color: var(--hatmada-blue-medium);
  }
}