/* #4377 — Paramètres Talent au dessin des paramètres Recruteur (spec du
   04/10, « Validé 04/10 » : une seule feuille de style pour les deux espaces).

   La BASE est celle du Recruteur, chargée avant cette feuille :
   `recruiter_settings_establishments` (tokens, coque, cartes, boutons,
   interrupteurs `.tog`), `recruiter_settings` (menu latéral, lignes `cred`),
   `recruiter_settings_account` (identité `idy`, saisie), et
   `recruiter_settings_notifications` (matrice `ntf-*`, options `opt`).

   Ici, seulement ce que le Talent a en propre : les compléments `tsx-*` de la
   maquette du 04/10, et ses règles « Responsive ». Tout est sous
   `.tsx-talent`, la classe que la maquette pose à côté de
   `page-recruiter-settings` : rien ne fuit vers l'écran recruteur. */

/* ── Ordinateur : page à 86 % (demande du 04/10, « trop zoomé ») ── */
@media (min-width:861px) {
  .tsx-talent .wrap { zoom:.86; }
}

/* ── Textes et compléments de la maquette ── */
.tsx-talent .tsx-p { font-size:12.5px; color:var(--n-500); line-height:1.55; margin:4px 0 10px; }
.tsx-talent .tsx-ul { margin:10px 0 0 18px; padding:0; font-size:12.5px; color:var(--n-500); line-height:1.6; list-style:disc; }
.tsx-talent .tsx-mono { font-family:'Geist Mono',ui-monospace,Menlo,monospace; letter-spacing:.04em; }
.tsx-talent .tsx-gap { margin-bottom:6px; }
.tsx-talent .grp-h { margin-bottom:8px; }
.tsx-talent .prof-h .grp-h { margin:0; }

/* Votre identité : les champs toujours visibles, la barre « non enregistré » */
.tsx-talent .tsx-fields { margin-top:16px; }
.tsx-talent .tsx-fields .idy-f input { width:100%; margin-top:6px; }
.tsx-talent .idy-f label { display:block; }
.tsx-talent .inp[readonly] { background:var(--n-50); color:var(--n-500); cursor:not-allowed; }
.tsx-talent .tsx-locked { display:flex; align-items:center; gap:6px; margin-top:10px; }
.tsx-talent .card-actions .tsx-dirty { margin-right:auto; align-self:center; font-size:12px; color:var(--n-500); }
.tsx-talent .card-actions[hidden] { display:none; }

/* Saisie dépliée sous une ligne (e-mail, mot de passe, SIREN) */
.tsx-talent .tsx-edit, .tsx-talent .tsx-pw { margin-top:4px; padding:14px 0 6px; border-top:1px solid var(--n-100); }
.tsx-talent .tsx-edit .idy-f input, .tsx-talent .tsx-pw .idy-f input { width:100%; margin-top:6px; }
.tsx-talent .tsx-pw .idy-grid { margin-top:0; padding-top:0; border-top:0; }
.tsx-talent .tsx-rules { display:flex; flex-wrap:wrap; gap:4px 14px; margin-top:10px; font-size:11.5px; color:var(--n-400); }
.tsx-talent .tsx-rules span::before { content:"○ "; }
.tsx-talent .tsx-rules span.ok { color:var(--green); }
.tsx-talent .tsx-rules span.ok::before { content:"✓ "; }
.tsx-talent .btn-gold:disabled { opacity:.45; cursor:not-allowed; }

/* Renvoi « Ce que voient les Maisons » */
.tsx-talent .tsx-link { display:flex; align-items:center; gap:14px; text-decoration:none; color:inherit; transition:var(--t); }
.tsx-talent .tsx-link:hover { border-color:var(--gold-300); }
.tsx-talent .tsx-link .tsx-li { color:var(--gold-600); flex-shrink:0; }
.tsx-talent .tsx-link > span { flex:1; display:flex; flex-direction:column; gap:3px; }
.tsx-talent .tsx-link b { font-size:14px; font-weight:600; color:var(--n-900); }
.tsx-talent .tsx-link span span { font-size:12.5px; color:var(--n-500); }
.tsx-talent .tsx-link .tsx-la { color:var(--gold-600); flex-shrink:0; }

