/* =====================================================
   RDV — CSS CLEAN & STABLE (CLEAN)
===================================================== */

/* =========================
   1) FRONT (log + champ code)
========================= */
#rdv-log{
  margin-bottom: 20px;
  font-size: 16px;
  line-height: 1.5;
}
#rdv-log b{ font-weight: 700; }
#rdv-log br{ line-height: 1.6; }

.rdv-hidden{
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* Champ code */
#rdv-id-input{
  appearance: none !important;
  -webkit-appearance: none !important;
  background: transparent !important;
  color: #111 !important;

  box-sizing: border-box !important;
  display: block !important;
  margin: 10px auto !important;
  padding: 12px !important;

  font-size: 18px !important;
  font-weight: 700 !important;
  letter-spacing: 6px !important;
  text-align: center !important;

  border: 1px solid #999 !important;
  border-radius: 6px !important;

  width: calc(7ch + 36px + 24px) !important;
  min-width: calc(7ch + 36px + 24px) !important;
  max-width: calc(7ch + 36px + 24px) !important;
}
#rdv-id-input:focus{
  outline: none !important;
  border: 2px solid #2c7be5 !important;
}

/* Boutons front (affichage géré par JS) */
#rdv-id-send,
#rdv-send{
  display: none; /* JS contrôle */
  margin: 10px auto;
  padding: 10px 20px;

  font-size: 16px;
  font-weight: 600;

  color: #fff;
  border: none;
  border-radius: 6px;
  cursor: pointer;
}
#rdv-id-send{ background: #2c7be5; }
#rdv-id-send:hover{ background: #1f5fbf; }
#rdv-send{ background: #28a745; }
#rdv-send:hover{ background: #1e7e34; }

#rdv-input{
  box-sizing: border-box;
  width: 100%;
  min-height: 90px;
  background: transparent;
  color: #111;
  padding: 12px;
  font-size: 16px;
  border: 1px solid #bbb;
  border-radius: 6px;
  resize: vertical;
}

/* =========================
   2) ADMIN WRAP
========================= */
.rdv-parent-wrap{
  width: 100%;
  max-width: 820px;
  margin: 24px auto;
  padding: 0 14px;
  color: #111;
  font-family: inherit;
  box-sizing: border-box;
}
.rdv-parent-wrap,
.rdv-parent-wrap *{ box-sizing: border-box; }

.rdv-hint{
  margin-top: 8px;
  font-size: 14px;
  color: #666;
}

/* info SMS (admin) */
.rdv-parent-wrap .rdv-sms-info{
  margin: 10px 0 14px;
  padding: 10px 12px;
  border-radius: 10px;
  background: #2c7be5;
  color: #fff;
  font-size: 14px;
  line-height: 1.45;
}
.rdv-parent-wrap .rdv-sms-info a.rdv-link{
  color:#fff !important;
  text-decoration: underline;
  font-weight: 800;
}

/* Checkbox */
.rdv-surplace{
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 10px 0 8px;
  user-select: none;
}
.rdv-surplace input{ margin: 0; }

/* =========================
   3) FORM (1 champ / ligne)
========================= */
.rdv-parent-meta{
  width: min(560px, 100%);
}

.rdv-parent-form .rdv-slot{
  display: block;
  width: 100%;
  padding: 8px 0;
  margin: 0 0 14px;

  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
}

