:root {
	--shd-empty-state-bg: rgba(255, 255, 255, 0.025);
	--shd-empty-state-border: rgba(255, 255, 255, 0.12);
	--shd-empty-state-text: rgba(211, 218, 232, 0.82);
}

html[data-ui-theme='light'] {
	--shd-empty-state-bg: #e8ecf2;
	--shd-empty-state-border: var(--ui-border);
	--shd-empty-state-text: var(--ui-text-dim);
}

.shd-empty-state,
.shd-activity-empty {
	grid-column: 1 / -1;
	column-span: all;
	display: grid;
	place-items: center;
	width: 100%;
	box-sizing: border-box;
	min-height: 42px;
	padding: 20px 12px;
	border-radius: 6px;
	border: 1px dashed var(--shd-empty-state-border);
	background: var(--shd-empty-state-bg);
	color: var(--shd-empty-state-text);
	font:
		400 0.85rem/1.45 'Artifakt Element',
		ui-monospace,
		SFMono-Regular,
		Menlo,
		Monaco,
		Consolas,
		'Liberation Mono',
		'Courier New',
		monospace;
	text-align: center;
}

.shd-empty-state[hidden],
.shd-activity-empty[hidden] {
	display: none !important;
}

.shd-empty-state--table {
	display: table-cell;
	width: auto;
	min-height: 0;
	padding: 24px 16px;
	border: 0;
	border-radius: 0;
	background: transparent;
	color: var(--ui-text-muted);
	font:
		400 13px/1.45 'Artifakt Element',
		system-ui,
		sans-serif;
	text-align: center;
	vertical-align: middle;
	white-space: normal;
	overflow: visible;
	text-overflow: clip;
	grid-column: auto;
	column-span: none;
}

:is(.shd-table-shell, .controller-table-shell) > table > tbody > tr > td.shd-empty-state--table {
	position: relative;
	isolation: isolate;
	display: table-cell;
	width: auto;
	min-height: 0;
	padding: 32px 28px;
	border: 0;
	border-radius: 0;
	background: transparent;
	color: var(--ui-text-muted);
	font:
		400 13px/1.45 'Artifakt Element',
		system-ui,
		sans-serif;
	text-align: center;
	vertical-align: middle;
	white-space: normal;
	overflow: visible;
	text-overflow: clip;
	grid-column: auto;
}

:is(.shd-table-shell, .controller-table-shell) > table > tbody > tr > td.shd-empty-state--table::before {
	content: '';
	position: absolute;
	inset: 8px 12px;
	z-index: -1;
	border: 1px dashed var(--shd-empty-state-border);
	border-radius: 6px;
	background: color-mix(in srgb, var(--shd-empty-state-bg) 72%, transparent);
	pointer-events: none;
}

.shd-empty-state--muted {
	color: var(--ui-text-muted);
}

.shd-empty-state--panel {
	padding: 16px;
	border: 1px solid var(--ui-border);
	border-radius: 8px;
	background: var(--ui-surface);
	color: var(--ui-text);
}

.shd-empty-state--page {
	min-height: calc(100vh - env(safe-area-inset-top, 0px) - var(--page-topbar-offset, 58px) - 32px);
	gap: 16px;
	padding: 24px;
	border: 1px solid var(--ui-border-strong);
	border-radius: 8px;
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.02));
	box-shadow: var(--ui-shadow);
}

.shd-empty-state--inventory {
	font:
		500 11px/1.35 'Artifakt Element',
		system-ui,
		sans-serif;
}

.pb-empty-state {
	min-height: calc(100vh - env(safe-area-inset-top, 0px) - var(--page-topbar-offset, 58px) - 32px);
	display: grid;
	place-items: center;
	gap: 16px;
	padding: 24px;
	border: 1px solid var(--ui-border-strong);
	border-radius: 8px;
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.02));
	box-shadow: var(--ui-shadow);
}

.tasks-empty-state {
	min-height: 120px;
	padding: 16px;
	border-radius: 10px;
	font:
		500 12px/1.35 'Artifakt Element',
		system-ui,
		sans-serif;
}

.projects-empty {
	padding: 16px;
	border: 1px solid var(--ui-border);
	border-radius: 8px;
	background: var(--ui-surface);
	color: var(--ui-text);
}

#tor-empty-state {
	position: absolute;
	inset: 0;
	display: flex;
	width: auto;
	min-height: 0;
	align-items: center;
	justify-content: center;
	padding: 24px;
	border: 0;
	border-radius: 0;
	background: transparent;
	color: rgba(255, 255, 255, 0.7);
	font-family: 'Montserrat', system-ui, sans-serif;
	font-size: 1rem;
}

.shd-empty-state--overlay {
	position: absolute;
	inset: 0;
	display: flex;
	width: auto;
	min-height: 0;
	padding: 24px;
	border: 0;
	border-radius: 0;
	background: transparent;
	color: rgba(255, 255, 255, 0.7);
	font-family: 'Montserrat', system-ui, sans-serif;
	font-size: 1rem;
}

.shd-empty-state--spaced-top {
	margin-top: 10px;
}

/* Compatibility for dynamic/older module markup. New markup should use shd-empty-state. */
.finance-empty-state--table {
	padding: 24px 16px;
	text-align: center;
}

.finance-empty-state--muted {
	color: var(--ui-text-muted);
}

.finance-empty-state--spaced-top {
	margin-top: 10px;
}