/* ── Dateimanager (default / light) ─────────────────── */

.dm-wrap {
	display: flex;
	flex-direction: column;
	height: calc(100vh - 110px);
	font-size: 13px;
}

.dm-topleiste {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 6px 4px 10px 4px;
	border-bottom: 1px solid rgb(200, 200, 200);
	flex-wrap: wrap;
}

.dm-domain-label {
	display: flex;
	align-items: center;
	gap: 6px;
	font-weight: bold;
}

.dm-info {
	color: rgb(100, 100, 100);
	font-size: 12px;
}
.dm-info code {
	background-color: rgb(245, 245, 245);
	padding: 1px 4px;
	border-radius: 2px;
	color: rgb(60, 60, 60);
}

.dm-layout {
	display: grid;
	grid-template-columns: 280px 1fr;
	gap: 12px;
	flex: 1;
	min-height: 0;
}

/* ── Tree links ──────────────────────────────── */

.dm-tree-spalte {
	border: 1px solid rgb(210, 210, 210);
	background-color: rgb(252, 252, 252);
	display: flex;
	flex-direction: column;
	min-height: 0;
}

.dm-tree-toolbar {
	display: flex;
	gap: 4px;
	padding: 4px;
	border-bottom: 1px solid rgb(210, 210, 210);
	background-color: rgb(245, 245, 245);
}

.dm-tree {
	overflow-y: auto;
	flex: 1;
	padding: 4px 6px;
}

.dm-tree-liste {
	list-style: none;
	margin: 0;
	padding: 0;
}
.dm-tree-liste.dm-tree-wurzel { padding-left: 0; }
.dm-tree .dm-tree-liste { padding-left: 14px; }

.dm-tree-knoten {
	margin: 1px 0;
}

.dm-tree-zeile {
	display: flex;
	align-items: center;
	gap: 4px;
	cursor: default;
	padding: 1px 3px;
	border-radius: 2px;
}
.dm-tree-zeile:hover { background-color: rgb(235, 240, 245); }

.dm-tree-knoten.aktiv > .dm-tree-zeile { background-color: rgb(220, 232, 248); font-weight: bold; }

.dm-tree-pfeil {
	width: 14px;
	color: rgb(80, 80, 80);
	cursor: pointer;
	font-size: 9px;
	user-select: none;
}

.dm-tree-name {
	flex: 1;
	cursor: pointer;
	user-select: none;
}

.dm-tree-knoten.dm-tabu > .dm-tree-zeile {
	color: rgb(160, 160, 160);
	cursor: not-allowed;
}
.dm-tree-knoten.dm-tabu .dm-tree-name { cursor: not-allowed; font-style: italic; }

.dm-tree-kinder { display: none; }
.dm-tree-knoten.dm-tree-offen > .dm-tree-kinder { display: block; }

/* ── Inhalts-Panel rechts ───────────────────── */

.dm-inhalt-spalte {
	border: 1px solid rgb(210, 210, 210);
	background-color: rgb(255, 255, 255);
	display: flex;
	flex-direction: column;
	min-height: 0;
}

.dm-pfadleiste {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 6px 8px;
	border-bottom: 1px solid rgb(210, 210, 210);
	background-color: rgb(247, 247, 247);
}

.dm-pfad-label { color: rgb(95, 95, 95); }
.dm-pfad {
	font-family: monospace;
	color: rgb(40, 40, 40);
	background-color: rgb(245, 245, 245);
	padding: 2px 6px;
	border-radius: 2px;
}

.dm-pfad-segment {
	color: rgb(25, 85, 155);
	text-decoration: none;
}
.dm-pfad-segment:hover { text-decoration: underline; }
.dm-pfad-segment.dm-pfad-aktiv {
	color: rgb(40, 40, 40);
	font-weight: bold;
	cursor: default;
}
.dm-pfad-trenner {
	color: rgb(140, 140, 140);
	margin: 0 2px;
}

.dm-spacer { flex: 1; }

.dm-listing-wrap {
	overflow: auto;
	flex: 1;
	min-height: 0;
}

.dm-listing {
	width: 100%;
	border-collapse: collapse;
}
.dm-listing th, .dm-listing td {
	text-align: left;
	padding: 4px 8px;
	border-bottom: 1px solid rgb(235, 235, 235);
	vertical-align: middle;
}
.dm-listing th {
	background-color: rgb(245, 245, 245);
	color: rgb(85, 85, 85);
	font-size: 12px;
	border-bottom: 1px solid rgb(200, 200, 200);
	position: sticky;
	top: 0;
	z-index: 1;
}
.dm-col-name { width: auto; }
.dm-col-groesse { width: 80px; text-align: right; }
.dm-col-aend { width: 140px; }
.dm-col-aktion { width: 360px; text-align: right; }

.dm-row:hover { background-color: rgb(248, 250, 252); }

.dm-row-eltern td { background-color: rgb(250, 250, 250); font-style: italic; }
.dm-row-eltern a { text-decoration: none; color: rgb(70, 100, 150); }

.dm-row.dm-tabu .dm-cell-name { color: rgb(160, 160, 160); font-style: italic; }

.dm-cell-groesse { text-align: right; color: rgb(95, 95, 95); font-family: monospace; font-size: 12px; }
.dm-cell-aend    { color: rgb(95, 95, 95); font-size: 12px; }
.dm-cell-aktion  { text-align: right; }

.dm-cell-name a { color: rgb(25, 85, 155); text-decoration: none; }
.dm-cell-name a:hover { text-decoration: underline; }

.dm-icon { display: inline-block; width: 18px; }

.dm-hint   { padding: 8px 4px; color: rgb(110, 110, 110); font-style: italic; }
.dm-fehler { padding: 8px 4px; color: rgb(180, 60, 60); }

.btn-loeschen {
	background-color: rgb(220, 80, 80) !important;
	color: rgb(255, 255, 255) !important;
	border-color: rgb(180, 50, 50) !important;
}
.btn-loeschen:hover { background-color: rgb(200, 60, 60) !important; }

.btn-eins-sm {
	font-size: 11px;
	padding: 2px 6px;
}

/* ── Editor ──────────────────────────────── */

.dm-editor-wrap {
	display: flex;
	flex-direction: column;
	flex: 1;
	min-height: 0;
}

.dm-editor-leiste {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 6px 8px;
	background-color: rgb(247, 247, 247);
	border-bottom: 1px solid rgb(210, 210, 210);
}

.dm-editor-pfad {
	font-family: monospace;
	color: rgb(40, 40, 40);
}

.dm-editor-status {
	color: rgb(80, 130, 80);
	font-size: 12px;
}

.dm-editor-wrap textarea,
.dm-editor-wrap .CodeMirror {
	flex: 1;
	width: 100%;
	border: 0;
	min-height: 0;
}