.rdv-parent-form .rdv-slot-text{
  display: block;
  margin: 0 0 6px;
  text-align: left;
  font-weight: 700;
}
.rdv-req{ color:#c40000; }

/* Inputs/select underline */
.rdv-parent-form input,
.rdv-parent-form select{
  display: block !important;
  width: 25ch !important;
  max-width: 100% !important;

  background: transparent !important;
  border: none !important;
  border-bottom: 2px solid #000 !important;

  height: 40px !important;
  line-height: 40px !important;
  padding: 0 2px !important;
  margin: 0 !important;

  outline: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;

  appearance: none;
  -webkit-appearance: none;
}
.rdv-parent-form input:focus,
.rdv-parent-form select:focus{
  border-bottom-width: 3px !important;
}

/* Select flèche simple */
.rdv-parent-form select{
  padding-right: 26px !important;
  background-image:
    linear-gradient(45deg, transparent 50%, #333 50%),
    linear-gradient(135deg, #333 50%, transparent 50%);
  background-position:
    calc(100% - 14px) 55%,
    calc(100% - 8px) 55%;
  background-size: 6px 6px, 6px 6px;
  background-repeat: no-repeat;
}

/* Champs plus larges */
#rdv-parent-name{ width: 35ch !important; }
#rdv-school{ width: 35ch !important; text-transform: uppercase; }

/* Moyenne 00,00 */
.rdv-parent-form .rdv-moyenne-wrap{
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}
.rdv-parent-form .rdv-moyenne-wrap input[type="text"]{
  width: 4ch !important;
  min-width: 4ch !important;
  max-width: 4ch !important;
  text-align: center !important;
  padding: 0 !important;
}
.rdv-parent-form .rdv-moyenne-comma{
  font-size: 18px !important;
  font-weight: 700 !important;
  line-height: 40px !important;
}

/* =========================
   4) ROWS (DOB / ADDR / CONTACT)
========================= */
.rdv-parent-form .rdv-row{
  display:flex !important;
  gap:12px !important;
  align-items:flex-end !important;
  flex-wrap:nowrap !important;
  width:100% !important;
}
.rdv-parent-form .rdv-row .rdv-col{
  flex: 1 1 0 !important;
  min-width: 0 !important;
}

/* Annule width 25ch dans les rows */
.rdv-parent-form .rdv-row input,
.rdv-parent-form .rdv-row select{
  width:100% !important;
  max-width:100% !important;
}

/* DOB */
.rdv-parent-form .rdv-row.rdv-dob .rdv-col{ flex:0 0 90px !important; }
.rdv-parent-form .rdv-row.rdv-dob .rdv-col.rdv-year{ flex:0 0 140px !important; }

/* Adresse + ville */
.rdv-parent-form .rdv-row.rdv-addr .rdv-col.addr{ flex:2 1 0 !important; min-width:320px !important; }
.rdv-parent-form .rdv-row.rdv-addr .rdv-col.city{ flex:1 1 0 !important; min-width:180px !important; }

/* Contact mobile/email */
.rdv-parent-form .rdv-row.rdv-contact .rdv-col.mobile{ flex:0 0 220px !important; }
.rdv-parent-form .rdv-row.rdv-contact .rdv-col.email{ flex:1 1 0 !important; min-width:240px !important; }

/* Téléphone avec icône */
.rdv-parent-form .rdv-phone-wrap{ position:relative !important; width:100% !important; }
.rdv-parent-form .rdv-phone-wrap .rdv-phone-ico{
  position:absolute !important;
  left:0 !important;
  top:50% !important;
  transform: translateY(-50%) !important;
  color:#d10000 !important;
  font-size:16px !important;
  font-weight:900 !important;
  pointer-events:none !important;
}
.rdv-parent-form .rdv-phone-wrap input{
  padding-left: 22px !important;
}

/* =========================
   5) CRENEAUX
========================= */
.rdv-slots-wrap{ margin-top: 8px; }

.rdv-slots-list{
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.rdv-slots-list .rdv-slot{
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 10px 12px !important;

  border: 1px solid #ddd !important;
  border-radius: 10px !important;
  cursor: pointer !important;
  user-select: none;
}
.rdv-slots-list .rdv-slot input[type="radio"]{
  margin: 0 !important;
  width: 22px;
  height: 22px;
  flex: 0 0 auto;
}
.rdv-slots-list .rdv-slot-text{
  display: inline-block;
  line-height: 1.2;
}

.rdv-primary{
  margin-top: 12px;
  width: 100%;
  padding: 14px 16px;
  border: none;
  border-radius: 10px;
  background: #2c7be5;
  color: #fff;
  font-weight: 700;
  cursor: pointer;
}
.rdv-primary:disabled{
  opacity: .5;
  cursor: not-allowed;
}

/* Alerte créneaux (blink) */
.rdv-slots-warning{
  margin: 10px 0 12px;
  padding: 10px 12px;
  border-left: 4px solid #d10000;
  background: #fff5f5;
  color: #b00000;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.45;
  animation: rdvBlink 1.6s ease-in-out infinite;
}
@keyframes rdvBlink{
  0%{ opacity:1; }
  50%{ opacity:.45; }
  100%{ opacity:1; }
}

/* =========================
   6) MODE SMS (verrou sans gris)
========================= */
.rdv-parent-meta.is-disabled,
.rdv-admin-slots.is-disabled{
  pointer-events: none !important;
  cursor: not-allowed !important;
}

/* fade seulement labels */
.rdv-parent-meta.is-disabled .rdv-slot-text{
  opacity: .55 !important;
}

/* champs restent propres */
.rdv-parent-meta.is-disabled input,
.rdv-parent-meta.is-disabled select,
.rdv-parent-meta.is-disabled textarea,
.rdv-parent-meta.is-disabled .rdv-moyenne-wrap,
.rdv-parent-meta.is-disabled .rdv-moyenne-wrap *{
  opacity: 1 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #111 !important;
  -webkit-text-fill-color: #111 !important;
  border-bottom-color: #999 !important;
}

/* =========================
   7) TITRES
========================= */

/* Sections (barre pleine largeur) */
.rdv-parent-form .rdv-section-title{
  margin: 18px 0 12px;
  padding: 10px 12px;
  border-radius: 10px;
  background: #2c7be5;
  color: #fff;
  font-weight: 800;
  text-transform: uppercase;
  line-height: 1.2;
}

/* Slots/Documents (badge largeur texte) */
#rdv-slots-block .rdv-slots-title,
.rdv-parent-form .rdv-slots-title{
  display: inline-block !important;
  width: auto !important;
  max-width: 100% !important;

  background: #0F2954 !important;
  color: #fff !important;

  font-weight: 800 !important;
  padding: 8px 12px !important;
  border-radius: 10px !important;
  margin: 18px 0 12px !important;
  line-height: 1.25 !important;
  text-transform: uppercase !important;

  box-shadow: none !important;
  border: none !important;
}

/* texte interne blanc, sans fond */
#rdv-slots-block .rdv-slots-title *,
.rdv-parent-form .rdv-slots-title *{
  color: #fff !important;
  background: transparent !important;
}

/* =========================
   8) RESPONSIVE
========================= */
@media (max-width:560px){
  .rdv-parent-form .rdv-row{ flex-wrap:wrap !important; }
  .rdv-parent-form .rdv-row.rdv-addr .rdv-col.addr{ min-width:100% !important; }
}

@media (max-width:480px){
  #rdv-log{ font-size: 15px; line-height: 1.55; }

  #rdv-id-input{
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    padding: 18px !important;
    font-size: 20px !important;
    letter-spacing: 4px !important;
    min-height: 56px !important;
  }
  #rdv-id-input{
    border: none !important;
    box-shadow: none !important;
  }
  #rdv-id-input:focus{
    border: none !important;
    box-shadow: 0 2px 0 #2c7be5;
  }

  #rdv-id-send,
  #rdv-send{
    width: 100% !important;
    padding: 14px 16px !important;
    font-size: 16px !important;
    border-radius: 10px !important;
  }

  #rdv-input{
    min-height: 110px !important;
    padding: 14px !important;
    font-size: 16px !important;
  }

  .rdv-slots-list .rdv-slot input[type="radio"]{
    width: 26px;
    height: 26px;
  }
}

