/* ============================================================
   Simulateurs — interface v2 (parquet, terrasse, panneaux)
   Chargée après core.css : ses composants réutilisés (sélecteurs en
   vignettes, pastilles de stock, modale client) sont re-teintés par les
   jetons ci-dessous.

   Toutes les règles sont préfixées par .mdn-calc.mdn2 (0,2,0) : elles
   passent devant le noyau (.mdn-calc input… = 0,2,1 au plus avec une classe
   en plus), le kit Elementor (.elementor-kit-XXX button/h1 = 0,1,1) et le
   reset du thème (button:hover = 0,1,1).
   ============================================================ */

.mdn-calc.mdn2 {
  --paper:     #F8F8F8;
  --surface:   #FFFFFF;
  --white:     #ffffff;
  --ink:       #1F2722;
  --ink-2:     #46514B;
  --muted:     #66706A;
  --muted-2:   #7A847E;
  --line:      #E0E0E0;
  --line-2:    #CBD1CD;
  --line-3:    #EDEDED;
  --sand:      #EEF2EF;
  --sand-2:    #F1F5F2;
  --acc:       #005D4B;
  --acc-dark:  #003C30;
  --acc-soft:  #E8F1EC;
  --acc-done:  #8FB5A9;
  --warn:      #C2571A;
  /* Jetons du noyau, re-teintés pour ses composants réutilisés. */
  --brand:     var(--acc);
  --brand-dark: var(--acc-dark);
  --accent:    var(--acc);
  --accent-soft: var(--sand);
  --wood:      var(--acc);
  --wood-deep: var(--ink);
  --wood-soft: var(--sand);
  --ok:        var(--acc);

  font-family: Figtree, system-ui, -apple-system, sans-serif;
  color: var(--ink);
  background: var(--paper);
  line-height: 1.45;
  padding: 24px 0 72px;
}
.mdn-calc.mdn2 button { font-family: inherit; }
.mdn-calc.mdn2 .mdn2-inner { max-width: 1280px; margin: 0 auto; padding-inline: clamp(16px, 3vw, 32px); }

/* ---- En-tête ---- */
.mdn-calc.mdn2 .mdn2-back { font-size: 14px; color: var(--muted); text-decoration: none; }
.mdn-calc.mdn2 .mdn2-back:hover { color: var(--ink); }
@media print { .mdn-calc.mdn2 .mdn2-back { display: none; } }
.mdn-calc.mdn2 .mdn2-head { margin: 18px 0 28px; max-width: 780px; }
.mdn-calc.mdn2 h1,
.mdn-calc.mdn2 h2 {
  font-family: Newsreader, Georgia, serif; font-weight: 400; color: var(--ink);
  letter-spacing: -.02em; text-transform: none; margin: 0;
}
.mdn-calc.mdn2 h1 { font-size: clamp(32px, 4.4vw, 46px); line-height: 1.05; margin-bottom: 12px; }
.mdn-calc.mdn2 h2 { font-size: 30px; line-height: 1.15; letter-spacing: -.01em; margin-bottom: 6px; }
.mdn-calc.mdn2 h3 { font-family: inherit; font-size: 15px; font-weight: 600; color: var(--ink); line-height: 1.3; margin: 0; }
.mdn-calc.mdn2 .mdn2-head p { font-size: 16px; line-height: 1.55; color: var(--ink-2); margin: 0; text-wrap: pretty; }

