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

:root {
  --background: hsl(0, 0%, 100%);
  --foreground: hsl(20, 14.3%, 4.1%);
  --muted: hsl(60, 4.8%, 95.9%);
  --muted-foreground: hsl(25, 5.3%, 44.7%);
  --popover: hsl(0, 0%, 100%);
  --popover-foreground: hsl(20, 14.3%, 4.1%);
  --card: hsl(0, 0%, 100%);
  --card-foreground: hsl(20, 14.3%, 4.1%);
  --border: hsl(20, 5.9%, 90%);
  --input: hsl(20, 5.9%, 90%);
  --primary: hsl(207, 90%, 54%);
  --primary-foreground: hsl(211, 100%, 99%);
  --secondary: hsl(60, 4.8%, 95.9%);
  --secondary-foreground: hsl(24, 9.8%, 10%);
  --accent: hsl(60, 4.8%, 95.9%);
  --accent-foreground: hsl(24, 9.8%, 10%);
  --destructive: hsl(0, 84.2%, 60.2%);
  --destructive-foreground: hsl(60, 9.1%, 97.8%);
  --ring: hsl(20, 14.3%, 4.1%);
  --radius: 0.5rem;
  
  /* Clinic specific colors - based on logo */
  --clinic-teal: hsl(175, 70%, 45%);  /* Verde/turquesa da logo */
  --clinic-green: hsl(175, 70%, 45%);  /* Mesmo tom para compatibilidade */
  --clinic-red: hsl(0, 85%, 55%);      /* Vermelho vibrante da logo */
  --clinic-blue: hsl(175, 70%, 45%);   /* Atualizado para usar o teal da logo */
  --clinic-gray-50: hsl(210, 40%, 98%);
  --clinic-gray-100: hsl(210, 40%, 96%);
  --clinic-gray-200: hsl(214, 32%, 91%);
  --clinic-gray-500: hsl(215, 16%, 47%);
  --clinic-gray-900: hsl(222, 84%, 5%);
}

.dark {
  --background: hsl(240, 10%, 3.9%);
  --foreground: hsl(0, 0%, 98%);
  --muted: hsl(240, 3.7%, 15.9%);
  --muted-foreground: hsl(240, 5%, 64.9%);
  --popover: hsl(240, 10%, 3.9%);
  --popover-foreground: hsl(0, 0%, 98%);
  --card: hsl(240, 10%, 3.9%);
  --card-foreground: hsl(0, 0%, 98%);
  --border: hsl(240, 3.7%, 15.9%);
  --input: hsl(240, 3.7%, 15.9%);
  --primary: hsl(207, 90%, 54%);
  --primary-foreground: hsl(211, 100%, 99%);
  --secondary: hsl(240, 3.7%, 15.9%);
  --secondary-foreground: hsl(0, 0%, 98%);
  --accent: hsl(240, 3.7%, 15.9%);
  --accent-foreground: hsl(0, 0%, 98%);
  --destructive: hsl(0, 62.8%, 30.6%);
  --destructive-foreground: hsl(0, 0%, 98%);
  --ring: hsl(240, 4.9%, 83.9%);
  --radius: 0.5rem;
}

@layer base {
  * {
    @apply border-border;
  }

  body {
    @apply font-sans antialiased bg-background text-foreground;
  }
}

@layer utilities {
  .clinic-teal {
    color: var(--clinic-teal);
  }

  /* WhatsApp Button Animations */
  .pulse-animation {
    animation: pulse-glow 2s infinite;
  }

  @keyframes pulse-glow {
    0%, 100% {
      box-shadow: 0 0 20px rgba(34, 197, 94, 0.4);
    }
    50% {
      box-shadow: 0 0 30px rgba(34, 197, 94, 0.8), 0 0 40px rgba(34, 197, 94, 0.6);
    }
  }

  .border-3 {
    border-width: 3px;
  }

  .hover\:shadow-3xl:hover {
    box-shadow: 0 35px 60px -12px rgba(0, 0, 0, 0.25);
  }
  .bg-clinic-teal {
    background-color: var(--clinic-teal);
  }
  
  /* Animação de pulso para botões WhatsApp */
  .whatsapp-pulse {
    animation: whatsapp-pulse 2s infinite;
  }
  
  /* Gradiente especial para botões importantes */
  .btn-gradient-teal {
    background: linear-gradient(135deg, var(--clinic-teal) 0%, hsl(175, 70%, 35%) 100%);
  }
  
  .btn-gradient-red {
    background: linear-gradient(135deg, var(--clinic-red) 0%, hsl(0, 85%, 45%) 100%);
  }
}

@keyframes whatsapp-pulse {
  0%, 100% {
    box-shadow: 0 0 0 0 rgba(229, 62, 62, 0.7);
  }
  50% {
    box-shadow: 0 0 0 10px rgba(229, 62, 62, 0);
  }
}
  .clinic-blue {
    color: var(--clinic-blue);
  }
  .bg-clinic-blue {
    background-color: var(--clinic-blue);
  }
  .clinic-green {
    color: var(--clinic-green);
  }
  .bg-clinic-green {
    background-color: var(--clinic-green);
  }
  .clinic-red {
    color: var(--clinic-red);
  }
  .bg-clinic-red {
    background-color: var(--clinic-red);
  }
  .clinic-gray-50 {
    color: var(--clinic-gray-50);
  }
  .bg-clinic-gray-50 {
    background-color: var(--clinic-gray-50);
  }
  .clinic-gray-500 {
    color: var(--clinic-gray-500);
  }
  .bg-clinic-gray-500 {
    background-color: var(--clinic-gray-500);
  }
  .clinic-gray-900 {
    color: var(--clinic-gray-900);
  }
  .bg-clinic-gray-900 {
    background-color: var(--clinic-gray-900);
  }