@media (max-width:360px){
  #rdv-id-input{ letter-spacing: 3px !important; }
}
/* =====================================================
   TITRES — BANDE FOND RECTANGULAIRE (PLEINE LARGEUR)
===================================================== */
.rdv-band-title{
  display: block !important;        /* pleine largeur */
  width: 100% !important;

  background: #0F2954 !important;   /* bleu */
  color: #ffffff !important;

  padding: 12px 16px !important;
  margin: 22px 0 14px !important;

  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: .3px !important;
  line-height: 1.25 !important;

  border-radius: 6px !important;    /* rectangulaire (peu arrondi) */
  border: none !important;
  box-shadow: none !important;
}

/* Sécurité thème : tout le texte reste blanc */
.rdv-band-title *{
  color: #ffffff !important;
  background: transparent !important;
}
/* =====================================================
   SLOTS — BORDS RECTANGULAIRES (FORCÉ)
===================================================== */

/* Titre bande slots */
#rdv-slots-block .rdv-slots-title,
.rdv-parent-form .rdv-slots-title{
  border-radius: 0 !important;   /* ✅ rectangle */
}

/* Chaque créneau (slot) */
.rdv-slots-list .rdv-slot{
  border-radius: 0 !important;   /* ✅ rectangle */
}

/* Bouton principal */
.rdv-primary{
  border-radius: 0 !important;   /* ✅ rectangle */
}
/* =====================================================
   TITRES "LE PÈRE" / "LA MÈRE" — NOIR + GRAS + TAILLE
===================================================== */

