/* =============================================================
   MASQUAGE DES ANCIENS FORMULAIRES
   Retirer cette règle pour rétablir les forms natifs.
   ============================================================= */
.rp-form-legacy { display: none !important; }

/* =============================================================
   PRELINKER FORMS — CSS dédié
   Harmonisé sur la charte LP1 (Sénior Chaleureux)
   Scoped sur les IDs Prelinker uniquement.
   N'utilise PAS les classes/IDs dynamiques (EZ_register-form_…).
   ============================================================= */

/* ── Variables de palette (calquées sur LP1) ── */
#formloginpre-rencpro,
#formregisterhome-rencpro,
#formregistermodal-rencpro {
  --plnk-brand:   var(--rp-brand, #c0392b);
  --plnk-brand2:  var(--rp-brand-mid, #e74c3c);
  --plnk-text:    #2c1c1c;
  --plnk-muted:   #7b6b63;
  --plnk-border:  var(--rp-border, #e2e8f0);
  --plnk-surface: #ffffff;
  --plnk-font:    inherit;
  font-family: var(--plnk-font);
  font-size: 15px;
  color: var(--plnk-text);
  line-height: 1.5;
}

/* ── Mode sombre modal — variables adaptées automatiquement ── */
.rp-modal[data-color="dark"] #formloginpre-rencpro,
.rp-modal[data-color="dark"] #formregistermodal-rencpro {
  --plnk-surface: #2d2d3f;
  --plnk-border:  #3f3f56;
  --plnk-text:    #f4f4f5;
  --plnk-muted:   #a1a1aa;
}

/* ── Mode clair modal — valeurs explicites (même que base) ── */
.rp-modal[data-color="light"] #formloginpre-rencpro,
.rp-modal[data-color="light"] #formregistermodal-rencpro {
  --plnk-surface: #ffffff;
  --plnk-border:  var(--rp-border, #e2e8f0);
  --plnk-text:    #2c1c1c;
  --plnk-muted:   #7b6b63;
}

/* ── Reset wrapper Prelinker ── */
#formloginpre-rencpro .ptprelinker--box,
#formregisterhome-rencpro .ptprelinker--box,
#formregistermodal-rencpro .ptprelinker--box {
  background: none;
  border: none;
  box-shadow: none;
  padding: 0;
  margin: 0;
}

#formloginpre-rencpro .ptprelinker-content,
#formloginpre-rencpro .ptprelinker-content-inner,
#formloginpre-rencpro .ptprelinker-content-content,
#formregisterhome-rencpro .ptprelinker-content,
#formregisterhome-rencpro .ptprelinker-content-inner,
#formregisterhome-rencpro .ptprelinker-content-content,
#formregistermodal-rencpro .ptprelinker-content,
#formregistermodal-rencpro .ptprelinker-content-inner,
#formregistermodal-rencpro .ptprelinker-content-content {
  padding: 0;
  margin: 0;
}

/* ── Layout du <form> ── */
#formloginpre-rencpro .ptprelinker-main-form,
#formregisterhome-rencpro form,
#formregistermodal-rencpro form {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin: 0;
  padding: 0;
}

/* Forgotten form — masquée par défaut, révélée par Prelinker via classe .show */
#formloginpre-rencpro .ptprelinker-forgotten-form {
  display: none;
  flex-direction: column;
  gap: 12px;
  margin: 0;
  padding: 0;
}
#formloginpre-rencpro .ptprelinker-forgotten-form.show {
  display: flex;
}

/* Quand la forgotten form est visible, masquer le main-form */
#formloginpre-rencpro .ptprelinker-login-form:has(.ptprelinker-forgotten-form.show) .ptprelinker-main-form {
  display: none;
}

/* ── Input group ── */
#formloginpre-rencpro .ptprelinker-input-group,
#formregisterhome-rencpro .ptprelinker-input-group,
#formregistermodal-rencpro .ptprelinker-input-group {
  display: flex;
  flex-direction: column;
  position: relative;
  margin: 0;
}

