:root{--ink:#17130f;--ivory:#f8f4ec;--paper:#fffdf8;--gold:#c69745;--gold-light:#efd58d;--gold-dark:#7f561f;--muted:#746b60;--line:rgba(57,45,31,.14);--serif:Georgia,serif;--sans:Inter,Arial,sans-serif}
.el-config-shell{position:relative;z-index:2;padding:16px;border-radius:38px;background:radial-gradient(circle at 26% 18%,rgba(198,151,69,.11),transparent 25rem),linear-gradient(145deg,#17130f,#0f0c09);box-shadow:0 34px 90px rgba(12,9,6,.24)}
.el-configurator{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(380px,.88fr);gap:20px;min-height:760px}
.el-stage,.el-panel{border:1px solid rgba(255,255,255,.1);border-radius:32px;background:rgba(255,255,255,.035);overflow:hidden}.el-zone-tooltip{position:absolute;z-index:10;pointer-events:none;transform:translateY(5px);opacity:0;padding:8px 11px;border:1px solid rgba(239,213,141,.3);border-radius:999px;color:#1b140c;background:linear-gradient(135deg,#f3ddaa,#c69745);box-shadow:0 10px 24px rgba(10,8,5,.24);font-size:.68rem;font-weight:850;white-space:nowrap;transition:opacity .13s ease,transform .13s ease}.el-zone-tooltip.is-visible{opacity:1;transform:none}
.el-stage{position:relative;min-height:760px;background:radial-gradient(circle at 72% 16%,rgba(239,213,141,.1),transparent 20rem),linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.02))}
.el-stage::after{content:"";position:absolute;inset:auto 8% 7%;height:1px;background:linear-gradient(90deg,transparent,rgba(240,211,141,.5),transparent)}
.el-stage-toolbar{position:absolute;z-index:6;top:22px;left:22px;right:22px;display:flex;justify-content:space-between;align-items:center;gap:12px}
.segmented{display:flex;padding:4px;border:1px solid rgba(255,255,255,.13);border-radius:999px;background:rgba(9,7,5,.45);backdrop-filter:blur(10px)}
.segmented button{border:0;color:rgba(255,255,255,.52);background:transparent;border-radius:999px;min-height:38px;padding:0 16px;font-size:.78rem;font-weight:750}
.segmented button.is-active{color:#18120b;background:linear-gradient(135deg,var(--gold-light),var(--gold))}
.config-toolbar-right{display:flex;gap:8px}
.icon-button{min-height:44px;padding:0 16px;border-radius:999px;border:1px solid rgba(255,255,255,.14);color:white;background:rgba(9,7,5,.38);font-size:.76rem}
#el-canvas{width:100%;height:100%;min-height:760px;display:block}
.el-stage-footer{position:absolute;left:24px;right:24px;bottom:22px;display:flex;justify-content:space-between;align-items:flex-end;gap:14px;z-index:5}
.el-stage-note{max-width:70%;margin:0;color:rgba(255,255,255,.62);font-size:.76rem}
.el-model-status{display:inline-flex;align-items:center;min-height:36px;padding:0 14px;border:1px solid rgba(255,255,255,.13);border-radius:999px;background:rgba(9,7,5,.38);color:#f5e5bf;font-size:.68rem;font-weight:750;letter-spacing:.04em;backdrop-filter:blur(10px)}
.el-model-status[data-tone=success]{color:#f8e8b6}
.el-model-status[data-tone=warning]{color:#ffdf98}
.el-model-status[data-tone=danger]{color:#ffb7aa}
.el-loader{position:absolute;inset:0;z-index:8;display:grid;place-items:center;gap:14px;align-content:center;background:rgba(9,7,5,.28);backdrop-filter:blur(4px);transition:opacity .28s ease,visibility .28s ease}
.el-loader.is-hidden{opacity:0;visibility:hidden;pointer-events:none}
.el-loader-ring{width:56px;height:56px;border:2px solid rgba(255,255,255,.15);border-top-color:var(--gold-light);border-radius:50%;animation:el-spin 1s linear infinite}
.el-loader-text{color:rgba(255,255,255,.72);font-size:.76rem}
@keyframes el-spin{to{transform:rotate(360deg)}}
.el-panel{padding:24px 24px 18px;color:white}
.el-panel-topline{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-bottom:14px}
.el-zone-label{color:rgba(255,255,255,.45);font-size:.66rem;font-weight:780;letter-spacing:.17em;text-transform:uppercase}
.el-zone-badge{padding:8px 12px;border-radius:999px;color:#1c150c;background:linear-gradient(135deg,var(--gold-light),var(--gold));font-size:.7rem;font-weight:800}
.el-panel h3{margin:0;font-family:var(--serif);font-size:2.05rem;font-weight:500;line-height:1.02}
.el-panel-subtitle{margin:10px 0 20px;color:rgba(255,255,255,.58);font-size:.82rem;line-height:1.65}
.el-offer{padding:18px;border:1px solid rgba(255,255,255,.09);border-radius:22px;background:rgba(255,255,255,.05)}
.el-offer-kicker{display:block;color:#f3d698;font-size:.64rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase}
.el-offer-line{display:flex;align-items:flex-end;gap:10px;margin-top:10px}
.el-crossed{color:rgba(255,255,255,.38);font-size:1rem;text-decoration:line-through}
.el-bundle-price{font-family:var(--serif);font-size:3rem;font-weight:500;line-height:1;color:white}
.el-saving{margin-top:7px;color:rgba(255,255,255,.58);font-size:.75rem}
.el-items{display:grid;gap:10px;margin-top:18px}
.el-item{display:grid;grid-template-columns:22px 1fr auto;align-items:center;gap:10px;padding:14px;border:1px solid rgba(255,255,255,.08);border-radius:18px;background:rgba(255,255,255,.025)}
.el-item input{width:18px;height:18px;accent-color:var(--gold)}
.el-item label{font-size:.96rem;font-weight:650;line-height:1.35;cursor:pointer}
.el-item-price{color:#f2d38d;font-size:.83rem;font-weight:800}
.el-summary{margin-top:18px;padding:18px;border:1px solid rgba(255,255,255,.09);border-radius:22px;background:rgba(255,255,255,.04)}
.el-total-row{display:flex;justify-content:space-between;align-items:flex-end;gap:14px}
.el-total-row small{display:block;color:rgba(255,255,255,.48);font-size:.72rem}
.el-live-total{font-family:var(--serif);font-size:2.35rem;font-weight:500;line-height:1}
.el-advice{margin-top:10px;color:rgba(255,255,255,.66);font-size:.8rem;line-height:1.55}
.el-price-disclaimer{margin:12px 0 0;color:rgba(255,255,255,.4);font-size:.68rem;line-height:1.55}
.el-actions{display:grid;grid-template-columns:1fr;gap:10px;margin-top:18px}
.el-primary,.el-secondary,.el-planity-fallback{min-height:50px;padding:0 18px;border:0;border-radius:999px;display:inline-flex;justify-content:center;align-items:center;text-decoration:none;font-size:.82rem;font-weight:820;transition:transform .2s ease,box-shadow .2s ease}
.el-primary{color:#1d150b;background:linear-gradient(135deg,var(--gold-light),var(--gold),var(--gold-dark));box-shadow:0 14px 28px rgba(153,104,36,.18)}
.el-secondary{color:white;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1)}
.el-primary:hover,.el-secondary:hover,.el-planity-fallback:hover{transform:translateY(-2px)}
.el-planity-section{margin-top:24px;padding:34px;border:1px solid rgba(57,45,31,.08);border-radius:32px;background:linear-gradient(180deg,#fffdf8,#faf6ee);color:var(--ink)}
.el-planity-heading{max-width:900px;margin-bottom:22px}
.el-planity-eyebrow{display:inline-block;color:var(--gold-dark);font-size:.65rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase}
.el-planity-heading h2{margin:9px 0 8px;font-family:var(--serif);font-size:clamp(2.2rem,4vw,3.8rem);font-weight:500;line-height:1}
.el-planity-heading p{max-width:70ch;margin:0;color:var(--muted);font-size:.96rem;line-height:1.7}
.el-recommendation{display:grid;grid-template-columns:1fr auto;gap:16px;padding:18px 20px;margin-bottom:18px;border:1px solid rgba(198,151,69,.22);border-radius:22px;background:linear-gradient(180deg,#fffaf1,#f7efdf)}
.el-recommendation-kicker{display:block;color:var(--gold-dark);font-size:.62rem;font-weight:800;letter-spacing:.15em;text-transform:uppercase}
.el-recommendation h3{margin:7px 0 6px;font-family:var(--serif);font-size:1.6rem;font-weight:600;line-height:1.08}
.el-recommendation p{margin:0;color:var(--muted);font-size:.82rem;line-height:1.55}
.el-recommendation-meta{text-align:right}
.el-recommendation-meta span{display:block;color:var(--muted);font-size:.72rem}
.el-recommendation-meta strong{display:block;margin-top:4px;font-size:1.1rem}
.el-recommendation-instruction{grid-column:1/-1;margin-top:6px!important}
.el-planity-module{overflow:hidden;border-radius:28px;background:white;box-shadow:0 14px 36px rgba(31,24,15,.06)}
.el-planity-placeholder{padding:34px;text-align:center}
.el-planity-placeholder h3{margin:0;font-family:var(--serif);font-size:2rem;font-weight:500}
.el-planity-placeholder p{max-width:52ch;margin:12px auto 0;color:var(--muted);font-size:.9rem;line-height:1.6}
.el-planity-fallback{margin-top:18px;color:white;background:#17130f}
@media(max-width:1200px){.el-configurator{grid-template-columns:1fr}.el-stage{min-height:660px}#el-canvas{min-height:660px}.el-stage-note{max-width:100%}}
@media(max-width:740px){.el-config-shell{padding:8px;border-radius:28px}.el-configurator{gap:14px}.el-stage,.el-panel,.el-planity-section{border-radius:24px}.el-stage{min-height:530px}#el-canvas{min-height:530px}.el-stage-toolbar{top:14px;left:14px;right:14px;flex-direction:column;align-items:stretch}.config-toolbar-right{justify-content:space-between}.segmented{width:max-content;max-width:100%}.el-stage-footer{left:16px;right:16px;bottom:14px;flex-direction:column;align-items:flex-start}.el-stage-note{font-size:.72rem}.el-panel{padding:18px}.el-panel h3{font-size:1.8rem}.el-offer{padding:15px}.el-bundle-price{font-size:2.4rem}.el-item{grid-template-columns:22px 1fr;grid-template-areas:"check label" "check price"}.el-item input{grid-area:check}.el-item label{grid-area:label}.el-item-price{grid-area:price;padding-left:2px}.el-summary{padding:15px}.el-total-row{align-items:center}.el-live-total{font-size:2rem}.el-planity-section{padding:22px}.el-recommendation{grid-template-columns:1fr}.el-recommendation-meta{text-align:left}}


/* V4.3 — interaction directement sur le vrai maillage GLB */
.el-skin-hit{
  position:absolute;
  z-index:9;
  width:17px;
  height:17px;
  pointer-events:none;
  transform:translate(-50%,-50%) scale(.72);
  opacity:0;
  border:1px solid rgba(247,223,164,.95);
  border-radius:50%;
  box-shadow:
    0 0 0 5px rgba(198,151,69,.12),
    0 0 22px rgba(239,213,141,.36);
  transition:
    opacity .12s ease,
    transform .16s ease,
    box-shadow .16s ease;
}

.el-skin-hit::after{
  content:"";
  position:absolute;
  inset:4px;
  border-radius:50%;
  background:#efd58d;
  box-shadow:0 0 10px rgba(239,213,141,.7);
}

.el-skin-hit.is-visible{
  opacity:1;
  transform:translate(-50%,-50%) scale(1);
}

.el-skin-hit.is-selected{
  transform:translate(-50%,-50%) scale(1.55);
  box-shadow:
    0 0 0 9px rgba(198,151,69,.15),
    0 0 34px rgba(239,213,141,.7);
}

@media(max-width:740px){
  .el-skin-hit{
    width:22px;
    height:22px;
  }
}


/* ================================================================
   V4.5 — Tunnel Sélection → Récapitulatif → Réservation
   ================================================================ */

.el-flow-steps{
  display:grid;
  grid-template-columns:auto 1fr auto 1fr auto;
  align-items:center;
  gap:9px;
  padding:4px 2px 20px;
  margin-bottom:18px;
  border-bottom:1px solid rgba(255,255,255,.08);
}

.el-flow-step{
  display:flex;
  align-items:center;
  gap:7px;
  color:rgba(255,255,255,.34);
  transition:color .2s ease;
}

.el-flow-step span{
  width:24px;
  height:24px;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.13);
  border-radius:50%;
  font-size:.63rem;
  font-weight:850;
  transition:all .2s ease;
}

.el-flow-step small{
  font-size:.61rem;
  font-weight:780;
  letter-spacing:.03em;
}

.el-flow-steps>i{
  height:1px;
  min-width:14px;
  background:rgba(255,255,255,.09);
}

.el-flow-step.is-active{
  color:#f3d896;
}

.el-flow-step.is-active span{
  color:#1c150c;
  border-color:transparent;
  background:linear-gradient(135deg,var(--gold-light),var(--gold));
  box-shadow:0 0 0 4px rgba(198,151,69,.10);
}

.el-flow-step.is-done{
  color:rgba(255,255,255,.62);
}

.el-flow-step.is-done span{
  color:#f2d28d;
  border-color:rgba(198,151,69,.36);
  background:rgba(198,151,69,.09);
}

.el-flow-view[hidden]{
  display:none!important;
}

.el-selected-count{
  display:block;
  margin-top:4px;
  color:rgba(255,255,255,.68);
  font-size:.68rem;
  font-weight:650;
}

.el-primary-next{
  justify-content:space-between;
  padding-left:22px;
  padding-right:17px;
}

.el-button-arrow{
  width:30px;
  height:30px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:rgba(255,255,255,.26);
  font-size:1rem;
  transition:transform .2s ease;
}

.el-primary:hover .el-button-arrow{
  transform:translateX(3px);
}

.el-direct-link{
  min-height:42px;
  border-color:transparent;
  background:transparent;
  color:rgba(255,255,255,.55);
  font-size:.72rem;
}

.el-direct-link:hover{
  color:white;
  background:rgba(255,255,255,.035);
}

/* Review */
.el-review-view{
  animation:el-review-in .34s cubic-bezier(.2,.8,.2,1);
}

@keyframes el-review-in{
  from{opacity:0;transform:translateY(10px)}
  to{opacity:1;transform:none}
}

.el-review-head{
  padding:3px 0 18px;
}

.el-review-eyebrow{
  display:block;
  margin-bottom:9px;
  color:#f0d291;
  font-size:.63rem;
  font-weight:820;
  letter-spacing:.14em;
  text-transform:uppercase;
}

.el-review-head h3{
  margin:0;
  font-family:var(--serif);
  font-size:2.35rem;
  font-weight:500;
}

.el-review-head p{
  margin:9px 0 0;
  color:rgba(255,255,255,.52);
  font-size:.82rem;
  line-height:1.6;
}

.el-review-card{
  padding:20px;
  border:1px solid rgba(239,213,141,.16);
  border-radius:24px;
  background:
    radial-gradient(circle at 100% 0,rgba(239,213,141,.09),transparent 15rem),
    rgba(255,255,255,.045);
}

.el-review-profile{
  display:flex;
  align-items:center;
  gap:8px;
  color:rgba(255,255,255,.6);
  font-size:.77rem;
}

.el-review-profile strong{
  color:white;
  font-weight:780;
}

.el-review-dot{
  color:#c69745;
}

.el-review-mode{
  display:inline-flex;
  margin-top:14px;
  padding:7px 10px;
  border:1px solid rgba(255,255,255,.09);
  border-radius:999px;
  color:rgba(255,255,255,.65);
  background:rgba(255,255,255,.035);
  font-size:.64rem;
  font-weight:760;
}

.el-review-mode[data-mode="bundle"]{
  color:#f1d493;
  border-color:rgba(198,151,69,.28);
  background:rgba(198,151,69,.09);
}

.el-review-items{
  display:grid;
  gap:10px;
  margin-top:18px;
  padding:16px 0;
  border-top:1px solid rgba(255,255,255,.07);
  border-bottom:1px solid rgba(255,255,255,.07);
}

.el-review-item{
  display:grid;
  grid-template-columns:22px 1fr;
  align-items:center;
  gap:9px;
  color:rgba(255,255,255,.83);
  font-size:.82rem;
}

.el-review-check{
  width:20px;
  height:20px;
  display:grid;
  place-items:center;
  border-radius:50%;
  color:#1c150c;
  background:linear-gradient(135deg,#f3dda9,#c69745);
  font-size:.65rem;
  font-weight:900;
}

.el-review-total{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:14px;
  padding-top:18px;
}

.el-review-total span{
  color:rgba(255,255,255,.48);
  font-size:.72rem;
}

.el-review-total strong{
  font-family:var(--serif);
  font-size:2.55rem;
  font-weight:500;
  line-height:1;
}

.el-review-note{
  display:grid;
  grid-template-columns:30px 1fr;
  gap:11px;
  margin-top:15px;
  padding:14px;
  border-radius:18px;
  background:rgba(198,151,69,.07);
}

.el-review-note-icon{
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  border:1px solid rgba(198,151,69,.22);
  border-radius:50%;
  color:#efd38e;
  font-size:.7rem;
}

.el-review-note p{
  margin:0;
  color:rgba(255,255,255,.58);
  font-size:.72rem;
  line-height:1.55;
}

.el-review-actions{
  margin-top:16px;
}

.el-secure-note{
  margin:12px 0 0;
  text-align:center;
  color:rgba(255,255,255,.34);
  font-size:.63rem;
  letter-spacing:.02em;
}

/* Planity recommendation becomes the visual step 3 */
#expertise-laser-configurator[data-flow="3"] + .el-planity-section .el-recommendation{
  border-color:rgba(198,151,69,.36);
  box-shadow:0 14px 40px rgba(113,75,24,.08);
}

/* Mobile conversion bar */
.el-mobile-continue{
  display:none;
}

@media(max-width:740px){
  .el-flow-steps{
    gap:6px;
    padding-bottom:15px;
    margin-bottom:14px;
  }

  .el-flow-step{
    gap:5px;
  }

  .el-flow-step span{
    width:22px;
    height:22px;
  }

  .el-flow-step small{
    display:none;
  }

  .el-review-head h3{
    font-size:2rem;
  }

  .el-review-card{
    padding:17px;
  }

  .el-review-total strong{
    font-size:2.15rem;
  }

  .el-config-shell{
    padding-bottom:82px;
  }

  .el-mobile-continue{
    position:fixed;
    z-index:999;
    left:12px;
    right:12px;
    bottom:12px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:10px 10px 10px 15px;
    border:1px solid rgba(239,213,141,.20);
    border-radius:20px;
    background:rgba(18,14,10,.94);
    box-shadow:0 18px 45px rgba(0,0,0,.32);
    backdrop-filter:blur(18px);
  }

  .el-mobile-continue>div{
    min-width:0;
  }

  .el-mobile-continue small{
    display:block;
    max-width:42vw;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    color:rgba(255,255,255,.48);
    font-size:.61rem;
  }

  .el-mobile-continue strong{
    display:block;
    margin-top:1px;
    color:white;
    font-family:var(--serif);
    font-size:1.35rem;
    font-weight:500;
  }

  .el-mobile-continue button{
    flex:0 0 auto;
    min-height:46px;
    padding:0 17px;
    border:0;
    border-radius:999px;
    color:#1b140c;
    background:linear-gradient(135deg,var(--gold-light),var(--gold));
    font-size:.75rem;
    font-weight:850;
  }

  #expertise-laser-configurator[data-flow="2"] .el-mobile-continue,
  #expertise-laser-configurator[data-flow="3"] .el-mobile-continue{
    display:none;
  }
}


/* ==========================================================
   V4.6 — Planity marque blanche intégré / RDV cliente
   ========================================================== */

.el-planity-native-shell{
  overflow:hidden;
  border:1px solid rgba(198,151,69,.18);
  border-radius:28px;
  background:#f6f7f8;
  box-shadow:0 24px 70px rgba(0,0,0,.14);
}

.el-planity-native-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:14px 18px;
  color:#15120e;
  border-bottom:1px solid rgba(25,20,14,.08);
  background:rgba(255,255,255,.92);
}

.el-planity-native-top>div{
  display:flex;
  align-items:center;
  gap:9px;
}

.el-planity-native-top strong{
  font-size:.76rem;
  font-weight:850;
}

.el-planity-native-top>span{
  color:rgba(21,18,14,.44);
  font-size:.64rem;
  font-weight:720;
}

.el-planity-live-dot{
  width:8px;
  height:8px;
  display:inline-block;
  border-radius:50%;
  background:#63a66f;
  box-shadow:0 0 0 4px rgba(99,166,111,.12);
}

.el-planity-native-container{
  min-height:420px;
  color:#000;
  background:#f6f7f8;
}

/* Personnalisation du DOM Planity fournie par le module officiel */
#planitywl{
  background-color:#F6F7F8!important;
}

@media(min-width:768px){
  #planitywl h3{
    color:#191510!important;
  }
}

#planitywl .planity_bookappointment-button-choose,
#planitywl .planity-gift-voucher-button-choose{
  background:#191510!important;
  border-radius:999px!important;
}

.planity_ui_appointment_background>div:nth-child(2){
  padding:10px;
}

#planitywl>div:nth-child(2)>div:nth-child(2)>div>div>div>div>h2,
#planitywl>div:nth-child(2)>div:nth-child(2)>div>div>div>h2,
#planitywl>div:nth-child(2)>div:nth-child(2)>div>div>div:nth-child(2)>span{
  color:#191510!important;
}

.el-planity-native-fallback{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:12px 18px 14px;
  color:#191510;
  border-top:1px solid rgba(25,20,14,.08);
  background:#fff;
}

.el-planity-native-fallback p{
  margin:0;
  max-width:650px;
  color:rgba(25,20,14,.52);
  font-size:.69rem;
  line-height:1.45;
}

.el-planity-native-fallback a{
  flex:0 0 auto;
  padding:9px 14px;
  border-radius:999px;
  color:#fff;
  background:#191510;
  font-size:.66rem;
  font-weight:820;
  text-decoration:none;
}

@media(max-width:740px){
  .el-planity-native-shell{
    border-radius:20px;
  }

  .el-planity-native-container{
    min-height:520px;
  }

  .el-planity-native-fallback{
    align-items:flex-start;
    flex-direction:column;
  }

  .el-planity-native-fallback a{
    width:100%;
    text-align:center;
  }
}


/* ==========================================================
   V4.7 — PLANITY FOCUS
   Empêche le catalogue Planity de transformer la page en scroll infini.
   ========================================================== */

.el-planity-focusbar{
  position:relative;
  z-index:3;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:13px 18px;
  color:#191510;
  border-bottom:1px solid rgba(25,20,14,.08);
  background:#fff;
}

.el-planity-focusbar>div{
  min-width:0;
}

.el-planity-focusbar span{
  display:block;
  margin-bottom:2px;
  color:#a2732d;
  font-size:.57rem;
  font-weight:850;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.el-planity-focusbar strong{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:.74rem;
  font-weight:800;
}

.el-planity-focusbar button{
  flex:0 0 auto;
  min-height:36px;
  padding:0 13px;
  border:1px solid rgba(25,20,14,.12);
  border-radius:999px;
  color:#191510;
  background:#f6f4ef;
  cursor:pointer;
  font-size:.63rem;
  font-weight:790;
}

.el-planity-focusbar button:hover{
  background:#ede8de;
}

/* Le catalogue reste entièrement fonctionnel mais dans une fenêtre maîtrisée. */
.el-planity-native-container{
  position:relative;
  min-height:540px;
  height:min(68vh,720px);
  max-height:720px;
  overflow-x:hidden;
  overflow-y:auto;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
  background:#f6f7f8;
}

.el-planity-native-container::-webkit-scrollbar{
  width:10px;
}

.el-planity-native-container::-webkit-scrollbar-thumb{
  border:3px solid #f6f7f8;
  border-radius:999px;
  background:#c9c2b7;
}

@media(max-width:740px){
  .el-planity-focusbar{
    align-items:flex-start;
    flex-direction:column;
    gap:9px;
    padding:12px 14px;
  }

  .el-planity-focusbar strong{
    white-space:normal;
  }

  .el-planity-focusbar button{
    width:100%;
  }

  .el-planity-native-container{
    min-height:480px;
    height:66vh;
    max-height:640px;
  }
}


/* ==========================================================
   V4.8 — Parcours Planity stabilisé
   ========================================================== */

.el-planity-focus-copy{
  min-width:0;
}

.el-planity-focusbar small{
  display:block;
  margin-top:3px;
  max-width:650px;
  color:rgba(25,21,16,.47);
  font-size:.62rem;
  line-height:1.4;
}

.el-planity-native-shell.is-booking .el-planity-focusbar{
  background:
    linear-gradient(90deg,rgba(239,211,146,.17),rgba(255,255,255,.96) 42%);
}

.el-planity-native-shell.is-booking .el-planity-focusbar>div>span{
  color:#8c6224;
}

.el-planity-native-shell.is-booking .el-planity-native-container{
  height:min(74vh,760px);
  min-height:600px;
  scroll-behavior:auto;
}

.el-planity-native-shell.is-booking .el-planity-native-fallback{
  padding-top:10px;
  padding-bottom:10px;
}

/* Évite les animations de scroll imbriquées entre notre page et le widget. */
.el-planity-native-container{
  scroll-behavior:auto!important;
  overflow-anchor:none;
}

.el-planity-native-container #planitywl{
  overflow-anchor:none;
}

/* Le widget reste visuellement contenu pendant le choix du créneau. */
.el-planity-native-shell{
  scroll-margin-top:96px;
}

@media(max-width:740px){
  .el-planity-focusbar small{
    font-size:.61rem;
  }

  .el-planity-native-shell.is-booking .el-planity-native-container{
    height:72vh;
    min-height:540px;
    max-height:720px;
  }
}


/* ==========================================================
   V4.9 — Anti-doublon prestations Planity
   ========================================================== */

/* Les lignes déjà choisies sont retirées sans laisser d'espace vide. */
#planitywl [data-el-planity-duplicate="1"]{
  display:none!important;
}

/* L'état "Supprimer" reste clairement une action secondaire Planity. */
#planitywl a,
#planitywl button{
  -webkit-tap-highlight-color:transparent;
}


/* ==========================================================
   V5.0 — Fluidité Planity
   ========================================================== */

.el-planity-focusbar{
  transition:
    background-color .22s ease,
    border-color .22s ease;
}

.el-planity-focusbar strong,
.el-planity-focusbar small,
.el-planity-focusbar span{
  transition:
    color .18s ease,
    opacity .18s ease;
}

.el-planity-native-container{
  contain:layout paint;
}

/* Évite que le navigateur tente de compenser automatiquement la hauteur
   lorsque Planity remplace la liste par le calendrier. */
.el-planity-native-shell,
.el-planity-native-container,
#planitywl{
  overflow-anchor:none!important;
}

@media(prefers-reduced-motion:reduce){
  .el-planity-focusbar,
  .el-planity-focusbar strong,
  .el-planity-focusbar small,
  .el-planity-focusbar span{
    transition:none!important;
  }
}


/* ==========================================================
   V5.1 — Planity zéro mouvement
   ========================================================== */

.el-planity-stage{
  position:relative;
  min-height:inherit;
}

.el-planity-transition-mask{
  position:absolute;
  z-index:30;
  inset:0;
  display:grid;
  place-items:center;
  padding:24px;
  opacity:0;
  pointer-events:auto;
  background:
    linear-gradient(rgba(246,247,248,.94),rgba(246,247,248,.94));
  backdrop-filter:blur(5px);
  transition:opacity .12s ease;
}

.el-planity-transition-mask[hidden]{
  display:none!important;
}

.el-planity-transition-mask.is-visible{
  opacity:1;
}

.el-planity-transition-card{
  display:flex;
  align-items:center;
  gap:13px;
  min-width:min(360px,90%);
  padding:15px 17px;
  border:1px solid rgba(25,20,14,.08);
  border-radius:18px;
  color:#191510;
  background:#fff;
  box-shadow:0 14px 40px rgba(25,20,14,.08);
}

.el-planity-transition-card strong{
  display:block;
  font-size:.78rem;
  font-weight:850;
}

.el-planity-transition-card small{
  display:block;
  margin-top:3px;
  color:rgba(25,20,14,.5);
  font-size:.64rem;
}

.el-planity-transition-spinner{
  width:25px;
  height:25px;
  flex:0 0 auto;
  border:2px solid rgba(166,119,48,.18);
  border-top-color:#a67730;
  border-radius:50%;
  animation:el-planity-spin .72s linear infinite;
}

@keyframes el-planity-spin{
  to{transform:rotate(360deg)}
}

/* Aucun navigateur ne doit compenser les mutations Planity par un scroll. */
.el-planity-stage,
.el-planity-native-shell,
.el-planity-native-container,
#planitywl{
  overflow-anchor:none!important;
}

@media(prefers-reduced-motion:reduce){
  .el-planity-transition-mask{
    transition:none;
  }

  .el-planity-transition-spinner{
    animation:none;
  }
}


/* ==========================================================
   V5.3 — QA FINALE
   ========================================================== */

.segmented button:focus-visible,
.icon-button:focus-visible,
.el-primary:focus-visible,
.el-secondary:focus-visible,
.el-planity-focusbar button:focus-visible,
.el-mobile-continue button:focus-visible{
  outline:2px solid #f0cf84;
  outline-offset:3px;
}

.el-item input[type="radio"]{
  accent-color:#c69745;
}

@media(max-width:740px){
  /* Le thème possède sa propre barre d'actions mobile : le CTA du configurateur
     se place juste au-dessus au lieu d'être caché derrière. */
  body:has(.mobile-action-bar) .el-mobile-continue{
    bottom:80px;
    z-index:1190;
  }
}


/* ==========================================================
   V5.3.1 — EXPÉRIENCE CONFIGURATEUR MOBILE PREMIUM
   ========================================================== */

@media(max-width:740px){

  .el-config-shell{
    padding:7px;
    border-radius:24px;
    box-shadow:0 22px 60px rgba(12,9,6,.20);
  }

  .el-configurator{
    gap:10px;
    min-height:0;
  }

  .el-stage,
  .el-panel{
    border-radius:20px;
  }

  /* Zone 3D : on garde une vraie surface de manipulation
     sans imposer un écran interminable. */
  .el-stage{
    min-height:500px;
  }

  #el-canvas{
    min-height:500px;
  }

  .el-stage-toolbar{
    top:11px;
    left:11px;
    right:11px;
    gap:7px;
    align-items:center;
  }

  .segmented{
    width:100%;
    max-width:360px;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    margin-inline:auto;
  }

  .segmented button{
    min-height:44px;
    padding:0 12px;
    text-align:center;
    -webkit-tap-highlight-color:transparent;
  }

  .config-toolbar-right{
    width:100%;
    max-width:360px;
    justify-content:center;
    margin-inline:auto;
  }

  .config-toolbar-right .icon-button{
    min-height:44px;
    flex:1 1 0;
    justify-content:center;
    text-align:center;
    -webkit-tap-highlight-color:transparent;
  }

  .el-stage-footer{
    left:13px;
    right:13px;
    bottom:12px;
    align-items:center;
    gap:8px;
    text-align:center;
  }

  .el-stage-note{
    max-width:34ch;
    margin-inline:auto;
    text-align:center;
    font-size:.7rem;
    line-height:1.45;
  }

  .el-model-status{
    min-height:34px;
    margin-inline:auto;
    text-align:center;
  }

  /* Panneau de sélection */
  .el-panel{
    padding:20px 16px 17px;
    text-align:center;
  }

  .el-panel-topline{
    justify-content:center;
    flex-wrap:wrap;
    gap:8px;
    margin-bottom:12px;
    text-align:center;
  }

  .el-zone-label,
  .el-zone-badge{
    text-align:center;
  }

  .el-panel h3{
    max-width:13ch;
    margin-inline:auto;
    font-size:1.95rem;
    text-align:center;
    text-wrap:balance;
  }

  .el-panel-subtitle{
    max-width:34ch;
    margin:10px auto 18px;
    text-align:center;
    line-height:1.55;
  }

  .el-offer{
    padding:16px 13px;
    border-radius:18px;
    text-align:center;
  }

  .el-offer-kicker,
  .el-saving{
    text-align:center;
  }

  .el-offer-line{
    justify-content:center;
  }

  .el-items{
    gap:8px;
    margin-top:14px;
  }

  .el-item{
    grid-template-columns:24px 1fr 24px;
    grid-template-areas:
      "check label spacer"
      "check price spacer";
    gap:3px 7px;
    min-height:64px;
    padding:12px 10px;
    border-radius:16px;
  }

  .el-item::after{
    content:"";
    grid-area:spacer;
    width:24px;
  }

  .el-item input{
    grid-area:check;
    align-self:center;
    width:20px;
    height:20px;
  }

  .el-item label{
    grid-area:label;
    text-align:center;
    line-height:1.3;
  }

  .el-item-price{
    grid-area:price;
    padding-left:0;
    text-align:center;
  }

  .el-summary{
    padding:16px 13px;
    border-radius:18px;
    text-align:center;
  }

  .el-total-row{
    flex-direction:column;
    align-items:center;
    gap:5px;
    text-align:center;
  }

  .el-total-row small,
  .el-advice,
  .el-price-disclaimer{
    max-width:34ch;
    margin-left:auto;
    margin-right:auto;
    text-align:center;
  }

  .el-actions{
    gap:9px;
  }

  .el-primary,
  .el-secondary,
  .el-planity-fallback{
    width:100%;
    min-height:50px;
    justify-content:center;
    text-align:center;
    -webkit-tap-highlight-color:transparent;
  }

  /* Bloc Planity du configurateur */
  .el-planity-section{
    margin-top:16px;
    padding:20px 10px 12px;
    border-radius:20px;
  }

  .el-planity-heading{
    margin:0 auto 18px;
    text-align:center;
  }

  .el-planity-eyebrow{
    text-align:center;
  }

  .el-planity-heading h2{
    max-width:11ch;
    margin:8px auto 8px;
    font-size:clamp(2.15rem,10vw,3rem);
    text-align:center;
    text-wrap:balance;
  }

  .el-planity-heading p{
    max-width:35ch;
    margin-inline:auto;
    text-align:center;
    font-size:.88rem;
    line-height:1.58;
  }

  .el-recommendation{
    grid-template-columns:1fr;
    gap:10px;
    padding:16px 13px;
    border-radius:18px;
    text-align:center;
  }

  .el-recommendation h3,
  .el-recommendation p,
  .el-recommendation-meta{
    text-align:center;
  }

  .el-planity-native-shell{
    border-radius:17px;
  }

  .el-planity-native-top{
    flex-direction:column;
    justify-content:center;
    gap:5px;
    padding:13px 10px;
    text-align:center;
  }

  .el-planity-native-top>div{
    justify-content:center;
  }

  .el-planity-native-top>span,
  .el-planity-native-top strong{
    text-align:center;
  }

  .el-planity-focusbar{
    align-items:center;
    gap:9px;
    padding:13px 10px;
    text-align:center;
  }

  .el-planity-focus-copy,
  .el-planity-focusbar span,
  .el-planity-focusbar strong,
  .el-planity-focusbar small{
    width:100%;
    max-width:none;
    text-align:center;
  }

  .el-planity-focusbar button{
    width:100%;
    max-width:340px;
    min-height:44px;
    margin-inline:auto;
  }

  .el-planity-native-container{
    min-height:500px;
    height:68dvh;
    max-height:680px;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
  }

  .el-planity-native-shell.is-booking .el-planity-native-container{
    min-height:520px;
    height:72dvh;
    max-height:720px;
  }

  .el-planity-native-container #planitywl{
    max-width:100%;
    overflow-x:hidden;
  }

  #planitywl a,
  #planitywl button{
    min-height:44px;
    touch-action:manipulation;
  }

  .el-planity-native-fallback{
    align-items:center;
    padding:13px 12px;
    text-align:center;
  }

  .el-planity-native-fallback p{
    max-width:36ch;
    margin-inline:auto;
    text-align:center;
  }

  .el-planity-native-fallback a{
    min-height:46px;
    text-align:center;
  }

  .el-planity-transition-card{
    min-width:0;
    width:min(340px,92%);
    justify-content:center;
    padding:15px 14px;
    text-align:center;
  }

  .el-planity-transition-card strong,
  .el-planity-transition-card small{
    text-align:center;
  }

  /* Le bouton de continuation reste au-dessus de la barre fixe du thème. */
  .el-mobile-continue{
    left:8px;
    right:8px;
    bottom:calc(82px + env(safe-area-inset-bottom, 0px));
  }

  .el-mobile-continue button{
    min-height:50px;
    text-align:center;
  }

  :where(.el-config-shell button,.el-config-shell a){
    touch-action:manipulation;
  }
}

@media(max-width:390px){
  .el-stage,
  #el-canvas{
    min-height:470px;
  }

  .el-panel h3{
    font-size:1.78rem;
  }

  .el-bundle-price{
    font-size:2.25rem;
  }
}


/* ==========================================================
   V5.3.2 — CONFIGURATEUR MOBILE DÉGAGÉ
   Aucun bouton ne recouvre le modèle 3D.
   ========================================================== */

@media(max-width:740px){

  /* Le stage devient une vraie pile :
     commandes -> modèle -> indication.
     Plus aucun contrôle n'est posé PAR-DESSUS le corps. */
  .el-stage{
    display:flex;
    flex-direction:column;
    min-height:0;
    overflow:hidden;
  }

  .el-stage-toolbar{
    position:relative;
    z-index:7;
    top:auto;
    left:auto;
    right:auto;
    width:100%;
    display:grid;
    grid-template-columns:1fr;
    gap:8px;
    padding:11px 11px 8px;
    background:
      linear-gradient(
        180deg,
        rgba(18,14,10,.96),
        rgba(18,14,10,.72)
      );
  }

  .el-stage-toolbar>.segmented{
    width:100%;
    max-width:none;
    margin:0;
  }

  .config-toolbar-right{
    width:100%;
    max-width:none;
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:8px;
    margin:0;
  }

  .config-toolbar-right>.segmented{
    width:100%;
    max-width:none;
  }

  .config-toolbar-right .icon-button{
    min-width:104px;
    min-height:44px;
    padding:0 11px;
    white-space:nowrap;
  }

  /* Surface 3D totalement libre. */
  #el-canvas{
    position:relative;
    z-index:1;
    width:100%;
    height:450px!important;
    min-height:450px!important;
    flex:0 0 450px;
    display:block;
  }

  /* L'aide n'est plus superposée sur les pieds du modèle. */
  .el-stage-footer{
    position:relative;
    z-index:4;
    left:auto;
    right:auto;
    bottom:auto;
    width:100%;
    display:grid;
    grid-template-columns:1fr;
    justify-items:center;
    gap:7px;
    padding:9px 13px 13px;
    background:
      linear-gradient(
        0deg,
        rgba(18,14,10,.96),
        rgba(18,14,10,.70)
      );
  }

  .el-stage-note{
    max-width:34ch;
    margin:0 auto;
    text-align:center;
  }

  .el-model-status{
    min-height:32px;
    margin:0 auto;
  }

  .el-stage::after{
    bottom:52px;
  }

  /* Ce dock était le principal élément qui cachait le configurateur.
     Le bouton Continuer existe déjà dans le panneau, donc aucun doublon. */
  .el-mobile-continue,
  #expertise-laser-configurator[data-flow="1"] .el-mobile-continue{
    display:none!important;
  }

  /* On retire l'espace qui était réservé au dock fixe. */
  .el-config-shell{
    padding-bottom:7px;
  }

  /* Panneau sous le modèle : positionnement 100% normal dans le flux. */
  .el-panel{
    position:relative;
    z-index:2;
    width:100%;
    min-width:0;
    margin:0;
  }

  .el-panel-topline{
    display:flex;
    justify-content:center;
  }

  .el-panel-topline>*{
    flex:0 1 auto;
  }

  .el-actions{
    width:100%;
    max-width:390px;
    margin-left:auto;
    margin-right:auto;
  }

  .el-primary,
  .el-secondary{
    position:relative!important;
    left:auto!important;
    right:auto!important;
    top:auto!important;
    bottom:auto!important;
    transform:none;
  }

  /* Checkboxes : le label reste au centre sans pousser le tarif. */
  .el-item{
    grid-template-columns:26px minmax(0,1fr) 26px;
  }

  .el-item label,
  .el-item-price{
    min-width:0;
  }

  /* Planity ne peut pas passer sous une barre fixe du plugin. */
  .el-planity-section{
    position:relative;
    z-index:1;
    margin-bottom:18px;
  }
}

@media(max-width:390px){
  #el-canvas{
    height:410px!important;
    min-height:410px!important;
    flex-basis:410px;
  }

  .config-toolbar-right{
    grid-template-columns:1fr;
  }

  .config-toolbar-right .icon-button{
    width:100%;
  }

  .el-stage-toolbar{
    padding:9px;
  }
}


/* ==========================================================
   V5.3.3 — PLANITY MOBILE COMPACT
   Réduction du grand vide avant la vraie étape de réservation.
   ========================================================== */

@media(max-width:740px){
  .el-planity-native-shell:not(.is-booking) .el-planity-native-container{
    min-height:220px;
    height:auto;
    max-height:none;
  }

  .el-planity-stage{
    min-height:0;
  }

  .el-planity-native-container:empty{
    min-height:180px;
  }
}

@media(max-width:390px){
  .el-planity-native-shell:not(.is-booking) .el-planity-native-container{
    min-height:180px;
  }
}
