/*
 * Tableaux de mensurations (fiche produit) — une seule feuille pour toutes les boutiques.
 * Les couleurs par boutique reprennent celles validées par le client sur ses premiers tableaux.
 */
:root {
  --gdt-btn-bg: #1f1f1f; --gdt-btn-text: #fff; --gdt-btn-border: #1f1f1f;
  --gdt-accent: #1f1f1f; --gdt-accent-text: #fff;
  --gdt-close-bg: #1f1f1f; --gdt-close-text: #fff;
  --gdt-head-bg: #f3f3f3; --gdt-border: #dcd8d2; --gdt-text: #262626;
  --gdt-radius: 6px; --gdt-font: inherit;
}
body.shop-1  { --gdt-btn-bg: #ab3f3a; --gdt-btn-border: #ab3f3a; --gdt-accent: #ab3f3a; --gdt-close-bg: #ab3f3a; --gdt-head-bg: #f2f2f2; --gdt-radius: 0; }
body.shop-2  { --gdt-btn-bg: #ffed00; --gdt-btn-text: #000; --gdt-btn-border: #000; --gdt-accent: #252525; --gdt-close-bg: #fff7a6; --gdt-close-text: #222; --gdt-head-bg: #ffed00; --gdt-radius: 8px; }
body.shop-5  { --gdt-btn-bg: #000; --gdt-btn-border: #000; --gdt-accent: #000; --gdt-close-bg: #000; --gdt-head-bg: #f2f2f2; --gdt-radius: 0; --gdt-font: PorscheTT, Arial, sans-serif; }
body.shop-7  { --gdt-btn-bg: #614b79; --gdt-btn-border: #614b79; --gdt-accent: #614b79; --gdt-close-bg: #614b79; --gdt-head-bg: #f2eef7; --gdt-radius: 5px; }
body.shop-8  { --gdt-btn-bg: #4a2e1e; --gdt-btn-border: #4a2e1e; --gdt-accent: #4a2e1e; --gdt-close-bg: #4a2e1e; --gdt-head-bg: #f5eee5; --gdt-radius: 5px; }
body.shop-9  { --gdt-btn-bg: #d60033; --gdt-btn-border: #d60033; --gdt-accent: #d60033; --gdt-close-bg: #d60033; --gdt-head-bg: #fff2f5; --gdt-radius: 8px; }
body.shop-10 { --gdt-btn-bg: #fdc756; --gdt-btn-border: #fdc756; --gdt-accent: #fdc756; --gdt-accent-text: #262626; --gdt-close-bg: #fdc756; --gdt-close-text: #262626; --gdt-head-bg: #fff8e8; --gdt-radius: 8px; }
body.shop-11 { --gdt-btn-bg: #d36c40; --gdt-btn-border: #d36c40; --gdt-accent: #d36c40; --gdt-close-bg: #d36c40; --gdt-close-text: #262626; --gdt-head-bg: #fcf3ee; --gdt-radius: 8px; }
body.shop-12 { --gdt-btn-bg: #fff; --gdt-btn-text: #822795; --gdt-btn-border: #ad3cc6; --gdt-accent: #9234a7; --gdt-close-bg: #f3e7f7; --gdt-close-text: #682377; --gdt-head-bg: #fcf7fd; --gdt-radius: 8px; }

.gdt-guide { margin: 12px 0 16px; text-align: left; width: 100%; }

.gdt-guide__button {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  width: 100%; padding: 14px 18px; cursor: pointer;
  background: var(--gdt-btn-bg); color: var(--gdt-btn-text);
  border: 1.5px solid var(--gdt-btn-border); border-radius: var(--gdt-radius);
  font: 600 15px/1.4 var(--gdt-font); text-transform: none; text-align: left;
}
.gdt-guide__button span:first-of-type { flex: 1; }
.gdt-guide__button:hover, .gdt-guide__button:focus-visible { filter: brightness(1.08); }
.gdt-guide__button:focus-visible { outline: 2px solid var(--gdt-text); outline-offset: 2px; }
.gdt-info { margin: 10px 0; color: var(--gdt-text); font: 14px/1.5 var(--gdt-font); }
.gdt-guide__hint { margin: 8px 0 0; color: var(--gdt-text); font: 13px/1.5 var(--gdt-font); }

.gdt-dialog {
  width: min(850px, 94vw); max-width: 94vw; max-height: 90vh; overflow: auto;
  padding: 0; border: 0; border-radius: 10px;
  background: #fff; color: var(--gdt-text); font: 15px/1.5 var(--gdt-font);
  box-shadow: 0 15px 60px rgba(0, 0, 0, .5);
}
.gdt-dialog::backdrop { background: rgba(0, 0, 0, .6); }
.gdt-dialog__head {
  position: sticky; top: 0; z-index: 2;
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 16px 22px; background: var(--gdt-head-bg);
}
.gdt-dialog__head h2 { margin: 0; color: var(--gdt-text); font: 700 21px/1.3 var(--gdt-font); text-transform: none; }
.gdt-dialog__close {
  display: flex; align-items: center; justify-content: center; flex: none;
  width: 36px; height: 36px; padding: 0; cursor: pointer;
  background: var(--gdt-close-bg); color: var(--gdt-close-text); border: 0; border-radius: 50%;
}
.gdt-dialog__content { padding: 18px 24px 22px; }
.gdt-section + .gdt-section { margin-top: 28px; padding-top: 22px; border-top: 1px solid var(--gdt-border); }
.gdt-section__title { margin: 0 0 10px; font: 700 17px/1.3 var(--gdt-font); color: var(--gdt-text); text-transform: none; }
.gdt-intro { margin: 0 0 14px; color: var(--gdt-text); }

.gdt-how { display: grid; grid-template-columns: minmax(200px, 1fr) minmax(220px, 1.15fr); gap: 22px; align-items: center; margin: 0 0 16px; }
.gdt-how__legend p { margin: 0 0 10px; font-size: 14px; color: var(--gdt-text); }
.gdt-letter {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 22px; height: 22px; margin-right: 4px; padding: 0 4px; border-radius: 11px;
  background: var(--gdt-accent); color: var(--gdt-accent-text); font-size: 13px; font-weight: 700;
}

.gdt-schema { display: block; width: 100%; max-height: 300px; }
.gdt-schema__shape { fill: #fafafa; stroke: #63616c; stroke-width: 1.6; stroke-linejoin: round; }
.gdt-schema__arrows { fill: none; stroke: var(--gdt-text); stroke-width: 2; }
.gdt-schema marker path { fill: var(--gdt-text); }
.gdt-schema__letters { fill: var(--gdt-text); stroke: #fff; stroke-width: 4px; paint-order: stroke; font: 700 17px Arial, sans-serif; text-anchor: middle; }

.gdt-tablewrap { overflow-x: auto; }
.gdt-table { width: 100%; margin: 4px 0 14px; border-collapse: collapse; font: 14px/1.4 var(--gdt-font); color: var(--gdt-text); }
.gdt-table caption { caption-side: top; padding: 0 0 8px; text-align: left; font-weight: 700; color: var(--gdt-text); }
.gdt-table th, .gdt-table td { padding: 9px 10px; border: 1px solid var(--gdt-border); text-align: center; }
.gdt-table thead th { background: var(--gdt-accent); color: var(--gdt-accent-text); font-weight: 700; vertical-align: top; }
.gdt-table thead th b { display: block; }
.gdt-table thead th span { display: block; font-weight: 400; font-size: 12px; }
.gdt-table tbody th { background: var(--gdt-head-bg); font-weight: 700; white-space: nowrap; }
.gdt-note { margin: 0 0 10px; padding: 10px 12px; background: var(--gdt-head-bg); font-size: 13px; color: var(--gdt-text); }
.gdt-note--small { padding: 0; background: none; opacity: .8; }

@media (max-width: 600px) {
  .gdt-how { grid-template-columns: 1fr; gap: 10px; }
  .gdt-schema { max-height: 220px; }
  .gdt-dialog__head { padding: 12px 14px; }
  .gdt-dialog__head h2 { font-size: 18px; }
  .gdt-dialog__content { padding: 14px; }
  .gdt-table th, .gdt-table td { padding: 7px 6px; }
}