/* CUG Print Configurator — charte CUG, durci contre les styles du thème pixfort
   (radios custom en ::before, input[type=radio]+span{display:inline}, span{color:#333}) */
.cug-ppc {
  --ppc-encre: var(--cug-encre, #1a0b06);
  --ppc-signal: var(--cug-signal, #0234e6);
  --ppc-ivoire: var(--cug-ivoire, #f5f2ee);
  --ppc-border: rgba(26, 11, 6, 0.14);
  --ppc-ease: cubic-bezier(0.23, 1, 0.32, 1);
  margin: 24px 0;
  color: var(--ppc-encre);
  font-size: 16px;
  line-height: 1.5;
}
.cug-ppc [hidden] { display: none !important; }
.cug-ppc :focus-visible { outline: 2px solid var(--ppc-signal); outline-offset: 2px; }
.cug-ppc span, .cug-ppc strong, .cug-ppc small, .cug-ppc em { color: inherit; }

/* ---- Stepper ---- */
.cug-ppc-steps {
  display: flex; flex-wrap: wrap; gap: 4px;
  list-style: none; margin: 0 0 26px; padding: 0;
}
.cug-ppc-step-ind {
  flex: 1 1 auto; display: flex; align-items: center; gap: 7px;
  padding: 8px 6px; border-bottom: 2.5px solid var(--ppc-border);
  font-size: 13px; font-weight: 600; color: rgba(26, 11, 6, 0.5);
  transition: color 200ms var(--ppc-ease), border-color 200ms var(--ppc-ease);
}
.cug-ppc-step-num {
  display: inline-flex; align-items: center; justify-content: center;
  width: 22px; height: 22px; border-radius: 50%;
  border: 1.5px solid currentColor; font-size: 12px; flex: none;
}
.cug-ppc-step-ind.is-active { color: var(--ppc-signal); border-color: var(--ppc-signal); }
.cug-ppc-step-ind.is-done { color: var(--ppc-encre); border-color: var(--ppc-encre); }
.cug-ppc-step-ind.is-done .cug-ppc-step-num { background: var(--ppc-encre); color: var(--ppc-ivoire); border-color: var(--ppc-encre); }

/* ---- Sections ---- */
.cug-ppc-section { margin: 0 0 30px; }
.cug-ppc-title {
  font-size: 19px; font-weight: 700; margin: 0 0 14px; color: var(--ppc-encre);
}
.cug-ppc-title span { color: var(--ppc-signal); }

/* ---- Cartes d'option ---- */
.cug-ppc-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 12px; }
.cug-ppc-card { position: relative; display: block; cursor: pointer; min-width: 0; margin: 0; }
.cug-ppc-card input {
  position: absolute !important; width: 1px !important; height: 1px !important;
  margin: 0 !important; padding: 0 !important; border: 0 !important;
  opacity: 0 !important; -webkit-appearance: none !important; appearance: none !important;
  clip-path: inset(50%); overflow: hidden;
}
.cug-ppc-card-in {
  display: flex !important; flex-direction: column; gap: 6px;
  min-width: 0; height: 100%; overflow-wrap: anywhere;
  padding: 16px; margin: 0 !important;
  border: 1.5px solid var(--ppc-border); border-radius: 14px;
  background: #fff;
  transition: border-color 180ms var(--ppc-ease), background-color 180ms var(--ppc-ease), box-shadow 180ms var(--ppc-ease);
}
.cug-ppc-card-in::before, .cug-ppc-card-in::after { content: none !important; display: none !important; }
.cug-ppc-card-in strong { font-size: 15px; line-height: 1.3; color: var(--ppc-encre); }
.cug-ppc-card-in small { font-size: 13px; line-height: 1.45; color: rgba(26, 11, 6, 0.62); font-weight: 400; }
.cug-ppc-card input:checked + .cug-ppc-card-in {
  border-color: var(--ppc-signal);
  background: rgba(2, 52, 230, 0.045);
  box-shadow: 0 0 0 1px var(--ppc-signal) inset;
}
.cug-ppc-card input:focus-visible + .cug-ppc-card-in { outline: 2px solid var(--ppc-signal); outline-offset: 2px; }
.cug-ppc-card.is-off { cursor: not-allowed; }
.cug-ppc-card.is-off .cug-ppc-card-in { opacity: 0.55; background: rgba(26, 11, 6, 0.02); }

/* badges */
.cug-ppc-badge {
  align-self: flex-start; font-style: normal; font-weight: 700; font-size: 11px;
  text-transform: uppercase; letter-spacing: 0.05em;
  padding: 3px 9px; border-radius: 999px;
}
.cug-ppc-badge--top-vente { background: var(--ppc-signal); color: #fff; }
.cug-ppc-badge--inclus { background: rgba(98, 77, 70, 0.12); color: var(--cug-atelier, #624d46); }
.cug-ppc-badge--bientot { background: rgba(26, 11, 6, 0.08); color: rgba(26, 11, 6, 0.6); }

/* ---- Pictos (flat, sans photos) ---- */
.cug-ppc-picto { display: block; width: 54px; height: 40px; position: relative; margin-bottom: 2px; }
.cug-ppc-picto::before, .cug-ppc-picto::after {
  content: "" !important; display: block !important; position: absolute;
  border: 2px solid var(--cug-atelier, #624d46); border-radius: 3px; background: var(--ppc-ivoire);
}
.cug-ppc-picto--rect::before { width: 46px; height: 30px; top: 5px; left: 0; }
.cug-ppc-picto--square::before { width: 32px; height: 32px; top: 4px; left: 7px; }
.cug-ppc-picto--fold-h::before { width: 26px; height: 30px; top: 5px; left: 4px; transform: skewY(-6deg); }
.cug-ppc-picto--fold-h::after { width: 26px; height: 30px; top: 5px; left: 26px; transform: skewY(6deg); }
.cug-ppc-picto--fold-v::before { width: 34px; height: 18px; top: 3px; left: 8px; transform: skewX(-8deg); }
.cug-ppc-picto--fold-v::after { width: 34px; height: 18px; top: 19px; left: 8px; }
.cug-ppc-picto--recto::before { width: 24px; height: 34px; top: 3px; left: 12px; }
.cug-ppc-picto--recto-verso::before { width: 24px; height: 34px; top: 3px; left: 2px; }
.cug-ppc-picto--recto-verso::after { width: 24px; height: 34px; top: 3px; left: 30px; background: rgba(2, 52, 230, 0.08); border-color: var(--ppc-signal); }
.cug-ppc-picto--paper::before { width: 34px; height: 34px; top: 3px; left: 8px; border-radius: 3px 14px 3px 3px; }
.cug-ppc-picto--finish::before { width: 42px; height: 30px; top: 5px; left: 4px; background: linear-gradient(135deg, var(--ppc-ivoire) 60%, rgba(98, 77, 70, 0.25)); }
.cug-ppc-picto--none::before { width: 42px; height: 30px; top: 5px; left: 4px; }
.cug-ppc-picto--gloss::before { width: 42px; height: 30px; top: 5px; left: 4px; background: linear-gradient(115deg, var(--ppc-ivoire) 55%, rgba(2, 52, 230, 0.18) 56%, var(--ppc-ivoire) 70%); }
.cug-ppc-picto--gold::before { width: 42px; height: 30px; top: 5px; left: 4px; background: linear-gradient(115deg, var(--ppc-ivoire) 55%, rgba(198, 96, 46, 0.4) 56%, var(--ppc-ivoire) 75%); }
.cug-ppc-picto--corner::before { width: 42px; height: 30px; top: 5px; left: 4px; border-radius: 0; }
.cug-ppc-picto--corner-round::before { width: 42px; height: 30px; top: 5px; left: 4px; border-radius: 12px; }

/* ---- Grille de quantités ---- */
.cug-ppc-qty { width: 100%; border-collapse: collapse; font-size: 15px; }
.cug-ppc-qty th {
  text-align: left; font-size: 12.5px; text-transform: uppercase; letter-spacing: 0.05em;
  color: rgba(26, 11, 6, 0.55); padding: 8px 10px; border-bottom: 2px solid var(--ppc-border);
}
.cug-ppc-qty td { padding: 13px 10px; border-bottom: 1px solid var(--ppc-border); color: var(--ppc-encre); }
.cug-ppc-qty tbody tr { cursor: pointer; transition: background-color 160ms var(--ppc-ease); }
.cug-ppc-qty tbody tr:hover { background: rgba(2, 52, 230, 0.04); }
.cug-ppc-qty tr.is-selected { background: rgba(2, 52, 230, 0.06); }
.cug-ppc-qty tr.is-selected .cug-ppc-qty-prix { color: var(--ppc-signal); font-weight: 700; }
.cug-ppc-qty-pick { width: 44px; text-align: center; }
.cug-ppc-radio {
  display: inline-block; width: 20px; height: 20px; border-radius: 50%;
  border: 2px solid var(--ppc-border); transition: border-color 160ms var(--ppc-ease), box-shadow 160ms var(--ppc-ease);
}
.cug-ppc-radio::before, .cug-ppc-radio::after { content: none !important; }
.cug-ppc-qty tr.is-selected .cug-ppc-radio {
  border-color: var(--ppc-signal);
  box-shadow: 0 0 0 5px rgba(2, 52, 230, 0.15) inset;
  background: var(--ppc-signal);
}
.cug-ppc-note { font-size: 13px; color: rgba(26, 11, 6, 0.65); margin: 10px 0 0; }

/* ---- Inclus ---- */
.cug-ppc-inclus { list-style: none; margin: 0 0 22px; padding: 16px 18px; border-radius: 12px; background: rgba(26, 11, 6, 0.035); }
.cug-ppc-inclus li { display: flex; align-items: flex-start; gap: 9px; font-size: 14px; padding: 4px 0; color: var(--ppc-encre); }
.cug-ppc-inclus svg { flex: none; margin-top: 3px; color: var(--ppc-signal); }

/* ---- Barre récap + CTA ---- */
.cug-ppc-bar {
  display: flex; align-items: center; gap: 18px; flex-wrap: wrap;
  padding: 18px; border-radius: 14px; background: rgba(26, 11, 6, 0.04);
}
.cug-ppc-recap { flex: 1 1 260px; min-width: 0; }
.cug-ppc-recap-config { display: block; font-size: 13px; color: rgba(26, 11, 6, 0.65); margin-bottom: 3px; }
.cug-ppc-recap-prix { font-size: 26px; font-weight: 700; color: var(--ppc-signal); }
.cug-ppc-btn {
  min-height: 52px; padding: 14px 30px; border: 0; border-radius: 999px;
  background: var(--ppc-signal); color: #fff !important; font: inherit; font-weight: 700;
  cursor: pointer; transition: opacity 180ms var(--ppc-ease), transform 120ms var(--ppc-ease);
}
.cug-ppc-btn:hover { opacity: 0.92; color: #fff !important; }
.cug-ppc-btn:active { transform: scale(0.985); }
.cug-ppc-btn:disabled { opacity: 0.45; cursor: not-allowed; transform: none; }

/* ---- Responsive ---- */
@media (max-width: 640px) {
  .cug-ppc-cards { grid-template-columns: 1fr 1fr; }
  .cug-ppc-step-lbl { font-size: 11px; }
  .cug-ppc-qty { font-size: 14px; }
  .cug-ppc-qty th:nth-child(2), .cug-ppc-qty td:nth-child(2) { display: none; }
  .cug-ppc-bar { flex-direction: column; align-items: stretch; text-align: center; }
}
@media (max-width: 420px) {
  .cug-ppc-cards { grid-template-columns: 1fr; }
}

/* ---- Reduced motion ---- */
@media (prefers-reduced-motion: reduce) {
  .cug-ppc *, .cug-ppc *::before, .cug-ppc *::after { transition-duration: 0.01ms !important; }
}

/* ---- Pleine largeur : le configurateur sort de la colonne summary ---- */
.single-product div.product:has(.cug-ppc) .woocommerce-product-gallery,
.single-product div.product:has(.cug-ppc) .pix-product-images,
.single-product div.product:has(.cug-ppc) > .row > [class*="col"]:first-child:not(:has(.summary)) {
  display: none !important;
}
.single-product div.product:has(.cug-ppc) .summary,
.single-product div.product:has(.cug-ppc) .entry-summary {
  width: 100% !important;
  max-width: 100% !important;
  float: none !important;
  flex: 0 0 100% !important;
  margin-left: 0 !important;
}

/* ---- v1.1 : wizard une étape à la fois ---- */
.cug-ppc--wizard .cug-ppc-section { display: none; }
.cug-ppc--wizard .cug-ppc-section.is-current { display: block; animation: cugPpcIn 240ms var(--ppc-ease) both; }
@keyframes cugPpcIn {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: none; }
}
.cug-ppc-step-ind.is-reachable { cursor: pointer; }
.cug-ppc-step-ind.is-reachable:hover { color: var(--ppc-signal); }
.cug-ppc-nav { display: flex; justify-content: space-between; gap: 12px; margin-top: 6px; }
.cug-ppc-btn--ghost {
  display: inline-flex; align-items: center; gap: 7px;
  min-height: 46px; padding: 10px 18px; border: 1.5px solid var(--ppc-border); border-radius: 999px;
  background: transparent; font: inherit; font-size: 14px; font-weight: 600; color: var(--ppc-encre);
  cursor: pointer; transition: border-color 180ms var(--ppc-ease);
}
.cug-ppc-btn--ghost:hover { border-color: var(--ppc-encre); }
.cug-ppc-btn--small {
  display: inline-flex; align-items: center; gap: 8px; margin-left: auto;
  min-height: 46px; padding: 10px 22px; border: 0; border-radius: 999px;
  background: var(--ppc-encre); color: #fff !important; font: inherit; font-size: 14.5px; font-weight: 700;
  cursor: pointer; transition: opacity 180ms var(--ppc-ease);
}
.cug-ppc-btn--small:hover { opacity: 0.9; color: #fff !important; }

/* ---- v1.1 : upload de fichiers ---- */
.cug-ppc-dropzone {
  display: flex; flex-direction: column; align-items: center; gap: 6px;
  width: 100%; padding: 26px 18px; margin-bottom: 14px;
  border: 2px dashed var(--ppc-border); border-radius: 14px;
  background: rgba(26, 11, 6, 0.02);
  font: inherit; color: var(--ppc-encre); text-align: center; cursor: pointer;
  transition: border-color 180ms var(--ppc-ease), background-color 180ms var(--ppc-ease);
}
.cug-ppc-dropzone:hover, .cug-ppc-dropzone.is-over { border-color: var(--ppc-signal); background: rgba(2, 52, 230, 0.04); }
.cug-ppc-dropzone svg { color: var(--ppc-signal); }
.cug-ppc-dropzone strong { font-size: 16px; }
.cug-ppc-drop-sub { font-size: 13px; color: rgba(26, 11, 6, 0.62); }
.cug-ppc-drop-cta {
  margin-top: 6px; padding: 9px 16px; border-radius: 999px;
  background: var(--ppc-signal); color: #fff; font-weight: 700; font-size: 14px;
}
.cug-ppc-drop-cta em { font-style: normal; font-weight: 400; opacity: 0.85; }
.cug-ppc-files { list-style: none; margin: 0 0 6px; padding: 0; }
.cug-ppc-file {
  display: flex; align-items: center; gap: 10px;
  padding: 9px 12px; margin-bottom: 6px;
  border: 1px solid var(--ppc-border); border-radius: 10px; background: #fff;
  font-size: 14px; animation: cugPpcIn 200ms var(--ppc-ease) both;
}
.cug-ppc-file-nom { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cug-ppc-file-etat { font-style: normal; font-size: 12.5px; font-weight: 600; color: rgba(26, 11, 6, 0.55); }
.cug-ppc-file.is-done .cug-ppc-file-etat { color: #2F9E63; }
.cug-ppc-file.is-error { border-color: #D64533; }
.cug-ppc-file.is-error .cug-ppc-file-etat { color: #D64533; }
.cug-ppc-file-x {
  width: 24px; height: 24px; border: 1px solid var(--ppc-border); border-radius: 50%;
  background: transparent; cursor: pointer; font-size: 13px; line-height: 1; color: var(--ppc-encre);
}
.cug-ppc-file-x:hover { border-color: #D64533; color: #D64533; }

/* ---- v1.1 : récap final ---- */
.cug-ppc-recap-final { margin: 18px 0; padding: 16px 18px; border-radius: 12px; background: rgba(26, 11, 6, 0.035); }
.cug-ppc-recap-final h4 { margin: 0 0 8px; font-size: 15px; color: var(--ppc-encre); }
.cug-ppc-recap-list { list-style: none; margin: 0; padding: 0; font-size: 14px; }
.cug-ppc-recap-list li { display: flex; justify-content: space-between; gap: 14px; padding: 5px 0; border-bottom: 1px dashed var(--ppc-border); }
.cug-ppc-recap-list li:last-child { border-bottom: 0; }
.cug-ppc-recap-list span { color: rgba(26, 11, 6, 0.6); }
.cug-ppc-recap-list strong { text-align: right; color: var(--ppc-encre); }

/* ---- v1.1.1 : une étape tient à l'écran, navigation toujours visible ---- */
.cug-ppc { scroll-margin-top: 150px; }
.cug-ppc-steps { margin-bottom: 16px; }
.cug-ppc-section { margin-bottom: 12px; }
.cug-ppc-title { font-size: 17px; margin-bottom: 10px; }
.cug-ppc-cards { gap: 10px; }
.cug-ppc-card-in { padding: 12px 14px; gap: 4px; }
.cug-ppc-card-in small { font-size: 12.5px; line-height: 1.35; }
.cug-ppc-picto { width: 44px; height: 32px; transform: scale(0.82); transform-origin: left top; margin-bottom: 0; }
.cug-ppc-qty td { padding: 10px 10px; }
.cug-ppc-nav {
  position: sticky; bottom: 10px; z-index: 5;
  margin-top: 10px; padding: 10px;
  border-radius: 999px;
  background: rgba(245, 242, 238, 0.85);
  -webkit-backdrop-filter: blur(12px) saturate(150%);
  backdrop-filter: blur(12px) saturate(150%);
  border: 1px solid rgba(26, 11, 6, 0.07);
}
.cug-ppc--wizard .cug-ppc-bar { position: sticky; bottom: 10px; z-index: 5; }
@media (max-width: 640px) {
  .cug-ppc-card-in small { display: none; }
  .cug-ppc-cards { gap: 8px; }
}

/* ---- v1.1.2 : dégager l'espace au-dessus du wizard ---- */
/* fourchette de prix Woo redondante avec la grille de quantités, titre déjà dans le bandeau de page */
.single-product div.product:has(.cug-ppc) .summary p.price,
.single-product div.product:has(.cug-ppc) .summary .price,
.single-product div.product:has(.cug-ppc) .summary .product_title {
  display: none !important;
}
.single-product div.product:has(.cug-ppc) .summary .woocommerce-product-details__short-description {
  margin: 0 0 10px; font-size: 14.5px;
}
.single-product div.product:has(.cug-ppc) .summary .posted_in { display: none !important; }

/* ---- v1.3 : quantités indisponibles pour la combinaison ---- */
.cug-ppc-qty tr.is-indispo { opacity: 0.35; cursor: not-allowed; }
.cug-ppc-qty tr.is-indispo .cug-ppc-qty-prix { visibility: hidden; }

/* ---- v1.4 : produits au m² (bâche) ---- */
.cug-ppc-dims-grid { display: grid; grid-template-columns: repeat(3, minmax(140px, 220px)); gap: 14px; }
.cug-ppc-field { display: block; font-weight: 600; font-size: 15px; color: var(--ppc-encre); }
.cug-ppc-suffix { position: relative; display: block; margin-top: 6px; }
.cug-ppc-suffix input {
  display: block; width: 100%; min-height: 46px; padding: 10px 44px 10px 12px;
  border: 1.5px solid var(--ppc-border); border-radius: 10px;
  font: inherit; font-weight: 400; background: #fff; color: var(--ppc-encre);
}
.cug-ppc-suffix input:focus { border-color: var(--ppc-signal); outline: none; }
.cug-ppc-suffix i {
  position: absolute; right: 12px; top: 50%; transform: translateY(-50%);
  font-style: normal; font-weight: 600; font-size: 13.5px; opacity: 0.55; pointer-events: none;
}
.cug-ppc-surface { margin: 12px 0 0; font-size: 14px; font-weight: 600; color: var(--ppc-signal); }
@media (max-width: 640px) { .cug-ppc-dims-grid { grid-template-columns: 1fr; } }

/* ---- v1.5 : lignes de dimensions multiples ---- */
.cug-ppc-ligne {
  display: grid; grid-template-columns: 1fr 1fr 1fr auto 32px; gap: 12px; align-items: end;
  padding: 12px 0; border-bottom: 1px dashed var(--ppc-border);
}
.cug-ppc-ligne label { font-weight: 600; font-size: 13px; color: var(--ppc-encre); }
.cug-ppc-ligne-prix { min-width: 92px; text-align: right; color: var(--ppc-signal); font-size: 15px; padding-bottom: 12px; }
.cug-ppc-ligne-x {
  width: 30px; height: 30px; margin-bottom: 8px; border: 1px solid var(--ppc-border); border-radius: 50%;
  background: transparent; cursor: pointer; font-size: 15px; line-height: 1; color: var(--ppc-encre);
  transition: border-color 160ms var(--ppc-ease), color 160ms var(--ppc-ease);
}
.cug-ppc-ligne-x:hover { border-color: #D64533; color: #D64533; }
.cug-ppc-add-ligne {
  display: inline-flex; align-items: center; gap: 7px; margin-top: 12px;
  min-height: 42px; padding: 9px 18px; border: 1.5px dashed var(--ppc-border); border-radius: 999px;
  background: transparent; font: inherit; font-size: 14px; font-weight: 600; color: var(--ppc-encre);
  cursor: pointer; transition: border-color 160ms var(--ppc-ease), color 160ms var(--ppc-ease);
}
.cug-ppc-add-ligne:hover { border-color: var(--ppc-signal); color: var(--ppc-signal); }
@media (max-width: 640px) {
  .cug-ppc-ligne { grid-template-columns: 1fr 1fr; }
  .cug-ppc-ligne-prix { text-align: left; padding-bottom: 0; }
}
