/**
 * Dashboard-UI (Liste / Create / Einreichungen) — mittlere Modernisierung.
 * Ergänzt csb-frontend.css; Dark-Mode über bestehende Theme-Klassen.
 */

.csb-dashboard {
	--csb-ui-bg: #ffffff;
	--csb-ui-surface: #f8fafc;
	--csb-ui-surface-2: #f1f5f9;
	--csb-ui-border: #e2e8f0;
	--csb-ui-border-strong: #cbd5e1;
	--csb-ui-text: #0f172a;
	--csb-ui-muted: #64748b;
	--csb-ui-accent: #2563eb;
	--csb-ui-accent-soft: #eff6ff;
	--csb-ui-radius: 14px;
	--csb-ui-shadow: 0 1px 2px rgba(15, 23, 42, 0.05), 0 8px 24px -16px rgba(15, 23, 42, 0.18);
	max-width: 960px;
	padding: 24px;
	border: 1px solid var(--csb-ui-border);
	border-radius: var(--csb-ui-radius);
	background: var(--csb-ui-bg);
	color: var(--csb-ui-text);
	box-shadow: var(--csb-ui-shadow);
}

.csb-dashboard.csb-dashboard--route-shell {
	max-width: none;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
}

/* —— Page header —— */
.csb-page-header {
	display: grid;
	gap: 6px;
	margin: 0 0 22px;
	padding-bottom: 18px;
	border-bottom: 1px solid var(--csb-ui-border);
}

.csb-page-header__row {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	justify-content: space-between;
	gap: 12px 16px;
}

.csb-page-header__eyebrow {
	margin: 0;
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--csb-ui-muted);
}

.csb-page-header__title {
	margin: 0;
	font-size: clamp(1.35rem, 2.4vw, 1.65rem);
	font-weight: 800;
	line-height: 1.25;
	letter-spacing: -0.02em;
	color: var(--csb-ui-text);
}

.csb-page-header__lead {
	margin: 0;
	max-width: 42rem;
	font-size: 0.98rem;
	line-height: 1.5;
	color: var(--csb-ui-muted);
}

.csb-page-header__meta {
	margin: 4px 0 0;
	font-size: 0.86rem;
	color: var(--csb-ui-muted);
}

.csb-page-header__meta code {
	font-size: 0.8rem;
	padding: 2px 8px;
	border-radius: 6px;
	background: var(--csb-ui-surface-2);
	color: var(--csb-ui-text);
}

/* —— Empty / soft panels —— */
.csb-empty-state {
	margin: 0;
	padding: 28px 20px;
	text-align: center;
	border: 1px dashed var(--csb-ui-border-strong);
	border-radius: var(--csb-ui-radius);
	background: var(--csb-ui-surface);
}

.csb-empty-state__title {
	margin: 0 0 6px;
	font-size: 1.05rem;
	font-weight: 700;
	color: var(--csb-ui-text);
}

.csb-empty-state__text {
	margin: 0;
	font-size: 0.95rem;
	color: var(--csb-ui-muted);
}

.csb-panel {
	margin: 0 0 18px;
	padding: 16px 18px;
	border: 1px solid var(--csb-ui-border);
	border-radius: 12px;
	background: var(--csb-ui-surface);
}

/* —— Messages —— */
.csb-dashboard .csb-message {
	margin: 0 0 16px;
	padding: 12px 14px;
	border-radius: 10px;
	border: 1px solid transparent;
	font-size: 0.95rem;
}

.csb-dashboard .csb-message.success {
	background: #ecfdf5;
	border-color: #a7f3d0;
	color: #065f46;
}

.csb-dashboard .csb-message.error {
	background: #fef2f2;
	border-color: #fecaca;
	color: #991b1b;
}

/* —— Survey list —— */
.csb-surveys__heading {
	display: none; /* ersetzt durch .csb-page-header */
}

.csb-surveys-list {
	gap: 14px;
}

.csb-surveys-list__item {
	padding: 18px 20px;
	border-radius: var(--csb-ui-radius);
	border-color: var(--csb-ui-border);
	background: var(--csb-ui-bg);
	box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
	align-items: flex-start;
}

.csb-surveys-list__item:hover {
	border-color: color-mix(in srgb, var(--csb-ui-accent) 35%, var(--csb-ui-border));
	box-shadow: 0 10px 28px -18px rgba(37, 99, 235, 0.45);
}

.csb-surveys-list__thumb {
	flex: 0 0 72px;
	width: 72px;
	height: 72px;
	border-radius: 10px;
	overflow: hidden;
	border: 1px solid var(--csb-ui-border);
	background: var(--csb-ui-surface);
}

