/* Overrides pour crispy-tailwind */

/* Amélioration des inputs */
.textinput, .emailinput, .numberinput, .urlinput, .passwordinput, .select {
  @apply block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-blue-500 focus:border-blue-500;
}

/* Checkbox et radio normaux (pas les toggles) */
.checkboxinput:not(.toggle-switch), .radioselect {
  @apply h-4 w-4 text-blue-600 focus:ring-blue-500 border-gray-300 rounded;
}

/* Labels */
.control-label {
  @apply block text-sm font-medium text-gray-700 mb-1;
}

/* Erreurs */
.invalid-feedback {
  @apply text-red-600 text-sm mt-1;
}

.is-invalid {
  @apply border-red-500 focus:border-red-500 focus:ring-red-500;
}

/* Messages d'aide */
.form-text {
  @apply text-gray-500 text-sm mt-1;
}

/* Fieldsets */
fieldset {
  @apply border border-gray-300 rounded-md p-4 mb-4;
}

legend {
  @apply text-lg font-medium text-gray-900 px-2;
}

/* Amélioration des boutons dans les formulaires */
.btn-primary {
  @apply inline-flex items-center px-4 py-2 border border-transparent rounded-md font-medium text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500;
}

.btn-secondary {
  @apply inline-flex items-center px-4 py-2 border border-gray-300 rounded-md font-medium text-gray-700 bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500;
}

/* Groupes de formulaires */
.form-group {
  @apply mb-4;
}

/* Amélioration des selects */
select.select {
  @apply pr-10;
}

/* Textarea */
.textarea {
  @apply block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-blue-500 focus:border-blue-500;
}

/* File input */
.clearablefileinput {
  @apply block w-full text-sm text-gray-900 border border-gray-300 rounded-md cursor-pointer bg-gray-50 focus:outline-none;
}

/* Inline forms */
.form-check {
  @apply flex items-center;
}

.form-check-input {
  @apply mr-2;
}

/* Required fields */
.asteriskField {
  @apply text-red-500 ml-1;
}

/* Form rows */
.form-row {
  @apply grid grid-cols-1 md:grid-cols-2 gap-4;
}

/* Alert messages dans les formulaires */
.alert {
  @apply p-4 rounded-md mb-4;
}

.alert-danger {
  @apply bg-red-100 border border-red-400 text-red-700;
}

.alert-success {
  @apply bg-green-100 border border-green-400 text-green-700;
}

.alert-warning {
  @apply bg-yellow-100 border border-yellow-400 text-yellow-700;
}

.alert-info {
  @apply bg-blue-100 border border-blue-400 text-blue-700;
}

/* Toggle switches */
.toggle-switch {
  position: relative;
  width: 48px;
  height: 24px;
  -webkit-appearance: none;
  appearance: none;
  background-color: #e5e7eb !important; /* Gris clair pour l'état désactivé */
  border-radius: 24px;
  outline: none;
  cursor: pointer;
  transition: background-color 0.3s;
  /* Override crispy styles */
  border: 1px solid #d1d5db !important; /* Bordure grise */
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.1) !important;
}

.toggle-switch:checked {
  background-color: #3b82f6 !important; /* Bleu pour l'état activé */
  border-color: #2563eb !important;
}

.toggle-switch::before {
  content: '';
  position: absolute;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background-color: white;
  top: 1px;
  left: 1px;
  transition: transform 0.3s;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

.toggle-switch:checked::before {
  transform: translateX(24px);
}

/* Hover effect */
.toggle-switch:hover:not(:disabled) {
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.1), 0 0 0 3px rgba(59, 130, 246, 0.1) !important;
}

/* Focus effect */
.toggle-switch:focus {
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.1), 0 0 0 3px rgba(59, 130, 246, 0.2) !important;
}

/* Disabled state */
.toggle-switch:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}