/* ── Labels CSS au-dessus des champs (::before sur input-group) ── */
/* Base commune */
#formloginpre-rencpro .ptprelinker-input-group::before,
#formregisterhome-rencpro .ptprelinker-input-group::before,
#formregistermodal-rencpro .ptprelinker-input-group::before {
  display: block;
  font-size: 0.875rem;
  font-weight: 600;
  margin-bottom: 6px;
  line-height: 1.3;
}
/* Modal fond sombre → labels clairs */
.rp-modal[data-color="dark"] #formloginpre-rencpro .ptprelinker-input-group::before,
.rp-modal[data-color="dark"] #formregistermodal-rencpro .ptprelinker-input-group::before {
  color: #f1f5f9;
}
/* Modal fond clair → labels sombres */
.rp-modal[data-color="light"] #formloginpre-rencpro .ptprelinker-input-group::before,
.rp-modal[data-color="light"] #formregistermodal-rencpro .ptprelinker-input-group::before {
  color: #1e293b;
}
/* LP1 homepage (fond clair) → labels sombres */
#formregisterhome-rencpro .ptprelinker-input-group::before {
  color: #1e293b;
}

/* ── Fallback labels injectés par JS pour navigateurs sans :has() ── */
.rp-label-fallback {
  display: block;
  font-size: 0.875rem;
  font-weight: 600;
  margin-bottom: 6px;
  line-height: 1.3;
  color: #1e293b;
}
.rp-modal[data-color="dark"] .rp-label-fallback {
  color: #f1f5f9;
}
.rp-modal[data-color="light"] .rp-label-fallback {
  color: #1e293b;
}

/* Login : email */
#formloginpre-rencpro .ptprelinker-main-form .ptprelinker-input-group:has(input[type="email"])::before {
  content: "Adresse e-mail";
}
/* Login : mot de passe */
#formloginpre-rencpro .ptprelinker-input-group:has(input[type="password"])::before {
  content: "Mot de passe";
}
/* Forgotten : email — on masque le label Prelinker existant et on met le nôtre */
#formloginpre-rencpro .ptprelinker-forgotten-label {
  display: none !important;
}
#formloginpre-rencpro .ptprelinker-forgotten-form .ptprelinker-input-group::before {
  content: "Adresse e-mail";
}

/* Register : genre */
#formregisterhome-rencpro .ptprelinker-input-group:has(select)::before,
#formregistermodal-rencpro .ptprelinker-input-group:has(select)::before {
  content: "Je suis";
}
/* Register : âge (mode nombre) */
#formregisterhome-rencpro .ptprelinker-input-group:has(input[type="number"])::before,
#formregistermodal-rencpro .ptprelinker-input-group:has(input[type="number"])::before {
  content: "Âge";
}
/* Register : âge (mode liste — 2e select, adjacent au genre) */
#formregisterhome-rencpro .ptprelinker-input-group:has(select) ~ .ptprelinker-input-group:has(select)::before,
#formregistermodal-rencpro .ptprelinker-input-group:has(select) ~ .ptprelinker-input-group:has(select)::before {
  content: "Âge";
}
/* Register : pseudo */
#formregistermodal-rencpro .ptprelinker-input-group:has(input[type="text"])::before {
  content: "Mon pseudo";
}
/* Register : email */
#formregisterhome-rencpro .ptprelinker-input-group:has(input[type="email"])::before,
#formregistermodal-rencpro .ptprelinker-input-group:has(input[type="email"])::before {
  content: "Adresse e-mail";
}

/* Masque les prepend (icônes) — connexion n'en a pas, inscription oui → les cacher pour uniformiser */
#formloginpre-rencpro .ptprelinker-input-group-prepend,
#formregisterhome-rencpro .ptprelinker-input-group-prepend,
#formregistermodal-rencpro .ptprelinker-input-group-prepend {
  display: none !important;
}

/* Masque les labels Prelinker dans le modal — on gère l'affichage via ::before */
#formloginpre-rencpro .ptprelinker-label,
#formregistermodal-rencpro .ptprelinker-label {
  display: none !important;
}

