@use '@talend/bootstrap-theme/src/theme/guidelines' as *;
@use '@talend/design-tokens/lib/tokens' as tokens;

.layout {
	:global(.react-grid-item) {
		display: flex;
		flex-direction: column;
		border: 1px solid tokens.$coral-color-neutral-border-weak;
		border-radius: 4px;
	}

	:global(.skeleton-tile .tc-tile-container .tc-tile-body) {
		padding: 0;
	}

	&.draggable {
		:global(.react-grid-item) {
			&:global(.react-grid-placeholder) {
				background: tokens.$coral-color-accent-background;
			}

			&:hover {
				box-shadow: 0 2px 2px rgba(0, 0, 0, 0.175);
				cursor: move;
			}
		}
	}
}