.rdv-parent-form .rdv-hint > b{
  color: #000 !important;        /* noir */
  font-weight: 800 !important;   /* bien gras */
  font-size: 16px !important;    /* taille lisible desktop */
  letter-spacing: .3px;
}

/* Mobile : légèrement plus petit */
@media (max-width: 480px){
  .rdv-parent-form .rdv-hint > b{
    font-size: 15px !important;
  }
}
/* =====================================================
   FIX INPUT FILE — supprimer "Aucun fichier choisi"
===================================================== */

.rdv-parent-form input[type="file"]{
  width: 100% !important;        /* empêche la coupure */
  max-width: 100% !important;

  border-bottom: none !important;
  height: auto !important;
  line-height: normal !important;

  white-space: normal !important;
  overflow: visible !important;
}
.rdv-parent-form input:not([type="file"]),
.rdv-parent-form select{
  width: 25ch !important;
}
/* =====================================================
   AUTOFILL = COMPORTEMENT NORMAL (aucun fond spécial)
===================================================== */

/* Chrome / Edge / Safari */
.rdv-parent-form input:-webkit-autofill,
.rdv-parent-form input:-webkit-autofill:hover,
.rdv-parent-form input:-webkit-autofill:focus,
.rdv-parent-form select:-webkit-autofill,
.rdv-parent-form textarea:-webkit-autofill{

  /* Supprime le fond jaune / bleu */
  -webkit-box-shadow: 0 0 0px 1000px transparent inset !important;
  box-shadow: 0 0 0px 1000px transparent inset !important;

  /* Texte normal */
  -webkit-text-fill-color: inherit !important;
  caret-color: inherit !important;

  /* Annule animation interne Chrome */
  transition: background-color 99999s ease-out 0s !important;
}

/* Firefox */
.rdv-parent-form input:-moz-autofill,
.rdv-parent-form select:-moz-autofill,
.rdv-parent-form textarea:-moz-autofill{
  box-shadow: 0 0 0px 1000px transparent inset !important;
}
/* Champs papier (père/mère/autre) : placeholder gris + input un peu plus bas */
.rdv-parent-form .rdv-paper-compact input{
  margin-top: 6px;          /* ✅ descend le champ */
  padding-top: 12px;        /* ✅ respire, comme les autres */
  padding-bottom: 12px;
}


/* Ligne horizontale Prénom / Nom */
.rdv-paper-inline{
  display: flex;
  gap: 12px;          /* ✅ espace ENTRE les champs */
}

/* Colonnes égales */
.rdv-paper-inline .rdv-col{
  flex: 1;
}

/* Champs papier : même rendu que les autres */
.rdv-parent-form .rdv-paper-compact input{
  margin-top: 6px;    /* ✅ descend un peu */
  padding: 12px;
}