/* Statut professionnel (#4386) */
.tsx-talent .tsx-mk-private { display:inline-flex; align-items:center; font-size:10px; font-weight:700; letter-spacing:.6px; text-transform:uppercase; color:#fff; background:#220A38; border-radius:999px; padding:3px 10px; }
.tsx-talent .tsx-seg { display:inline-flex; gap:4px; padding:3px; border:1px solid var(--n-200); border-radius:999px; background:var(--n-50); flex-shrink:0; }
.tsx-talent .tsx-seg form { margin:0; display:flex; }
.tsx-talent .tsx-seg-opt { white-space:nowrap; border:0; background:none; border-radius:999px; padding:8px 16px; font:inherit; font-size:12.5px; font-weight:600; color:var(--n-500); cursor:pointer; }
.tsx-talent .tsx-seg-opt.is-on { background:var(--n-0); color:var(--gold-700); box-shadow:0 1px 3px rgba(44,44,44,.12); }
.tsx-talent .tsx-tag-ko { display:inline-flex; align-items:center; font-size:10px; font-weight:700; letter-spacing:.4px; text-transform:uppercase; background:var(--red-bg); color:var(--red); border:1px solid var(--red-line); border-radius:999px; padding:4px 10px; }
.tsx-talent .tsx-statut-edit { padding:0 0 4px 56px; }
.tsx-talent .tsx-statut-edit > summary { list-style:none; cursor:pointer; display:inline-block; }
.tsx-talent .tsx-statut-edit > summary::-webkit-details-marker { display:none; }
.tsx-talent .tsx-statut-edit[open] > summary { margin-bottom:6px; }
.tsx-talent .tsx-statut-edit .tsx-edit { border-top:0; padding-top:4px; }

/* Interrupteurs sur une seule colonne (fréquence, préférences, confidentialité) */
.tsx-talent .ntf-row.tsx-r1 { grid-template-columns:1fr auto; }
.tsx-talent .tsx-r1 .ntf-cell { justify-self:end; }
.tsx-talent .ntf-row.tsx-r1:last-child, .tsx-talent .ntf-row:has(+ .help) { border-bottom:0; }
.tsx-talent .tsx-ch { display:none; }
.tsx-talent .tsx-sel { width:auto; min-width:160px; flex:none; }

/* Confidentialité : les trois positions (contenu inchangé, #4330) */
.tsx-talent .tsx-vis { border:0; margin:0; padding:0 0 4px; }
.tsx-talent .tsx-vis .opt { position:relative; }
.tsx-talent .tsx-vis .opt:has(input:checked) { border-color:var(--gold-300); background:var(--gold-50); }
.tsx-talent .tsx-vis .opt:has(input:checked) .rd { border-color:var(--gold-500); }
.tsx-talent .tsx-vis .opt:has(input:checked) .rd::after { content:""; position:absolute; inset:3px; border-radius:50%; background:var(--gold-fill-deep); }
.tsx-talent .tsx-vis .opt:not(:has(input:checked)) .rd::after { content:none; }
.tsx-talent .tsx-vis .opt:has(input:focus-visible) { outline:2px solid var(--gold-500); outline-offset:2px; }

/* #4453 — specs Visibilité Talent v2 : trois positions côte à côte (empilées
   en mobile), chacune à sa couleur une fois choisie (gris veille, vert
   Visible, or Off-market), badge d'état dans l'en-tête, repères ✓ / ✕. */
.tsx-talent .tsx-vis-h { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.tsx-talent .tsx-vis-h .grp-h { margin-bottom:0; }
/* Les couleurs du badge vivent dans les variables du tableau de bord (`--td2-*`),
   absentes de cette page : on les pose ici, mêmes valeurs. */
.tsx-talent .td2-vis-badge.is-visible { background:#EAF4EE; color:#1B7A4E; }
.tsx-talent .td2-vis-badge.is-offmarket { background:#FAF4E6; color:var(--gold-500); }
.tsx-talent .tsx-vis-3 { display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:12px; }
.tsx-talent .tsx-vis-3 .opt { margin:0; height:100%; }
.tsx-talent .tsx-vis-3 .opt.is-masque:has(input:checked) { border-color:var(--n-400); background:linear-gradient(180deg,#fff,var(--n-100)); }
.tsx-talent .tsx-vis-3 .opt.is-masque:has(input:checked) .rd { border-color:var(--n-500); }
.tsx-talent .tsx-vis-3 .opt.is-masque:has(input:checked) .rd::after { background:var(--n-500); }
.tsx-talent .tsx-vis-3 .opt.is-visible:has(input:checked) { border-color:#1B7A4E; background:linear-gradient(180deg,#fff,#F3F9F5); }
.tsx-talent .tsx-vis-3 .opt.is-visible:has(input:checked) .rd { border-color:#1B7A4E; }
.tsx-talent .tsx-vis-3 .opt.is-visible:has(input:checked) .rd::after { background:#1B7A4E; }
.tsx-talent .tsx-facts { display:flex; flex-wrap:wrap; gap:4px 12px; margin-top:10px; padding-top:9px; border-top:1px solid var(--n-100); }
.tsx-talent .tsx-fact { display:inline-flex; align-items:center; gap:6px; font-size:12px; color:var(--n-900); }
.tsx-talent .tsx-fact.is-no { color:var(--n-500); }
.tsx-talent .tsx-fact-dot { width:16px; height:16px; border-radius:50%; display:grid; place-items:center; flex:none; }
.tsx-talent .tsx-fact.is-yes .tsx-fact-dot { background:#EAF4EE; color:#1B7A4E; }
.tsx-talent .tsx-fact.is-no .tsx-fact-dot { background:var(--n-100); color:var(--n-400); }
.tsx-talent .tsx-sub { margin:4px 0 12px; padding:14px 16px; border:1px solid var(--n-200); border-radius:12px; background:var(--gold-50); }
.tsx-talent .tsx-sub .tsx-p:last-child { margin-bottom:0; }
.tsx-talent .tsx-ul { margin:6px 0 8px; padding-left:18px; list-style:disc; font-size:12.5px; color:var(--n-900); line-height:1.6; }
@media (max-width:900px) { .tsx-talent .tsx-vis-3 { grid-template-columns:minmax(0,1fr); } }

/* Maisons bloquées : la saisie et ses suggestions (#4243) */
.tsx-talent .tsx-srch { position:relative; margin:4px 0 10px; }
.tsx-talent .tsx-srch .inp { width:100%; }
.tsx-talent .ts-block-sugg { margin-top:6px; border:1px solid var(--n-200); border-radius:11px; background:var(--n-0); overflow:hidden; box-shadow:0 8px 20px rgba(0,0,0,.06); }
.tsx-talent .ts-block-sugg-form { display:block; margin:0; }
.tsx-talent .ts-block-sugg-item { display:flex; width:100%; align-items:baseline; justify-content:space-between; gap:10px; padding:11px 14px; border:0; background:none; text-align:left; cursor:pointer; font:inherit; }
.tsx-talent .ts-block-sugg-form + .ts-block-sugg-form .ts-block-sugg-item { border-top:1px solid var(--n-100); }
.tsx-talent .ts-block-sugg-item:hover, .tsx-talent .ts-block-sugg-item:focus-visible { background:var(--gold-50); }
.tsx-talent .ts-block-sugg-name { font-size:13.5px; font-weight:600; color:var(--n-900); }
.tsx-talent .ts-block-sugg-meta { font-size:12px; color:var(--n-500); white-space:nowrap; }
.tsx-talent .ts-block-sugg-empty { margin:0; padding:11px 14px; font-size:12.5px; color:var(--n-500); }
.tsx-talent .acc-empty { margin:8px 0 0; }

/* Codes de secours affichés seuls */
.tsx-talent .tsx-enroll-single { grid-template-columns:1fr; }

/* ── 860 px et moins : une colonne, onglets en bandeau qui défile ── */
@media (max-width:860px) {
  .tsx-talent .side { position:sticky; top:0; z-index:5; flex-direction:row; flex-wrap:nowrap; overflow-x:auto; gap:6px;
    margin:0 -16px; padding:8px 16px; background:var(--n-0); scrollbar-width:none;
    -webkit-mask-image:linear-gradient(90deg,#000 85%,transparent); mask-image:linear-gradient(90deg,#000 85%,transparent); }
  .tsx-talent .side::-webkit-scrollbar { display:none; }
  .tsx-talent .side-i { flex-shrink:0; min-height:40px; padding:8px 13px; white-space:nowrap; }
}

/* ── 600 px et moins ── */
@media (max-width:600px) {
  .tsx-talent .wrap { padding:20px 16px 72px; }
  .tsx-talent .p-head h1 { font-size:26px; }
  .tsx-talent .panel-title { font-size:22px; }
  .tsx-talent .card, .tsx-talent .prof-card { padding:16px; }

  /* Lignes à icône : le texte garde sa largeur, l'action passe dessous,
     alignée sur le texte (retrait de 56 px = icône 42 + écart 14). */
  .tsx-talent .cred { flex-wrap:wrap; }
  .tsx-talent .cred > .cred-b { flex:1 1 calc(100% - 56px); min-width:0; }
  .tsx-talent .cred > :not(.cred-ic):not(.cred-b) { margin-left:56px; }
  .tsx-talent .cred > .cred-form .cred-btn, .tsx-talent .cred > .cred-btn,
  .tsx-talent .cred > .tsx-sel, .tsx-talent .cred > .tsx-seg { width:calc(100% - 56px); }
  .tsx-talent .cred > .cred-form:has(.cred-btn) { width:calc(100% - 56px); }
  .tsx-talent .cred > .cred-form .cred-btn { width:100%; }
  .tsx-talent .cred > .tsx-seg .tsx-seg-opt, .tsx-talent .tsx-seg form { flex:1; }

  /* Identité : photo et « Changer la photo » sur la ligne du nom, prénom et
     nom côte à côte, téléphone dessous. */
  .tsx-talent .idy { display:grid; grid-template-columns:auto minmax(0,1fr); column-gap:14px; row-gap:4px; align-items:center; }
  .tsx-talent .idy > .idy-av { grid-row:span 2; }
  .tsx-talent .idy-photo-form { grid-column:2; width:auto; padding-left:0; justify-self:start; }
  .tsx-talent .tsx-fields { grid-template-columns:1fr 1fr; gap:12px; }
  .tsx-talent .tsx-fields .idy-f:nth-child(n+3) { grid-column:1 / -1; }

  /* Champs en 16 px : pas de zoom iOS. */
  .tsx-talent .inp, .tsx-talent input, .tsx-talent select { font-size:16px; }
  .tsx-talent .btn-gold, .tsx-talent .btn-outline { min-height:44px; }
  .tsx-talent .card-actions > * { flex:1; text-align:center; }
  .tsx-talent .card-actions .tsx-dirty { flex-basis:100%; }

  /* Notifications : plus d'en-tête de colonnes ; chaque interrupteur porte
     le nom de son canal, les cases sans réglage disparaissent. */
  .tsx-talent .tsx-ntf .ntf-head { display:none; }
  .tsx-talent .tsx-ntf .ntf-row { grid-template-columns:1fr auto; gap:8px 14px; }
  .tsx-talent .tsx-ntf .ntf-cell.tsx-na { display:none; }
  .tsx-talent .tsx-ntf .ntf-cell { gap:8px; }
  .tsx-talent .tsx-ntf .tsx-ch { display:inline; font-size:11px; color:var(--n-500); }
  .tsx-talent .tsx-ntf .ntf-row:not(:has(.ntf-cell:not(.tsx-na))) { grid-template-columns:1fr; }
}

/* ── 420 px et moins : le libellé prend toute la ligne ── */
@media (max-width:420px) {
  .tsx-talent .tsx-ntf .ntf-row { grid-template-columns:1fr; }
  .tsx-talent .tsx-ntf .ntf-cell { justify-self:start; }
}

/* #4427 (Tatianna 05/10) — l'œil à droite des champs mot de passe. */
.tsx-talent .tsx-pw-field { position:relative; margin-top:6px; }
.tsx-talent .tsx-pw .tsx-pw-field input { margin-top:0; padding-right:44px; }
.tsx-talent .tsx-pw-eye { position:absolute; top:50%; right:6px; transform:translateY(-50%); width:32px; height:32px; display:grid; place-items:center; border:0; border-radius:999px; background:transparent; color:var(--n-500); cursor:pointer; }
.tsx-talent .tsx-pw-eye:hover, .tsx-talent .tsx-pw-eye[aria-pressed="true"] { color:var(--gold-700); background:var(--gold-50); }
.tsx-talent .tsx-pw-eye svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.tsx-talent .tsx-pw-eye svg[hidden] { display:none; }
/* 08/10 — « Visible » choisi, identité pas encore vérifiée (bandeau de la
   maquette du 07/10, `.tvs-lock`). */
.tsx-talent .td2-vis-badge.is-pending { background:#F2F0EC; color:#6B665D; }
.tsx-talent .td2-vis-lock { display:flex; align-items:center; gap:8px; margin-top:12px; padding:9px 10px; border-radius:12px; font-size:12px; line-height:1.4; background:#FDF1E9; border:1px solid #F0CDB8; color:#8A3E15; }
.tsx-talent .td2-vis-lock svg { flex-shrink:0; }
.tsx-talent .td2-vis-lock-go { margin-left:auto; flex-shrink:0; display:inline-flex; align-items:center; height:28px; padding:0 12px; border-radius:999px; border:1px solid #F0CDB8; background:#fff; color:#B5541F; font-size:12px; font-weight:700; text-decoration:none; }

/* #4233 / #4315 — « Par qui être contacté » : deux univers côte à côte (empilés
   en mobile), un seul coché, puis la confirmation sur place. */
.tsx-talent .tsx-vis-2 { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:12px; }
.tsx-talent .tsx-vis-2 .opt { margin:0; height:100%; }
.tsx-talent .tsx-uni-badge { background:var(--gold-50); color:var(--gold-700); }
.tsx-talent .tsx-uni-now { display:inline-block; margin-left:6px; font-size:10.5px; font-weight:700; letter-spacing:.4px; text-transform:uppercase; color:var(--gold-700); }
.tsx-talent .tsx-uni-confirm { margin-top:12px; }
.tsx-talent .tsx-uni-confirm .card-actions { margin-top:12px; }
.tsx-talent .tsx-uni-ok { display:block; margin:0; }
/* #4845 — en passant en Private, « Êtes-vous à votre compte ? » puis le SIREN
   facultatif (maquette Paramètres du 04/10, fenêtre « Activer Private »,
   valeurs reprises). Le SIREN ne se montre qu'à son compte, sans JavaScript. */
.tsx-talent .tsx-uni-statut { margin-top:14px; padding-top:14px; border-top:1px solid var(--n-200); text-align:left; }
.tsx-talent .tsx-uni-opt { font-size:11.5px; font-weight:500; color:var(--n-500); }
.tsx-talent .tsx-uni-stat { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:8px; }
.tsx-talent .tsx-uni-stat-opt { position:relative; border:1.5px solid var(--n-200); border-radius:12px; padding:10px 12px; background:#fff; cursor:pointer; display:block; }
.tsx-talent .tsx-uni-stat-opt input { position:absolute; opacity:0; pointer-events:none; }
.tsx-talent .tsx-uni-stat-opt span { display:flex; flex-direction:column; gap:2px; }
.tsx-talent .tsx-uni-stat-opt b { font-size:13px; font-weight:600; color:var(--n-900); }
.tsx-talent .tsx-uni-stat-opt small { font-size:11.5px; color:var(--n-500); }
.tsx-talent .tsx-uni-stat-opt:has(input:checked) { border-color:var(--gold-primary); box-shadow:0 0 0 3px #F3E9CF; background:linear-gradient(180deg,#fff,#FDFAF2); }
.tsx-talent .tsx-uni-stat-opt:has(input:focus-visible) { outline:2px solid var(--gold-700); outline-offset:2px; }
.tsx-talent .tsx-uni-siren { display:none; margin-top:12px; }
.tsx-talent .tsx-uni-statut:has(input[value="self_employed"]:checked) .tsx-uni-siren { display:block; }
.tsx-talent .tsx-uni-siren input.inp { width:100%; border:1px solid var(--n-200); border-radius:12px; padding:12px 14px; font-size:16px; letter-spacing:.04em; background:#fff; margin-top:6px; }
.tsx-talent .tsx-uni-siren input.inp:focus { border-color:var(--gold-primary); box-shadow:0 0 0 3px #F3E9CF; outline:none; }
.tsx-talent .tsx-uni-siren .fld-hint { font-size:11.5px; color:var(--n-500); margin:6px 0 0; }
.tsx-talent .tsx-uni-confirm .card-actions .btn-gold, .tsx-talent .tsx-uni-confirm .card-actions .btn-outline { white-space:nowrap; }
@media (max-width:900px) { .tsx-talent .tsx-vis-2 { grid-template-columns:minmax(0,1fr); } }
@media (max-width:600px) {
  .tsx-talent .tsx-uni-stat { grid-template-columns:1fr; }
  .tsx-talent .tsx-uni-confirm .card-actions { flex-direction:column-reverse; align-items:stretch; gap:8px; }
  .tsx-talent .tsx-uni-ok, .tsx-talent .tsx-uni-ok .btn-gold, .tsx-talent .tsx-uni-confirm .card-actions .btn-outline { display:block; width:100%; text-align:center; }
}