/* ---- Étapes ---- */
.mdn-calc.mdn2 .mdn2-steps {
  list-style: none; margin: 0 0 28px; padding: 0;
  display: grid; grid-template-columns: repeat(var(--mdn2-steps, 5), minmax(0, 1fr)); gap: 6px;
}
.mdn-calc.mdn2 .mdn2-steps li { display: flex; margin: 0; padding: 0; }
.mdn-calc.mdn2 .mdn2-step,
.mdn-calc.mdn2 .mdn2-step:hover,
.mdn-calc.mdn2 .mdn2-step:focus {
  flex: 1; display: flex; align-items: center; gap: 10px; min-width: 0;
  padding: 12px 14px; margin: 0; border: 0; border-top: 3px solid var(--line); border-radius: 0;
  background: transparent; box-shadow: none; cursor: pointer; text-align: left;
  font: inherit; color: var(--muted-2); text-transform: none; letter-spacing: normal;
}
.mdn-calc.mdn2 .mdn2-step-dot {
  width: 24px; height: 24px; flex: none; border-radius: 50%; display: grid; place-items: center;
  font-size: 12px; font-weight: 700; background: #E6E9E7; color: var(--muted-2);
}
.mdn-calc.mdn2 .mdn2-step-label { font-size: 14px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mdn-calc.mdn2 .mdn2-step.is-current { border-top-color: var(--acc); color: var(--ink); }
.mdn-calc.mdn2 .mdn2-step.is-current .mdn2-step-dot { background: var(--acc); color: #fff; }
.mdn-calc.mdn2 .mdn2-step.is-done { border-top-color: var(--acc-done); color: var(--ink); }
.mdn-calc.mdn2 .mdn2-step.is-done .mdn2-step-dot { background: var(--acc-soft); color: var(--acc); }
.mdn-calc.mdn2 .mdn2-step.is-locked { cursor: not-allowed; }
.mdn-calc.mdn2 .mdn2-step:focus-visible { outline: 2px solid var(--acc); outline-offset: 2px; }

/* ---- Mise en page ---- */
.mdn-calc.mdn2 .mdn2-layout { display: flex; flex-wrap: wrap; gap: 32px; align-items: flex-start; }
.mdn-calc.mdn2 .mdn2-main {
  flex: 1 1 480px; min-width: 0; background: var(--surface); border: 1px solid var(--line);
  border-radius: 14px; padding: 32px; display: flex; flex-direction: column; gap: 28px;
  /* Le contenu des étapes s'adapte à la largeur du panneau, pas à celle de
     l'écran : la colonne de droite lui en prend une part variable. */
  container: mdn2main / inline-size;
}
.mdn-calc.mdn2 .mdn2-panel { display: flex; flex-direction: column; gap: 20px; min-width: 0; }
.mdn-calc.mdn2 .mdn2-aside {
  flex: 0 1 360px; min-width: 300px;
  display: flex; flex-direction: column; gap: 16px;
}
/* Colonne collante sous l'en-tête fixe du thème (~190 px), seulement quand
   l'écran est assez haut pour la montrer en entier. */
@media (min-width: 961px) and (min-height: 1000px) {
  .mdn-calc.mdn2 .mdn2-aside { position: sticky; top: 210px; }
}

/* ---- Titres de section, textes ---- */
.mdn-calc.mdn2 .mdn2-sec-head p { margin: 0; color: var(--muted); font-size: 15px; }
.mdn-calc.mdn2 .mdn2-sec-head--row { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; flex-wrap: wrap; }
.mdn-calc.mdn2 .mdn2-muted { font-size: 13px; color: var(--muted); }
.mdn-calc.mdn2 .mdn2-hint { display: block; font-size: 12px; color: var(--muted-2); margin-top: 6px; }
.mdn-calc.mdn2 .mdn2-note { font-size: 13px; color: var(--muted); margin-top: -6px; }
.mdn-calc.mdn2 .mdn2-lbl { font-size: 13px; color: var(--muted); margin-bottom: 8px; }
.mdn-calc.mdn2 .mdn2-eyebrow { font-size: 12px; color: var(--muted-2); text-transform: uppercase; letter-spacing: .06em; }
.mdn-calc.mdn2 .mdn2-stack { display: flex; flex-direction: column; gap: 12px; }

/* ---- Champs ---- */
.mdn-calc.mdn2 .mdn2-fld { display: flex; flex-direction: column; gap: 6px; font-size: 13px; color: var(--muted); min-width: 0; margin: 0; }
.mdn-calc.mdn2 .mdn2-fld-note { font-size: 13px; color: var(--ink-2); padding: 11px 0; }
.mdn-calc.mdn2 input.mdn2-in,
.mdn-calc.mdn2 select.mdn2-in {
  font: inherit; font-size: 16px; color: var(--ink); height: 44px; width: 100%; min-width: 0;
  padding: 0 12px; border: 1px solid var(--line-2); border-radius: 8px; background: var(--white);
  box-shadow: none; margin: 0;
}
.mdn-calc.mdn2 input.mdn2-num { font-variant-numeric: tabular-nums; }
.mdn-calc.mdn2 input.mdn2-in:focus,
.mdn-calc.mdn2 select.mdn2-in:focus { outline: 2px solid var(--acc); outline-offset: -1px; border-color: var(--line-2); box-shadow: none; }
.mdn-calc.mdn2 .mdn2-check { display: flex; gap: 8px; align-items: center; font-size: 13px; color: var(--ink-2); cursor: pointer; margin: 2px 0 8px; }
.mdn-calc.mdn2 .mdn2-check input { width: 16px; height: 16px; margin: 0; accent-color: var(--acc); flex: none; }
.mdn-calc.mdn2 .mdn2-check a { color: var(--acc); text-decoration: underline; text-underline-offset: 2px; }

/* ---- Boutons ---- */
.mdn-calc.mdn2 .mdn2-btn-dashed,
.mdn-calc.mdn2 .mdn2-btn-dashed:focus {
  font: inherit; font-size: 15px; font-weight: 600; padding: 12px 18px; margin: 0;
  border: 1px dashed #A9B3AD; border-radius: 10px; background: transparent; color: var(--ink); cursor: pointer; box-shadow: none;
}
.mdn-calc.mdn2 .mdn2-btn-dashed:hover { background: var(--sand); color: var(--ink); border-color: #A9B3AD; }
.mdn-calc.mdn2 .mdn2-link,
.mdn-calc.mdn2 .mdn2-link:hover,
.mdn-calc.mdn2 .mdn2-link:focus {
  align-self: flex-start; font: inherit; font-size: 13px; border: 0; background: transparent; color: var(--acc);
  cursor: pointer; padding: 0; margin: 0; text-decoration: underline; text-underline-offset: 2px; box-shadow: none; text-align: left;
}
.mdn-calc.mdn2 .mdn2-link:hover { color: var(--ink); }
.mdn-calc.mdn2 .mdn2-link--tight { margin-top: -8px; }
.mdn-calc.mdn2 .mdn2-link-muted,
.mdn-calc.mdn2 .mdn2-link-muted:hover,
.mdn-calc.mdn2 .mdn2-link-muted:focus {
  font: inherit; font-size: 14px; border: 0; background: transparent; color: var(--muted); cursor: pointer;
  padding: 12px 10px; margin: 0; box-shadow: none;
}
.mdn-calc.mdn2 .mdn2-link-muted:hover { color: var(--ink); }
.mdn-calc.mdn2 .mdn2-room-end .mdn2-link-muted { font-size: 13px; padding: 0; color: var(--muted-2); }
.mdn-calc.mdn2 .mdn2-room-end .mdn2-link-muted:hover { color: #a33b2b; }
.mdn-calc.mdn2 .mdn2-btn-outline,
.mdn-calc.mdn2 .mdn2-btn-outline:focus {
  font: inherit; font-size: 14px; font-weight: 600; padding: 10px 16px; margin: 0;
  border: 1px solid var(--ink); border-radius: 8px; background: transparent; color: var(--ink); cursor: pointer; box-shadow: none; white-space: nowrap;
}
.mdn-calc.mdn2 .mdn2-btn-outline:hover { background: var(--sand); color: var(--ink); border-color: var(--ink); }
.mdn-calc.mdn2 .mdn2-btn-dark,
.mdn-calc.mdn2 .mdn2-btn-dark:hover,
.mdn-calc.mdn2 .mdn2-btn-dark:focus {
  font: inherit; font-size: 14px; font-weight: 600; padding: 10px 16px; margin: 0;
  border: 0; border-radius: 8px; background: var(--ink); color: #fff; cursor: pointer; box-shadow: none; white-space: nowrap;
}
.mdn-calc.mdn2 .mdn2-btn-dark:hover { background: #2C3630; }
.mdn-calc.mdn2 .mdn2-btn-green,
.mdn-calc.mdn2 .mdn2-btn-green:focus {
  font: inherit; font-size: 15px; font-weight: 600; padding: 14px 24px; margin: 0;
  border: 0; border-radius: 10px; background: var(--acc); color: #fff; cursor: pointer; box-shadow: none;
}
.mdn-calc.mdn2 .mdn2-btn-green:hover { background: var(--acc-dark); color: #fff; }
.mdn-calc.mdn2 .mdn2-btn-lg { font-size: 15px; padding: 13px 20px; border-radius: 10px; }
.mdn-calc.mdn2 .mdn2-btn-text,
.mdn-calc.mdn2 .mdn2-btn-text:hover,
.mdn-calc.mdn2 .mdn2-btn-text:focus {
  font: inherit; font-size: 14px; font-weight: 500; padding: 13px 16px; margin: 0;
  border: 0; background: transparent; color: var(--ink-2); cursor: pointer; box-shadow: none;
}
.mdn-calc.mdn2 .mdn2-btn-text:hover { color: var(--ink); }
.mdn-calc.mdn2 button:disabled { cursor: not-allowed; opacity: .55; }

/* ---- Navigation bas de panneau ---- */
.mdn-calc.mdn2 .mdn2-nav {
  display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap;
  padding-top: 24px; border-top: 1px solid var(--line-3);
}
.mdn-calc.mdn2 .mdn2-spacer { flex: 1; }
.mdn-calc.mdn2 .mdn2-prev,
.mdn-calc.mdn2 .mdn2-prev:hover,
.mdn-calc.mdn2 .mdn2-prev:focus {
  font: inherit; font-size: 15px; font-weight: 500; padding: 12px 18px 12px 0; margin: 0;
  border: 0; background: transparent; color: var(--ink-2); cursor: pointer; box-shadow: none;
}
.mdn-calc.mdn2 .mdn2-prev:hover { color: var(--ink); }
.mdn-calc.mdn2 .mdn2-block { font-size: 13px; color: var(--warn); }
.mdn-calc.mdn2 .mdn2-next,
.mdn-calc.mdn2 .mdn2-next:hover,
.mdn-calc.mdn2 .mdn2-next:focus {
  font: inherit; font-size: 15px; font-weight: 600; padding: 14px 24px; margin: 0;
  border: 0; border-radius: 10px; background: var(--ink); color: #fff; cursor: pointer; box-shadow: none;
}
.mdn-calc.mdn2 .mdn2-next:hover { background: #2C3630; }
.mdn-calc.mdn2 .mdn2-next.is-blocked { background: #A7B0AB; cursor: not-allowed; }
.mdn-calc.mdn2 .mdn2-cta { display: flex; gap: 10px; flex-wrap: wrap; justify-content: flex-end; }
/* Boutons finaux (PDF, devis, panier) et ceux de la modale client : sans
   animation. Le thème parent (hello-elementor) pose `transition: all .3s` sur
   tous les <button>, d'où le fondu au survol et au changement de libellé. */
.mdn-calc.mdn2 .mdn2-cta button,
.mdn-calc.mdn2 .mdn2-cta button:hover,
.mdn-calc.mdn2 .mdn2-cta button:focus,
.mdn-calc.mdn2 .mdn-modal .mdn-btn,
.mdn-calc.mdn2 .mdn-modal .mdn-btn:hover { transition: none; }

/* ---- Cartes pièce (communes aux étapes) ---- */
.mdn-calc.mdn2 .mdn2-room {
  border: 2px solid var(--line); border-radius: 12px; padding: 16px 18px; background: var(--white);
  display: flex; flex-direction: column; gap: 14px; min-width: 0;
}
.mdn-calc.mdn2 .mdn2-room.is-sel { border-color: var(--acc); }
.mdn-calc.mdn2 .mdn2-room--plain { border-width: 1px; }
.mdn-calc.mdn2 .mdn2-room-top { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.mdn-calc.mdn2 .mdn2-room-name { font-size: 16px; font-weight: 600; }

/* Étape 1 : une ligne par pièce. */
.mdn-calc.mdn2 .mdn2-room-grid {
  display: grid; grid-template-columns: minmax(0, 1.6fr) repeat(2, minmax(0, 1fr)) auto auto;
  gap: 16px; align-items: end;
}
.mdn-calc.mdn2 .mdn2-room-grid .mdn2-fld-span { grid-column: span 2; }
.mdn-calc.mdn2 .mdn2-room-end { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; min-width: 88px; }
.mdn-calc.mdn2 .mdn2-room-area { font-size: 18px; font-weight: 600; font-variant-numeric: tabular-nums; padding: 10px 0; white-space: nowrap; }
.mdn-calc.mdn2 .mdn2-more,
.mdn-calc.mdn2 .mdn2-more:hover,
.mdn-calc.mdn2 .mdn2-more:focus {
  align-self: flex-start; font: inherit; font-size: 13px; color: var(--muted); background: transparent;
  border: 0; padding: 0; margin: -4px 0 0; cursor: pointer; box-shadow: none;
}
.mdn-calc.mdn2 .mdn2-more:hover { color: var(--ink); }
.mdn-calc.mdn2 .mdn2-adv {
  display: flex; flex-direction: column; gap: 12px; padding: 14px; border-radius: 10px; background: var(--sand-2);
}
.mdn-calc.mdn2 .mdn2-fld-shape { max-width: 240px; }
.mdn-calc.mdn2 .mdn2-sub-h { font-size: 13px; color: var(--muted); margin-bottom: 8px; }
.mdn-calc.mdn2 .mdn2-adv .mdn-zded-h { font-size: 13px; font-weight: 400; text-transform: none; letter-spacing: 0; color: var(--muted); }
.mdn-calc.mdn2 .mdn2-adv .mdn-field label { color: var(--muted); }
.mdn-calc.mdn2 .mdn2-adv input[type="number"],
.mdn-calc.mdn2 .mdn2-adv input[type="text"],
.mdn-calc.mdn2 .mdn2-adv .mdn-seg select { background: var(--white); border-color: var(--line-2); border-radius: 8px; }
.mdn-calc.mdn2 .mdn2-adv .mdn-add,
.mdn-calc.mdn2 .mdn2-adv .mdn-add:hover { background: transparent; border: 1px dashed #A9B3AD; color: var(--ink); border-radius: 8px; }
.mdn-calc.mdn2 .mdn2-adv .mdn-add:hover { background: var(--white); }
.mdn-calc.mdn2 .mdn2-adv .mdn-icon-btn { background: var(--white); color: var(--muted); }
.mdn-calc.mdn2 .mdn2-actions-row { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; }

/* Compteur − n + */
.mdn-calc.mdn2 .mdn2-stepper {
  display: flex; align-items: center; justify-content: space-between; width: 112px; height: 44px;
  border: 1px solid var(--line-2); border-radius: 8px; background: var(--white);
}
.mdn-calc.mdn2 .mdn2-stepper-btn,
.mdn-calc.mdn2 .mdn2-stepper-btn:hover,
.mdn-calc.mdn2 .mdn2-stepper-btn:focus {
  width: 36px; height: 100%; margin: 0; padding: 0; border: 0; border-radius: 8px; background: transparent;
  font: inherit; font-size: 18px; line-height: 1; color: var(--ink); cursor: pointer; box-shadow: none;
}
.mdn-calc.mdn2 .mdn2-stepper-btn:hover { background: var(--sand); }
/* Valeur saisissable : champ sans cadre, le cadre est celui du compteur. */
.mdn-calc.mdn2 input.mdn2-stepper-v,
.mdn-calc.mdn2 input.mdn2-stepper-v:focus {
  flex: 1; min-width: 0; width: 36px; height: 100%; margin: 0; padding: 0;
  border: 0; border-radius: 0; background: transparent; box-shadow: none;
  font: inherit; font-size: 16px; line-height: 1; text-align: center; color: var(--ink);
  font-variant-numeric: tabular-nums; -moz-appearance: textfield;
}
.mdn-calc.mdn2 input.mdn2-stepper-v:focus { outline: none; background: var(--sand-2); }
.mdn-calc.mdn2 .mdn2-stepper:focus-within { border-color: var(--acc); box-shadow: 0 0 0 2px rgba(0,93,75,.14); }

/* Étape 2 : motifs, sens, mode. */
.mdn-calc.mdn2 .mdn2-motifs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.mdn-calc.mdn2 .mdn2-motif,
.mdn-calc.mdn2 .mdn2-motif:hover,
.mdn-calc.mdn2 .mdn2-motif:focus {
  font: inherit; padding: 0; margin: 0; border: 2px solid var(--line); border-radius: 8px; background: var(--white);
  cursor: pointer; overflow: hidden; display: flex; flex-direction: column; box-shadow: none; text-align: left; color: var(--muted);
}
.mdn-calc.mdn2 .mdn2-motif:hover { border-color: var(--line-2); }
.mdn-calc.mdn2 .mdn2-motif.is-on { border-color: var(--acc); color: var(--ink); }
.mdn-calc.mdn2 .mdn2-motif-img { display: block; height: 56px; background: #EBEEEC; overflow: hidden; }
.mdn-calc.mdn2 .mdn2-motif-img svg { display: block; width: 100%; height: 100%; }
.mdn-calc.mdn2 .mdn2-motif-lbl { padding: 7px 8px; font-size: 13px; font-weight: 600; line-height: 1.25; }
.mdn-calc.mdn2 .mdn2-two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; align-items: start; }
.mdn-calc.mdn2 .mdn2-seg { display: flex; gap: 6px; }
.mdn-calc.mdn2 .mdn2-seg button,
.mdn-calc.mdn2 .mdn2-seg button:hover,
.mdn-calc.mdn2 .mdn2-seg button:focus {
  flex: 1; font: inherit; font-size: 13px; font-weight: 500; padding: 9px 10px; margin: 0; border-radius: 8px;
  border: 1px solid var(--line-2); background: var(--white); color: var(--ink); cursor: pointer; box-shadow: none; line-height: 1.3;
}
.mdn-calc.mdn2 .mdn2-seg button:hover { border-color: #A9B3AD; }
.mdn-calc.mdn2 .mdn2-seg button.is-on { background: var(--ink); border-color: var(--ink); color: #fff; }
.mdn-calc.mdn2 .mdn2-locked { padding: 9px 12px; border-radius: 8px; background: var(--sand-2); font-size: 13px; color: var(--ink-2); }

/* Contrôle segmenté « pilule » (fixation des plinthes). */
.mdn-calc.mdn2 .mdn2-segtab { display: flex; gap: 4px; padding: 3px; background: var(--sand); border-radius: 9px; }
.mdn-calc.mdn2 .mdn2-segtab button,
.mdn-calc.mdn2 .mdn2-segtab button:hover,
.mdn-calc.mdn2 .mdn2-segtab button:focus {
  flex: 1; font: inherit; font-size: 13px; font-weight: 500; padding: 7px 6px; margin: 0; border: 0; border-radius: 7px;
  background: transparent; color: var(--muted); cursor: pointer; box-shadow: none;
}
.mdn-calc.mdn2 .mdn2-segtab button:hover { color: var(--ink); }
.mdn-calc.mdn2 .mdn2-segtab button.is-on { background: var(--white); color: var(--ink); box-shadow: 0 1px 2px rgba(31,39,34,.12); }

/* Pastilles (filtres, onglets de pièce). */
.mdn-calc.mdn2 .mdn2-chips { display: flex; gap: 6px; flex-wrap: wrap; }
.mdn-calc.mdn2 .mdn2-chips[hidden] { display: none; }
.mdn-calc.mdn2 .mdn2-chip,
.mdn-calc.mdn2 .mdn2-chip:hover,
.mdn-calc.mdn2 .mdn2-chip:focus {
  font: inherit; font-size: 13px; font-weight: 500; padding: 7px 12px; margin: 0; border-radius: 999px;
  border: 1px solid var(--line-2); background: var(--white); color: var(--ink); cursor: pointer; box-shadow: none; line-height: 1.2;
}
.mdn-calc.mdn2 .mdn2-chip:hover { border-color: #A9B3AD; }
.mdn-calc.mdn2 .mdn2-chip.is-on { background: var(--ink); border-color: var(--ink); color: #fff; }
.mdn-calc.mdn2 .mdn2-aside .mdn2-chip { padding: 6px 11px; }

/* Étape 3 : pièces, sélection, filtres, cartes produit. */
.mdn-calc.mdn2 .mdn2-tabs { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 10px; }
.mdn-calc.mdn2 .mdn2-tab,
.mdn-calc.mdn2 .mdn2-tab:hover,
.mdn-calc.mdn2 .mdn2-tab:focus {
  font: inherit; text-align: left; padding: 12px 14px; margin: 0; border: 2px solid var(--line); border-radius: 10px;
  background: #F6F8F7; cursor: pointer; display: flex; flex-direction: column; gap: 3px; box-shadow: none; color: var(--ink); min-width: 0;
}
.mdn-calc.mdn2 .mdn2-tab.is-on { border-color: var(--acc); background: var(--white); }
.mdn-calc.mdn2 .mdn2-tab-name { font-size: 14px; font-weight: 600; }
.mdn-calc.mdn2 .mdn2-tab-sub { font-size: 12px; color: var(--muted); }
.mdn-calc.mdn2 .mdn2-tab-status { font-size: 12px; font-weight: 600; color: var(--warn); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mdn-calc.mdn2 .mdn2-tab-status.is-ok { color: var(--acc); }

.mdn-calc.mdn2 .mdn2-selected {
  display: flex; flex-direction: column; gap: 10px; padding: 10px 14px; border-radius: 10px;
  background: var(--sand-2); border: 1px solid var(--line);
}
.mdn-calc.mdn2 .mdn2-selected-head { display: flex; gap: 12px; align-items: center; }
.mdn-calc.mdn2 .mdn2-selected-head .mdn-pick-thumb { width: 44px; height: 44px; border-radius: 8px; }
.mdn-calc.mdn2 .mdn2-selected-txt { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.mdn-calc.mdn2 .mdn2-selected-txt .mdn2-eyebrow { font-size: 11px; }
.mdn-calc.mdn2 .mdn2-selected-txt strong { font-size: 14px; font-weight: 600; line-height: 1.3; }
/* Prix et disponibilité sur une seule ligne. */
.mdn-calc.mdn2 .mdn2-selected-line { display: flex; align-items: center; gap: 4px 10px; flex-wrap: wrap; }
.mdn-calc.mdn2 .mdn2-selected-line .mdn2-muted { font-size: 12px; }
.mdn-calc.mdn2 .mdn2-selected-line .mdn-stock-wrap { flex-direction: row; align-items: center; gap: 6px; margin: 0; }
.mdn-calc.mdn2 .mdn2-fiche { margin: 0; font-size: 13px; font-weight: 600; color: var(--acc); white-space: nowrap; }
.mdn-calc.mdn2 .mdn2-selected .mdn2-lbl { margin: 0 0 -4px; }

.mdn-calc.mdn2 .mdn2-filters { display: flex; flex-direction: column; gap: 10px; }
.mdn-calc.mdn2 .mdn2-filters:empty { display: none; }
.mdn-calc.mdn2 .mdn2-filter { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.mdn-calc.mdn2 .mdn2-filter-lbl { font-size: 13px; color: var(--muted); width: 78px; flex: none; }
.mdn-calc.mdn2 .mdn2-chip-list { display: flex; flex-wrap: wrap; gap: 8px; flex: 1 1 0; min-width: 0; }
.mdn-calc.mdn2 .mdn2-more-chips { margin-left: 86px; }
.mdn-calc.mdn2 .mdn2-more-chips[hidden] { display: none; }
.mdn-calc.mdn2 input.mdn2-search { flex: 1 1 220px; max-width: 360px; height: 38px; font-size: 14px; border-radius: 999px; padding: 0 14px; }

.mdn-calc.mdn2 .mdn2-prods { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 14px; }
.mdn-calc.mdn2 .mdn2-prod,
.mdn-calc.mdn2 .mdn2-prod:hover,
.mdn-calc.mdn2 .mdn2-prod:focus {
  font: inherit; text-align: left; padding: 0; margin: 0; border: 2px solid var(--line); border-radius: 12px;
  background: var(--white); cursor: pointer; overflow: hidden; display: flex; flex-direction: column;
  box-shadow: none; color: var(--ink); white-space: normal; min-width: 0;
  transition: border-color .15s, box-shadow .15s, transform .12s;
}
.mdn-calc.mdn2 .mdn2-prod:hover { border-color: var(--line-2); box-shadow: 0 6px 18px rgba(31,39,34,.08); transform: translateY(-2px); }
.mdn-calc.mdn2 .mdn2-prod.is-sel { border-color: var(--acc); }
.mdn-calc.mdn2 .mdn2-prod.is-oos { opacity: .55; cursor: not-allowed; transform: none; box-shadow: none; }
.mdn-calc.mdn2 .mdn2-prod-img { display: block; position: relative; aspect-ratio: 4 / 3; background: #EBEEEC; overflow: hidden; }
.mdn-calc.mdn2 .mdn2-prod-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.mdn-calc.mdn2 .mdn2-pill {
  position: absolute; top: 8px; right: 8px; background: var(--acc); color: #fff;
  font-size: 12px; font-weight: 600; padding: 4px 9px; border-radius: 999px;
}
.mdn-calc.mdn2 .mdn2-prod-body { padding: 10px 12px 10px; display: flex; flex-direction: column; gap: 4px; flex: 1; }
.mdn-calc.mdn2 .mdn2-prod-name { font-size: 15px; font-weight: 600; line-height: 1.3; overflow-wrap: anywhere; }
.mdn-calc.mdn2 .mdn2-prod-spec { font-size: 13px; color: var(--muted); }
.mdn-calc.mdn2 .mdn2-prod-foot { margin-top: 4px; padding-top: 0; display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; flex-wrap: wrap; }
.mdn-calc.mdn2 .mdn2-prod-price { font-size: 17px; font-weight: 700; font-variant-numeric: tabular-nums; }
.mdn-calc.mdn2 .mdn2-prod-foot .mdn-stock-wrap { margin-top: 3px; }
/* Coût du parquet pour la pièce, sous le prix au m². */
.mdn-calc.mdn2 .mdn2-prod-total { font-size: 13px; font-weight: 600; color: var(--acc); font-variant-numeric: tabular-nums; }
.mdn-calc.mdn2 .mdn2-more-prods { width: 100%; text-align: center; }
.mdn-calc.mdn2 .mdn2-empty {
  padding: 28px; border: 1px dashed #C5CCC8; border-radius: 12px; text-align: center; color: var(--muted); font-size: 15px;
}
.mdn-calc.mdn2 .mdn2-empty .mdn2-link { display: inline; font-size: 15px; }

/* Étape 4 : lignes d'accessoires (libellé | contrôle | référence | montant). */
.mdn-calc.mdn2 .mdn2-acc-row {
  display: grid; grid-template-columns: 130px 230px minmax(0, 1fr) 96px; gap: 14px; align-items: center;
  padding: 12px 0 0; border-top: 1px solid var(--line-3);
}
.mdn-calc.mdn2 .mdn2-room > .mdn2-acc-row:last-child { padding-bottom: 2px; }
.mdn-calc.mdn2 .mdn2-acc-lbl { font-size: 14px; font-weight: 500; }
.mdn-calc.mdn2 .mdn2-acc-pick { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.mdn-calc.mdn2 .mdn2-acc-pick .mdn2-hint { margin-top: -2px; }
/* Référence retenue, repliée : vignette + nom + variante + « Modifier ». */
.mdn-calc.mdn2 .mdn2-acc-sum {
  display: flex; align-items: center; gap: 10px; min-width: 0;
  padding: 6px 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--white);
}
.mdn-calc.mdn2 .mdn2-acc-sum .mdn-pick-thumb { width: 32px; height: 32px; border-radius: 6px; }
.mdn-calc.mdn2 .mdn2-acc-sum-txt { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.mdn-calc.mdn2 .mdn2-acc-sum-name { font-size: 13px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mdn-calc.mdn2 .mdn2-acc-sum-var { font-size: 12px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mdn-calc.mdn2 .mdn2-acc-sum .mdn2-acc-toggle { flex: none; align-self: center; }
.mdn-calc.mdn2 .mdn2-acc-amt { font-size: 15px; font-weight: 600; text-align: right; font-variant-numeric: tabular-nums; }
.mdn-calc.mdn2 .mdn2-acc-row .mdn2-stepper { height: 40px; }
.mdn-calc.mdn2 .mdn2-check { margin-left: 144px; }

/* Sélecteurs en vignettes du noyau, à la charte v2. */
.mdn-calc.mdn2 .mdn-pick-trigger { background: var(--white); border-color: var(--line-2); border-radius: 8px; padding: 7px 10px; gap: 10px; }
.mdn-calc.mdn2 .mdn-pick-trigger:hover { border-color: #A9B3AD; }
.mdn-calc.mdn2 .mdn-picker.is-open .mdn-pick-trigger { border-color: var(--acc); box-shadow: 0 0 0 3px rgba(0,93,75,.14); }
.mdn-calc.mdn2 .mdn-pick-thumb { width: 36px; height: 36px; border-radius: 6px; border-color: var(--line); }
.mdn-calc.mdn2 .mdn-pick-name { font-size: 14px; font-weight: 500; }
.mdn-calc.mdn2 .mdn-pick-caret { background: var(--sand); color: var(--muted); }
.mdn-calc.mdn2 .mdn-pick-panel { border-color: var(--line-2); border-radius: 12px; box-shadow: 0 14px 40px rgba(31,39,34,.16); }
.mdn-calc.mdn2 .mdn-pick-search { background: var(--white); border-color: var(--line-2); border-radius: 8px; }
.mdn-calc.mdn2 .mdn-pick-search:focus { border-color: var(--acc); box-shadow: 0 0 0 3px rgba(0,93,75,.14); }
.mdn-calc.mdn2 .mdn-pick-opt,
.mdn-calc.mdn2 .mdn-pick-opt:focus,
.mdn-calc.mdn2 .mdn-pick-opt:active { border-color: var(--line); border-radius: 10px; }
.mdn-calc.mdn2 .mdn-pick-opt:hover { border-color: var(--line-2); box-shadow: 0 6px 18px rgba(31,39,34,.08); }
.mdn-calc.mdn2 .mdn-pick-opt.is-selected { border-color: var(--acc); box-shadow: inset 0 0 0 1px var(--acc); }
.mdn-calc.mdn2 .mdn-pick-opt-media .mdn-pick-thumb { width: 100%; height: auto; border-radius: 7px; }
.mdn-calc.mdn2 .mdn-pick-opt-sub { color: var(--ink-2); }
.mdn-calc.mdn2 .mdn-pick-opt-link,
.mdn-calc.mdn2 .mdn-acc-link { color: var(--acc); font-weight: 600; }
.mdn-calc.mdn2 .mdn-pick-link { display: none; } /* le lien fiche est déjà dans la carte « sélectionné » */
.mdn-calc.mdn2 .mdn2-variant { padding-left: 14px; border-left: 2px solid var(--acc-soft); display: flex; flex-direction: column; gap: 6px; }
.mdn-calc.mdn2 .mdn2-selected .mdn2-variant { padding-left: 0; border-left: 0; }
.mdn-calc.mdn2 .mdn2-variant-lbl { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; color: var(--ink); }
.mdn-calc.mdn2 .mdn2-count {
  font-size: 12px; font-weight: 600; color: var(--acc); background: var(--acc-soft);
  padding: 2px 8px; border-radius: 999px; white-space: nowrap;
}

/* Étape 5 : estimation. */
.mdn-calc.mdn2 .mdn2-tiles {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px;
  background: var(--line); border: 1px solid var(--line); border-radius: 12px; overflow: hidden;
}
.mdn-calc.mdn2 .mdn2-tiles > div { background: var(--white); padding: 16px 18px; display: flex; flex-direction: column; gap: 4px; }
.mdn-calc.mdn2 .mdn2-tiles span { font-size: 13px; color: var(--muted); }
.mdn-calc.mdn2 .mdn2-tiles strong { font-size: 20px; font-weight: 600; font-variant-numeric: tabular-nums; }
/* Le chiffre à retenir : la surface réellement commandée. */
.mdn-calc.mdn2 .mdn2-tiles > .is-key { background: var(--acc-soft); }
.mdn-calc.mdn2 .mdn2-tiles > .is-key span { color: var(--acc); }
.mdn-calc.mdn2 .mdn2-tiles > .is-key strong { color: var(--acc); }
.mdn-calc.mdn2 .mdn2-tiles > .is-key small { font-size: 12px; color: var(--acc); opacity: .8; line-height: 1.3; }

/* Récapitulatif : groupes (famille ou pièce) avec sous-total, lignes à vignette. */
.mdn-calc.mdn2 .mdn2-recap { display: flex; flex-direction: column; gap: 18px; }
.mdn-calc.mdn2 .mdn2-recap-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
.mdn-calc.mdn2 .mdn2-recap-head .mdn2-lbl { margin: 0; font-weight: 600; color: var(--ink); font-size: 14px; }
.mdn-calc.mdn2 .mdn2-recap-head .mdn2-segtab { flex: 0 1 260px; }
.mdn-calc.mdn2 .mdn2-rgroup { display: flex; flex-direction: column; }
.mdn-calc.mdn2 .mdn2-rgroup-head {
  display: flex; justify-content: space-between; align-items: baseline; gap: 12px;
  padding-bottom: 8px; border-bottom: 1px solid var(--ink);
}
.mdn-calc.mdn2 .mdn2-rgroup-head > div { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; min-width: 0; }
.mdn-calc.mdn2 .mdn2-rgroup-t { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; }
.mdn-calc.mdn2 .mdn2-rgroup-meta { font-size: 13px; color: var(--muted); }
.mdn-calc.mdn2 .mdn2-rgroup-sum { font-size: 14px; font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }
.mdn-calc.mdn2 .mdn2-rrow {
  display: grid; grid-template-columns: 44px minmax(0, 1fr) auto 104px; gap: 14px; align-items: center;
  padding: 12px 0; border-bottom: 1px solid var(--line-3);
}
.mdn-calc.mdn2 .mdn2-rrow .mdn-pick-thumb { width: 44px; height: 44px; border-radius: 8px; }
.mdn-calc.mdn2 .mdn2-rrow-txt { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.mdn-calc.mdn2 .mdn2-rrow-name { font-size: 15px; font-weight: 500; line-height: 1.3; overflow-wrap: anywhere; }
.mdn-calc.mdn2 .mdn2-rrow-sub { font-size: 13px; color: var(--muted); line-height: 1.35; }
.mdn-calc.mdn2 .mdn2-rrow-qty { font-size: 14px; color: var(--muted); font-variant-numeric: tabular-nums; white-space: nowrap; text-align: right; }
.mdn-calc.mdn2 .mdn2-rrow-amt { font-size: 15px; font-weight: 600; text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.mdn-calc.mdn2 .mdn2-auto {
  display: inline-block; vertical-align: 1px; margin-left: 4px; padding: 1px 7px; border-radius: 999px;
  font-size: 11px; font-weight: 600; color: var(--muted); background: var(--sand);
}
.mdn-calc.mdn2 .mdn2-grand { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding: 6px 0 0; }
.mdn-calc.mdn2 .mdn2-grand span { font-size: 17px; font-weight: 600; }
.mdn-calc.mdn2 .mdn2-grand strong { font-size: 26px; font-weight: 700; font-variant-numeric: tabular-nums; }
.mdn-calc.mdn2 .mdn2-tva { display: flex; justify-content: flex-end; gap: 6px; font-size: 13px; color: var(--muted); }
.mdn-calc.mdn2 .mdn2-included { display: flex; flex-direction: column; gap: 8px; padding: 16px 18px; background: var(--sand-2); border-radius: 12px; }
.mdn-calc.mdn2 .mdn2-included strong { font-size: 14px; font-weight: 600; }
.mdn-calc.mdn2 .mdn2-included ul { margin: 0; padding-left: 18px; font-size: 14px; color: var(--ink-2); line-height: 1.6; }
.mdn-calc.mdn2 .mdn2-box { display: flex; flex-direction: column; gap: 12px; border: 1px solid var(--line); border-radius: 12px; padding: 18px 20px; }
.mdn-calc.mdn2 .mdn2-box-head { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; }
.mdn-calc.mdn2 .mdn2-box-head > div { display: flex; flex-direction: column; gap: 2px; flex: 1 1 280px; }
.mdn-calc.mdn2 .mdn2-box-head strong { font-size: 15px; font-weight: 600; }
.mdn-calc.mdn2 .mdn2-box-form { display: flex; flex-direction: column; gap: 8px; }
.mdn-calc.mdn2 .mdn2-inline { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.mdn-calc.mdn2 .mdn2-inline input.mdn2-in { flex: 1 1 240px; width: auto; font-size: 15px; }
.mdn-calc.mdn2 .mdn2-box .mdn2-check { margin: 2px 0 0; }
.mdn-calc.mdn2 .mdn2-box .mdn-se-msg { margin: 0; font-size: 14px; }
.mdn-calc.mdn2 .mdn2-box .mdn-se-msg.is-ok { color: var(--acc); font-weight: 500; }
.mdn-calc.mdn2 .mdn2-disclaimer { margin: 0; font-size: 12px; line-height: 1.55; color: var(--muted-2); }

/* ---- Colonne de droite ---- */
.mdn-calc.mdn2 .mdn2-card {
  background: var(--surface); border: 1px solid var(--line); border-radius: 14px; padding: 18px;
  display: flex; flex-direction: column; gap: 12px;
}
.mdn-calc.mdn2 .mdn2-preview-top { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.mdn-calc.mdn2 .mdn2-preview-top h3 { white-space: nowrap; flex: none; }
.mdn-calc.mdn2 .mdn2-preview-dims { font-size: 13px; color: var(--muted); font-variant-numeric: tabular-nums; text-align: right; }
.mdn-calc.mdn2 .mdn2-preview-box { background: var(--sand); border-radius: 8px; padding: 14px; display: grid; place-items: center; min-height: 200px; }
.mdn-calc.mdn2 #mdn-svg { display: block; width: 100%; height: auto; max-width: none; background: transparent; margin: 0; }
.mdn-calc.mdn2 .mdn2-caption { font-size: 12px; color: var(--muted-2); }

.mdn-calc.mdn2 .mdn2-sum {
  background: var(--ink); color: #F4F6F5; border-radius: 14px; padding: 22px;
  display: flex; flex-direction: column; gap: 16px;
}
.mdn-calc.mdn2 .mdn2-sum-head { display: flex; flex-direction: column; gap: 4px; }
.mdn-calc.mdn2 .mdn2-sum-lab,
.mdn-calc.mdn2 .mdn2-sum-k { font-size: 13px; color: #BCC4BF; }
.mdn-calc.mdn2 .mdn2-sum-k { font-size: 12px; }
.mdn-calc.mdn2 .mdn2-sum-big { font-family: Newsreader, Georgia, serif; font-size: 44px; line-height: 1; font-variant-numeric: tabular-nums; }
.mdn-calc.mdn2 .mdn2-sum-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 12px; padding: 14px 0;
  border-top: 1px solid #2C3630; border-bottom: 1px solid #2C3630;
}
.mdn-calc.mdn2 .mdn2-sum-grid > div { display: flex; flex-direction: column; gap: 2px; }
.mdn-calc.mdn2 .mdn2-sum-v { font-size: 18px; font-weight: 600; font-variant-numeric: tabular-nums; }
.mdn-calc.mdn2 .mdn2-sum-lines { display: flex; flex-direction: column; gap: 6px; }
.mdn-calc.mdn2 .mdn2-sum-lines[hidden] { display: none; }
.mdn-calc.mdn2 .mdn2-sum-lines > div { display: flex; justify-content: space-between; gap: 12px; font-size: 13px; color: #D5DAD7; }
.mdn-calc.mdn2 .mdn2-sum-lines > div span:last-child { font-variant-numeric: tabular-nums; white-space: nowrap; }
.mdn-calc.mdn2 .mdn2-sum-total { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.mdn-calc.mdn2 .mdn2-sum-total span { font-size: 14px; color: #BCC4BF; }
.mdn-calc.mdn2 .mdn2-sum-total strong { font-size: 24px; font-weight: 700; font-variant-numeric: tabular-nums; color: #F4F6F5; }

/* Fourchette de prix avant le choix du parquet : synthèse (fond sombre) et étape Pièces. */
.mdn-calc.mdn2 .mdn2-sum-range { font-size: 13px; color: #D5DAD7; line-height: 1.45; }
.mdn-calc.mdn2 .mdn2-sum-range[hidden] { display: none; }
.mdn-calc.mdn2 .mdn2-sum-range strong { color: #F4F6F5; white-space: nowrap; }
.mdn-calc.mdn2 .mdn2-range { margin: 0; padding: 12px 14px; border-radius: 10px; background: var(--sand-2); font-size: 14px; color: var(--ink-2); }
.mdn-calc.mdn2 .mdn2-range[hidden] { display: none; }
.mdn-calc.mdn2 .mdn2-range strong { color: var(--ink); white-space: nowrap; }

/* Étape Pose : rappel du parquet venu de la fiche produit. */
.mdn-calc.mdn2 .mdn2-prefill { display: flex; align-items: center; gap: 12px; padding: 10px 14px; border: 1px solid var(--acc-done); border-radius: 12px; background: var(--acc-soft); font-size: 14px; }
.mdn-calc.mdn2 .mdn2-prefill > span { flex: 1; min-width: 0; }
.mdn-calc.mdn2 .mdn2-prefill .mdn-pick-thumb { width: 40px; height: 40px; border-radius: 8px; flex: none; }

/* Étape Résultat : engagements sous les boutons. */
.mdn-calc.mdn2 .mdn2-reassure { list-style: none; margin: 0; padding: 4px 0; display: flex; flex-direction: column; gap: 10px; }
.mdn-calc.mdn2 .mdn2-reassure li { margin: 0; }
.mdn-calc.mdn2 .mdn2-reassure li > a { text-decoration: none; color: inherit; }
.mdn-calc.mdn2 .mdn2-reassure li,
.mdn-calc.mdn2 .mdn2-reassure li > a { display: flex; align-items: flex-start; gap: 10px; }
.mdn-calc.mdn2 .mdn2-reassure-ico { width: 20px; height: 20px; flex: none; margin-top: 1px; fill: none; stroke: var(--acc); stroke-width: 1.6; stroke-linejoin: round; stroke-linecap: round; }
.mdn-calc.mdn2 .mdn2-reassure strong { display: block; font-size: 14px; font-weight: 600; color: var(--ink); }
.mdn-calc.mdn2 .mdn2-reassure strong + span { display: block; font-size: 13px; color: var(--muted); }
.mdn-calc.mdn2 .mdn2-reassure a:hover strong { text-decoration: underline; }

/* Livraison offerte : récap (fond sombre) et barre mobile. */
.mdn-calc.mdn2 .mdn2-sum-ship { display: flex; flex-direction: column; gap: 10px; font-size: 14px; line-height: 1.4; color: var(--ink); padding: 12px 14px; border-radius: 10px; background: #fff; }
.mdn-calc.mdn2 .mdn2-sum-ship[hidden] { display: none; }
.mdn-calc.mdn2 .mdn2-ship-text { margin: 0; font-size: inherit; font-weight: 600; color: inherit; }
.mdn-calc.mdn2 .mdn2-ship-text .mdn2-muted { display: block; margin-top: 2px; font-weight: 400; }
.mdn-calc.mdn2 .mdn2-sum-ship strong { font-size: 16px; font-weight: 700; color: var(--warn); white-space: nowrap; }
.mdn-calc.mdn2 .mdn2-sum-ship.is-ok { color: var(--acc-dark); background: var(--acc-soft); }
.mdn-calc.mdn2 .mdn2-sum-ship.is-ok .mdn2-ship-text::before { content: "✓ "; }
.mdn-calc.mdn2 .mdn2-ship-edit,
.mdn-calc.mdn2 .mdn2-ship-edit:hover,
.mdn-calc.mdn2 .mdn2-ship-edit:focus { padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; font: inherit; color: var(--ink); text-decoration: underline; text-underline-offset: 2px; cursor: pointer; }
.mdn-calc.mdn2 .mdn2-ship-edit:focus-visible { outline: 2px solid var(--acc); outline-offset: 2px; }
.mdn-calc.mdn2 .mdn2-ship-cp { display: flex; flex-direction: column; gap: 4px; font-size: 13px; color: var(--ink-2); }
.mdn-calc.mdn2 .mdn2-ship-cp[hidden] { display: none; }
.mdn-calc.mdn2 .mdn2-ship-field { display: flex; gap: 8px; }
.mdn-calc.mdn2 .mdn2-ship-field input.mdn2-in { flex: 1 1 0; width: auto; min-width: 0; }
.mdn-calc.mdn2 .mdn2-ship-field .mdn2-btn-outline { flex: none; }
.mdn-calc.mdn2 .mdn2-ship-msg { font-size: 13px; color: var(--warn); }
.mdn-calc.mdn2 .mdn2-ship-msg:empty { display: none; }

/* Étape Résultat : plus d'aperçu ; boutons d'action et envoi e-mail à droite. */
.mdn-calc.mdn2[data-step="4"] .mdn2-preview { display: none; }
.mdn-calc.mdn2 .mdn2-aside-actions { display: flex; flex-direction: column; gap: 16px; }
.mdn-calc.mdn2 .mdn2-aside-actions[hidden] { display: none; }
.mdn-calc.mdn2 .mdn2-aside-actions .mdn2-cta { flex-direction: column; align-items: stretch; gap: 8px; width: 100%; }
.mdn-calc.mdn2 .mdn2-aside-actions .mdn2-cta button { width: 100%; text-align: center; }
.mdn-calc.mdn2 .mdn2-aside-actions .mdn2-box { background: var(--surface); padding: 16px 18px; }
.mdn-calc.mdn2 .mdn2-aside-actions .mdn2-box-head > div { flex-basis: 100%; }
.mdn-calc.mdn2 .mdn2-aside-actions .mdn2-inline { flex-direction: column; align-items: stretch; }
.mdn-calc.mdn2 .mdn2-aside-actions .mdn2-inline input.mdn2-in { flex: none; width: 100%; }
.mdn-calc.mdn2 .mdn2-aside-actions .mdn2-inline .mdn2-btn-outline { width: 100%; }

/* Barre mobile de l'étape Résultat (affichée par le JS, ≤ 960 px seulement). */
.mdn-calc.mdn2 .mdn2-mbar { display: none; }
@media (max-width: 960px) {
  .mdn-calc.mdn2 .mdn2-mbar:not([hidden]) {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 999;
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
    padding: 10px clamp(16px, 3vw, 32px) calc(10px + env(safe-area-inset-bottom, 0px));
    background: var(--ink); box-shadow: 0 -6px 18px rgba(31,39,34, .18);
  }
  .mdn-calc.mdn2 .mdn2-mbar-total { display: flex; flex-direction: column; min-width: 0; }
  .mdn-calc.mdn2 .mdn2-mbar-total span { font-size: 12px; color: #BCC4BF; }
  .mdn-calc.mdn2 .mdn2-mbar-total strong { font-size: 20px; font-weight: 700; color: #F4F6F5; font-variant-numeric: tabular-nums; white-space: nowrap; }
  .mdn-calc.mdn2 .mdn2-mbar-ship { font-size: 12px; font-weight: 600; color: #fff; line-height: 1.3; }
  .mdn-calc.mdn2 .mdn2-mbar-ship[hidden] { display: none; }
  .mdn-calc.mdn2 .mdn2-mbar .mdn2-btn-green { flex: none; padding: 12px 18px; transition: none; }
  /* La barre ne doit pas masquer le bas de page. */
  body.mdn2-has-mbar { padding-bottom: 72px; }
}
@media print { .mdn-calc.mdn2 .mdn2-mbar { display: none !important; } }

/* Modale client (admin) : boutons à la charte. */
.mdn-calc.mdn2 .mdn-modal .mdn-btn.primary { background: var(--ink); border-color: var(--ink); }
.mdn-calc.mdn2 .mdn-modal h3 { font-family: Newsreader, Georgia, serif; font-size: 22px; font-weight: 400; }

/* ---- Responsive ---- */
/* Page : la colonne de droite passe sous le panneau. */
@media (max-width: 960px) {
  .mdn-calc.mdn2 .mdn2-aside { flex: 1 1 100%; min-width: 0; }
}
@media (max-width: 760px) {
  .mdn-calc.mdn2 { padding-top: 16px; }
  .mdn-calc.mdn2 .mdn2-main { padding: 20px 16px; gap: 22px; border-radius: 12px; }
  .mdn-calc.mdn2 .mdn2-steps { gap: 4px; }
  .mdn-calc.mdn2 .mdn2-step,
  .mdn-calc.mdn2 .mdn2-step:hover,
  .mdn-calc.mdn2 .mdn2-step:focus { flex-direction: column; align-items: flex-start; gap: 6px; padding: 10px 2px 0; }
  .mdn-calc.mdn2 .mdn2-step-label { font-size: 12px; max-width: 100%; }
  .mdn-calc.mdn2 .mdn2-sum-big { font-size: 38px; }
  .mdn-calc.mdn2 .mdn2-nav { gap: 10px; }
  .mdn-calc.mdn2 .mdn2-cta { width: 100%; flex-direction: column-reverse; }
  .mdn-calc.mdn2 .mdn2-cta button { width: 100%; }
}

/* Panneau d'étape : d'après sa propre largeur. */
@container mdn2main (max-width: 820px) {
  .mdn-calc.mdn2 .mdn2-acc-row { grid-template-columns: 130px minmax(0, 1fr) 90px; padding-bottom: 4px; }
  .mdn-calc.mdn2 .mdn2-acc-row > .mdn2-acc-pick { grid-column: 1 / -1; grid-row: 2; }
  .mdn-calc.mdn2 .mdn2-acc-row > .mdn2-acc-amt { grid-column: 3; grid-row: 1; }
  .mdn-calc.mdn2 .mdn2-segtab { max-width: 300px; }
  .mdn-calc.mdn2 .mdn2-check { margin-left: 0; }
}
@container mdn2main (max-width: 640px) {
  .mdn-calc.mdn2 h2 { font-size: 26px; }
  .mdn-calc.mdn2 .mdn2-room { padding: 14px; }
  .mdn-calc.mdn2 .mdn2-room-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .mdn-calc.mdn2 .mdn2-room-grid .mdn2-fld-name { grid-column: 1 / -1; }
  .mdn-calc.mdn2 .mdn2-room-end { flex-direction: row-reverse; justify-content: space-between; align-items: center; min-width: 0; }
  .mdn-calc.mdn2 .mdn2-motifs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mdn-calc.mdn2 .mdn2-two { grid-template-columns: 1fr; }
  .mdn-calc.mdn2 .mdn2-prods { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .mdn-calc.mdn2 .mdn2-prod-body { padding: 8px 10px 8px; }
  .mdn-calc.mdn2 .mdn2-prod-name { font-size: 14px; }
  .mdn-calc.mdn2 .mdn2-prod-price { font-size: 15px; }
  .mdn-calc.mdn2 .mdn2-acc-row { grid-template-columns: minmax(0, 1fr) auto; }
  .mdn-calc.mdn2 .mdn2-acc-row > .mdn2-acc-lbl { grid-column: 1; grid-row: 1; }
  .mdn-calc.mdn2 .mdn2-acc-row > .mdn2-acc-amt { grid-column: 2; grid-row: 1; }
  .mdn-calc.mdn2 .mdn2-acc-row > .mdn2-stepper,
  .mdn-calc.mdn2 .mdn2-acc-row > .mdn2-segtab { grid-column: 1 / -1; grid-row: 2; max-width: none; }
  .mdn-calc.mdn2 .mdn2-acc-row > .mdn2-acc-pick { grid-column: 1 / -1; grid-row: 3; }
  .mdn-calc.mdn2 .mdn2-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mdn-calc.mdn2 .mdn2-tiles > div { padding: 12px 14px; }
  .mdn-calc.mdn2 .mdn2-tiles strong { font-size: 18px; }
  /* Ligne : vignette | nom + détail + quantité | prix. */
  .mdn-calc.mdn2 .mdn2-rrow { grid-template-columns: 40px minmax(0, 1fr) auto; gap: 4px 12px; align-items: start; }
  .mdn-calc.mdn2 .mdn2-rrow .mdn-pick-thumb { width: 40px; height: 40px; grid-row: 1 / span 2; }
  .mdn-calc.mdn2 .mdn2-rrow-txt { grid-column: 2; grid-row: 1; }
  .mdn-calc.mdn2 .mdn2-rrow-qty { grid-column: 2; grid-row: 2; text-align: left; font-size: 13px; }
  .mdn-calc.mdn2 .mdn2-rrow-amt { grid-column: 3; grid-row: 1; }
  .mdn-calc.mdn2 .mdn2-rrow-name { font-size: 14px; }
  .mdn-calc.mdn2 .mdn2-recap-head .mdn2-segtab { flex: 1 1 100%; }
  .mdn-calc.mdn2 .mdn-pick-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mdn-calc.mdn2 .mdn2-filter-lbl { width: 100%; }
  /* Pastilles de filtre repliées sur 2 lignes (≈ 2 × 32 px + 8 px d'écart). */
  .mdn-calc.mdn2 .mdn2-filter--chips .mdn2-chip-list { flex-basis: 100%; }
  .mdn-calc.mdn2 .mdn2-filter--chips:not(.is-open) .mdn2-chip-list { max-height: 72px; overflow: hidden; }
  .mdn-calc.mdn2 .mdn2-more-chips { margin-left: 0; }
}
@container mdn2main (max-width: 380px) {
  .mdn-calc.mdn2 .mdn2-motifs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mdn-calc.mdn2 .mdn2-selected-head { flex-wrap: wrap; }
}

/* ---- Terrasse et panneaux ---- */
/* Surface sans compteur de portes : pas de colonne vide en fin de ligne. */
@container mdn2main (min-width: 641px) {
  .mdn-calc.mdn2 .mdn2-room-grid--plain { grid-template-columns: minmax(0, 1.6fr) repeat(2, minmax(0, 1fr)) auto; }
}
@container mdn2main (max-width: 640px) {
  .mdn-calc.mdn2 .mdn2-room-grid--plain .mdn2-room-end { grid-column: 1 / -1; }
  .mdn-calc.mdn2 .mdn2-tgl { grid-template-columns: minmax(0, 1fr) auto; }
}
.mdn-calc.mdn2 .mdn2-lbl--flush { margin: 0; }
.mdn-calc.mdn2 .mdn2-plotnote { display: flex; flex-direction: column; gap: 6px; }
.mdn-calc.mdn2 .mdn2-plotnote:empty { display: none; }
.mdn-calc.mdn2 .mdn2-plotnote .mdn-note { margin: 0; font-size: 13px; color: var(--ink-2); }
.mdn-calc.mdn2 .mdn2-plotnote .mdn-plot-mix { margin: 0; padding-left: 18px; font-size: 13px; color: var(--ink-2); }

/* Accessoire à interrupteur, ou ajouté d'office : intitulé | montant. */
.mdn-calc.mdn2 .mdn2-tgl {
  display: grid; grid-template-columns: minmax(0, 1fr) 96px; gap: 14px; align-items: start;
  padding: 12px 0 0; border-top: 1px solid var(--line-3);
}
.mdn-calc.mdn2 .mdn2-tgl-main { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; min-width: 0; }
.mdn-calc.mdn2 .mdn2-tgl-head { display: flex; align-items: center; gap: 10px; margin: 0; cursor: pointer; }
.mdn-calc.mdn2 div.mdn2-tgl-head { cursor: default; }
.mdn-calc.mdn2 .mdn2-tgl-name { font-size: 14px; font-weight: 600; color: var(--ink); }
.mdn-calc.mdn2 .mdn2-tgl .mdn2-muted { line-height: 1.45; }
.mdn-calc.mdn2 .mdn2-tgl-link { margin: 0; font-size: 13px; }
.mdn-calc.mdn2 .mdn2-tgl .mdn-picker { align-self: stretch; margin-top: 4px; }
.mdn-calc.mdn2 .mdn2-tgl .mdn2-acc-amt { line-height: 1.5; }
.mdn-calc.mdn2 .mdn-switch input:checked + .track { background: var(--acc); }

/* « Accessoires » tient en entier dans le fil d'étapes sur téléphone. */
@media (max-width: 480px) {
  .mdn-calc.mdn2 .mdn2-step-label { font-size: 11px; }
}

/* ---- Panneaux : page unique, sans fil d'étapes ---- */
.mdn-calc.mdn2 #mdn2-detail { display: flex; flex-direction: column; gap: 18px; margin-top: 28px; padding-top: 24px; border-top: 1px solid var(--line-3); }
.mdn-calc.mdn2 #mdn2-detail[hidden] { display: none; }
.mdn-calc.mdn2 #mdn2-walls { display: flex; flex-direction: column; gap: 16px; }
.mdn-calc.mdn2 .mdn-swatch-select { display: none; }
@media (max-width: 600px) {
  .mdn-calc.mdn2 .mdn-swatch-select { display: block; }
}

/* Mise en avant du clipsable (easiklip) */
.mdn-calc.mdn2 .mdn2-clip-badge {
  position: absolute; left: 8px; bottom: 8px; background: #fff; color: var(--acc);
  font-size: 12px; font-weight: 700; padding: 4px 9px; border-radius: 999px;
}
.mdn-calc.mdn2 .mdn2-motif-tag { display: block; font-size: 11px; font-weight: 600; color: var(--acc); margin-top: 2px; }
.mdn-calc.mdn2 .mdn2-reco { background: var(--acc-soft); border-radius: 8px; padding: 10px 12px; margin-bottom: 14px; font-size: 14px; }
.mdn-calc.mdn2 .mdn2-to-clip { display: inline-block; margin-top: 6px; font-size: 13px; }