.csb-surveys-list__thumb img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.csb-surveys-list__title {
	font-size: 1.12rem;
	font-weight: 750;
	letter-spacing: -0.01em;
}

.csb-surveys-list__actions {
	flex: 1 1 100%;
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding-top: 4px;
	border-top: 1px solid var(--csb-ui-border);
	margin-top: 2px;
}

.csb-surveys-list__actions-row {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	align-items: center;
}

.csb-surveys-list__actions-row--share {
	opacity: 0.96;
}

.csb-surveys-list__actions-row--danger {
	padding-top: 2px;
}

.csb-surveys-list__actions .csb-action-btn {
	min-height: 40px;
	border-radius: 10px;
	font-weight: 650;
}

.csb-surveys-list__actions .csb-action-btn--primary {
	background: var(--csb-ui-accent);
	border-color: var(--csb-ui-accent);
	box-shadow: 0 6px 16px -10px rgba(37, 99, 235, 0.8);
}

.csb-surveys-list__actions .csb-action-btn--ghost {
	background: transparent;
	border-color: transparent;
	color: var(--csb-ui-muted);
	text-decoration: underline;
	text-underline-offset: 3px;
	min-height: auto;
	padding: 6px 8px;
}

.csb-surveys-list__actions .csb-action-btn--ghost:hover {
	background: var(--csb-ui-surface-2);
	border-color: transparent;
	color: var(--csb-ui-text);
	text-decoration: none;
}

@media (min-width: 720px) {
	.csb-surveys-list__item {
		align-items: center;
	}

	.csb-surveys-list__actions {
		flex: 1 1 auto;
		border-top: 0;
		margin-top: 0;
		padding-top: 0;
		align-items: flex-end;
	}

	.csb-surveys-list__actions-row {
		justify-content: flex-end;
	}
}

/* —— Import block —— */
.csb-import-survey-wrap,
.csb-surveys-import {
	margin-bottom: 20px;
}

.csb-import-survey-wrap .csb-action-btn.csb-import-survey-toggle,
.csb-surveys-import .csb-action-btn.csb-import-survey-toggle {
	border-radius: 10px;
}

/* —— Create / Wizard —— */
.csb-dashboard--widget-create > h2 {
	display: none;
}

.csb-dashboard--widget-create .csb-page-header {
	margin-bottom: 18px;
}

.csb-create-wizard-shell__title {
	font-size: 1.45rem;
	font-weight: 800;
	letter-spacing: -0.02em;
}

.csb-survey-wizard {
	max-width: 680px;
	margin-top: 8px;
	padding: 20px;
	border: 1px solid var(--csb-ui-border);
	border-radius: var(--csb-ui-radius);
	background: var(--csb-ui-surface);
}

.csb-survey-wizard__progress {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 1.15rem;
	padding: 10px 14px;
	border-radius: 10px;
	background: var(--csb-ui-bg);
	border: 1px solid var(--csb-ui-border);
	font-size: 0.9rem;
	font-weight: 650;
	color: var(--csb-ui-text);
}

.csb-survey-wizard__step-title {
	font-size: 1.1rem;
	font-weight: 750;
	letter-spacing: -0.01em;
	color: var(--csb-ui-text);
}

.csb-survey-wizard .csb-form label,
.csb-dashboard--widget-create .csb-form label {
	font-size: 0.9rem;
	font-weight: 650;
	color: var(--csb-ui-text);
}

.csb-survey-wizard .csb-form input[type="text"],
.csb-survey-wizard .csb-form textarea,
.csb-survey-wizard .csb-form select,
.csb-dashboard--widget-create .csb-form input[type="text"],
.csb-dashboard--widget-create .csb-form textarea,
.csb-dashboard--widget-create .csb-form select {
	padding: 11px 12px;
	border-radius: 10px;
	border-color: var(--csb-ui-border-strong);
	background: var(--csb-ui-bg);
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.csb-survey-wizard .csb-form input[type="text"]:focus,
.csb-survey-wizard .csb-form textarea:focus,
.csb-survey-wizard .csb-form select:focus,
.csb-dashboard--widget-create .csb-form input[type="text"]:focus,
.csb-dashboard--widget-create .csb-form textarea:focus,
.csb-dashboard--widget-create .csb-form select:focus {
	outline: none;
	border-color: var(--csb-ui-accent);
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--csb-ui-accent) 22%, transparent);
}

