.ldspq-dashboard {
	margin: 1.5rem 0;
}

.ldspq-dashboard h2 {
	/* Use Elementor global typography if available, otherwise fall back */
	font-size: var(--e-global-typography-primary-font-size, 1.5rem);
	line-height: var(--e-global-typography-primary-line-height, 1.3);
	margin: 0 0 1rem;
}

.ldspq-tabs {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 1rem;
}

.ldspq-tab {
	border: 1px solid #ccd0d4;
	background: #f6f7f7;
	padding: 6px 12px;
	cursor: pointer;
	border-radius: 3px;
	font-size: 13px;
}

.ldspq-tab.ldspq-tab-active {
	background: #ffffff;
	border-bottom-color: #ffffff;
	font-weight: 600;
}

.ldspq-tab-panel {
	display: none;
}

.ldspq-tab-panel.ldspq-tab-panel-active {
	display: block;
}

/* Space sections a bit so they feel like Elementor sections */
.ldspq-dashboard-section,
.ldspq-tab-panel {
	padding: 1rem 0;
	border-top: 1px solid rgba(0, 0, 0, 0.04);
}

/* Buttons: rely on WP/Elementor .button styling, just tweak size */
.ldspq-dashboard .button.button-small {
	padding: 3px 10px;
	font-size: 12px;
}

/* Table wraps nicely on smaller screens */
.ldspq-my-quizzes {
	overflow-x: auto;
}

.ldspq-my-quizzes table {
	width: 100%;
}

/* Analytics layout tweaks */
.ldspq-analytics-overview {
	margin-bottom: 1.5rem;
}

.ldspq-analytics-kpis {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}

.ldspq-analytics-kpis li {
	background: #ffffff;
	border: 1px solid rgba(0, 0, 0, 0.06);
	border-radius: 4px;
	padding: 8px 12px;
	font-size: 13px;
}

.ldspq-analytics-filters {
	margin-bottom: 0.75rem;
	display: flex;
	align-items: center;
	gap: 8px;
}

.ldspq-analytics-filters select {
	max-width: 160px;
}

.ldspq-analytics-recent,
.ldspq-analytics-categories {
	margin-top: 1rem;
}

/* Simple Elementor-style spinner next to the submit button */
.ldspq-spinner {
	width: 16px;
	height: 16px;
	border-radius: 50%;
	border: 2px solid rgba(0, 0, 0, 0.15);
	border-top-color: var(--e-global-color-primary, #2271b1);
	box-sizing: border-box;
}

.ldspq-spinner.is-active {
	animation: ldspq-spin 0.7s linear infinite;
}

@keyframes ldspq-spin {
	to {
		transform: rotate(360deg);
	}
}