/* Panel lateral para consulta y gestión de documentos de traspaso. */
body.drawer-open {
	overflow: hidden;
}

#detailView.transfer-drawer-layer {
	position: fixed;
	inset: 0;
	z-index: 50;
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) min(860px, 100vw);
	max-width: none;
	margin: 0;
	padding: 0;
	background: rgba(20, 35, 50, 0.38);
}

.transfer-drawer-backdrop {
	min-width: 0;
	cursor: pointer;
}

.transfer-drawer {
	display: grid;
	grid-template-rows: auto minmax(0, 1fr);
	min-width: 0;
	height: 100vh;
	background: var(--bg);
	box-shadow: -16px 0 38px rgba(24, 38, 53, 0.2);
	overflow: hidden;
	animation: transfer-drawer-in 180ms ease-out;
}

.transfer-drawer__header {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 16px;
	padding: 24px 28px 18px;
	border-bottom: 1px solid var(--line);
	background: var(--surface);
}

.transfer-drawer__header .operation-mode {
	margin: 0 0 5px;
}

.transfer-drawer__title {
	margin: 0;
	font-size: 24px;
}

.transfer-drawer__close {
	display: inline-grid;
	place-items: center;
	width: 38px;
	min-width: 38px;
	height: 38px;
	padding: 0;
	font-size: 22px;
	line-height: 1;
}

.transfer-drawer__body {
	min-height: 0;
	padding: 20px 28px 28px;
	overflow: auto;
}

.transfer-drawer .transfer-document {
	display: grid;
	gap: 16px;
}

.transfer-drawer .transfer-header {
	margin: 0 !important;
	padding: 0 !important;
	border: 0;
}

.transfer-drawer .transfer-header > .operation-mode,
.transfer-drawer .transfer-header > h1 {
	display: none;
}

.transfer-drawer .transfer-meta {
	margin: 0;
}

.transfer-drawer .transfer-lines {
	margin: 0;
	padding: 18px !important;
	box-shadow: none;
}

.transfer-drawer .transfer-lines .actions {
	margin: 16px -18px -18px !important;
}

.transfer-drawer .document-table-shell {
	width: 100%;
	overflow: hidden;
}

.transfer-drawer .document-table {
	width: 100%;
	min-width: 0;
	table-layout: fixed;
}

.transfer-drawer .document-table th,
.transfer-drawer .document-table td {
	white-space: normal;
	overflow-wrap: anywhere;
}

.transfer-drawer .document-table td input {
	min-width: 0;
}

.transfer-drawer .document-table col.document-article {
	width: 48%;
}

.transfer-drawer .document-table col.document-lot {
	width: 25%;
}

.transfer-drawer .document-table col.document-quantity {
	width: 17%;
}

.transfer-drawer .document-table col.document-remove {
	width: 10%;
}

/* Tabla final de recepción: cuatro datos operativos, sin columna de acción. */
.transfer-drawer .document-table.receipt-comparison col.document-article {
	width: 36%;
}

.transfer-drawer .document-table.receipt-comparison col.document-lot {
	width: 22%;
}

.transfer-drawer .document-table.receipt-comparison col.document-sent,
.transfer-drawer .document-table.receipt-comparison col.document-received {
	width: 21%;
}

@keyframes transfer-drawer-in {
	from {
		transform: translateX(24px);
		opacity: 0.5;
	}

	to {
		transform: translateX(0);
		opacity: 1;
	}
}

@media (max-width: 760px) {
	#detailView.transfer-drawer-layer {
		grid-template-columns: 1fr;
	}

	.transfer-drawer-backdrop {
		display: none;
	}

	.transfer-drawer__header,
	.transfer-drawer__body {
		padding-inline: 16px;
	}

	.transfer-drawer__header {
		padding-top: 18px;
		padding-bottom: 14px;
	}

	.transfer-drawer__body {
		padding-top: 16px;
	}

	.transfer-drawer .transfer-meta {
		grid-template-columns: 1fr 1fr;
	}

	.transfer-drawer .document-table th,
	.transfer-drawer .document-table td {
		padding: 8px 7px;
		font-size: 12px;
	}

	.transfer-drawer .document-table td input {
		padding-inline: 6px;
	}

	.transfer-drawer .document-table col.document-remove {
		width: 12%;
	}

	.transfer-drawer .document-table col.document-article {
		width: 45%;
	}

	.transfer-drawer .document-table col.document-lot {
		width: 24%;
	}

	.transfer-drawer .document-table col.document-quantity {
		width: 19%;
	}

	.transfer-drawer .document-table th.document-remove,
	.transfer-drawer .document-table td.document-remove {
		padding-inline: 2px;
	}

	.transfer-drawer .document-table .remove {
		width: 30px;
		min-width: 30px;
	}
}

@media print {
	#detailView.transfer-drawer-layer {
		position: static !important;
		display: block !important;
		background: transparent !important;
	}

	.transfer-drawer-backdrop,
	.transfer-drawer__header,
	.transfer-drawer .transfer-lines .actions {
		display: none !important;
	}

	.transfer-drawer,
	.transfer-drawer__body {
		display: block !important;
		height: auto !important;
		padding: 0 !important;
		background: #fff !important;
		box-shadow: none !important;
		overflow: visible !important;
	}
}