/* ── Inputs texte / email / password / number ── */
#formloginpre-rencpro .ptprelinker-input,
#formregisterhome-rencpro .ptprelinker-input,
#formregistermodal-rencpro .ptprelinker-input {
  width: 100%;
  box-sizing: border-box;
  border: 2px solid var(--plnk-border);
  border-radius: 8px;
  padding: 13px 16px; /* LP1 homepage */
  font-size: 15px;
  font-family: var(--plnk-font);
  color: var(--plnk-text);
  background: var(--plnk-surface);
  outline: none;
  transition: border-color .2s, box-shadow .2s;
  -webkit-appearance: none;
  appearance: none;
}

#formloginpre-rencpro .ptprelinker-input:focus,
#formregisterhome-rencpro .ptprelinker-input:focus,
#formregistermodal-rencpro .ptprelinker-input:focus {
  border-color: var(--plnk-brand);
  box-shadow: 0 0 0 3px rgba(192, 57, 43, .1);
}

#formloginpre-rencpro .ptprelinker-input::placeholder,
#formregisterhome-rencpro .ptprelinker-input::placeholder,
#formregistermodal-rencpro .ptprelinker-input::placeholder {
  color: var(--plnk-muted);
  opacity: 1;
}

/* Masque les flèches sur input[type=number] */
#formregisterhome-rencpro .ptprelinker-input[type="number"],
#formregistermodal-rencpro .ptprelinker-input[type="number"] {
  -moz-appearance: textfield;
}
#formregisterhome-rencpro .ptprelinker-input[type="number"]::-webkit-outer-spin-button,
#formregisterhome-rencpro .ptprelinker-input[type="number"]::-webkit-inner-spin-button,
#formregistermodal-rencpro .ptprelinker-input[type="number"]::-webkit-outer-spin-button,
#formregistermodal-rencpro .ptprelinker-input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* ── Inputs modal : padding réduit pour coller au natif ── */
#formloginpre-rencpro .ptprelinker-input,
#formregistermodal-rencpro .ptprelinker-input {
  padding: 12px 14px;
}

/* ── Select ── */
#formregisterhome-rencpro .ptprelinker-select,
#formregistermodal-rencpro .ptprelinker-select {
  width: 100%;
  box-sizing: border-box;
  border: 2px solid var(--plnk-border);
  border-radius: 8px;
  padding: 13px 40px 13px 16px;
  font-size: 15px;
  font-family: var(--plnk-font);
  color: var(--plnk-text);
  background: var(--plnk-surface);
  outline: none;
  cursor: pointer;
  transition: border-color .2s;
  -webkit-appearance: none;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%237b6b63' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
}

#formregisterhome-rencpro .ptprelinker-select:focus,
#formregistermodal-rencpro .ptprelinker-select:focus {
  border-color: var(--plnk-brand);
  box-shadow: 0 0 0 3px rgba(192, 57, 43, .1);
}

/* Select modal : padding réduit */
#formregistermodal-rencpro .ptprelinker-select {
  padding: 12px 40px 12px 14px;
}

/* Select modal fond sombre — chevron clair */
.rp-modal[data-color="dark"] #formregistermodal-rencpro .ptprelinker-select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23a1a1aa' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/Svg%3E");
}

/* ── Zone boutons ── */
#formloginpre-rencpro .ptprelinker-buttons,
#formregisterhome-rencpro .ptprelinker-buttons,
#formregistermodal-rencpro .ptprelinker-buttons {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 4px;
}

/* ── Bouton submit ── */
#formloginpre-rencpro .ptprelinker-button,
#formregisterhome-rencpro .ptprelinker-button,
#formregistermodal-rencpro .ptprelinker-button {
  display: block;
  width: 100%;
  box-sizing: border-box;
  background: var(--rp-btn-bg, var(--plnk-brand));
  color: #fff;
  border: none;
  border-radius: 8px;
  padding: 15px 24px; /* LP1 homepage */
  font-size: 16px;
  font-weight: 700;
  font-family: var(--plnk-font);
  cursor: pointer;
  text-align: center;
  letter-spacing: .01em;
  transition: background .2s, transform .15s;
  -webkit-appearance: none;
  appearance: none;
}

