/* Lo que el sistema real agrega a la maqueta aprobada: fotos del formulario y la liga privada del pedido (F2). */
.crear .archivo { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; }
.crear .archivo span { color: var(--tinta-suave); overflow-wrap: anywhere; }
.resumen-errores[hidden] { display: none; }
.crear .resumen-errores { margin-top: 24px; }
.folio { margin: 0 0 16px; font-weight: 700; color: var(--tinta-suave); }
.pedido h2 { font-family: var(--titulo); font-weight: 400; font-size: 1.5rem; margin: 28px 0 10px; }
.lo-que-sale { max-width: 640px; background: #fff; border-left: 4px solid var(--oro-tinta); padding: 4px 18px 14px; border-radius: 0 var(--radio-chico) var(--radio-chico) 0; }
.lo-que-sale h2 { margin-top: 10px; }
.lo-que-sale p { margin: 0; }
.dudas { max-width: 640px; margin: 18px 0 0; background: #fff; border-left: 4px solid var(--turquesa); padding: 12px 18px; border-radius: 0 var(--radio-chico) var(--radio-chico) 0; }
.dudas p { margin: 0 0 6px; font-weight: 700; }
.dudas ul { margin: 0; padding-left: 20px; }
.pedido .resumen { margin-top: 18px; }
.siguiente { max-width: 60ch; margin: 22px 0 0; color: var(--tinta-suave); }

/* Estados del formulario con JavaScript (Tarea 9): fotos, envío y resumen de errores enfocable. */
.crear .archivo input:focus-visible + label { outline: 3px solid var(--oro-tinta); outline-offset: 3px; }
#fotos-elegidas.con-error { color: var(--aviso, #9c2f12); font-weight: 600; }
.boton[disabled] { opacity: .7; cursor: progress; }
.resumen-errores:focus { outline: 3px solid var(--oro-tinta); outline-offset: 3px; }
.resumen-errores a { color: inherit; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }