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


@layer components {
    .btn-primary {
      @apply bg-blue-700 rounded-lg text-white py-2 px-4 my-2;
      
    }

    .btn-danger {
        @apply bg-red-700 rounded-lg text-white py-2 px-4 my-2;
        
      }

    
      .btn-warning {
        @apply bg-yellow-700 rounded-lg text-white py-2 px-4 my-2;
        
      }


      .btn-maroon {
        @apply text-red-900 rounded-lg text-white py-2 px-4 my-2;
        
      }
      .link-maroon {
        @apply text-red-900 rounded-lg text-white py-2 px-4 my-2;
        
      }
  
      .form-control {  
        @apply bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500
      }

  }

  .filament-forms-field-wrapper-error input,
.filament-forms-field-wrapper-error textarea,
.filament-forms-field-wrapper-error select {
    border: 2px solid #e3342f !important;
    background-color: #fde8e8 !important;
    outline: none;
}

/* Optional: Style the error message text */
.filament-forms-field-wrapper-error .text-danger-600 {
    color: #e3342f !important;
    font-weight: bold;
}