/* Bouton modal : padding réduit pour coller au natif */
#formloginpre-rencpro .ptprelinker-button,
#formregistermodal-rencpro .ptprelinker-button {
  padding: 14px 20px;
}

#formloginpre-rencpro .ptprelinker-button:hover,
#formregisterhome-rencpro .ptprelinker-button:hover,
#formregistermodal-rencpro .ptprelinker-button:hover {
  background: var(--rp-btn-hover-bg, var(--plnk-brand2));
  transform: translateY(-1px);
}

#formloginpre-rencpro .ptprelinker-button:active,
#formregisterhome-rencpro .ptprelinker-button:active,
#formregistermodal-rencpro .ptprelinker-button:active {
  transform: translateY(0);
}

/* ── Checkbox CGU ── */
#formregisterhome-rencpro .ptprelinker-checkbox,
#formregistermodal-rencpro .ptprelinker-checkbox {
  display: flex;
  align-items: flex-start;
  gap: 8px;
}

#formregisterhome-rencpro .ptprelinker-input-checkbox,
#formregistermodal-rencpro .ptprelinker-input-checkbox {
  width: 16px;
  height: 16px;
  min-width: 16px;
  margin-top: 2px;
  cursor: pointer;
  accent-color: var(--plnk-brand);
  flex-shrink: 0;
}

#formregisterhome-rencpro .ptprelinker-label-checkbox,
#formregistermodal-rencpro .ptprelinker-label-checkbox {
  font-size: 12px;
  color: var(--plnk-muted);
  line-height: 1.5;
  cursor: pointer;
}

#formregisterhome-rencpro .ptprelinker-cgu-link,
#formregistermodal-rencpro .ptprelinker-cgu-link {
  color: var(--plnk-brand);
  text-decoration: underline;
  text-underline-offset: 2px;
}

#formregisterhome-rencpro .ptprelinker-cgu-link:hover,
#formregistermodal-rencpro .ptprelinker-cgu-link:hover {
  color: var(--plnk-brand2);
}

/* ── Messages d'erreur / succès ── */

/* Masqués par défaut (classes de hide Prelinker — leur CSS no-style n'inclut pas ces règles) */
#formloginpre-rencpro .login-hide,
#formloginpre-rencpro .forgotten-hide,
#formregisterhome-rencpro .error-register[style*="none"],
#formregistermodal-rencpro .error-register[style*="none"] {
  display: none;
}

#formloginpre-rencpro .error-login,
#formloginpre-rencpro .ptprelinker-forgotten-fail,
#formregisterhome-rencpro .error-register,
#formregistermodal-rencpro .error-register {
  color: var(--plnk-brand);
  font-size: 13px;
  font-weight: 600;
  padding: 8px 12px;
  background: #fff5f4;
  border-radius: 6px;
  border-left: 3px solid var(--plnk-brand);
  line-height: 1.5;
}

/* Erreurs en mode sombre modal — fond adapté */
.rp-modal[data-color="dark"] #formloginpre-rencpro .error-login,
.rp-modal[data-color="dark"] #formloginpre-rencpro .ptprelinker-forgotten-fail,
.rp-modal[data-color="dark"] #formregistermodal-rencpro .error-register {
  background: rgba(192, 57, 43, 0.18);
  color: #fca5a5;
  border-left-color: #fca5a5;
}

/* ── Message succès mot de passe oublié ── */
#formloginpre-rencpro .ptprelinker-forgotten-success {
  color: #276749;
  font-size: 13px;
  font-weight: 600;
  padding: 8px 12px;
  background: #f0fdf6;
  border-radius: 6px;
  border-left: 3px solid #276749;
}

/* ── Lien "mot de passe oublié" — même style que .rp-modal__help ── */
#formloginpre-rencpro .ptprelinker-forgotten-link {
  display: block;
  margin-top: 14px;
  font-size: 0.78rem;
  color: #888;
  text-align: center;
  text-decoration: underline;
  text-underline-offset: 2px;
  cursor: pointer;
}

