/* ==========================================================================
   DevisPro — espace client (refonte oct. 2026)
   Palette alignée sur msc-cards.css : marine #14213D, accent #0A6E99
   ========================================================================== */
.dp, .dp-head {
  --dp-ink: #14213D;
  --dp-text: #2D3748;
  --dp-muted: #5B6576;
  --dp-faint: #8A94A6;
  --dp-line: #E1E5EB;
  --dp-line-strong: #C9D0DA;
  --dp-soft: #F3F5F8;
  --dp-accent: #0A6E99;
  --dp-accent-soft: #E6F2F8;
  --dp-success: #1E7B4F;
  --dp-success-soft: #E5F4EC;
  --dp-warn: #9A6200;
  --dp-warn-soft: #FDF3E1;
  --dp-danger: #B42318;
  --dp-danger-soft: #FDECEA;
  --dp-radius: 12px;
  --dp-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
  color: var(--dp-text);
}
.dp *, .dp-head * { box-sizing: border-box; }
.dp .material-icons, .dp-head .material-icons { font-size: 18px; line-height: 1; vertical-align: middle; }

/* le conteneur du thème : on retire la carte blanche par défaut */
body[id^="module-devispro"] #content.page-content { background: transparent; border: 0; box-shadow: none; padding: 0; }

/* ---------- En-tête de page ---------- */
.dp-page-header, .dp-head { margin-bottom: 20px; }
.dp-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.dp-head__title { margin: 4px 0 4px; font-size: 26px; font-weight: 700; color: var(--dp-ink); letter-spacing: -.01em; text-transform: none; }
.dp-head__sub { margin: 0; color: var(--dp-muted); font-size: 14px; }
.dp-head__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; font-size: 13px; }
.dp-back { display: inline-flex; align-items: center; gap: 4px; font-size: 13px; color: var(--dp-muted); text-decoration: none; }
.dp-back:hover { color: var(--dp-accent); text-decoration: none; }

