/* ============================== */
/* CSS for sap.ui.table/DragDrop  */
/* Base theme                     */
/* ============================== */

@_sap_ui_table_DragDrop_ColumnDnDHighlightColor: @sapUiListHighlightColor;
@_sap_ui_table_DragDrop_ReorderIndicatorWidth: 2px;

.sapUiTableDragDrop {
	cursor: move;

	.sapUiTableCCnt,
	.sapUiTableColRsz {
		pointer-events: none;
	}

	.sapUiTableHeaderCell {
		cursor: move;

		* {
			cursor: move;
		}
	}
}

/* Column Reordering */

.sapUiTableHeaderCell.sapUiTableColReorderGhost {
	position: absolute;
	width: auto;
	max-width: 200px;
	cursor: pointer;
	border: @_sap_ui_table_BaseBorderWidth solid var(--sapList_BorderColor);
	background-color: var(--sapList_HeaderBackground);
	box-shadow: @sapUiShadowLevel2;
}

.sapUiSizeCozy.sapUiTableHeaderCell.sapUiTableColReorderGhost .sapUiTableCellInner > * {
	height: 100%;
	line-height: @_sap_ui_table_BaseSizeCozy;
}

.sapUiSizeCozy.sapUiTableHeaderCell.sapUiTableColReorderGhost {
	padding-top: 0;
	padding-bottom: 0;
}

.sapUiTableColReorderIndicator {
	position: absolute;
	top: 0;
	bottom: 0;
	left: auto; /*set dynamically*/
	width: 4 * @_sap_ui_table_DragDrop_ReorderIndicatorWidth;
	margin-left: (-4) * @_sap_ui_table_DragDrop_ReorderIndicatorWidth + @_sap_ui_table_DragDrop_ReorderIndicatorWidth;
	z-index: 3;
	display: none;
}

html[dir=rtl] .sapUiTableColReorderIndicator {
	margin-right: (-4) * @_sap_ui_table_DragDrop_ReorderIndicatorWidth + 2 * @_sap_ui_table_DragDrop_ReorderIndicatorWidth;
}

.sapUiTableColReorderIndicatorActive {
	display: block;
}

html[data-sap-ui-animation^='on'] .sapUiTableColReorderIndicator {
	transition-property: left;
	transition-duration: 100ms;
}

.sapUiTableColReorderIndicatorInner {
	position: absolute;
	top: 4 * @_sap_ui_table_DragDrop_ReorderIndicatorWidth;
	left: 2 * @_sap_ui_table_DragDrop_ReorderIndicatorWidth;
	bottom: 0;
	width: @_sap_ui_table_DragDrop_ReorderIndicatorWidth;
	background-color: @_sap_ui_table_DragDrop_ColumnDnDHighlightColor;
}

.sapUiTableColReorderIndicatorArrow {
	position: absolute;
	top: 0;
	left: 1px;
	width: 0;
}

.sapUiTableColReorderIndicatorArrow::after,
.sapUiTableColReorderIndicatorArrow::before {
	position: absolute;
	top: 0;
	content: ' ';
}

.sapUiTableColReorderIndicatorArrow::after {
	height: 2 * @_sap_ui_table_DragDrop_ReorderIndicatorWidth;
	width: 2 * @_sap_ui_table_DragDrop_ReorderIndicatorWidth;
	border-radius: @_sap_ui_table_DragDrop_ReorderIndicatorWidth;
	top: @_sap_ui_table_DragDrop_ReorderIndicatorWidth;
	left: @_sap_ui_table_DragDrop_ReorderIndicatorWidth;
	background-color: var(--sapList_HeaderBackground);
}

.sapUiTableColReorderIndicatorArrow::before {
	height: 4 * @_sap_ui_table_DragDrop_ReorderIndicatorWidth;
	width: 4 * @_sap_ui_table_DragDrop_ReorderIndicatorWidth;
	border-radius: 2 * @_sap_ui_table_DragDrop_ReorderIndicatorWidth;
	background-color: @_sap_ui_table_DragDrop_ColumnDnDHighlightColor;
}

.sapUiTableColReorderFade {
	position: relative;
}

.sapUiTableColReorderFade::after {
	content: ' ';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: -1px;
	z-index: 3;
	background-color: var(--sapList_Hover_Background);
	opacity: 0.5;
	box-sizing: border-box;
}

/* Column Resizing */

.sapUiTableColRsz {
	position: absolute;
	top: 0;
	width: 5px;
	margin-left: -4px;
	bottom: 0;
	cursor: col-resize;
	z-index: 3;
	box-sizing: border-box;
	left: -5px;
}

.sapUiTableColRsz.sapUiTableColRszActive {
	z-index: 5; /* Ensure be above Row Action Area */
	padding: 0 12px; /* Increase clickable area (width) to 24px */
	margin: 0 -12px;
}

