/* =================================================================
   Amelia — retouches légères.
   Le gros de l'habillage (couleurs vertes, police Hanken) est fait
   NATIVEMENT dans les réglages Amelia (Personnalisation), pas ici.
   Ce fichier ne fait que : cadrer la largeur, forcer la police,
   et styler les éléments ajoutés par salle.js (encadré CGV, bouton fermer).
   v0.3.3 : filet anti-bleu Element-UI + contraste barre latérale claire.
   ================================================================= */

.amelia-app-booking,
.amelia-service-step,
#amelia-container {
  max-width:960px;
  margin-inline:auto;
}
.amelia-app-booking,
.amelia-app-booking input,
.amelia-app-booking select,
.amelia-app-booking textarea,
.amelia-app-booking button,
.amelia-app-booking .el-input__inner {
  font-family:"Hanken Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}
.amelia-app-booking .am-fs__main-heading,
.amelia-app-booking h1,
.amelia-app-booking h2,
.amelia-app-booking h3 {
  letter-spacing:-.01em;
}

/* ---- hiérarchie : le bouton d'action doit dominer ---- */
/* Boutons primaires Amelia (« Continuer », « Réserver maintenant »…) */
.wpamelia-catalog .am-c-btn-prim,
.amelia-app-booking .am-c-btn-prim,
.amelia-app-booking button.am-c-btn-prim,
.amelia-app-booking .am-button--primary,
.amelia-app-booking .el-button--primary {
  background:var(--accent) !important;
  background-image:none !important;
  border-color:var(--accent) !important;
  color:#fff !important;
  font-weight:700 !important;
  font-size:1rem !important;
  min-height:48px !important;
  border-radius:10px !important;
  box-shadow:0 6px 18px -6px color-mix(in srgb, var(--accent) 65%, transparent) !important;
  transition:transform .12s ease, box-shadow .18s, background-color .18s !important;
}
.wpamelia-catalog .am-c-btn-prim:hover,
.amelia-app-booking .am-c-btn-prim:hover,
.amelia-app-booking .el-button--primary:hover {
  background-color:var(--accent-hover) !important;
  transform:translateY(-1px);
  box-shadow:0 10px 24px -8px color-mix(in srgb, var(--accent) 70%, transparent) !important;
}

/* Étiquette de catégorie « Service » : discrète, ce n'est pas un bouton */
.wpamelia-catalog [class*="category"],
.wpamelia-catalog [class*="badge"],
.amelia-app-booking [class*="service-category"],
.amelia-app-booking .am-service [class*="category"] {
  background:var(--raised) !important;
  color:var(--muted) !important;
  border-color:transparent !important;
  font-weight:500 !important;
  font-size:.72rem !important;
  letter-spacing:.02em;
  text-transform:uppercase;
  box-shadow:none !important;
}
.wpamelia-catalog [class*="category"] svg,
.wpamelia-catalog [class*="badge"] svg,
.amelia-app-booking [class*="service-category"] svg {
  color:var(--muted) !important; fill:var(--muted) !important; opacity:.7;
}

/* Pastille de prix : neutre, pas verte */
.wpamelia-catalog [class*="price"],
.amelia-app-booking .am-service [class*="price"] {
  background:var(--raised) !important;
  color:var(--ink) !important;
  font-weight:600 !important;
}

/* Encadré CGV injecté par salle.js */
.shc-terms {
  background:var(--accent-wash);
  border:1px solid color-mix(in srgb, var(--accent) 25%, transparent);
  border-radius:12px;
  padding:16px 18px;
  margin:18px 0;
  font-size:.92rem;
  line-height:1.5;
  color:var(--ink);
}
.shc-terms strong { display:block; margin-bottom:8px; font-weight:600; }
.shc-terms a { color:var(--accent-ink); text-decoration:underline; }
.shc-terms label { display:flex; gap:10px; align-items:flex-start; font-weight:600; margin-top:12px; }
.shc-terms input { margin-top:3px; width:18px; height:18px; accent-color:var(--accent); }

/* Bouton « fermer » injecté par salle.js */
.shc-close-booking {
  position:absolute; top:14px; right:16px;
  width:36px; height:36px; border-radius:50%;
  border:1px solid var(--line-2); background:var(--card); color:var(--ink);
  font-size:22px; line-height:1; cursor:pointer; z-index:20;
}
.shc-close-booking:hover { background:var(--raised); }

/* =================================================================
   Filet anti-bleu : Amelia laisse par endroits la couleur primaire
   d'Element-UI (#409eff) ou sa propre valeur par défaut (#1246D6) —
   croix de fermeture, contours de focus, éléments actifs des menus.
   On mappe ces variables sur le vert du site.
   ================================================================= */
.amelia-v2-booking,
.amelia-v2-booking #amelia-container,
.amelia-app-booking,
.el-popper.amelia-v2-booking,
.el-select__popper.amelia-v2-booking {
  --el-color-primary: var(--accent) !important;
  --el-color-primary-light-3: color-mix(in srgb, var(--accent) 68%, #fff) !important;
  --el-color-primary-light-5: color-mix(in srgb, var(--accent) 48%, #fff) !important;
  --el-color-primary-light-7: color-mix(in srgb, var(--accent) 26%, #fff) !important;
  --el-color-primary-light-8: color-mix(in srgb, var(--accent) 16%, #fff) !important;
  --el-color-primary-light-9: var(--accent-wash) !important;
  --el-color-primary-dark-2: var(--accent-ink) !important;
  --am-c-primary: var(--accent) !important;
}

/* Croix de fermeture native des dialogues Amelia : disque neutre, pas bleu */
.amelia-v2-booking .el-dialog__headerbtn,
.amelia-v2-booking.amelia-v2-booking-dialog .el-dialog__headerbtn,
.amelia-v2-booking.am-forms-dialog .el-dialog__headerbtn {
  background-color:var(--card) !important;
  border:1px solid var(--line-2) !important;
  box-shadow:var(--shadow-sm);
}
.amelia-v2-booking .el-dialog__headerbtn:hover {
  background-color:var(--raised) !important;
}
.amelia-v2-booking .el-dialog__headerbtn .el-dialog__close,
.amelia-v2-booking .el-dialog__headerbtn .am-icon-close,
.amelia-v2-booking .el-dialog__headerbtn .am-icon-close::before {
  color:var(--ink) !important;
}

/* Barre latérale « étape par étape » : fond beige clair (réglé dans Amelia),
   elle était quasi-noire → « mortuaire ». Ici on redonne du contraste aux
   étapes : puces en chips blanches, étape active en vert, ronds d'état visibles.
   (Amelia ne pose pas de classe « étape active » : on cible via :has() le
   step qui contient le rond sélectionné.) */
.amelia-v2-booking .am-fs-sb__step {
  background-color:var(--card) !important;
  border:1px solid var(--line) !important;
  border-radius:10px !important;
}
.amelia-v2-booking .am-fs-sb__step:has(.am-fs-sb__step-checker-selected) {
  background-color:var(--accent-wash) !important;
  border-color:color-mix(in srgb, var(--accent) 35%, transparent) !important;
  box-shadow:inset 3px 0 0 var(--accent) !important;
}
.amelia-v2-booking .am-fs-sb__step-heading { color:var(--ink) !important; }
.amelia-v2-booking .am-fs-sb__step:has(.am-fs-sb__step-checker-selected) .am-fs-sb__step-heading {
  color:var(--accent-ink) !important;
  font-weight:600 !important;
}
.amelia-v2-booking .am-fs-sb__step-icon { color:var(--muted) !important; }
.amelia-v2-booking .am-fs-sb__step:has(.am-fs-sb__step-checker-selected) .am-fs-sb__step-icon {
  color:var(--accent) !important;
}
/* rond d'état à droite de chaque étape */
.amelia-v2-booking .am-fs-sb__step-checker {
  background-color:var(--card) !important;
  border:1px solid var(--line-2) !important;
}
.amelia-v2-booking .am-fs-sb__step-checker-selected {
  border:2px solid var(--accent) !important;
}
.amelia-v2-booking .am-fs-sb__step-checker .am-icon-check {
  background-color:var(--accent) !important;
  color:#fff !important;
}
/* séparateurs pointillés des récapitulatifs d'étape + pied « Réduire le menu » */
.amelia-v2-booking .am-fs-sb__step-selection { border-bottom-color:var(--line) !important; }
.amelia-v2-booking [class*="am-fs-sb__collapse"] { color:var(--ink) !important; }

/* =================================================================
   COUCHE « CHALEUREUSE »  (v0.4.0) — accent terracotta, matière crème,
   coins généreux, ombres douces, pastilles rondes.
   ================================================================= */

/* modale : coins généreux + ombre chaude, pas de contour dur */
.amelia-v2-booking.am-forms-dialog .el-dialog,
.amelia-v2-booking.am-dialog-popup .el-dialog,
.amelia-v2-booking .am-fs,
.amelia-v2-booking .am-cbf {
  border-radius:var(--r-lg) !important;
  box-shadow:var(--shadow-lg) !important;
  border:none !important;
  overflow:hidden;
}

/* titres Amelia en Fraunces */
.amelia-v2-booking [class*="__title"],
.amelia-v2-booking [class*="-title"],
.amelia-v2-booking [class*="-heading"],
.amelia-v2-booking h1, .amelia-v2-booking h2, .amelia-v2-booking h3 {
  font-family:var(--font-head) !important;
  font-weight:500 !important;
  letter-spacing:-.005em;
}

/* cartes de sélection (étapes, services, extras) : crème, arrondi, ombre douce */
.amelia-v2-booking .am-fs-sb__step,
.amelia-v2-booking [class*="__service-item"],
.amelia-v2-booking [class*="__extra-item"],
.amelia-v2-booking [class*="-card"],
.amelia-v2-booking .am-cbf__service {
  background-color:var(--card) !important;
  border:1px solid transparent !important;
  border-radius:var(--r) !important;
  box-shadow:var(--shadow-sm) !important;
}
.amelia-v2-booking .am-fs-sb__step:has(.am-fs-sb__step-checker-selected) {
  box-shadow:inset 3px 0 0 var(--accent), var(--shadow-sm) !important;
}

/* pastilles d'icône rondes et chaudes plutôt que traits froids */
.amelia-v2-booking .am-fs-sb__step-icon {
  width:34px !important; height:34px !important;
  display:inline-flex !important; align-items:center; justify-content:center;
  border-radius:50% !important;
  background:var(--accent-wash) !important;
  color:var(--accent-ink) !important;
  font-size:18px !important;
}
.amelia-v2-booking .am-fs-sb__step:has(.am-fs-sb__step-checker-selected) .am-fs-sb__step-icon {
  background:var(--accent) !important; color:#fff9f4 !important;
}
.amelia-v2-booking .am-fs-sb__step-checker { border-radius:50% !important; }

/* boutons + / − des quantités : ronds, crème, accent au survol */
.amelia-v2-booking [class*="__quantity"] button,
.amelia-v2-booking .am-select-number button,
.amelia-v2-booking [class*="stepper"] button {
  border-radius:50% !important;
  background:var(--raised) !important;
  border:1px solid var(--line-2) !important;
  color:var(--ink) !important;
}
.amelia-v2-booking [class*="__quantity"] button:hover,
.amelia-v2-booking .am-select-number button:hover {
  background:var(--accent-wash) !important; border-color:var(--accent) !important; color:var(--accent-ink) !important;
}

/* champs : arrondi doux, halo terracotta au focus (aligne sur le reste du site) */
.amelia-v2-booking #amelia-container input,
.amelia-v2-booking #amelia-container .am-select__input,
.amelia-v2-booking #amelia-container textarea {
  border-radius:var(--r-sm) !important;
}
.amelia-v2-booking #amelia-container input:focus,
.amelia-v2-booking #amelia-container textarea:focus {
  box-shadow:0 0 0 4px var(--accent-wash) !important;
}

/* croix de fermeture : disque crème sans contour, ombre douce */
.amelia-v2-booking .el-dialog__headerbtn {
  border:none !important;
  border-radius:50% !important;
  box-shadow:var(--shadow-sm) !important;
}