/* ---------- Boutons ---------- */
.dp-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  height: 40px; padding: 0 16px; border-radius: 8px; border: 1px solid transparent;
  font-size: 14px; font-weight: 600; line-height: 1; text-decoration: none; cursor: pointer;
  transition: background .15s, border-color .15s, color .15s, box-shadow .15s; white-space: nowrap;
}
.dp-btn:hover, .dp-btn:focus { text-decoration: none; }
.dp-btn--primary { background: var(--dp-ink); color: #fff; }
.dp-btn--primary:hover, .dp-btn--primary:focus { background: #0E182C; color: #fff; box-shadow: 0 4px 12px rgba(20,33,61,.18); }
.dp-btn--secondary { background: var(--dp-accent); color: #fff; }
.dp-btn--secondary:hover, .dp-btn--secondary:focus { background: #085A7D; color: #fff; }
.dp-btn--ghost { background: #fff; color: var(--dp-ink); border-color: var(--dp-line); }
.dp-btn--ghost:hover { border-color: var(--dp-line-strong); background: var(--dp-soft); color: var(--dp-ink); }
.dp-btn--sm { height: 34px; padding: 0 12px; font-size: 13px; }
.dp-btn--block { display: flex; width: 100%; height: 46px; font-size: 15px; }
.dp-btn:disabled, .dp-btn.devispro-loading { opacity: .6; cursor: wait; }

.dp-icon-btn {
  display: inline-flex; align-items: center; justify-content: center;
  width: 34px; height: 34px; border-radius: 8px; color: var(--dp-muted);
  border: 1px solid transparent; text-decoration: none; transition: background .15s, color .15s;
}
.dp-icon-btn:hover { background: var(--dp-soft); color: var(--dp-ink); text-decoration: none; }
.dp-icon-btn--accent { color: var(--dp-accent); }
.dp-icon-btn--accent:hover { background: var(--dp-accent-soft); color: var(--dp-accent); }
.dp-icon-btn--danger:hover { background: var(--dp-danger-soft); color: var(--dp-danger); }

.dp-link { display: flex; align-items: center; gap: 8px; padding: 8px 0; color: var(--dp-ink); font-size: 14px; font-weight: 500; text-decoration: none; }
.dp-link:hover { color: var(--dp-accent); text-decoration: none; }
.dp-link--danger { color: var(--dp-danger); }
.dp-link--danger:hover { color: #8A1A12; }

/* ---------- Éléments communs ---------- */
.dp-ref { font-family: var(--dp-mono); font-size: 13px; font-weight: 600; color: var(--dp-ink); letter-spacing: -.01em; }
.dp-ref--sm { font-size: 12px; font-weight: 500; color: var(--dp-muted); display: block; margin-top: 2px; }
.dp-muted { color: var(--dp-muted); }
.dp-c { text-align: center; }
.dp-r { text-align: right; }
.dp-req { color: var(--dp-danger); }
.dp-count { display: inline-flex; align-items: center; justify-content: center; min-width: 22px; height: 22px; padding: 0 6px; margin-left: 6px; border-radius: 11px; background: var(--dp-soft); color: var(--dp-muted); font-size: 12px; font-weight: 600; vertical-align: middle; }
.dp-hint { display: flex; align-items: center; gap: 6px; margin: 14px 0 0; font-size: 13px; color: var(--dp-muted); }
.dp-hint--center { justify-content: center; margin-top: 8px; font-size: 12px; }

.dp-status { display: inline-flex; align-items: center; gap: 6px; height: 24px; padding: 0 10px; border-radius: 12px; font-size: 12px; font-weight: 600; white-space: nowrap; }
.dp-status::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.dp-status--draft { background: var(--dp-soft); color: var(--dp-muted); }
.dp-status--sent { background: var(--dp-accent-soft); color: var(--dp-accent); }
.dp-status--validated { background: var(--dp-success-soft); color: var(--dp-success); }
.dp-status--converted { background: #ECEEF5; color: var(--dp-ink); }

.dp-card { background: #fff; border: 1px solid var(--dp-line); border-radius: var(--dp-radius); padding: 20px; margin-bottom: 16px; }
.dp-card--flush { padding: 0; overflow: hidden; }
.dp-card--soft { background: var(--dp-soft); border-color: transparent; }
.dp-card__header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 20px; border-bottom: 1px solid var(--dp-line); }
.dp-card__title { margin: 0 0 14px; font-size: 16px; font-weight: 700; color: var(--dp-ink); text-transform: none; }
.dp-card__header .dp-card__title { margin: 0; }
.dp-card--actions { padding: 8px 20px; }

/* ---------- Formulaires ---------- */
.dp-form { display: flex; flex-direction: column; gap: 16px; }
.dp-collapse .dp-form { padding: 20px; }
.dp-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.dp-form__actions { display: flex; justify-content: flex-end; gap: 10px; }
.dp-field { display: flex; flex-direction: column; gap: 6px; }
.dp-field label, .dp-margin label { font-size: 13px; font-weight: 600; color: var(--dp-ink); margin: 0; }
.dp-field small, .dp-margin small { font-size: 12px; color: var(--dp-faint); }
.dp-field input, .dp-field textarea, .dp-select, .dp-margin input, .dp-search__input {
  width: 100%; min-height: 42px; padding: 9px 12px; border: 1px solid var(--dp-line-strong); border-radius: 8px;
  background: #fff; color: var(--dp-text); font-family: inherit; font-size: 14px; transition: border-color .15s, box-shadow .15s;
}
.dp-field textarea { resize: vertical; }
.dp-field input:focus, .dp-field textarea:focus, .dp-select:focus, .dp-margin input:focus, .dp-search__input:focus {
  outline: none; border-color: var(--dp-accent); box-shadow: 0 0 0 3px rgba(10,110,153,.15);
}

/* ---------- Liste : indicateurs ---------- */
.dp-kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 20px; }
.dp-kpi { background: #fff; border: 1px solid var(--dp-line); border-radius: var(--dp-radius); padding: 14px 16px; display: flex; flex-direction: column; gap: 4px; }
.dp-kpi__label { font-size: 12px; font-weight: 600; color: var(--dp-muted); text-transform: uppercase; letter-spacing: .04em; }
.dp-kpi__value { font-size: 22px; font-weight: 700; color: var(--dp-ink); font-variant-numeric: tabular-nums; }

.dp-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 12px; }
.dp-filters { display: flex; flex-wrap: wrap; gap: 6px; }
.dp-filter { display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 12px; border-radius: 17px; border: 1px solid var(--dp-line); background: #fff; color: var(--dp-muted); font-size: 13px; font-weight: 600; cursor: pointer; }
.dp-filter span { font-size: 12px; color: var(--dp-faint); font-weight: 500; }
.dp-filter:hover { border-color: var(--dp-line-strong); color: var(--dp-ink); }
.dp-filter.is-active { background: var(--dp-ink); border-color: var(--dp-ink); color: #fff; }
.dp-filter.is-active span { color: rgba(255,255,255,.7); }
.dp-search { position: relative; width: 280px; max-width: 100%; }
.dp-search .material-icons { position: absolute; left: 10px; top: 50%; transform: translateY(-50%); color: var(--dp-faint); }
.dp-search__input { padding-left: 36px; min-height: 36px; height: 36px; }

/* ---------- Liste : tableau ---------- */
.dp-table { background: #fff; border: 1px solid var(--dp-line); border-radius: var(--dp-radius); overflow: hidden; }
.dp-table__head, .dp-row { display: grid; grid-template-columns: minmax(200px, 2.2fr) minmax(120px, 1.4fr) 70px 120px 110px 100px 156px; align-items: center; gap: 12px; padding: 0 16px; }
.dp-table__head { height: 42px; background: var(--dp-soft); font-size: 12px; font-weight: 600; color: var(--dp-muted); text-transform: uppercase; letter-spacing: .04em; }
.dp-row { min-height: 64px; border-top: 1px solid var(--dp-line); font-size: 14px; transition: background .12s; }
.dp-row:hover { background: #FAFBFC; }
.dp-row__main { display: flex; flex-direction: column; gap: 2px; padding: 12px 0; text-decoration: none; min-width: 0; }
.dp-row__main:hover { text-decoration: none; }
.dp-row__main:hover .dp-row__name { color: var(--dp-accent); }
.dp-row__name { color: var(--dp-text); font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dp-row__client { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dp-row__total { font-weight: 700; color: var(--dp-ink); font-variant-numeric: tabular-nums; }
.dp-row__actions { display: flex; justify-content: flex-end; gap: 2px; }
.dp-empty-filter { padding: 24px; text-align: center; color: var(--dp-muted); border-top: 1px solid var(--dp-line); }

/* ---------- États vides & étapes ---------- */
.dp-empty { text-align: center; background: #fff; border: 1px dashed var(--dp-line-strong); border-radius: var(--dp-radius); padding: 40px 24px; margin-bottom: 20px; }
.dp-empty--inline { border: 0; border-radius: 0; margin: 0; }
.dp-empty__icon { display: inline-flex; align-items: center; justify-content: center; width: 56px; height: 56px; border-radius: 50%; background: var(--dp-accent-soft); color: var(--dp-accent); margin-bottom: 12px; }
.dp-empty__icon .material-icons { font-size: 28px; }
.dp-empty h2, .dp-empty h3 { font-size: 18px; font-weight: 700; color: var(--dp-ink); margin: 0 0 6px; text-transform: none; }
.dp-empty p { color: var(--dp-muted); max-width: 440px; margin: 0 auto 18px; }
.dp-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.dp-steps li { display: flex; gap: 12px; align-items: flex-start; background: #fff; border: 1px solid var(--dp-line); border-radius: var(--dp-radius); padding: 14px; }
.dp-steps__n { flex: 0 0 26px; height: 26px; border-radius: 50%; background: var(--dp-ink); color: #fff; font-size: 13px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; }
.dp-steps strong { display: block; color: var(--dp-ink); font-size: 14px; }
.dp-steps p { margin: 2px 0 0; font-size: 13px; color: var(--dp-muted); }
.dp-steps--compact { grid-template-columns: 1fr; gap: 14px; }
.dp-steps--compact li { background: transparent; border: 0; padding: 0; }

/* ---------- Création ---------- */
.dp-grid { display: grid; grid-template-columns: minmax(0, 2fr) minmax(240px, 1fr); gap: 16px; align-items: start; }

/* ---------- Détail d'un devis ---------- */
.dp-layout { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 20px; align-items: start; }
.dp-layout__side { position: sticky; top: 20px; }

.dp-lines__head, .dp-line { display: grid; grid-template-columns: minmax(220px, 1fr) 150px 100px 100px 110px 36px; align-items: center; gap: 12px; padding: 0 20px; }
.dp-lines--nomargin .dp-lines__head,
.dp-lines--nomargin .dp-line { grid-template-columns: minmax(220px, 1fr) 150px 110px 110px 36px; }
.dp-lines__head { height: 40px; background: var(--dp-soft); font-size: 12px; font-weight: 600; color: var(--dp-muted); text-transform: uppercase; letter-spacing: .04em; }
.dp-line { padding-top: 14px; padding-bottom: 14px; border-top: 1px solid var(--dp-line); font-size: 14px; font-variant-numeric: tabular-nums; }
.dp-line__product { display: flex; align-items: center; gap: 12px; min-width: 0; }
.dp-line__product img { width: 56px; height: 56px; object-fit: contain; border: 1px solid var(--dp-line); border-radius: 8px; background: #fff; flex: 0 0 56px; }
.dp-line__name { text-decoration: none; color: var(--dp-ink); font-weight: 600; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.dp-line__name:hover { color: var(--dp-accent); text-decoration: none; }
.dp-line__total { font-weight: 700; color: var(--dp-ink); }

.dp-qty { display: inline-flex; align-items: center; justify-self: center; border: 1px solid var(--dp-line-strong); border-radius: 8px; overflow: hidden; height: 36px; margin: 0; }
.dp-qty input { width: 44px; height: 34px; border: 0; text-align: center; font-weight: 600; color: var(--dp-ink); -moz-appearance: textfield; }
.dp-qty input::-webkit-outer-spin-button, .dp-qty input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.dp-qty__btn { width: 30px; height: 34px; border: 0; background: var(--dp-soft); color: var(--dp-ink); font-size: 16px; cursor: pointer; }
.dp-qty__btn:hover { background: #E8ECF1; }
.dp-qty__save { width: 0; height: 34px; padding: 0; border: 0; background: var(--dp-accent); color: #fff; cursor: pointer; overflow: hidden; transition: width .15s; }
.dp-qty.is-dirty .dp-qty__save { width: 34px; }
.dp-qty__save .material-icons { font-size: 18px; }

.dp-collapse > summary { list-style: none; cursor: pointer; border-bottom: 0; }
.dp-collapse > summary::-webkit-details-marker { display: none; }
.dp-collapse[open] > summary { border-bottom: 1px solid var(--dp-line); }
.dp-collapse { padding: 0; }
.dp-collapse__icon { transition: transform .2s; color: var(--dp-muted); }
.dp-collapse[open] .dp-collapse__icon { transform: rotate(180deg); }

.dp-margin { display: flex; flex-direction: column; gap: 6px; padding-bottom: 16px; margin-bottom: 4px; border-bottom: 1px solid var(--dp-line); }
.dp-margin__input { display: flex; align-items: center; gap: 8px; }
.dp-margin__input input { width: 90px; min-height: 34px; height: 34px; text-align: right; font-weight: 600; }
.dp-margin__input span { color: var(--dp-muted); font-weight: 600; margin-right: auto; }

.dp-totals { margin: 12px 0 16px; font-variant-numeric: tabular-nums; }
.dp-totals > div { display: flex; justify-content: space-between; align-items: baseline; padding: 6px 0; font-size: 14px; }
.dp-totals dt { font-weight: 500; color: var(--dp-muted); }
.dp-totals dd { margin: 0; font-weight: 600; color: var(--dp-ink); }
.dp-totals__margin dt, .dp-totals__margin dd { color: var(--dp-success); }
.dp-totals__grand { margin-top: 8px; padding-top: 12px !important; border-top: 1px solid var(--dp-line); }
.dp-totals__grand dt { color: var(--dp-ink); font-weight: 700; }
.dp-totals__grand dd { font-size: 22px; font-weight: 800; }

.dp-segmented { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; padding: 4px; background: var(--dp-soft); border-radius: 10px; margin-bottom: 8px; }
.dp-segmented label { margin: 0; cursor: pointer; }
.dp-segmented input { position: absolute; opacity: 0; pointer-events: none; }
.dp-segmented span { display: flex; align-items: center; justify-content: center; height: 34px; border-radius: 7px; font-size: 13px; font-weight: 600; color: var(--dp-muted); transition: background .15s, color .15s; }
.dp-segmented label:hover span { color: var(--dp-ink); }
.dp-segmented input:checked + span { background: #fff; color: var(--dp-ink); box-shadow: 0 1px 3px rgba(20,33,61,.12); }
.dp-segmented input:focus-visible + span { outline: 2px solid var(--dp-accent); }

/* ---------- Fiche produit : bloc « Ajouter à un devis » ---------- */
.devispro-add-to-quote { margin-top: 16px; }
.dp-addbox { border: 1px solid var(--dp-line); border-radius: var(--dp-radius); padding: 14px 16px; background: #fff; }
.dp-addbox__head { display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 700; color: var(--dp-ink); margin-bottom: 10px; }
.dp-addbox__head .material-icons { color: var(--dp-accent); }
.dp-addbox__row { display: flex; gap: 8px; }
.dp-addbox__row .dp-select { flex: 1; min-width: 0; min-height: 40px; height: 40px; padding: 0 10px; }
.dp-addbox__hint { display: block; margin-top: 8px; font-size: 12px; color: var(--dp-faint); }
.devispro-message { margin-top: 10px; padding: 10px 12px; border-radius: 8px; font-size: 13px; font-weight: 500; }
.devispro-message.success { background: var(--dp-success-soft); color: var(--dp-success); align-items: center; gap: 8px; flex-wrap: wrap; }
.devispro-message .material-icons { font-size: 18px; }
.devispro-message__link { margin-left: auto; font-weight: 700; color: var(--dp-success); text-decoration: underline; white-space: nowrap; }
.devispro-message__link:hover { color: #145537; }
.devispro-message.error { background: var(--dp-danger-soft); color: var(--dp-danger); }

/* ---------- Lien dans « Mon compte » ---------- */
#devispro-link .material-icons { color: #0A6E99; }

/* ---------- Responsive ---------- */
@media (max-width: 1199px) {
  .dp-layout { grid-template-columns: 1fr; }
  .dp-layout__side { position: static; }
}
@media (max-width: 991px) {
  .dp-kpis { grid-template-columns: repeat(2, 1fr); }
  .dp-steps { grid-template-columns: repeat(2, 1fr); }
  .dp-grid { grid-template-columns: 1fr; }
  .dp-table__head { display: none; }
  .dp-row { grid-template-columns: 1fr auto; grid-template-areas: "main status" "client total" "meta actions"; gap: 4px 12px; padding: 12px 16px; }
  .dp-row__main { grid-area: main; padding: 0; }
  .dp-row__client { grid-area: client; color: var(--dp-muted); font-size: 13px; }
  .dp-row > [data-label="Statut"] { grid-area: status; text-align: right; }
  .dp-row > [data-label="Total TTC"] { grid-area: total; }
  .dp-row > [data-label="Articles"] { display: none; }
  .dp-row > [data-label="Mis à jour"] { grid-area: meta; text-align: left; font-size: 12px; }
  .dp-row__actions { grid-area: actions; }
  .dp-lines__head { display: none; }
  .dp-line, .dp-lines--nomargin .dp-line { grid-template-columns: 1fr auto; gap: 8px 12px; padding: 14px 16px; }
  .dp-line__product { grid-column: 1 / -1; padding-right: 40px; }
  .dp-line { position: relative; }
  .dp-line > .dp-icon-btn { position: absolute; top: 12px; right: 10px; }
  .dp-line > .dp-qty { justify-self: start; }
  .dp-line > [data-label]:not(form) { display: flex; justify-content: space-between; gap: 8px; grid-column: 1 / -1; font-size: 13px; }
  .dp-line > [data-label]:not(form)::before { content: attr(data-label); color: var(--dp-muted); font-weight: 500; }
}
@media (max-width: 575px) {
  .dp-head__title { font-size: 22px; }
  .dp-head > .dp-btn { width: 100%; }
  .dp-search { width: 100%; }
  .dp-form__row { grid-template-columns: 1fr; }
  .dp-steps { grid-template-columns: 1fr; }
  .dp-kpi__value { font-size: 18px; }
}

/* ---------- Confirmation d'ajout (toast) ---------- */
.dp-toast {
  position: fixed; right: 24px; bottom: 24px; z-index: 10050;
  display: flex; align-items: center; gap: 10px; max-width: min(460px, calc(100vw - 32px));
  padding: 14px 12px 14px 16px; border-radius: 12px; background: var(--dp-ink); color: #fff;
  box-shadow: 0 12px 32px rgba(20,33,61,.28); font-size: 14px; line-height: 1.35;
  opacity: 0; transform: translateY(16px); pointer-events: none; transition: opacity .2s, transform .2s;
}
.dp-toast.is-visible { opacity: 1; transform: none; pointer-events: auto; }
.dp-toast__icon { color: #5FD39B; font-size: 22px !important; flex: 0 0 auto; }
.dp-toast__text { flex: 1; }
.dp-toast__link { flex: 0 0 auto; padding: 8px 12px; border-radius: 8px; background: #fff; color: var(--dp-ink) !important; font-weight: 700; text-decoration: none !important; white-space: nowrap; }
.dp-toast__link:hover { background: var(--dp-accent-soft); }
.dp-toast__close { flex: 0 0 auto; width: 30px; height: 30px; border: 0; border-radius: 6px; background: transparent; color: rgba(255,255,255,.7); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; }
.dp-toast__close:hover { background: rgba(255,255,255,.12); color: #fff; }
@media (max-width: 575px) { .dp-toast { left: 16px; right: 16px; bottom: 16px; max-width: none; } }

/* ---------- Suivi commercial (oct. 2026) ---------- */
.dp-status--sm { height: 20px; padding: 0 8px; font-size: 11px; margin-top: 4px; align-self: flex-start; }
.dp-status--sales-submitted { background: var(--dp-warn-soft); color: var(--dp-warn); }
.dp-status--sales-offer { background: #EFE9FB; color: #5B3DB5; }
.dp-status--sales-in_cart { background: var(--dp-accent-soft); color: var(--dp-accent); }
.dp-status--sales-ordered { background: var(--dp-success-soft); color: var(--dp-success); }
.dp-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #E0452B; vertical-align: middle; margin-left: 4px; }

.dp-thread__intro { display: flex; gap: 14px; align-items: flex-start; margin-bottom: 6px; }
.dp-thread__intro .dp-card__title { margin-bottom: 4px; }
.dp-thread__intro p { margin: 0; font-size: 14px; }
.dp-thread__icon { flex: 0 0 44px; height: 44px; border-radius: 50%; background: var(--dp-accent-soft); color: var(--dp-accent); display: inline-flex; align-items: center; justify-content: center; }
.dp-thread__icon .material-icons { font-size: 22px; }
.dp-thread__list { display: flex; flex-direction: column; gap: 10px; margin-bottom: 16px; max-height: 420px; overflow-y: auto; padding-right: 4px; }
.dp-msg { max-width: 85%; padding: 10px 14px; border-radius: 12px; font-size: 14px; line-height: 1.45; }
.dp-msg__meta { font-size: 12px; color: var(--dp-muted); margin-bottom: 4px; }
.dp-msg--me { align-self: flex-end; background: var(--dp-soft); border-bottom-right-radius: 4px; }
.dp-msg--shop { align-self: flex-start; background: var(--dp-accent-soft); border-bottom-left-radius: 4px; }
.dp-msg--shop .dp-msg__meta strong { color: var(--dp-accent); }
.dp-thread__form { margin-top: 12px; padding-top: 14px; border-top: 1px solid var(--dp-line); gap: 10px; }

.dp-totals__discount dt, .dp-totals__discount dd { color: #5B3DB5; }
.dp-totals__discount dt { display: flex; align-items: center; gap: 6px; font-size: 13px; }
.dp-totals__discount .material-icons { font-size: 16px; }
.dp-totals__net { margin-top: 4px; padding: 8px 10px !important; border-radius: 8px; background: #EFE9FB; }
.dp-totals__net dt, .dp-totals__net dd { color: #3D2A82; font-weight: 700; }

/* Article offert mis en avant sur la ligne */
.dp-line--free { background: linear-gradient(90deg, #F6F2FE 0, #fff 60%); box-shadow: inset 3px 0 0 #7C5CE0; }
.dp-gift { display: inline-flex; align-items: center; gap: 4px; margin-top: 6px; padding: 3px 8px; border-radius: 6px; background: #7C5CE0; color: #fff; font-size: 12px; font-weight: 700; }
.dp-gift .material-icons { font-size: 15px; }
.dp-line s { color: var(--dp-faint); }
.dp-free-price { color: #5B3DB5; }

.dp-gift-wrap { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.dp-gift-wrap .dp-gift { margin-top: 0; white-space: nowrap; }
.dp-gift__save { font-size: 12px; font-weight: 700; color: #5B3DB5; white-space: nowrap; }

.dp-offer-banner { display: flex; align-items: center; gap: 14px; margin-bottom: 18px; padding: 14px 18px; border-radius: 12px; background: #5B3DB5; color: #fff; }
.dp-offer-banner .material-icons { font-size: 28px; flex: 0 0 auto; }
.dp-offer-banner strong { display: block; font-size: 15px; }
.dp-offer-banner span { font-size: 13px; opacity: .85; }
.dp-totals__discount dt { align-items: flex-start; }

/* ---- v18 : devis PDF de l'installateur ---- */
.dp-head__actions { display: flex; gap: 10px; flex-wrap: wrap; }
.dp-card__title .material-icons { color: var(--dp-accent); margin-right: 4px; }
.dp-pdf__notice { display: flex; align-items: center; gap: 14px; padding: 14px 20px; background: var(--dp-accent-soft); color: var(--dp-ink); font-size: 14px; border-bottom: 1px solid var(--dp-line); }
.dp-pdf__notice > .material-icons { color: var(--dp-accent); font-size: 24px; }
.dp-pdf__notice > div { flex: 1; }
.dp-pdf__notice--card { border: 1px solid #BFDCEA; border-radius: var(--dp-radius); margin-bottom: 20px; }
.dp-pdf__body { padding: 20px; }
.dp-pdf__opts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.dp-pdf__lines { border: 1px solid var(--dp-line); border-radius: 10px; overflow: hidden; }
.dp-pdf__lines-head, .dp-pdf__line { display: grid; grid-template-columns: minmax(0, 1fr) 56px 110px 130px; gap: 12px; align-items: center; padding: 10px 14px; }
.dp-pdf__lines-head { background: var(--dp-soft); font-size: 12px; font-weight: 600; color: var(--dp-muted); text-transform: uppercase; letter-spacing: .03em; }
.dp-pdf__line { border-top: 1px solid var(--dp-line); font-size: 14px; }
.dp-pdf__line .dp-field { gap: 3px; }
.dp-pdf__line .dp-field input { padding: 7px 10px; font-size: 14px; }
.dp-pdf__line .dp-field small { font-family: var(--dp-mono); font-size: 11px; }
.dp-pdf__line--extra { background: #FBFCFD; }
.dp-pdf__line--extra .dp-r { display: flex; align-items: center; justify-content: flex-end; gap: 6px; }
.dp-pdf__tag { display: inline-block; font-size: 11px; font-weight: 600; padding: 2px 8px; border-radius: 99px; background: var(--dp-success-soft); color: var(--dp-success); margin-right: 6px; }
.dp-icon-btn--xs { width: 26px; height: 26px; }
.dp-pdf__foot { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; flex-wrap: wrap; }
.dp-pdf__totals { margin: 0; min-width: 240px; font-size: 14px; }
.dp-pdf__totals > div { display: flex; justify-content: space-between; gap: 20px; padding: 3px 0; }
.dp-pdf__totals dt { font-weight: 400; color: var(--dp-muted); }
.dp-pdf__totals dd { margin: 0; font-variant-numeric: tabular-nums; }
.dp-pdf__ttc { border-top: 1px solid var(--dp-line); margin-top: 4px; padding-top: 8px !important; font-size: 16px; font-weight: 700; }
.dp-pdf__ttc dt { color: var(--dp-ink) !important; font-weight: 700 !important; }
.dp-pdf__add { display: grid; grid-template-columns: minmax(0, 1fr) 90px 130px auto; gap: 12px; align-items: end; padding: 16px 20px; border-top: 1px dashed var(--dp-line-strong); background: var(--dp-soft); }
.dp-pdf__hint { margin: 0; padding: 0 20px 16px; background: var(--dp-soft); font-size: 12px; color: var(--dp-faint); }
.dp-logo-field { display: flex; gap: 20px; align-items: center; }
.dp-logo-field__preview { width: 180px; height: 90px; border: 1px dashed var(--dp-line-strong); border-radius: 10px; display: flex; align-items: center; justify-content: center; background: #fff; flex: none; padding: 8px; }
.dp-logo-field__preview img { max-width: 100%; max-height: 100%; object-fit: contain; }
.dp-logo-field__preview span { display: flex; flex-direction: column; align-items: center; gap: 4px; color: var(--dp-faint); font-size: 12px; }
.dp-logo-field__preview .material-icons { font-size: 28px; }
.dp-logo-field .dp-field { flex: 1; }
.dp-logo-field .dp-link { margin-top: 4px; align-self: flex-start; }
.dp-color { height: 42px; padding: 4px !important; cursor: pointer; }
.dp-settings .dp-card { margin-bottom: 20px; }
.dp-settings .dp-card__title { margin-bottom: 16px; }
@media (max-width: 767px) {
  .dp-pdf__opts { grid-template-columns: 1fr; }
  .dp-pdf__lines-head { display: none; }
  .dp-pdf__line { grid-template-columns: 1fr auto auto; }
  .dp-pdf__line > :first-child { grid-column: 1 / -1; }
  .dp-pdf__add { grid-template-columns: 1fr 1fr; }
  .dp-pdf__add-label { grid-column: 1 / -1; }
  .dp-logo-field { flex-direction: column; align-items: stretch; }
  .dp-pdf__notice { flex-wrap: wrap; }
}
.dp-field label, .dp-margin label { text-align: left; }

/* ---- v20 : lignes produits adaptées à la largeur réelle de la carte (marge affichée = 2 colonnes de plus) ---- */
.dp-card--flush { container-type: inline-size; }
.dp-lines__head, .dp-line { grid-template-columns: minmax(0, 1fr) 128px 88px 88px 100px 34px; gap: 10px; }
.dp-lines--nomargin .dp-lines__head, .dp-lines--nomargin .dp-line { grid-template-columns: minmax(0, 1fr) 128px 100px 104px 34px; }
.dp-line__product > div { min-width: 0; }
@container (max-width: 640px) {
  .dp-lines__head { display: none; }
  .dp-line, .dp-lines--nomargin .dp-line { grid-template-columns: 1fr auto; gap: 8px 12px; padding: 14px 16px; position: relative; }
  .dp-line__product { grid-column: 1 / -1; padding-right: 40px; }
  .dp-line > .dp-icon-btn { position: absolute; top: 12px; right: 10px; }
  .dp-line > .dp-qty { justify-self: start; }
  .dp-line > [data-label]:not(form) { display: flex; justify-content: space-between; gap: 8px; grid-column: 1 / -1; font-size: 13px; }
  .dp-line > [data-label]:not(form)::before { content: attr(data-label); color: var(--dp-muted); font-weight: 500; }
}
@container (max-width: 560px) {
  .dp-pdf__opts { grid-template-columns: 1fr; }
  .dp-pdf__lines-head { display: none; }
  .dp-pdf__line { grid-template-columns: 1fr auto auto; }
  .dp-pdf__line > :first-child { grid-column: 1 / -1; }
  .dp-pdf__add { grid-template-columns: 1fr 1fr; }
  .dp-pdf__add-label { grid-column: 1 / -1; }
}

/* ---- v22 : marge par produit et remise / produit offert au client final ---- */
.dp-chip { display: inline-block; margin-left: 6px; padding: 1px 7px; border-radius: 99px; background: var(--dp-accent-soft); color: var(--dp-accent); font-size: 11px; font-weight: 600; white-space: nowrap; vertical-align: middle; }
.dp-chip--gift { background: #FDECF3; color: #A3245C; }
.dp-sale, .dp-line__total { display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: 2px 0; }
.dp-line__total s { color: var(--dp-faint); font-weight: 400; margin-right: 6px; }
.dp-totals__client dt, .dp-totals__client dd { color: #A3245C !important; }
.dp-totals__client .material-icons { font-size: 15px; vertical-align: -2px; }
.dp-check { display: flex; align-items: center; gap: 6px; margin-top: 6px; font-size: 12px; font-weight: 400 !important; color: var(--dp-muted) !important; text-align: left; }
.dp-check input { width: auto !important; margin: 0; }
.dp-pdf__lines-head, .dp-pdf__line { grid-template-columns: minmax(0, 1fr) 40px 84px 112px 92px 104px; gap: 10px; }
.dp-pct { display: inline-flex; align-items: center; justify-self: center; gap: 3px; }
.dp-pct input { width: 58px; padding: 6px 6px; border: 1px solid var(--dp-line-strong); border-radius: 8px; font-size: 13px; text-align: right; background: #fff; -moz-appearance: textfield; }
.dp-pct input::-webkit-outer-spin-button, .dp-pct input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.dp-pct input:focus { outline: none; border-color: var(--dp-accent); box-shadow: 0 0 0 3px var(--dp-accent-soft); }
.dp-pct i { font-style: normal; color: var(--dp-muted); font-size: 12px; }
.dp-gift-btn { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; margin-left: 2px; border: 1px solid var(--dp-line); border-radius: 8px; background: #fff; color: var(--dp-faint); cursor: pointer; padding: 0; }
.dp-gift-btn .material-icons { font-size: 16px !important; }
.dp-gift-btn:hover, .dp-gift-btn.is-on { color: #A3245C; border-color: #E7A9C4; background: #FDECF3; }
.dp-offered { color: #A3245C; }
.dp-pdf__line .dp-r s { font-size: 12px; }
.dp-pdf__disc dt, .dp-pdf__disc dd { color: #A3245C !important; }
@container (max-width: 700px) {
  .dp-pdf__lines-head { display: none; }
  .dp-pdf__line { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .dp-pdf__line > .dp-pct { justify-self: start; }
  .dp-pdf__line > :first-child { grid-column: 1 / -1; }
  .dp-pdf__line > .dp-pct::before { content: attr(data-label); font-size: 12px; color: var(--dp-muted); margin-right: 4px; }
  .dp-pdf__line > .dp-c:nth-child(2)::before { content: 'Qté '; color: var(--dp-muted); font-size: 12px; }
  .dp-pdf__line--extra > .dp-c.dp-muted { display: none; }
}

/* ---- v23 : pied de la carte « Devis pour mon client » ---- */
.dp-pdf__foot { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 24px; align-items: start; }
.dp-pdf__help { margin: 0; padding: 0; list-style: none; font-size: 13px; color: var(--dp-muted); display: flex; flex-direction: column; gap: 6px; }
.dp-pdf__help li { padding-left: 14px; position: relative; line-height: 1.45; }
.dp-pdf__help li::before { content: ''; position: absolute; left: 0; top: 8px; width: 5px; height: 5px; border-radius: 50%; background: var(--dp-line-strong); }
.dp-pdf__help strong { color: var(--dp-ink); font-weight: 600; }
.dp-pdf__help .material-icons { font-size: 15px !important; vertical-align: -3px; color: #A3245C; }
.dp-pdf__totals { min-width: 0; background: var(--dp-soft); border: 1px solid var(--dp-line); border-radius: 10px; padding: 12px 16px; }
.dp-pdf__totals > div { padding: 4px 0; }
.dp-pdf__totals dd { font-weight: 500; color: var(--dp-ink); white-space: nowrap; }
.dp-pdf__ht { border-top: 1px dashed var(--dp-line-strong); margin-top: 4px; padding-top: 8px !important; }
.dp-pdf__ht dt { color: var(--dp-ink) !important; font-weight: 600 !important; }
.dp-pdf__ttc { border-top: 1px solid var(--dp-line-strong); margin-top: 6px; padding-top: 10px !important; font-size: 17px; }
.dp-pdf__ttc dd { font-weight: 700; }
.dp-pdf__totals > div:first-child.dp-pdf__ht { border-top: 0; margin-top: 0; padding-top: 4px !important; }
.dp-pdf__actions { display: flex; align-items: center; justify-content: flex-end; gap: 10px; padding-top: 16px; border-top: 1px solid var(--dp-line); }
.dp-pdf__actions > span { margin-right: auto; font-size: 12px; }
.dp-totals__note { display: flex; gap: 6px; margin: 10px 0 0; padding: 10px 12px; border-radius: 8px; background: var(--dp-soft); font-size: 12px; line-height: 1.45; color: var(--dp-muted); }
.dp-totals__note .material-icons { font-size: 16px !important; color: var(--dp-accent); }
.dp-totals__note strong { color: var(--dp-ink); white-space: nowrap; }
@container (max-width: 640px) {
  .dp-pdf__foot { grid-template-columns: 1fr; }
  .dp-pdf__totals { order: -1; }
  .dp-pdf__actions { flex-wrap: wrap; }
  .dp-pdf__actions > span { width: 100%; }
  .dp-pdf__actions .dp-btn { flex: 1; }
}

/* ---- v24 : bloc « Devis pour mon client » repliable ---- */
.dp-pdf__summary { display: flex; align-items: center; gap: 14px; }
.dp-pdf__summary-title { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.dp-pdf__summary-sub { font-size: 12.5px; color: var(--dp-muted); }
.dp-pdf[open] .dp-pdf__summary-sub { display: none; }
.dp-pdf__summary-total { font-size: 13px; font-weight: 600; color: var(--dp-ink); background: var(--dp-soft); border: 1px solid var(--dp-line); border-radius: 99px; padding: 4px 12px; white-space: nowrap; font-variant-numeric: tabular-nums; }
.dp-pdf[open] .dp-pdf__summary-total { display: none; }
.dp-pdf__summary:hover .dp-card__title { color: var(--dp-accent); }
.dp-pdf__toolbar { display: flex; align-items: center; justify-content: flex-end; gap: 12px; padding: 12px 20px 0; }
.dp-pdf__toolbar > span { margin-right: auto; font-size: 13px; display: inline-flex; align-items: center; gap: 6px; }
.dp-pdf__toolbar .material-icons { font-size: 16px !important; }
.dp-pdf .dp-pdf__notice { margin-top: 12px; border-top: 1px solid var(--dp-line); }

/* ---- v27 : Devis express ---- */
.dpf-bolt { color: #F2A900; font-size: 26px !important; vertical-align: -4px; }
.dp-fast { padding-bottom: 96px; max-width: 860px; margin: 0 auto; }
.dpf-top { position: sticky; top: 0; z-index: 20; background: var(--dp-soft, #F3F5F8); padding: 10px 0; display: flex; flex-direction: column; gap: 10px; border-bottom: 1px solid var(--dp-line); margin-bottom: 12px; }
.dpf-row { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.dpf-seg { display: flex; background: #fff; border: 1px solid var(--dp-line); border-radius: 12px; padding: 3px; gap: 3px; overflow-x: auto; scrollbar-width: none; }
.dpf-seg::-webkit-scrollbar { display: none; }
.dpf-seg button { flex: 1 0 auto; border: 0; background: transparent; border-radius: 9px; padding: 9px 14px; font-size: 14px; font-weight: 600; color: var(--dp-muted); cursor: pointer; white-space: nowrap; display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 40px; }
.dpf-seg button.is-on { background: var(--dp-ink); color: #fff; }
.dpf-seg--sm button { padding: 7px 12px; }
.dpf-swatch { width: 14px; height: 14px; border-radius: 50%; border: 1px solid var(--dp-line-strong); display: inline-block; }
.dpf-swatch--w { background: #fff; }
.dpf-swatch--b { background: #1d1d1f; }
.dpf-nf { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; color: var(--dp-ink); margin: 0; }
.dpf-nf input { width: 18px; height: 18px; margin: 0; }
.dpf-search { flex: 1 1 220px; position: relative; }
.dpf-search .material-icons { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: var(--dp-faint); font-size: 20px !important; }
.dpf-search input { width: 100%; height: 44px; border: 1px solid var(--dp-line); border-radius: 12px; padding: 0 12px 0 40px; font-size: 16px; background: #fff; }
.dpf-search input:focus { outline: none; border-color: var(--dp-accent); box-shadow: 0 0 0 3px var(--dp-accent-soft); }
.dpf-packs { display: flex; align-items: center; gap: 8px; overflow-x: auto; padding: 2px 0 12px; scrollbar-width: none; }
.dpf-packs::-webkit-scrollbar { display: none; }
.dpf-packs__label { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--dp-muted); flex: none; }
.dpf-packs__label .material-icons { font-size: 16px !important; }
.dpf-chip { display: inline-flex; align-items: center; flex: none; border: 1px solid var(--dp-line-strong); border-radius: 99px; background: #fff; overflow: hidden; }
.dpf-chip button { border: 0; background: transparent; padding: 8px 14px; font-size: 13.5px; font-weight: 600; color: var(--dp-ink); cursor: pointer; white-space: nowrap; }
.dpf-chip button:hover { background: var(--dp-soft); }
.dpf-chip--mine { border-color: #BFDCEA; background: var(--dp-accent-soft); }
.dpf-chip--mine > button:first-child { color: var(--dp-accent); padding-right: 6px; }
.dpf-chip__x { padding: 8px 10px 8px 4px !important; color: var(--dp-muted) !important; }
.dpf-chip__x .material-icons { font-size: 16px !important; }
.dpf-fam { background: #fff; border: 1px solid var(--dp-line); border-radius: var(--dp-radius); margin-bottom: 10px; overflow: hidden; }
.dpf-fam__head { width: 100%; display: flex; align-items: center; gap: 10px; padding: 14px 16px; border: 0; background: #fff; cursor: pointer; font-size: 15px; font-weight: 700; color: var(--dp-ink); text-align: left; min-height: 52px; }
.dpf-fam__head > .material-icons:first-child { color: var(--dp-accent); font-size: 22px !important; }
.dpf-fam__head span { flex: 1; }
.dpf-fam__chev { color: var(--dp-muted); transition: transform .2s; }
.dpf-fam.is-open .dpf-fam__chev { transform: rotate(180deg); }
.dpf-fam__body { display: none; border-top: 1px solid var(--dp-line); }
.dpf-fam.is-open .dpf-fam__body { display: block; }
.dpf-badge { min-width: 24px; height: 24px; padding: 0 7px; border-radius: 99px; background: var(--dp-ink); color: #fff; font-size: 12.5px; display: inline-flex; align-items: center; justify-content: center; }
.dpf-item { display: grid; grid-template-columns: 48px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 10px 14px; border-top: 1px solid var(--dp-line); }
.dpf-item:first-child { border-top: 0; }
.dpf-item.has-qty { background: #F2F8FB; box-shadow: inset 3px 0 0 var(--dp-accent); }
.dpf-item__img { width: 48px; height: 48px; border-radius: 8px; background: var(--dp-soft); display: flex; align-items: center; justify-content: center; overflow: hidden; }
.dpf-item__img img { width: 100%; height: 100%; object-fit: contain; }
.dpf-item__img .material-icons { color: var(--dp-faint); }
.dpf-item__main { min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.dpf-item__name { font-weight: 700; color: var(--dp-ink); font-size: 14.5px; line-height: 1.25; }
.dpf-item__label { font-size: 12.5px; color: var(--dp-muted); line-height: 1.3; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dpf-item__meta { display: flex; align-items: center; gap: 8px; margin-top: 3px; font-size: 13px; color: var(--dp-ink); flex-wrap: wrap; }
.dpf-variant { font-size: 12px; border: 1px solid var(--dp-line); border-radius: 6px; padding: 2px 6px; background: #fff; color: var(--dp-muted); max-width: 150px; height: 26px; }
.dpf-variant--one { display: inline-flex; align-items: center; height: auto; padding: 1px 6px; }
.dpf-step { display: inline-flex; align-items: center; border: 1px solid var(--dp-line-strong); border-radius: 12px; overflow: hidden; background: #fff; }
.dpf-step button { width: 44px; height: 44px; border: 0; background: var(--dp-soft); font-size: 22px; font-weight: 600; color: var(--dp-ink); cursor: pointer; touch-action: manipulation; -webkit-user-select: none; user-select: none; }
.dpf-step button[data-step="1"] { background: var(--dp-ink); color: #fff; }
.dpf-step button:disabled { color: var(--dp-line-strong); cursor: default; }
.dpf-step input { width: 44px; height: 44px; border: 0; text-align: center; font-size: 17px; font-weight: 700; color: var(--dp-ink); -moz-appearance: textfield; padding: 0; background: #fff; }
.dpf-step input::-webkit-outer-spin-button, .dpf-step input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.dpf-more { width: 100%; border: 0; border-top: 1px dashed var(--dp-line); background: #fff; padding: 12px; font-size: 13.5px; font-weight: 600; color: var(--dp-accent); cursor: pointer; display: flex; align-items: center; justify-content: center; gap: 4px; }
.dpf-empty { padding: 24px; text-align: center; }
.dpf-bar { position: fixed; left: 50%; transform: translateX(-50%) translateY(140%); bottom: 16px; width: min(760px, calc(100% - 32px)); z-index: 1000; display: flex; align-items: center; gap: 12px; padding: 10px 10px 10px 18px; background: var(--dp-ink); color: #fff; border-radius: 16px; box-shadow: 0 10px 30px rgba(20, 33, 61, .35); transition: transform .25s; }
.dp-fast.has-items .dpf-bar { transform: translateX(-50%) translateY(0); }
.dpf-bar__sum { flex: 1; display: flex; flex-direction: column; line-height: 1.25; min-width: 0; }
.dpf-bar__sum strong { font-size: 15px; }
.dpf-bar__sum span { font-size: 13px; opacity: .8; font-variant-numeric: tabular-nums; }
.dpf-bar .dp-btn--primary { background: #fff; color: var(--dp-ink); min-height: 46px; }
.dpf-sheet { position: fixed; inset: 0; z-index: 1100; display: flex; align-items: flex-end; justify-content: center; }
.dpf-sheet[hidden] { display: none; }
.dpf-sheet__backdrop { position: absolute; inset: 0; background: rgba(20, 33, 61, .45); }
.dpf-sheet__panel { position: relative; width: min(640px, 100%); max-height: 92vh; display: flex; flex-direction: column; background: #fff; border-radius: 18px 18px 0 0; box-shadow: 0 -10px 40px rgba(0, 0, 0, .2); }
.dpf-sheet__head { display: flex; align-items: center; justify-content: space-between; padding: 14px 16px 10px 20px; border-bottom: 1px solid var(--dp-line); }
.dpf-sheet__head h2 { margin: 0; font-size: 18px; font-weight: 700; color: var(--dp-ink); }
.dpf-sheet__body { overflow-y: auto; padding: 14px 20px 24px; -webkit-overflow-scrolling: touch; }
.dpf-recap { list-style: none; margin: 0; padding: 0; }
.dpf-recap li { display: grid; grid-template-columns: 40px minmax(0, 1fr) auto; gap: 8px; padding: 8px 0; border-bottom: 1px solid var(--dp-line); font-size: 14px; align-items: start; }
.dpf-recap__q { font-weight: 700; color: var(--dp-accent); }
.dpf-recap__n { font-weight: 600; color: var(--dp-ink); }
.dpf-recap__n small { display: block; font-weight: 400; color: var(--dp-faint); font-family: var(--dp-mono); font-size: 11px; }
.dpf-recap__t { font-variant-numeric: tabular-nums; white-space: nowrap; }
.dpf-recap__total { display: flex; justify-content: space-between; padding: 12px 0 18px; font-size: 16px; color: var(--dp-ink); }
.dpf-form { gap: 12px; }
.dpf-form .dp-field input, .dpf-form .dp-field textarea, .dpf-form select { font-size: 16px; }
.dpf-mode { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; background: var(--dp-soft); border-radius: 12px; padding: 4px; }
.dpf-mode label { margin: 0; display: flex; align-items: center; justify-content: center; gap: 6px; padding: 10px; border-radius: 9px; font-size: 14px; font-weight: 600; color: var(--dp-muted); cursor: pointer; }
.dpf-mode label:has(input:checked) { background: #fff; color: var(--dp-ink); box-shadow: 0 1px 3px rgba(0, 0, 0, .08); }
.dpf-mode label.is-disabled { opacity: .5; cursor: default; }
.dpf-form .dp-btn--block { min-height: 50px; font-size: 16px; }
.dpf-savepack { margin-top: 20px; padding-top: 16px; border-top: 1px dashed var(--dp-line-strong); display: flex; flex-direction: column; gap: 6px; }
.dpf-savepack label { font-size: 13px; font-weight: 600; color: var(--dp-ink); margin: 0; }
.dpf-savepack__row { display: flex; gap: 8px; }
.dpf-savepack__row input { flex: 1; min-width: 0; height: 44px; border: 1px solid var(--dp-line-strong); border-radius: 10px; padding: 0 12px; font-size: 16px; }
.dpf-clear { margin-top: 16px; border: 0; background: none; padding: 0; cursor: pointer; }
.dpf-toast { position: fixed; left: 50%; bottom: 96px; transform: translateX(-50%) translateY(20px); opacity: 0; pointer-events: none; z-index: 1200; background: var(--dp-ink); color: #fff; padding: 10px 16px; border-radius: 10px; font-size: 14px; max-width: calc(100% - 32px); transition: all .25s; }
.dpf-toast.is-on { opacity: 1; transform: translateX(-50%) translateY(0); }
html.dpf-lock, html.dpf-lock body { overflow: hidden; }
@media (max-width: 575px) {
  .dpf-top { margin-left: -15px; margin-right: -15px; padding: 8px 15px; }
  .dpf-item { grid-template-columns: 40px minmax(0, 1fr) auto; gap: 10px; padding: 10px 12px; }
  .dpf-item__img { width: 40px; height: 40px; }
  .dpf-bar { width: auto; left: 12px; right: 84px; transform: translateY(140%); bottom: 12px; }
  .dp-fast.has-items .dpf-bar { transform: translateY(0); }
  .dpf-bar .dp-btn--primary { padding: 0 14px; }
  .dpf-bar .dp-btn--primary .material-icons { display: none; }
  .dpf-sheet__panel { max-height: 96vh; }
}
/* bouton Devis express dans la liste */
.dp-btn--fast { background: #F2A900; color: #14213D; }
.dp-btn--fast:hover { background: #E09C00; color: #14213D; }
@media (max-width: 575px) {
  .dpf-row { flex-wrap: nowrap; }
  .dpf-seg--sm button { font-size: 0; padding: 7px 10px; min-width: 42px; }
  .dpf-seg--sm .dpf-swatch { width: 18px; height: 18px; }
  .dpf-seg--sm button.is-on .dpf-swatch { box-shadow: 0 0 0 2px #fff; }
  .dpf-search { flex: 1 1 auto; min-width: 0; }
  .dpf-nf { font-size: 12px; flex: none; }
}
.dp-fast label { text-align: left; }
.dpf-mode label { text-align: center; line-height: 1.2; }
.dpf-mode input { flex: none; margin: 0; }
/* v30 : barre du Devis express */
.dpf-bar { padding: 10px; }
.dpf-bar__sum { padding-left: 8px; }
.dpf-bar__reset { flex: none; display: inline-flex; flex-direction: column; align-items: center; justify-content: center; gap: 0; width: 52px; height: 48px; border: 1px solid rgba(255, 255, 255, .25); border-radius: 12px; background: transparent; color: #fff; cursor: pointer; font-size: 10.5px; font-weight: 700; letter-spacing: .05em; }
.dpf-bar__reset .material-icons { font-size: 20px !important; }
.dpf-bar__reset:hover { background: rgba(255, 255, 255, .1); }
.dpf-bar__go { flex: none; display: inline-flex; align-items: center; gap: 8px; height: 48px; padding: 0 18px; border: 0; border-radius: 12px; background: #F2A900; color: #14213D; font-size: 15.5px; font-weight: 800; cursor: pointer; box-shadow: 0 2px 0 rgba(0, 0, 0, .15); }
.dpf-bar__go:hover { background: #FFB812; }
.dpf-bar__go .material-icons { font-size: 20px !important; }
.dpf-bar__go:disabled, .dpf-bar__reset:disabled { opacity: .5; cursor: default; }
.dpf-packs__hint { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--dp-muted); white-space: normal; }
.dpf-packs__hint .material-icons { font-size: 18px !important; color: var(--dp-accent); }
@media (max-width: 575px) {
  .dpf-bar__go { padding: 0 12px; font-size: 14.5px; }
  .dpf-bar__go .material-icons { display: inline-block; }
  .dpf-bar__reset { width: 44px; }
}