html[dir=rtl] .sapUiTableColRsz {
	margin-right: -3px;
	right: -5px; /* it becomes "left" in RTL mode */
	left: auto;
}

html.sap-desktop .sapUiTableColRsz:hover {
	background-color: @_sap_ui_table_DragDrop_ColumnDnDHighlightColor;
	opacity: 0.5;
}

.sapUiTableColRszActive,
html.sap-desktop .sapUiTableColRsz.sapUiTableColRszActive:hover {
	background: linear-gradient(
		to left,
		transparent 0% 40%,
		@_sap_ui_table_DragDrop_ColumnDnDHighlightColor 40% 60%,
		transparent 60%
	);
	opacity: 1;
}

/* Table Height Resizing */

.sapUiTableHeightResizer {
	position: relative;
	cursor: row-resize;
	height: 1rem;
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: var(--sapContent_ForegroundColor);
	border-top: solid 0.0625rem var(--sapGroup_ContentBorderColor);
	border-bottom: solid 0.0625rem var(--sapGroup_ContentBorderColor);

	.sapUiTableHeightResizerDecorationBefore {
		width: 4rem;
		height: 1rem;
		background-image: linear-gradient(to left, var(--sapGroup_ContentBorderColor), transparent);
		background-size: 100% 0.0625rem;
		background-repeat: no-repeat;
		background-position: center;
	}

	.sapUiTableHeightResizerDecorationAfter {
		width: 4rem;
		height: 1rem;
		background-image: linear-gradient(to right, var(--sapGroup_ContentBorderColor), transparent);
		background-size: 100% 0.0625rem;
		background-repeat: no-repeat;
		background-position: center;
	}

	.sapUiTableHeightResizerGrip {
		color: var(--sapButton_Lite_TextColor);
		height: 1.5rem;
		line-height: 1.5rem;
		width: 2rem;
		position: relative;
		z-index: 1;

		.sapUiTableHeightResizerGripIcon {
			cursor: row-resize;
			box-sizing: border-box;
			width: 1.625rem;
			height: 1.5rem;
			line-height: ~"calc(1.5rem - var(--sapButton_BorderWidth) - var(--sapButton_BorderWidth))";
			margin-left: 3px;
			border: var(--sapButton_BorderWidth) solid var(--sapButton_Lite_BorderColor);
			border-radius: var(--sapButton_BorderCornerRadius);
			background: var(--sapButton_Lite_Background);
		}
	}

	&:hover {

		.sapUiTableHeightResizerDecorationBefore,
		.sapUiTableHeightResizerDecorationAfter {
			flex-grow: 1;
			transition: all 0.1s ease-in;
		}

		.sapUiTableHeightResizerGripIcon {
			background: var(--sapButton_Lite_Background);
			border-color: var(--sapButton_Lite_BorderColor);
		}
	}

	&:focus {
		outline: none;
	}

	&:focus::after {
		content: '';
		display: block;
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		border: var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--sapContent_FocusColor);
	}

	&.sapUiTableHeightResizerActive {

		.sapUiTableHeightResizerDecorationBefore {
			flex-grow: 1;
			background-image: linear-gradient(to left, var(--sapContent_Selected_ForegroundColor), var(--sapContent_Selected_ForegroundColor));
		}

		.sapUiTableHeightResizerDecorationAfter {
			flex-grow: 1;
			background-image: linear-gradient(to right, var(--sapContent_Selected_ForegroundColor), var(--sapContent_Selected_ForegroundColor));
		}
	}
}

.sapUiTable:has(.sapUiTableHeightResizerActive) {
	z-index: 10000;
}

.sapUiTableRowGhost {
	z-index: auto;

	> * {
		z-index: auto;
	}

	> .sapUiTableRowGhostCount {
		position: absolute;
		top: -0.625rem;
		right: 0;
		height: @_sap_ui_table_RowHeight;
		width: @_sap_ui_table_RowHeight;

		.sapUiSizeCozy &,
		.sapUiSizeCozy& {
			height: @_sap_ui_table_RowHeightCozy;
			width: @_sap_ui_table_RowHeightCozy;
		}

		.sapUiSizeCondensed &,
		.sapUiSizeCondensed& {
			height: @_sap_ui_table_RowHeightCondensed;
			width: @_sap_ui_table_RowHeightCondensed;
		}

		display: flex;
		align-items: center;
		justify-content: center;
		background-color: @sapUiDragAndDropActiveBorderColor;
		border-radius: 0.125rem;

		> div {
			font-size: @sapMFontMediumSize;
			color: var(--sapList_Active_TextColor);

			.sapUiSizeCozy &,
			.sapUiSizeCozy& {
				font-size: var(--sapFontLargeSize);
			}

			.sapUiSizeCondensed &,
			.sapUiSizeCondensed& {
				font-size: var(--sapFontSmallSize);
			}
		}
	}
}