/* Placeholder EXACTEMENT comme "Nom et Prénom de l’élève" */
.rdv-parent-form input::placeholder{
  color: #6b6b6b;   /* même gris que le champ élève */
  opacity: 1;       /* important : même rendu sur Chrome/Firefox */
}
/* Père / Mère / Autre = même gris que élève */
.rdv-paper-compact input::placeholder{
  color: #6b6b6b;
  opacity: 1;
}
/* =========================================
   PLACEHOLDER — GRIS UNIQUE (OFFICIEL)
   Identique à "Nom et Prénom de l’élève"
========================================= */
.rdv-parent-form input::placeholder,
.rdv-parent-form select::placeholder{
  color: #6b6b6b !important;
  opacity: 1 !important;
}

/* =========================
   DOB : JJ / MM / AAAA centrés
========================= */
.rdv-parent-form .rdv-row.rdv-dob input{
  text-align: center !important;
}

/* =========================
   Adresse : champ "Adresse ligne 1" plus large (s'arrête avant ville)
========================= */
.rdv-parent-form .rdv-row.rdv-addr{
  gap: 14px !important;
}

.rdv-parent-form .rdv-row.rdv-addr .rdv-col.addr{
  flex: 3 1 0 !important;        /* ✅ plus large */
  min-width: 380px !important;   /* ✅ augmente */
}

.rdv-parent-form .rdv-row.rdv-addr .rdv-col.city{
  flex: 1 1 0 !important;        /* ✅ ville plus petite */
  min-width: 170px !important;
}

/* =========================
   ERREUR (champ non rempli)
========================= */
.rdv-parent-form .rdv-error{
  border-bottom-color: #d10000 !important;
  border-bottom-width: 3px !important;
}

.rdv-parent-form .rdv-error::placeholder{
  color: #d10000 !important;
  opacity: 1 !important;
}

/* Pour les select en erreur */
.rdv-parent-form select.rdv-error{
  border-bottom-color: #d10000 !important;
}

/* Message erreur global */
.rdv-form-error{
  margin: 10px 0 0;
  padding: 10px 12px;
  border-left: 4px solid #d10000;
  background: #fff5f5;
  color: #b00000;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.4;
}
/* Champ texte/select en erreur */
.rdv-parent-form .rdv-error{
  border-bottom-color:#d10000 !important;
  border-bottom-width:3px !important;
}

/* Fichiers : pas de border-bottom => on met un contour rouge */
.rdv-parent-form input[type="file"].rdv-error{
  outline: 2px solid #d10000 !important;
  outline-offset: 2px !important;
}

/* Petit message au-dessus du formulaire */
.rdv-form-error{
  margin: 10px 0 12px;
  padding: 10px 12px;
  border-left: 4px solid #d10000;
  background: #fff5f5;
  color: #b00000;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.4;
}

/* =====================================================
   ✅ MODAL CONFIRM (PARENTS) — même style que modal admin
   Cible: #rdv-confirm-modal
===================================================== */

/* caché (si pas déjà défini ailleurs) */
#rdv-confirm-modal.rdv-hidden{
  display: none !important;
}



/* ===== FIX 1: Champ code (bon ID) ===== */
#rdv-code-input{
  appearance: none !important;
  -webkit-appearance: none !important;
  background: transparent !important;
  color: #111 !important;

  box-sizing: border-box !important;
  display: block !important;
  margin: 10px auto !important;
  padding: 12px !important;

  font-size: 18px !important;
  font-weight: 700 !important;
  letter-spacing: 6px !important;
  text-align: center !important;

  border: 1px solid #999 !important;
  border-radius: 6px !important;

  width: calc(7ch + 36px + 24px) !important;
  min-width: calc(7ch + 36px + 24px) !important;
  max-width: calc(7ch + 36px + 24px) !important;
}
#rdv-code-input:focus{
  outline: none !important;
  border: 2px solid #2c7be5 !important;
}


/* =========================
   ✅ POPUP TOP (Toast)
   Cible: #rdv-confirm-modal
========================= */

#rdv-confirm-modal.rdv-hidden{ display:none !important; }