.csb-survey-wizard__nav {
	gap: 10px;
	margin-top: 1.4rem;
	padding-top: 1.1rem;
	border-top-color: var(--csb-ui-border);
}

.csb-survey-wizard__nav .button,
.csb-survey-wizard__nav .button-primary {
	min-height: 42px;
	padding: 10px 16px;
	border-radius: 10px;
	font-weight: 650;
}

.csb-survey-wizard__nav .button-primary {
	background: var(--csb-ui-accent) !important;
	border-color: var(--csb-ui-accent) !important;
}

/* —— Submissions —— */
.csb-submissions {
	max-width: 1100px;
}

.csb-submissions__title {
	display: none;
}

.csb-submissions__toolbar {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	gap: 12px 18px;
	margin: 0 0 16px;
	padding: 14px 16px;
	border: 1px solid var(--csb-ui-border);
	border-radius: 12px;
	background: var(--csb-ui-surface);
}

.csb-submissions__toolbar .csb-report-survey-picker {
	margin: 0;
	flex: 1 1 260px;
}

.csb-submissions__stats {
	margin: 0;
	font-size: 0.9rem;
	color: var(--csb-ui-muted);
	font-weight: 600;
}

.csb-report-survey-picker__label {
	font-size: 0.8rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--csb-ui-muted);
}

.csb-report-survey-picker__select {
	min-height: 42px;
	padding: 8px 12px;
	border-radius: 10px;
	border: 1px solid var(--csb-ui-border-strong);
	background: var(--csb-ui-bg);
	font-weight: 600;
}

.csb-analytics .csb-analytics__export {
	margin: 0;
}

.csb-analytics .csb-analytics__export .csb-action-btn {
	text-decoration: none;
	white-space: nowrap;
}

.csb-analytics .csb-analytics__export-empty {
	margin: 0;
}

.csb-submissions .csb-table-wrap {
	margin-top: 4px;
	border: 1px solid var(--csb-ui-border);
	border-radius: 12px;
	overflow: auto;
	background: var(--csb-ui-bg);
	box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.csb-submissions .csb-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 0.92rem;
}

.csb-submissions .csb-table th {
	position: sticky;
	top: 0;
	z-index: 1;
	padding: 12px 14px;
	text-align: left;
	font-size: 0.72rem;
	font-weight: 750;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: var(--csb-ui-muted);
	background: var(--csb-ui-surface-2);
	border-bottom: 1px solid var(--csb-ui-border);
	white-space: nowrap;
}

.csb-submissions .csb-table td {
	padding: 12px 14px;
	border-bottom: 1px solid var(--csb-ui-border);
	vertical-align: middle;
	color: var(--csb-ui-text);
}

.csb-submissions .csb-table tbody tr:last-child td {
	border-bottom: 0;
}

.csb-submissions .csb-table tbody tr:hover td {
	background: color-mix(in srgb, var(--csb-ui-accent-soft) 55%, transparent);
}

.csb-submissions .csb-link {
	display: inline-flex;
	align-items: center;
	min-height: 34px;
	padding: 6px 12px;
	border-radius: 8px;
	font-weight: 650;
	text-decoration: none;
	color: var(--csb-ui-accent);
	background: var(--csb-ui-accent-soft);
	border: 1px solid color-mix(in srgb, var(--csb-ui-accent) 25%, transparent);
}

.csb-submissions .csb-link:hover {
	background: color-mix(in srgb, var(--csb-ui-accent) 14%, white);
}

.csb-submissions__del-btn {
	min-height: 34px;
	padding: 6px 12px;
	border-radius: 8px;
	font-weight: 650;
}

.csb-submissions--detail .csb-page-header {
	margin-bottom: 16px;
}

.csb-submissions__back {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin: 0 0 12px;
	font-weight: 650;
	text-decoration: none;
	color: var(--csb-ui-accent);
}

.csb-submissions__back:hover {
	text-decoration: underline;
}

/* —— Dark theme —— */
.csb-dashboard.csb-dashboard--theme-dark,
html[data-scp-theme="dark"] .csb-dashboard:not(.csb-dashboard--theme-light),
.smartcore-platform-layout[data-scp-theme="dark"] .csb-dashboard:not(.csb-dashboard--theme-light) {
	--csb-ui-bg: #141a22;
	--csb-ui-surface: #1a222d;
	--csb-ui-surface-2: #222b38;
	--csb-ui-border: #2c3645;
	--csb-ui-border-strong: #3b4758;
	--csb-ui-text: #e8eef7;
	--csb-ui-muted: #9aa8bc;
	--csb-ui-accent: #60a5fa;
	--csb-ui-accent-soft: rgba(96, 165, 250, 0.14);
	--csb-ui-shadow: 0 1px 2px rgba(0, 0, 0, 0.35), 0 12px 28px -18px rgba(0, 0, 0, 0.55);
}

