.wp-block-docspress-file-tree {
	--db-tree-accent: var(--dp-blue, #3858e9);
	--db-tree-surface: color-mix(in srgb, var(--db-tree-accent) 2%, var(--dp-paper, #fff));
	--db-tree-panel: color-mix(in srgb, var(--dp-canvas, #f6f7f9) 76%, var(--dp-paper, #fff));
	--db-tree-border: var(--dp-line-strong, #cfd4dc);
	box-sizing: border-box;
	width: 100%;
	min-width: 0;
	margin-block: clamp(1.5rem, 3vw, 2.25rem);
	overflow: hidden;
	border: 1px solid var(--db-tree-border);
	border-radius: var(--dp-radius, 10px);
	background: var(--db-tree-surface);
	box-shadow: none;
}

.docspress-preset-docspress .wp-block-docspress-file-tree,
.docspress-blocks--preset-docspress.wp-block-docspress-file-tree {
	--db-tree-accent: #005cb3;
}

.docspress-preset-jetpack .wp-block-docspress-file-tree,
.docspress-blocks--preset-jetpack.wp-block-docspress-file-tree {
	--db-tree-accent: #069e08;
}

.docspress-file-tree__bar {
	display: grid;
	min-height: 39px;
	grid-template-columns: auto minmax(0, 1fr) auto;
	align-items: center;
	gap: 7px;
	box-sizing: border-box;
	padding: 6px 11px;
	border-bottom: 1px solid var(--db-tree-border);
	background: color-mix(in srgb, var(--db-tree-accent) 4%, var(--dp-paper, #fff));
}

.docspress-file-tree__bar code,
.entry-content .docspress-file-tree__bar code {
	overflow: hidden;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
	color: var(--dp-ink, #171a22);
	font: 650 0.76rem/1.2 var(--dp-font-mono, "SFMono-Regular", Consolas, monospace);
	text-overflow: ellipsis;
	white-space: nowrap;
}

.docspress-file-tree__bar > span:last-child {
	color: var(--dp-muted, #6f7685);
	font: 650 0.66rem/1.2 var(--dp-font-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.docspress-file-tree__root-icon,
.docspress-file-tree__icon {
	display: inline-grid;
	place-items: center;
	color: var(--db-tree-accent);
}

.docspress-file-tree__root-icon svg,
.docspress-file-tree__icon svg {
	width: 15px;
	height: 15px;
}

.wp-block-docspress-file-tree .docspress-file-tree__entries,
.wp-block-docspress-file-tree .docspress-file-tree__children {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
	list-style: none;
}

.wp-block-docspress-file-tree .docspress-file-tree__entries {
	padding: 8px 9px 9px;
	background: var(--db-tree-panel);
}

.wp-block-docspress-file-tree .docspress-file-tree__children {
	margin-left: 16px;
	padding-left: 8px;
	border-left: 1px solid color-mix(in srgb, var(--db-tree-accent) 24%, var(--db-tree-border));
}

.wp-block-docspress-file-tree .docspress-file-tree__item {
	margin: 0;
	padding: 0;
	list-style: none;
}

.docspress-file-tree__folder {
	margin: 0;
}

.docspress-file-tree__entry {
	display: grid;
	min-height: 27px;
	grid-template-columns: 12px 16px minmax(0, 1fr);
	align-items: center;
	gap: 5px;
	box-sizing: border-box;
	margin: 0;
	padding: 1px 6px 1px 2px;
	transition: background-color 120ms ease;
}

summary.docspress-file-tree__entry {
	cursor: pointer;
	list-style: none;
}

summary.docspress-file-tree__entry::-webkit-details-marker {
	display: none;
}

.docspress-file-tree__entry:hover {
	background: color-mix(in srgb, var(--db-tree-accent) 7%, transparent);
}

.docspress-file-tree__entry:focus-visible {
	outline: 2px solid var(--db-tree-accent);
	outline-offset: -2px;
}

.docspress-file-tree__entry code,
.entry-content .docspress-file-tree__entry code {
	overflow-wrap: anywhere;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
	color: var(--dp-copy, #2c3338);
	font: 520 0.78rem/1.35 var(--dp-font-mono, "SFMono-Regular", Consolas, monospace);
}

.docspress-file-tree__item.is-folder > .docspress-file-tree__entry code,
.docspress-file-tree__item.is-folder > .docspress-file-tree__folder > summary code {
	color: var(--dp-ink, #171a22);
	font-weight: 670;
}

.docspress-file-tree__toggle {
	display: inline-grid;
	width: 12px;
	height: 12px;
	place-items: center;
	color: var(--dp-muted, #6f7685);
	transition: transform 140ms ease;
}

.docspress-file-tree__toggle svg {
	width: 10px;
	height: 10px;
}

.docspress-file-tree__folder[open] > summary .docspress-file-tree__toggle {
	transform: rotate(90deg);
}

.docspress-file-tree__caption {
	padding: 7px 11px;
	border-top: 1px solid var(--db-tree-border);
	color: var(--dp-muted, #6f7685);
	font: 500 0.76rem/1.5 var(--dp-font-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
}

html[data-theme="dark"] .wp-block-docspress-file-tree {
	--db-tree-panel: color-mix(in srgb, var(--dp-canvas, #11141b) 82%, #000);
	box-shadow: none;
}

@media (prefers-reduced-motion: reduce) {
	.docspress-file-tree__entry,
	.docspress-file-tree__toggle {
		transition: none;
	}
}
