/* ==========================================================================
   Formulaire de reservation (raccourci [2mindev_reservation] du greffon 2minDev).
   Dans le theme depuis le 16/10/2026, comme le carrousel : voir
   2mindev-carrousel.css. Les couleurs et les formes viennent de la charte.
   ========================================================================== */

.deuxmindev { --dm-accent: var(--anchor, #004D51); --dm-fond: #FFFCF6; --dm-trait: rgba(59,46,37,.14);
  --dm-doux: var(--creme-clair, #FDF4E8); --dm-rayon: var(--rayon, 14px);
  max-width: 900px; margin: 0 auto; color: var(--espresso, #3B2E25); }
.deuxmindev__titre { margin: 0 0 14px; }
.deuxmindev__fil { display: flex; gap: 8px; list-style: none; padding: 0; margin: 0 0 22px; counter-reset: pas; flex-wrap: wrap; }
.deuxmindev__fil li { counter-increment: pas; display: flex; align-items: center; gap: 8px; padding: 6px 14px 6px 6px;
  border-radius: 999px; background: var(--dm-doux); font-size: .92em; opacity: .6; }
.deuxmindev__fil li::before { content: counter(pas); display: inline-grid; place-items: center; width: 24px; height: 24px;
  border-radius: 50%; background: #fff; font-weight: 600; }
.deuxmindev__fil li.est-actif { opacity: 1; background: var(--dm-accent); color: #fff; }
.deuxmindev__fil li.est-actif::before { color: var(--dm-accent); }
.deuxmindev__fil li.est-fait { opacity: 1; }
.deuxmindev__filtre { width: 100%; margin: 0 0 12px; padding: 11px 14px; border: 1px solid var(--dm-trait);
  border-radius: 999px; font: inherit; background: var(--dm-fond); }
.deuxmindev__soins { display: grid; gap: 10px; }
.deuxmindev__soin { display: flex; justify-content: space-between; gap: 16px; align-items: center;
  width: 100%; text-align: left; padding: 14px 18px; cursor: pointer; color: inherit;
  border: 1px solid var(--dm-trait); border-radius: var(--dm-rayon); background: var(--dm-fond); font: inherit;
  transition: border-color .15s, box-shadow .15s; }
.deuxmindev__soin:hover, .deuxmindev__soin:focus-visible { border-color: var(--dm-accent); box-shadow: 0 2px 10px rgba(0,77,81,.10); outline: none; }
.deuxmindev__soin b { font-weight: 600; }
.deuxmindev__texte { display: block; opacity: .7; font-size: .9em; margin-top: 2px; }
.deuxmindev__detail { white-space: nowrap; font-size: .92em; color: var(--dm-accent); font-weight: 600; }
.deuxmindev__rappel { margin: -4px 0 16px; opacity: .8; }
/* ⭐ LA CARTE DU SOIN, etapes 2 a 4. */
.deuxmindev__carte { display: grid; grid-template-columns: minmax(0, 1fr); margin: 0 0 20px;
  border: 1px solid var(--dm-trait); border-radius: var(--dm-rayon); overflow: hidden; background: var(--dm-fond); }
/* ⛔ SANS CES DEUX LIGNES LA CARTE RESTE VISIBLE MALGRE `hidden` : une regle
   d auteur `display: grid` bat le `[hidden] { display: none }` du navigateur,
   quelle que soit la specificite. */
.deuxmindev__carte[hidden], .deuxmindev__carte-image[hidden] { display: none; }
.deuxmindev__carte.est-illustree { grid-template-columns: minmax(0, 240px) minmax(0, 1fr); }
.deuxmindev__carte-image { width: 100%; height: 100%; min-height: 160px; object-fit: cover; display: block; }
.deuxmindev__carte-mots { display: flex; flex-direction: column; justify-content: center; gap: 6px; padding: 18px 22px; }
.deuxmindev__carte-famille { margin: 0; font-size: .74rem; letter-spacing: .12em; text-transform: uppercase;
  color: var(--dm-accent); }
.deuxmindev__carte-nom { margin: 0; font-family: var(--font-titre, inherit); font-weight: 400;
  font-size: 1.4rem; line-height: 1.15; }
.deuxmindev__carte-texte { margin: 0; font-size: .94em; opacity: .78; }
.deuxmindev__carte .deuxmindev__rappel { margin: 4px 0 0; opacity: 1; font-size: .92em; font-weight: 600;
  color: var(--dm-accent); }
.deuxmindev__carte--mince.est-illustree { grid-template-columns: minmax(0, 132px) minmax(0, 1fr); }
.deuxmindev__carte--mince .deuxmindev__carte-image { min-height: 96px; }
.deuxmindev__carte--mince .deuxmindev__carte-mots { padding: 13px 18px; gap: 3px; }
.deuxmindev__carte--mince .deuxmindev__carte-nom { font-size: 1.12rem; }
/* Sous 560 px limage passe AU-DESSUS du texte : une vignette de 240 px dans
   une carte de 340 px ne laisse plus rien a lire. */
@media (max-width: 560px) {
  .deuxmindev__carte.est-illustree, .deuxmindev__carte--mince.est-illustree { grid-template-columns: minmax(0, 1fr); }
  .deuxmindev__carte-image, .deuxmindev__carte--mince .deuxmindev__carte-image {
    height: clamp(140px, 42vw, 200px); min-height: 0; }
}
.deuxmindev__agenda { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 20px; align-items: start; }
@media (max-width: 720px) { .deuxmindev__agenda { grid-template-columns: 1fr; } }
.deuxmindev__calendrier, .deuxmindev__horaires { background: var(--dm-fond); border: 1px solid var(--dm-trait);
  border-radius: var(--dm-rayon); padding: 16px; }
.deuxmindev__mois { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.deuxmindev__mois-nom { font-weight: 600; text-transform: capitalize; }
.deuxmindev__nav { width: 38px; height: 38px; border-radius: 50%; border: 1px solid var(--dm-trait); background: #fff;
  cursor: pointer; font-size: 1.4em; line-height: 1; color: var(--dm-accent); }
.deuxmindev__nav:disabled { opacity: .3; cursor: default; }
.deuxmindev__grille { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; text-align: center; }
.deuxmindev__entete { font-size: .75em; text-transform: uppercase; letter-spacing: .06em; opacity: .55; padding: 4px 0; }
.deuxmindev__jour { aspect-ratio: 1; display: grid; place-items: center; border-radius: 50%; border: 0;
  background: transparent; font: inherit; color: inherit; opacity: .35; position: relative; padding: 0; }
.deuxmindev__jour.est-libre { opacity: 1; cursor: pointer; font-weight: 600; background: var(--dm-doux); }
.deuxmindev__jour.est-libre::after { content: ""; position: absolute; bottom: 14%; width: 5px; height: 5px;
  border-radius: 50%; background: var(--dm-accent); }
.deuxmindev__jour.est-libre:hover, .deuxmindev__jour.est-libre:focus-visible { outline: 2px solid var(--dm-accent); outline-offset: -2px; }
.deuxmindev__jour.est-choisi { background: var(--dm-accent); color: #fff; }
.deuxmindev__jour.est-choisi::after { background: #fff; }
.deuxmindev__jour.est-aujourdhui { box-shadow: inset 0 0 0 1px var(--dm-trait); }
.deuxmindev__legende { display: flex; align-items: center; gap: 8px; margin: 12px 0 0; font-size: .82em; opacity: .7; }
.deuxmindev__pastille { width: 16px; height: 16px; border-radius: 50%; background: var(--dm-doux); position: relative; }
.deuxmindev__pastille::after { content: ""; position: absolute; left: 5.5px; bottom: 2px; width: 5px; height: 5px; border-radius: 50%; background: var(--dm-accent); }
.deuxmindev__jour-choisi { margin: 0 0 12px; font-weight: 600; color: var(--dm-accent); }
.deuxmindev__periode { margin: 12px 0 8px; font-size: .78em; text-transform: uppercase; letter-spacing: .08em; opacity: .6; }
.deuxmindev__heures-grille { display: grid; grid-template-columns: repeat(auto-fill, minmax(78px, 1fr)); gap: 8px; }
.deuxmindev__heure { padding: 10px 6px; border-radius: 999px; cursor: pointer; font: inherit; color: inherit;
  border: 1px solid var(--dm-trait); background: #fff; }
.deuxmindev__heure:hover, .deuxmindev__heure:focus-visible { border-color: var(--dm-accent); color: var(--dm-accent); outline: none; }
.deuxmindev__vide { opacity: .75; }
.deuxmindev__duo { display: grid; grid-template-columns: 1fr 1fr; gap: 0 16px; }
@media (max-width: 560px) { .deuxmindev__duo { grid-template-columns: 1fr; } }
.deuxmindev label { display: block; margin: 12px 0; }
.deuxmindev input:not([type=search]), .deuxmindev textarea { display: block; width: 100%; margin-top: 4px; padding: 11px 13px;
  border: 1px solid var(--dm-trait); border-radius: 10px; font: inherit; background: #fff; box-sizing: border-box; }
.deuxmindev input:focus, .deuxmindev textarea:focus { border-color: var(--dm-accent); outline: none; }
.deuxmindev__piege { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.deuxmindev__envoyer { margin-top: 8px; padding: 13px 26px; border: 0; border-radius: 999px; cursor: pointer;
  background: var(--dm-accent); color: #fff; font: inherit; font-weight: 600; }
.deuxmindev__envoyer:disabled { opacity: .6; cursor: default; }
.deuxmindev__retour { margin-top: 14px; background: none; border: 0; cursor: pointer; text-decoration: underline; font: inherit; color: inherit; padding: 0; }
.deuxmindev__mention { margin-top: 14px; opacity: .75; font-size: .92em; }
.deuxmindev__merci { background: var(--dm-doux); border-radius: var(--dm-rayon); padding: 24px; }
.deuxmindev__message:not(:empty) { margin-top: 14px; padding: 12px 16px; border-radius: 12px; background: rgba(94,33,57,.08); }
/* ⛔ Un ?soin= perime ne peut PAS etre signale dans .deuxmindev__message :
   ce paragraphe est en bas du bloc, cinquante-deux soins plus loin. Le mot
   va donc en tete de etape 1, la ou le regard arrive. */
.deuxmindev__avis { margin: 0 0 14px; padding: 12px 16px; border-radius: 12px; background: rgba(94,33,57,.08); }
/* Le message « reservation indisponible » (16/10/2026) : courriel et
   telephone cliquables, et qui se voient comme tels. */
.deuxmindev__indispo { margin: 0; }
.deuxmindev__indispo a { color: var(--dm-accent); text-decoration: underline; text-underline-offset: 3px; font-weight: 600; }