@media (prefers-color-scheme: dark) {
	.csb-dashboard.csb-dashboard--theme-auto {
		--csb-ui-bg: #141a22;
		--csb-ui-surface: #1a222d;
		--csb-ui-surface-2: #222b38;
		--csb-ui-border: #2c3645;
		--csb-ui-border-strong: #3b4758;
		--csb-ui-text: #e8eef7;
		--csb-ui-muted: #9aa8bc;
		--csb-ui-accent: #60a5fa;
		--csb-ui-accent-soft: rgba(96, 165, 250, 0.14);
		--csb-ui-shadow: 0 1px 2px rgba(0, 0, 0, 0.35), 0 12px 28px -18px rgba(0, 0, 0, 0.55);
	}
}

/* —— Sprache bearbeiten (LMS-Muster) —— */
.csb-authoring-lang-bar {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: 10px 16px;
	margin: 12px 0 16px;
	padding: 10px 12px;
	background: var(--csb-ui-surface, #f8fafc);
	border: 1px solid var(--csb-ui-border, #e2e8f0);
	border-radius: 8px;
	max-width: 52rem;
}

.csb-authoring-lang-bar__row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
}

.csb-authoring-lang-bar__lbl {
	font-size: 13px;
	font-weight: 600;
	color: var(--csb-ui-text, #334155);
	margin: 0;
}

.csb-authoring-lang-sel-wrap {
	display: inline-block;
	position: relative;
	vertical-align: middle;
}

.csb-authoring-lang-sel {
	appearance: none;
	-moz-appearance: none;
	-webkit-appearance: none;
	min-width: 12rem;
	padding: 6px 2.25rem 6px 10px;
	border-radius: 8px;
	border: 1px solid var(--csb-ui-border-strong, #cbd5e1);
	font: inherit;
	color: var(--csb-ui-text, #0f172a);
	background-color: var(--csb-ui-bg, #fff);
	background-repeat: no-repeat;
	background-position: right 0.55rem center;
	background-size: 0.65rem 0.45rem;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14'%3E%3Cpath fill='%2364748b' d='M2 5h10L7 10z'/%3E%3C/svg%3E");
	cursor: pointer;
}

.csb-authoring-lang-bar__hint {
	font-size: 12px;
	color: var(--csb-ui-muted, #64748b);
	margin: 0;
	flex-basis: 100%;
	line-height: 1.45;
}

.csb-lang-pane[hidden] {
	display: none !important;
}

.csb-privacy-infra-note {
	max-width: 46rem;
	line-height: 1.5;
}

/* Typografie-Sperre: fluid Spaltenbreite, Deckel 18px */
.csb-dash, .csb-authoring, .csb-table-wrap, .csb-analytics, .csb {
  font-size: clamp(15px, 2.1vw + 7px, 18px) !important;
  font-size: clamp(15px, 2.1cqw + 7px, 18px) !important;
  line-height: 1.5;
  container-type: inline-size;
}
.csb-dash p, .csb-dash li, .csb-dash td, .csb-dash th, .csb-dash label, .csb-dash .button, .csb-dash button, .csb-dash input, .csb-dash select, .csb-dash textarea,
.csb-authoring p, .csb-authoring li, .csb-authoring td, .csb-authoring th, .csb-authoring label, .csb-authoring .button, .csb-authoring button, .csb-authoring input, .csb-authoring select, .csb-authoring textarea,
.csb-table-wrap p, .csb-table-wrap li, .csb-table-wrap td, .csb-table-wrap th, .csb-table-wrap label, .csb-table-wrap .button, .csb-table-wrap button, .csb-table-wrap input, .csb-table-wrap select, .csb-table-wrap textarea,
.csb-analytics p, .csb-analytics li, .csb-analytics td, .csb-analytics th, .csb-analytics label, .csb-analytics .button, .csb-analytics button, .csb-analytics input, .csb-analytics select, .csb-analytics textarea,
.csb p, .csb li, .csb td, .csb th, .csb label, .csb .button, .csb button, .csb input, .csb select, .csb textarea {
  font-size: 1em !important;
  line-height: 1.5;
}
.csb-dash h1, .csb-dash h2, .csb-authoring h1, .csb-authoring h2, .csb-table-wrap h1, .csb-table-wrap h2, .csb-analytics h1, .csb-analytics h2, .csb h1, .csb h2 { font-size: 1.45em !important; line-height: 1.25; }
.csb-dash h3, .csb-authoring h3, .csb-table-wrap h3, .csb-analytics h3, .csb h3 { font-size: 1.22em !important; }
.csb-dash [class*='lead'], .csb-dash [class*='sub'], .csb-dash [class*='hint'], .csb-dash [class*='desc'], .csb-dash .description, .csb-authoring [class*='lead'], .csb-authoring [class*='sub'], .csb-authoring [class*='hint'], .csb-authoring [class*='desc'], .csb-authoring .description, .csb-table-wrap [class*='lead'], .csb-table-wrap [class*='sub'], .csb-table-wrap [class*='hint'], .csb-table-wrap [class*='desc'], .csb-table-wrap .description, .csb-analytics [class*='lead'], .csb-analytics [class*='sub'], .csb-analytics [class*='hint'], .csb-analytics [class*='desc'], .csb-analytics .description, .csb [class*='lead'], .csb [class*='sub'], .csb [class*='hint'], .csb [class*='desc'], .csb .description { font-size: 1.05em !important; line-height: 1.5; }
.csb-dash [class*='kpi__value'], .csb-dash [class*='kpi-value'], .csb-authoring [class*='kpi__value'], .csb-authoring [class*='kpi-value'], .csb-table-wrap [class*='kpi__value'], .csb-table-wrap [class*='kpi-value'], .csb-analytics [class*='kpi__value'], .csb-analytics [class*='kpi-value'], .csb [class*='kpi__value'], .csb [class*='kpi-value'] { font-size: 1.85em !important; }
.csb-dash [style*='font-size:10px'], .csb-dash [style*='font-size:11px'], .csb-dash [style*='font-size:12px'], .csb-dash [style*='font-size:13px'], .csb-dash [style*='font-size:14px'], .csb-dash [style*='font-size:15px'], .csb-dash [style*='font-size:16px'], .csb-dash [style*='font-size:0.7'], .csb-dash [style*='font-size:0.8'], .csb-dash [style*='font-size:0.9'], .csb-dash [style*='font-size:0.95'], .csb-dash [style*='font-size:1rem'],
.csb-authoring [style*='font-size:10px'], .csb-authoring [style*='font-size:11px'], .csb-authoring [style*='font-size:12px'], .csb-authoring [style*='font-size:13px'], .csb-authoring [style*='font-size:14px'], .csb-authoring [style*='font-size:15px'], .csb-authoring [style*='font-size:16px'], .csb-authoring [style*='font-size:0.7'], .csb-authoring [style*='font-size:0.8'], .csb-authoring [style*='font-size:0.9'], .csb-authoring [style*='font-size:0.95'], .csb-authoring [style*='font-size:1rem'],
.csb-table-wrap [style*='font-size:10px'], .csb-table-wrap [style*='font-size:11px'], .csb-table-wrap [style*='font-size:12px'], .csb-table-wrap [style*='font-size:13px'], .csb-table-wrap [style*='font-size:14px'], .csb-table-wrap [style*='font-size:15px'], .csb-table-wrap [style*='font-size:16px'], .csb-table-wrap [style*='font-size:0.7'], .csb-table-wrap [style*='font-size:0.8'], .csb-table-wrap [style*='font-size:0.9'], .csb-table-wrap [style*='font-size:0.95'], .csb-table-wrap [style*='font-size:1rem'],
.csb-analytics [style*='font-size:10px'], .csb-analytics [style*='font-size:11px'], .csb-analytics [style*='font-size:12px'], .csb-analytics [style*='font-size:13px'], .csb-analytics [style*='font-size:14px'], .csb-analytics [style*='font-size:15px'], .csb-analytics [style*='font-size:16px'], .csb-analytics [style*='font-size:0.7'], .csb-analytics [style*='font-size:0.8'], .csb-analytics [style*='font-size:0.9'], .csb-analytics [style*='font-size:0.95'], .csb-analytics [style*='font-size:1rem'],
.csb [style*='font-size:10px'], .csb [style*='font-size:11px'], .csb [style*='font-size:12px'], .csb [style*='font-size:13px'], .csb [style*='font-size:14px'], .csb [style*='font-size:15px'], .csb [style*='font-size:16px'], .csb [style*='font-size:0.7'], .csb [style*='font-size:0.8'], .csb [style*='font-size:0.9'], .csb [style*='font-size:0.95'], .csb [style*='font-size:1rem'] { font-size: 1em !important; }