/* B3 tâche 010, déménagée par la tâche 011 — le formulaire « Inviter une
   personne dans l'équipe », maintenant dans le panneau « Accès & rôles ».

   Ce qui a disparu avec le déménagement : la liste « Invitations en attente »
   (`.inv-panel`, `.inv-list`, `.inv-item*`, `.inv-role`, `.inv-act*`), qui rend
   désormais les lignes de la maquette (`.acc-row`, `recruiter_settings.css`).
   Reste ici le formulaire lui-même. Aucune couleur en dur : jetons de
   `design_tokens.css`. */

.inv-empty { margin: 0 0 var(--sp-4); font-size: 13px; color: var(--n-500); line-height: 1.5; }

/* #4283 (Tatianna 01/10) — valeurs de la maquette validée
   (`mockups/recruiter/settings.html.erb:331-346`) : champs `.inp` et bouton
   `.btn-gold` de la base commune, libellé de périmètre en capitales, pôles en
   cartes cochables avec leur type à droite. `.inv-inp` ne sert plus qu'au
   formulaire de transfert de propriété. */
.inv-row { display: flex; flex-wrap: wrap; gap: 9px; margin-bottom: 12px; }
.inv-row .inp-email { flex: 1 1 220px; min-width: 0; }
.inv-role { flex: 0 0 170px; }
.inv-inp { flex: 1 1 220px; min-width: 0; padding: 10px 12px; border-radius: var(--r-md); border: 1px solid var(--n-200); font-size: 13.5px; font-family: inherit; background: var(--n-0); }
.inv-poles-lbl { font-size: 10.5px; font-weight: 700; letter-spacing: .9px; text-transform: uppercase; color: var(--n-500); margin-bottom: 9px; }
.inv-poles { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 8px; margin-bottom: 14px; }
.inv-pole-opt { display: flex; align-items: center; gap: 9px; border: 1px solid var(--n-200); border-radius: 10px; padding: 10px 12px; font-size: 12.5px; color: var(--n-700); cursor: pointer; }
.inv-pole-opt input { width: 15px; height: 15px; accent-color: var(--gold-500); }
.inv-pole-opt span.pt { margin-left: auto; font-size: 9px; color: var(--n-500); text-transform: uppercase; letter-spacing: .3px; }
.inv-actions { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; }
.inv-hint { font-size: 11.5px; color: var(--n-500); line-height: 1.5; }

@media (max-width: 430px) {
  .inv-row .inp-email, .inv-role, .inv-inp { flex: 1 1 100%; }
  .inv-actions .btn-gold { width: 100%; }
}

/* #4373 (Tatianna 02/10) — la confirmation de l'envoi, dans le bloc
   d'invitation, avec l'adresse : le toast du haut de page disparaissait loin
   du formulaire. */
.inv-sent { display: flex; align-items: flex-start; gap: 9px; margin: 0 0 14px; padding: 11px 14px; border-radius: 10px; border: 1px solid var(--green-200); background: var(--green-50); font-size: 13px; line-height: 1.5; color: var(--n-900); }
.inv-sent svg { width: 16px; height: 16px; flex-shrink: 0; margin-top: 2px; color: var(--green); }