.mq-details {
	width: 100%;
	display: flex;
	flex-direction: column;
	gap: 24px;
}

.mq-overview-container {
	display: flex;
	padding: 24px;
	flex-direction: column;
	align-items: start;
	gap: 16px;

	border-radius: 6px;
	border: 1px solid var(--l1-border);
	background: var(--l1-background);

	.mq-overview-title {
		display: flex;
		justify-content: space-between;
		align-items: center;
		width: 100%;

		color: var(--l2-foreground);

		font-family: Inter;
		font-size: 18px;
		font-style: normal;
		font-weight: 500;
		line-height: 28px;
	}

	.mq-details-options {
		letter-spacing: -0.06px;
		cursor: pointer;

		.ant-radio-button-wrapper {
			border-color: var(--l1-border);
			color: var(--l2-foreground);
		}
		.ant-radio-button-wrapper-checked {
			background: var(--l1-border);
			color: var(--l1-foreground);
		}
		.ant-radio-button-wrapper::before {
			width: 0px;
		}
	}
}

.droprate-view {
	.mq-table {
		width: 100%;

		.ant-table-content {
			border-radius: 6px;
			border: 1px solid var(--l1-border);
			box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.1);
		}

		.ant-table-tbody {
			.ant-table-cell {
				max-width: 250px;
				border-bottom: none;
			}
		}

		.ant-table-thead {
			.ant-table-cell {
				background-color: var(--l1-background);
				border-bottom: 1px solid var(--l1-border);
			}
		}
	}

	.trace-id-list {
		display: flex;
		flex-direction: column;
		gap: 4px;
		width: max-content;

		.traceid-style {
			display: flex;
			gap: 8px;
			align-items: center;

			.traceid-text {
				border-radius: 2px;
				border: 1px solid var(--l1-border);
				background: var(--l1-border);
				padding: 2px;
				cursor: pointer;
			}

			.remaing-count {
				cursor: pointer;
				color: var(--l1-foreground);
				font-family: Inter;
				font-size: 12px;
				font-style: normal;
				font-weight: 400;
				line-height: normal;
				letter-spacing: -0.06px;
			}
		}
	}
}

.pagination-left {
	&.mq-table {
		.ant-pagination {
			justify-content: flex-start;
		}
	}
}
