/* Devis impression UV (paquet 173). Complète quote.css : tout ce qui est
   commun au devis 3D (cartes de choix, récapitulatif, alertes, dépôt) vient de
   là ; ici, seulement ce que la page UV a en propre. */

.uv-etape { margin-top: var(--s-7, 40px); }
.uv-etape:first-of-type { margin-top: var(--s-5, 24px); }
.uv-etape__titre { display: flex; align-items: baseline; gap: var(--s-3, 12px); margin: 0 0 var(--s-2, 8px); font-size: var(--t-h3); }
.uv-etape__num {
  flex: none; width: 28px; height: 28px; display: grid; place-items: center;
  border-radius: 50%; font-family: var(--f-mono); font-size: var(--t-xs);
  background: var(--c-cyan-08); color: var(--c-cyan); border: 1px solid var(--c-cyan-40);
}
.uv-etape__aide { margin: 0 0 var(--s-4, 16px); color: var(--c-muted); font-size: var(--t-sm); }

/* Quatre repères sous le titre : surface, relief, minimum, délai */
.uv-faits { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: var(--s-3, 12px); margin: 0; padding: 0; }
.uv-faits > div { padding: var(--s-3, 12px) var(--s-4, 16px); border: 1px solid var(--c-border); border-radius: var(--r-md); background: var(--c-surface); }
.uv-faits dt { font-size: var(--t-xs); color: var(--c-muted); margin: 0; }
.uv-faits dd { margin: 4px 0 0; font-family: var(--f-mono); font-size: var(--t-body); color: var(--c-cyan); }

/* Cartes de choix plus serrées : dix supports doivent tenir sans défiler. */
.choices--uv { grid-template-columns: repeat(auto-fit, minmax(min(100%, 150px), 1fr)); }
.choices--uv .choice__box { padding: var(--s-3, 12px); gap: 4px; }
.choices--uv .choice__note { line-height: 1.35; }
.choices--rendu { grid-template-columns: repeat(auto-fit, minmax(min(100%, 190px), 1fr)); }

/* Formats prédéfinis */
.uv-presets { display: flex; flex-wrap: wrap; gap: var(--s-2, 8px); margin-bottom: var(--s-3, 12px); }
.uv-presets .btn { font-family: var(--f-mono); font-size: var(--t-xs); padding: 6px 12px; }
.uv-presets .btn[aria-pressed="true"] { border-color: var(--c-cyan); background: var(--c-cyan-08); color: var(--c-cyan); }
.uv-dims { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: var(--s-3, 12px); align-items: end; }
.uv-dims .input { font-family: var(--f-mono); }

/* Option vernis : une case, mais habillée comme une carte pour rester lisible */
.uv-option { margin-top: var(--s-3, 12px); }
.uv-option .choice__box { flex-direction: row; display: flex; align-items: center; gap: var(--s-3, 12px); }
.uv-option input:checked + .choice__box { border-color: var(--c-cyan); background: var(--c-cyan-08); }

/* Récapitulatif : léger voile pendant le recalcul */
.recap__rows.is-attente { opacity: .55; transition: opacity var(--dur) var(--ease); }
#uv-notes .alerte + .alerte { margin-top: var(--s-2, 8px); }
#uv-notes:not(:empty) { padding: 0 var(--s-5, 24px) var(--s-4, 16px); }
#uv-erreur[hidden] { display: none; }
#uv-erreur { margin-top: var(--s-4, 16px); }
.field__err { color: var(--c-danger, #e5484d); margin-top: 4px; }
[aria-invalid="true"] { border-color: var(--c-danger, #e5484d) !important; }

/* Étapes « comment ça marche » dans la colonne de droite */
.uv-etapes { margin: 0; padding: 0; list-style: none; display: grid; gap: var(--s-3, 12px); counter-reset: uv; }
.uv-etapes li { position: relative; padding-left: 34px; font-size: var(--t-sm); counter-increment: uv; }
.uv-etapes li::before {
  content: counter(uv); position: absolute; left: 0; top: 0; width: 24px; height: 24px;
  display: grid; place-items: center; border-radius: 50%; font-family: var(--f-mono); font-size: var(--t-xs);
  background: var(--c-cyan-08); color: var(--c-cyan); border: 1px solid var(--c-cyan-40);
}

/* Exemples de prix (page Prix et page UV) */
.uv-exemples td:last-child, .uv-exemples th:last-child { text-align: right; font-family: var(--f-mono); }

/* Catalogue d'exemples et idées cadeaux : cartes avec image */
.uv-items { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 290px), 1fr)); gap: var(--s-4, 16px); }
.uv-item { padding: 0; overflow: hidden; display: flex; flex-direction: column; }
.uv-item__img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; }
.uv-item__corps { padding: var(--s-4, 16px); display: flex; flex-direction: column; gap: var(--s-2, 8px); flex: 1; }
.uv-item__corps .card__title { margin: 0; font-size: var(--t-body); }
.uv-item__meta { margin: 0; font-family: var(--f-mono); font-size: var(--t-xs); color: var(--c-muted); }
.uv-item__corps .card__text { margin: 0; }
.uv-item__prix { margin: 0; font-family: var(--f-mono); font-size: var(--t-xs); color: var(--c-cyan); }
.uv-item__corps .card__foot { margin: auto 0 0; padding-top: var(--s-2, 8px); }
.uv-item .btn { width: 100%; justify-content: center; }

/* Retouche 173 — deux photos par objet (à plat / relief), sélecteur en CSS pur */
.uv-item__media { position: relative; }
.uv-item__radio { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
.uv-item__img--relief { display: none; }
.uv-item__radio:nth-of-type(2):checked ~ .uv-item__img--plat { display: none; }
.uv-item__radio:nth-of-type(2):checked ~ .uv-item__img--relief { display: block; }
.uv-item__rendus { position: absolute; left: var(--s-3, 12px); bottom: var(--s-3, 12px); display: flex; gap: 4px; padding: 3px; border-radius: 999px; background: rgba(15, 18, 24, .72); backdrop-filter: blur(6px); }
.uv-item__rendus label { cursor: pointer; padding: 4px 10px; border-radius: 999px; font-family: var(--f-mono); font-size: var(--t-xs); color: #e6e9ef; user-select: none; }
.uv-item__radio:nth-of-type(1):checked ~ .uv-item__rendus label:first-child,
.uv-item__radio:nth-of-type(2):checked ~ .uv-item__rendus label:last-child { background: var(--c-cyan, #34c7d8); color: #0b1020; }
.uv-item__rendus label:hover { text-decoration: underline; }

/* Objet fourni par l'atelier (paquet 174) */
.uv-objet { padding: var(--s-4, 16px); border: 1px solid var(--c-border); border-radius: var(--r-md); background: var(--c-surface); }
.uv-objet__case { display: flex; gap: var(--s-3, 12px); align-items: flex-start; cursor: pointer; font-size: var(--t-sm); line-height: 1.45; }
.uv-objet__case input { flex: none; margin-top: 2px; }
.uv-objet__case span { color: var(--c-muted); }
.uv-objet__case strong { color: var(--c-text); }
.uv-objet__choix { margin-top: var(--s-3, 12px); padding-top: var(--s-3, 12px); border-top: 1px solid var(--c-border); }
.uv-objet__choix select { width: 100%; max-width: 520px; }