.crypto-dashboard {
	display: flex;
	flex-direction: column;
	height: 100%;
	background: #f8f8f8;

	.resize-handle-h {
		height: 5px;
		background: var(--border-default);
		cursor: row-resize;
		flex-shrink: 0;
		transition: background 0.15s;
		position: relative;

		&::after {
			content: '';
			position: absolute;
			left: 50%;
			top: 50%;
			transform: translate(-50%, -50%);
			width: 30px;
			height: 3px;
			border-top: 1px solid var(--border-strong);
			border-bottom: 1px solid var(--border-strong);
		}

		&:hover {
			background: #d0d0d0;
		}
	}

	.dashboard-bottom {
		display: flex;
		flex: 1;
		min-height: 0;
		border-top: 1px solid var(--border-default);

		.dashboard-orderbook {
			overflow: hidden;
			min-width: 0;
		}

		.dashboard-trades {
			overflow: hidden;
			min-width: 0;
		}

		.resize-handle-v {
			width: 5px;
			background: var(--border-default);
			cursor: col-resize;
			flex-shrink: 0;
			transition: background 0.15s;
			position: relative;

			&::after {
				content: '';
				position: absolute;
				left: 50%;
				top: 50%;
				transform: translate(-50%, -50%);
				width: 3px;
				height: 30px;
				border-left: 1px solid var(--border-strong);
				border-right: 1px solid var(--border-strong);
			}

			&:hover {
				background: #d0d0d0;
			}
		}
	}
}

@media (max-width: 768px) {
	.crypto-dashboard {
		height: auto;

		.dashboard-bottom {
			flex-direction: column;

			.dashboard-orderbook {
				width: 100% !important;
				height: 350px;
			}

			.dashboard-trades {
				width: 100% !important;
				height: 300px;
			}

			.resize-handle-v {
				display: none;
			}
		}
	}
}