/* ═══════════════════════════════════════════════════════════════════════════
   FIX URGENT : Override des classes focus: problématiques
   Ce fichier est chargé en dernier pour garantir la priorité maximale
   Utilise des sélecteurs avec spécificité maximale pour override Tailwind
   ═══════════════════════════════════════════════════════════════════════════ */

/* FIX: Désactiver complètement les styles focus: sur TOUS les inputs */
/* Utilisation de sélecteurs avec spécificité maximale pour override Tailwind */
html body input:focus:not(:focus-visible),
html body textarea:focus:not(:focus-visible),
html body select:focus:not(:focus-visible),
html body input[type="email"]:focus:not(:focus-visible),
html body input[type="password"]:focus:not(:focus-visible),
html body input[type="text"]:focus:not(:focus-visible),
html body form input:focus:not(:focus-visible),
html body form textarea:focus:not(:focus-visible),
html body form select:focus:not(:focus-visible) {
  outline: none !important;
  border-color: rgb(59, 69, 84) !important; /* border-kodo-steel */
  border-top-color: rgb(59, 69, 84) !important;
  border-right-color: rgb(59, 69, 84) !important;
  border-bottom-color: rgb(59, 69, 84) !important;
  border-left-color: rgb(59, 69, 84) !important;
  box-shadow: none !important;
  --tw-ring-width: 0px !important;
  --tw-ring-offset-width: 0px !important;
  --tw-ring-color: transparent !important;
  --tw-ring-offset-color: transparent !important;
  /* Supprimer tous les effets de ring */
  --tw-ring-opacity: 0 !important;
  --tw-ring-shadow: 0 0 #0000 !important;
}

/* FIX: Activer les styles focus-visible: seulement au clavier */
html body input:focus-visible,
html body textarea:focus-visible,
html body select:focus-visible,
html body input[type="email"]:focus-visible,
html body input[type="password"]:focus-visible,
html body input[type="text"]:focus-visible,
html body form input:focus-visible,
html body form textarea:focus-visible,
html body form select:focus-visible {
  outline: none !important;
  border-color: rgba(102, 252, 241, 0.6) !important; /* border-kodo-cyan/60 */
  border-top-color: rgba(102, 252, 241, 0.6) !important;
  border-right-color: rgba(102, 252, 241, 0.6) !important;
  border-bottom-color: rgba(102, 252, 241, 0.6) !important;
  border-left-color: rgba(102, 252, 241, 0.6) !important;
  box-shadow: none !important;
  --tw-ring-width: 0px !important;
  --tw-ring-offset-width: 0px !important;
  --tw-ring-color: transparent !important;
  --tw-ring-offset-color: transparent !important;
  --tw-ring-opacity: 0 !important;
  --tw-ring-shadow: 0 0 #0000 !important;
}

/* FIX: Override spécifique pour toutes les classes Tailwind focus:* */
/* Ce sélecteur cible tous les inputs avec des classes contenant "focus" */
html body input[class*="focus"]:focus:not(:focus-visible),
html body textarea[class*="focus"]:focus:not(:focus-visible),
html body select[class*="focus"]:focus:not(:focus-visible),
html body form input[class*="focus"]:focus:not(:focus-visible),
html body form textarea[class*="focus"]:focus:not(:focus-visible),
html body form select[class*="focus"]:focus:not(:focus-visible) {
  border-color: rgb(59, 69, 84) !important; /* border-kodo-steel */
  border-top-color: rgb(59, 69, 84) !important;
  border-right-color: rgb(59, 69, 84) !important;
  border-bottom-color: rgb(59, 69, 84) !important;
  border-left-color: rgb(59, 69, 84) !important;
  --tw-ring-width: 0px !important;
  --tw-ring-offset-width: 0px !important;
  box-shadow: none !important;
  --tw-ring-opacity: 0 !important;
  --tw-ring-shadow: 0 0 #0000 !important;
}

html body input[class*="focus"]:focus-visible,
html body textarea[class*="focus"]:focus-visible,
html body select[class*="focus"]:focus-visible,
html body form input[class*="focus"]:focus-visible,
html body form textarea[class*="focus"]:focus-visible,
html body form select[class*="focus"]:focus-visible {
  border-color: rgba(102, 252, 241, 0.6) !important; /* border-kodo-cyan/60 */
  border-top-color: rgba(102, 252, 241, 0.6) !important;
  border-right-color: rgba(102, 252, 241, 0.6) !important;
  border-bottom-color: rgba(102, 252, 241, 0.6) !important;
  border-left-color: rgba(102, 252, 241, 0.6) !important;
  --tw-ring-width: 0px !important;
  --tw-ring-offset-width: 0px !important;
  box-shadow: none !important;
  --tw-ring-opacity: 0 !important;
  --tw-ring-shadow: 0 0 #0000 !important;
}

/* ═══════════════════════════════════════════════════════════════════════════
   FIX: Largeur des inputs dans les formulaires
   Garantit que les inputs prennent toute la largeur disponible
   ═══════════════════════════════════════════════════════════════════════════ */

/* Force la largeur à 100% pour tous les conteneurs d'inputs dans les formulaires */
html body form > div,
html body form div[class*="w-full"] {
  width: 100% !important;
  min-width: 0 !important;
}

/* Force la largeur à 100% pour les inputs eux-mêmes */
html body form input[type="email"],
html body form input[type="password"],
html body form input[type="text"] {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
}

/* Force la largeur à 100% pour les divs relatifs qui contiennent les inputs */
html body form div.relative {
  width: 100% !important;
  min-width: 0 !important;
}
