/*
Theme Name: Default
Description: Clean, responsive survey theme for desktop and mobile.
Version: 1.0.0
*/

:root {
	--st-primary: #2563eb;
	--st-primary-hover: #1d4ed8;
	--st-bg: #f8fafc;
	--st-card: #ffffff;
	--st-text: #1e293b;
	--st-muted: #64748b;
	--st-border: #e2e8f0;
	--st-radius: 8px;
	--st-shadow: 0 1px 3px rgba(0,0,0,0.08);
}

.st-survey-wrap {
	max-width: 720px;
	margin: 2rem auto;
	padding: 0 1rem;
	font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
	color: var(--st-text);
	background: var(--st-bg);
}

.st-survey-card {
	background: var(--st-card);
	border-radius: var(--st-radius);
	box-shadow: var(--st-shadow);
	padding: 2rem;
	border: 1px solid var(--st-border);
}

.st-survey-title {
	font-size: 1.5rem;
	font-weight: 700;
	margin: 0 0 0.5rem;
}

.st-survey-desc {
	color: var(--st-muted);
	margin-bottom: 1.5rem;
}

.st-question {
	margin-bottom: 1.75rem;
}

.st-question-title {
	font-weight: 600;
	margin-bottom: 0.5rem;
}

.st-question-required::after {
	content: " *";
	color: #dc2626;
}

.st-btn {
	display: inline-block;
	background: var(--st-primary);
	color: #fff;
	border: none;
	padding: 0.75rem 1.5rem;
	border-radius: var(--st-radius);
	font-size: 1rem;
	cursor: pointer;
	transition: background 0.15s ease;
}

.st-btn:hover {
	background: var(--st-primary-hover);
}

/* Mobile first adjustments */
@media (max-width: 600px) {
	.st-survey-card {
		padding: 1.25rem;
	}
	.st-survey-title {
		font-size: 1.25rem;
	}
}