#formloginpre-rencpro .ptprelinker-forgotten-link:hover {
  color: var(--plnk-brand);
}

/* ── Label formulaire mot de passe oublié ── */
#formloginpre-rencpro .ptprelinker-forgotten-label {
  display: block;
  font-size: 13px;
  color: var(--plnk-muted);
  margin-bottom: 4px;
  line-height: 1.6;
}

/* ── Lien caché (redirect login) ── */
#formloginpre-rencpro .hidden-link-login {
  display: none;
}

/* ── Responsive ── */
@media (max-width: 480px) {
  #formloginpre-rencpro .ptprelinker-input,
  #formregisterhome-rencpro .ptprelinker-input,
  #formregistermodal-rencpro .ptprelinker-input,
  #formregisterhome-rencpro .ptprelinker-select,
  #formregistermodal-rencpro .ptprelinker-select {
    padding: 12px 14px;
    font-size: 16px; /* évite le zoom iOS */
  }

  #formloginpre-rencpro .ptprelinker-button,
  #formregisterhome-rencpro .ptprelinker-button,
  #formregistermodal-rencpro .ptprelinker-button {
    padding: 14px 20px;
  }
}

/* =============================================================
   MODALES CGU / POLITIQUE DE CONFIDENTIALITÉ (Prelinker)
   Injectées par Prelinker dans le <body>. On les transforme
   en overlay fixe plein écran dès qu'elles passent display:block.
   ============================================================= */

/* ── Overlay fond sombre ── */
.ptprelinker-modal-cgu,
.ptprelinker-modal-cgu-short {
  display: none;               /* caché par défaut — Prelinker override via JS inline style */
  position: fixed !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background: rgba(0, 0, 0, 0.65) !important;
  z-index: 999999 !important;
  padding: 20px !important;
  box-sizing: border-box !important;
  overflow-y: auto !important;
}

/* Quand Prelinker affiche la modale (display:block via JS) → on passe en flex pour centrer */
.ptprelinker-modal-cgu[style*="display: block"],
.ptprelinker-modal-cgu[style*="display:block"],
.ptprelinker-modal-cgu-short[style*="display: block"],
.ptprelinker-modal-cgu-short[style*="display:block"] {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* ── Boîte de dialogue intérieure ── */
.ptprelinker-modal-cgu-content,
.ptprelinker-modal-cgu-short-content {
  position: relative;
  background: #ffffff;
  border-radius: 12px;
  padding: 32px 28px 28px;
  max-width: 640px;
  width: 100%;
  max-height: 80vh;
  overflow-y: auto;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.35);
  color: #2c1c1c;
  font-size: 14px;
  line-height: 1.7;
}

/* ── Bouton fermer × ── */
.ptprelinker-modal-cgu-close,
.ptprelinker-modal-cgu-short-close {
  position: absolute;
  top: 14px;
  right: 18px;
  font-size: 24px;
  line-height: 1;
  color: #7b6b63;
  cursor: pointer;
  transition: color .15s;
}

.ptprelinker-modal-cgu-close:hover,
.ptprelinker-modal-cgu-short-close:hover {
  color: #c0392b;
}

/* ── Contenu textuel ── */
#ptprelinker-modal-cgu-body,
#ptprelinker-modal-cgu-short-body {
  margin-top: 8px;
}

#ptprelinker-modal-cgu-body h2,
#ptprelinker-modal-cgu-short-body h2,
#ptprelinker-modal-cgu-body h3,
#ptprelinker-modal-cgu-short-body h3 {
  font-size: 1rem;
  font-weight: 700;
  margin: 16px 0 6px;
  color: #1c1c27;
}

#ptprelinker-modal-cgu-body p,
#ptprelinker-modal-cgu-short-body p {
  margin: 0 0 10px;
}

#ptprelinker-modal-cgu-body a,
#ptprelinker-modal-cgu-short-body a {
  color: #c0392b;
  text-decoration: underline;
}
