/* =========================================================
   FORMULAIRES — BASE (générique, NON invasif)
   - Ici on évite de toucher globalement à .form-control partout
   - On cible uniquement les blocs qui utilisent .form-card / .form-group
   ========================================================= */

/* Carte formulaire */
.form-card {
  background: #ffffff;
  border-radius: 14px;
  padding: 24px;
  box-shadow: 0 8px 24px rgba(0,0,0,0.06);
  max-width: 650px;
  margin: 0 auto;
}

/* Titres */
.form-title {
  font-size: 1.4rem;
  font-weight: 600;
  margin-bottom: 6px;
}

.form-subtitle {
  font-size: 0.9rem;
  color: #6c757d;
  margin-bottom: 20px;
}

/* Groupes */
.form-group { margin-bottom: 16px; }

/* Labels */
.form-group label {
  font-weight: 500;
  margin-bottom: 6px;
  display: block;
}

/* Champs génériques UNIQUEMENT dans form-card / form-group */
.form-card .form-control,
.form-card select,
.form-card textarea,
.form-group .form-control,
.form-group select,
.form-group textarea {
  border-radius: 10px;
  padding: 10px 12px;
}



/* =========================================================
   ALOA — STAFF FORMS
   Scope: uniquement dans les pages qui ont .staff-ui
   ========================================================= */

.staff-ui {
  /* On n’invente pas de sable ici : on récupère ton thème global */
  --aloa-ink: var(--aloa-ink, #1f2937);
  --aloa-coral: var(--aloa-coral, #f08c6e);

  /* Champs "glass" neutres */
  --aloa-field-bg: rgba(255, 255, 255, 0.80);
  --aloa-field-bg-focus: rgba(255, 255, 255, 0.92);

  --aloa-field-border: rgba(31, 41, 55, 0.14);
  --aloa-field-border-strong: rgba(240, 140, 110, 0.55);
  --aloa-focus-ring: rgba(240, 140, 110, 0.18);
}

/* --- Champs texte : tous sauf checkbox/radio/file --- */
.staff-ui input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
.staff-ui textarea,
.staff-ui select {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;

  background: var(--aloa-field-bg) !important;
  color: var(--aloa-ink) !important;

  border: 1px solid var(--aloa-field-border) !important;
  border-radius: 12px !important;

  padding: 10px 12px !important;
  font-size: 0.95rem !important;
  line-height: 1.25rem !important;

  box-shadow: inset 0 1px 0 rgba(16, 24, 40, 0.03), 0 1px 0 rgba(0,0,0,0.02) !important;

  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);

  transition: border-color .15s ease, box-shadow .15s ease, background-color .15s ease;
}

/* Couvre explicitement Bootstrap */
.staff-ui .form-control,
.staff-ui .form-select {
  width: 100% !important;
  max-width: 100% !important;

  background: var(--aloa-field-bg) !important;
  border-color: var(--aloa-field-border) !important;
  border-radius: 12px !important;
}

/* Placeholder */
.staff-ui input::placeholder,
.staff-ui textarea::placeholder {
  color: rgba(31, 41, 55, 0.45) !important;
}

/* Focus ALOA (coral) */
.staff-ui input:focus,
.staff-ui textarea:focus,
.staff-ui select:focus,
.staff-ui .form-control:focus,
.staff-ui .form-select:focus {
  background: var(--aloa-field-bg-focus) !important;
  border-color: var(--aloa-field-border-strong) !important;
  box-shadow: 0 0 0 .22rem var(--aloa-focus-ring) !important;
  outline: none !important;
}

/* Checkbox / radio : ne pas casser le layout */
.staff-ui input[type="checkbox"],
.staff-ui input[type="radio"] {
  width: auto !important;
  max-width: none !important;
}

/* Taille checkbox/radio */
.staff-ui .form-check-input {
  width: 1.05rem;
  height: 1.05rem;
}

/* Labels / textes */
.staff-ui .form-label {
  margin-bottom: 6px;
  color: var(--aloa-ink);
}
.staff-ui .form-text {
  color: rgba(31, 41, 55, 0.65);
}
.staff-ui .text-danger.small {
  margin-top: 6px;
}

/* Textarea : confort + mobile safe */
.staff-ui textarea {
  resize: vertical;
  overflow-x: hidden;
  min-height: 120px;
}

/* Select : curseur */
.staff-ui select,
.staff-ui .form-select {
  cursor: pointer;
}



/* =========================================================
   Sections "soft" (Informations / Capacité)
   -> NEUTRE (glass blanc) pour éviter l’effet “site sable”
   ========================================================= */

.staff-ui .staff-soft-fields {
  background: rgba(255, 255, 255, 0.55) !important; /* <-- plus sable */
  border-color: rgba(31, 41, 55, 0.10) !important;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

/* Verrouille les champs dedans */
.staff-ui .staff-soft-fields input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
.staff-ui .staff-soft-fields textarea,
.staff-ui .staff-soft-fields select,
.staff-ui .staff-soft-fields .form-control,
.staff-ui .staff-soft-fields .form-select {
  background: var(--aloa-field-bg) !important;
  border-color: var(--aloa-field-border) !important;
}



/* =========================================================
   FIX MOBILE / overflow (évite les champs qui sortent)
   ========================================================= */

.staff-ui input,
.staff-ui textarea,
.staff-ui select,
.staff-ui .form-control,
.staff-ui .form-select {
  max-width: 100% !important;
  box-sizing: border-box !important;
}

.staff-ui .row > * {
  max-width: 100%;
}
