/* New shipment is a short, ordered decision flow. */
/* Modal de nuevo envío y superficie de preparación de expedición. */
#modal {
	width: min(100% - 32px, 620px);
	position: relative;
}
#modal .close {
	position: absolute;
	top: 16px;
	right: 18px;
	z-index: 2;
}
#modalContent {
	clear: none;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 14px 16px;
	padding-top: 0;
}
#modalContent > h2 {
	margin: 0 0 4px;
	padding-right: 36px;
}
#modalContent > label:nth-of-type(1) {
	grid-column: 1/-1;
}
#modalContent > label:nth-of-type(2),
#modalContent > label:nth-of-type(3) {
	grid-column: auto;
}
#modalContent > .actions {
	grid-column: 1/-1;
	margin-top: 2px;
	padding-top: 14px;
}
#modalContent > .actions .modal-actions {
	justify-content: flex-end;
}
#modalContent > .actions .btn {
	min-width: 130px;
}
/* The transfer document is an operational work surface, centered and proportioned to its fields. */
#detailView {
	max-width: 1120px;
	margin-inline: auto;
}
#detailView .detail-top {
	align-items: center;
}
#detailView .detail-top h1 {
	margin: 0 0 5px;
}
#detailView #lines {
	margin-top: 2px;
}
#detailView .line-grid {
	grid-template-columns:
		minmax(250px, 1.55fr) minmax(140px, 0.85fr) minmax(92px, 0.55fr)
		minmax(115px, 0.65fr) 42px;
	gap: 12px;
	padding: 14px 12px;
}
#detailView .line-grid label {
	align-content: end;
}
#detailView .line-grid label input {
	width: 100%;
}
.actions {
	align-items: center;
}
.actions .btn.primary {
	min-width: 174px;
}
@media (max-width: 760px) {
	#modalContent {
		grid-template-columns: 1fr;
	}
	#modalContent > label:nth-of-type(1),
	#modalContent > label:nth-of-type(2),
	#modalContent > label:nth-of-type(3) {
		grid-column: auto;
	}
	#modalContent > .actions .modal-actions {
		justify-content: stretch;
	}
	#modalContent > .actions .btn {
		width: 100%;
	}
	#detailView {
		max-width: none;
		margin: 0;
	}
	#detailView .detail-top {
		align-items: flex-start;
	}
	#detailView .line-grid {
		grid-template-columns: 1fr 1fr;
		gap: 12px;
	}
}