/* ==========================================================================
   ProCareLink — Formulaires (Demander un soin / Affiliation soignant)
   Même langage visuel que le reste du site : tokens de base.css,
   champs identiques à l'écran de connexion.
   ========================================================================== */

/* --------------------------------------------------------------------------
   En-tête de page
   -------------------------------------------------------------------------- */
.form-hero{position:relative;background:#FFFFFF;padding:64px 40px 56px;overflow:hidden;border-bottom:1px solid var(--border)}
.form-hero .hero-blob{position:absolute;right:-160px;top:-140px;width:460px;height:460px;border-radius:46% 54% 52% 48%;background:linear-gradient(150deg,var(--rose-50),var(--cream))}
.form-hero-inner{max-width:760px;margin:0 auto;position:relative;z-index:2;text-align:center}
.form-hero h1{font-family:var(--font-display);font-weight:800;font-size:clamp(34px,4.6vw,56px);line-height:1.0;letter-spacing:-0.035em;text-wrap:balance;margin:0 0 16px}
.form-hero p{font-size:17px;line-height:1.6;color:var(--text);margin:0 auto;max-width:620px}
.form-hero .phone-line{margin-top:18px;font-size:14.5px;color:var(--text)}
.form-hero .phone-line strong{color:var(--ink)}

/* Parcours en 3 étapes (affiliation) */
.flow{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:26px}
.flow-step{display:flex;align-items:center;gap:9px;background:#fff;border:1px solid var(--border);border-radius:100px;padding:9px 16px;font-size:13.5px;font-weight:600;color:var(--text-strong)}
.flow-num{width:22px;height:22px;border-radius:50%;color:#fff;font-size:12px;font-weight:700;display:inline-flex;align-items:center;justify-content:center}
.flow-num.rose{background:var(--rose)}
.flow-num.teal{background:var(--teal)}
.flow-num.orange{background:var(--orange)}

/* --------------------------------------------------------------------------
   Carte formulaire
   -------------------------------------------------------------------------- */
.form-wrap{background:var(--bg);padding:56px 40px 96px}
.form-card{max-width:820px;margin:0 auto;background:#fff;border:1px solid var(--border);border-radius:24px;padding:44px;box-shadow:0 18px 44px rgba(34,26,40,0.05)}
.form-card[data-mode="patient"],.form-card.rose-accent{--form-accent:var(--rose);--form-shadow:rgba(214,38,107,0.32);--form-tint:var(--rose-50);--form-note-text:#7A4A60}
.form-card[data-mode="institution"]{--form-accent:var(--teal);--form-shadow:rgba(31,158,146,0.30);--form-tint:var(--teal-50);--form-note-text:#1A6B62}

/* Sélecteur Patient / Institution — état instantané, sans transition */
.form-toggle{display:grid;grid-template-columns:1fr 1fr;gap:6px;background:var(--border);border-radius:14px;padding:5px;margin-bottom:8px}
.form-toggle .tab{height:46px;border:none;border-radius:10px;font-family:var(--font-display);font-weight:700;font-size:14.5px;letter-spacing:-0.01em;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;background:transparent;color:var(--muted)}
.form-toggle .tab svg{display:block}
.form-toggle .tab.active{background:#fff;box-shadow:0 2px 8px rgba(34,26,40,0.12)}
.form-toggle .tab-patient.active{color:var(--rose)}
.form-toggle .tab-institution.active{color:var(--teal)}

/* Groupes de champs */
.fgroup{padding:26px 0;border-top:1px solid var(--border)}
form > .fgroup:first-of-type,.form-toggle + form .fgroup:first-of-type{border-top:none}
.fgroup-title{font-family:var(--font-display);font-weight:700;font-size:18px;color:var(--ink);margin:0 0 4px}
.fgroup-sub{font-size:13.5px;line-height:1.55;color:var(--text);margin:0 0 18px}
.fgroup-title + .grid-2,.fgroup-title + .field,.fgroup-title + .check-grid,.fgroup-title + .radio-cards{margin-top:16px}

/* Champs */
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.grid-cp{display:grid;grid-template-columns:0.8fr 1.2fr;gap:14px}
.field{margin-bottom:14px}
.field:last-child{margin-bottom:0}
.field label{display:block;font-size:13px;font-weight:600;color:var(--text-strong);margin-bottom:7px}
.req{color:var(--rose)}
.field input,.field select,.field textarea{width:100%;border:1.5px solid var(--border-input);border-radius:12px;padding:0 15px;font-size:15px;color:var(--ink);background:#fff;transition:border-color 0.15s;font-family:inherit}
.field input,.field select{height:48px}
.field select{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M6 9l6 6 6-6' stroke='%239A93A4' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;background-size:16px;padding-right:42px}
.field textarea{min-height:110px;padding:12px 15px;resize:vertical;line-height:1.5}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--form-accent);outline:none}
.field .hint{font-size:12px;color:var(--muted);margin-top:6px}

/* Cases à cocher (types de soins, besoins) */
.check-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.check{display:flex;gap:10px;align-items:flex-start;background:var(--bg);border:1.5px solid transparent;border-radius:12px;padding:12px 14px;cursor:pointer;font-size:14px;color:var(--text-strong);line-height:1.35}
.check input{appearance:none;-webkit-appearance:none;flex:none;width:18px;height:18px;border-radius:5px;border:1.5px solid #CFC9D6;margin:1px 0 0;cursor:pointer;background:#fff}
.check input:checked{background:var(--form-accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5' stroke='white' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/12px no-repeat;border-color:var(--form-accent)}
.check:has(input:checked){border-color:var(--form-accent);background:#fff}

/* Boutons radio simples (oui/non) */
.radio-row{display:flex;gap:10px;flex-wrap:wrap}
.radio-pill{display:inline-flex;align-items:center;gap:8px;background:var(--bg);border:1.5px solid transparent;border-radius:100px;padding:10px 18px;cursor:pointer;font-size:14px;font-weight:600;color:var(--text-strong)}
.radio-pill input{appearance:none;-webkit-appearance:none;flex:none;width:16px;min-width:16px;max-width:16px;height:16px;border-radius:50%;border:1.5px solid #CFC9D6;margin:0;padding:0;cursor:pointer;background:#fff}
.radio-pill input:checked{border:5px solid var(--form-accent)}
.radio-pill:has(input:checked){border-color:var(--form-accent);background:#fff}

/* Cartes radio Track A/B/C */
.radio-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.radio-card{position:relative;display:block;background:var(--bg);border:1.5px solid transparent;border-radius:16px;padding:18px;cursor:pointer}
.radio-card input{position:absolute;opacity:0;pointer-events:none}
.rc-letter{width:34px;height:34px;border-radius:11px;color:#fff;font-family:var(--font-display);font-weight:800;font-size:16px;display:flex;align-items:center;justify-content:center;margin-bottom:10px}
.radio-card.a .rc-letter{background:var(--rose)}
.radio-card.b .rc-letter{background:var(--teal)}
.radio-card.c .rc-letter{background:var(--orange)}
.radio-card.x .rc-letter{background:#221A28}
.rc-title{display:block;font-family:var(--font-display);font-weight:700;font-size:15px;color:var(--ink);margin-bottom:3px}
.rc-desc{display:block;font-size:12.5px;line-height:1.45;color:var(--text)}
.radio-card.a:has(input:checked){background:#fff;border-color:var(--rose);box-shadow:0 10px 24px rgba(214,38,107,0.10)}
.radio-card.b:has(input:checked){background:#fff;border-color:var(--teal);box-shadow:0 10px 24px rgba(31,158,146,0.10)}
.radio-card.c:has(input:checked){background:#fff;border-color:var(--orange);box-shadow:0 10px 24px rgba(224,145,62,0.12)}
.radio-card.x:has(input:checked){background:#fff;border-color:#221A28;box-shadow:0 10px 24px rgba(34,26,40,0.10)}

/* Téléversement de documents */
.upload{display:flex;gap:13px;align-items:center;border:1.5px dashed #CFC9D6;border-radius:14px;padding:14px 16px;background:var(--bg);cursor:pointer;margin-bottom:10px}
.upload:last-child{margin-bottom:0}
.upload:hover{border-color:var(--form-accent)}
.upload input{display:none}
.upload-icon{flex:none;width:38px;height:38px;border-radius:11px;background:var(--form-tint);display:flex;align-items:center;justify-content:center;color:var(--form-accent)}
.upload-body{display:block;min-width:0}
.up-title{display:block;font-size:14px;font-weight:600;color:var(--ink)}
.up-hint{display:block}
.up-title .req{margin-left:2px}
.up-hint{font-size:12px;color:var(--muted);margin-top:2px}
.up-files{font-size:12.5px;font-weight:600;color:var(--form-accent);margin-top:4px;overflow-wrap:anywhere;display:none}
.up-files.filled{display:block}

/* Consentement + note + envoi */
.consent{display:flex;gap:10px;align-items:flex-start;font-size:13px;color:var(--text);line-height:1.5;cursor:pointer;margin:4px 0 20px}
.consent input{appearance:none;-webkit-appearance:none;flex:none;width:18px;height:18px;border-radius:5px;border:1.5px solid #CFC9D6;margin:1px 0 0;cursor:pointer;background:#fff}
.consent input:checked{background:var(--form-accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5' stroke='white' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/12px no-repeat;border-color:var(--form-accent)}

.form-note{background:var(--form-tint);border-radius:12px;padding:14px 16px;display:flex;gap:11px;align-items:flex-start;margin:20px 0}
.form-note-icon{flex:none;width:22px;height:22px;border-radius:7px;background:var(--form-accent);display:flex;align-items:center;justify-content:center;margin-top:1px}
.form-note p{font-size:12.5px;line-height:1.5;color:var(--form-note-text);margin:0}

.btn-submit{width:100%;height:52px;border:none;border-radius:13px;background:var(--form-accent);color:#fff;font-family:var(--font-display);font-weight:700;font-size:16px;letter-spacing:-0.01em;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:9px;box-shadow:0 10px 24px var(--form-shadow)}
.btn-submit .arrow{font-size:17px}

/* Alerte « envoi pas encore raccordé » */
.form-alert{display:none;background:var(--orange-50);border:1px solid #F0D9B8;border-radius:12px;padding:14px 16px;font-size:13.5px;line-height:1.55;color:var(--orange-700);margin-top:16px}
.form-alert.visible{display:block}
.form-alert a{font-weight:700;color:var(--orange-700);text-decoration:underline}

/* Champ anti-spam (honeypot) */
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* --------------------------------------------------------------------------
   Responsive
   -------------------------------------------------------------------------- */
@media (max-width:760px){
  .form-hero{padding:48px 20px 44px}
  .form-wrap{padding:36px 16px 64px}
  .form-card{padding:28px 20px;border-radius:20px}
  .grid-2,.grid-cp,.check-grid{grid-template-columns:1fr}
  .radio-cards{grid-template-columns:1fr}
}