#rdv-confirm-modal{
  position: fixed !important;
  top: 14px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  z-index: 999999 !important;
  width: min(700px, calc(100% - 24px)) !important;
}

/* pas de backdrop */
#rdv-confirm-modal .rdv-modal-backdrop{ display:none !important; }

/* box */
#rdv-confirm-modal .rdv-modal-box{
  background: #ffffff !important;
  border: 1px solid #e5e5e5 !important;
  border-radius: 8px !important;
  box-shadow: 0 10px 30px rgba(0,0,0,.18) !important;
  overflow: hidden !important;
}

/* header */
#rdv-confirm-modal .rdv-modal-head{
  background: #0F2954 !important;
  color: #fff !important;
  padding: 10px 12px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
}

/* body */
#rdv-confirm-modal .rdv-modal-body{
  padding: 12px !important;
  font-size: 15px !important;
  line-height: 1.45 !important;
  color:#111 !important;
}

/* actions */
#rdv-confirm-modal .rdv-modal-actions{
  padding: 10px 12px 12px !important;
  display:flex !important;
  justify-content:flex-end !important;
  gap:10px !important;
}

/* boutons */
#rdv-confirm-modal .rdv-modal-ok{
  border-radius: 8px !important;
  padding: 8px 14px !important;
  font-weight: 900 !important;
  border: 1px solid #0F2954 !important;
  background: #0F2954 !important;
  color:#fff !important;
  cursor:pointer !important;
}
#rdv-confirm-modal .rdv-modal-close{
  background: transparent !important;
  border: none !important;
  color:#fff !important;
  font-size: 18px !important;
  cursor:pointer !important;
  font-weight: 900 !important;
}

/* ne bloque jamais le scroll */
body.rdv-modal-open{ overflow:auto !important; }
/* DOB dropdowns : fond transparent + underline (comme inputs) */
.rdv-parent-form .rdv-row.rdv-dob select{
  background: transparent !important;
  border: none !important;
  border-bottom: 2px solid #000 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  height: 40px !important;
  line-height: 40px !important;
  padding: 0 26px 0 2px !important; /* espace flèche */
  appearance: none !important;
  -webkit-appearance: none !important;
}

/* flèche simple (même style que tes autres select) */
.rdv-parent-form .rdv-row.rdv-dob select{
  background-image:
    linear-gradient(45deg, transparent 50%, #333 50%),
    linear-gradient(135deg, #333 50%, transparent 50%);
  background-position:
    calc(100% - 14px) 55%,
    calc(100% - 8px) 55%;
  background-size: 6px 6px, 6px 6px;
  background-repeat: no-repeat;
}
/* =====================================================
   ADRESSES (FINAL) : Adresse ligne 1 très longue, Ville courte
===================================================== */

/* on garde ton système .rdv-row existant */
.rdv-parent-form .rdv-row.rdv-addr{
  gap: 14px !important;
  align-items: flex-end !important; /* comme les autres lignes */
}

/* Adresse = prend presque toute la ligne */
.rdv-parent-form .rdv-row.rdv-addr .rdv-col.addr{
  flex: 1 1 auto !important;
  min-width: 0 !important;
}

/* Ville = petite colonne fixe */
.rdv-parent-form .rdv-row.rdv-addr .rdv-col.city{
  flex: 0 0 160px !important;     /* ✅ ville plus petite => adresse plus longue */
  max-width: 160px !important;
}

/* Sécurité : inputs full dans leur colonne */
.rdv-parent-form .rdv-row.rdv-addr input{
  width: 100% !important;
}

/* Mobile : empiler */
@media (max-width: 560px){
  .rdv-parent-form .rdv-row.rdv-addr{
    flex-wrap: wrap !important;
  }
  .rdv-parent-form .rdv-row.rdv-addr .rdv-col.addr{
    flex: 1 1 100% !important;
    max-width: 100% !important;
  }
  .rdv-parent-form .rdv-row.rdv-addr .rdv-col.city{
    flex: 1 1 100% !important;
    max-width: 100% !important;
  }
}