/**
 * Docs shell — base reset, fluid width, 3-column grid and main column.
 *
 * Scoped under .sd-docs so the active theme is untouched.
 */

/* ---------- Base / reset ---------- */
.sd-docs,
.sd-docs *,
.sd-docs *::before,
.sd-docs *::after {
	box-sizing: border-box;
}

.sd-docs {
	font-family: var(--sd-font);
	font-size: 15px;
	line-height: 1.65;
	min-height: 100vh;
	color: var(--sd-text-soft);
	background: var(--sd-bg);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

/* Fluid full-width container. The theme wrapper (#page) already reaches the
 * viewport edges, so width:100% is edge-to-edge without a 100vw breakout
 * (which would add the scrollbar width and trigger a horizontal scrollbar). */
.sd-docs {
	width: 100%;
	max-width: 100%;
}

.sd-docs a {
	color: var(--sd-text-soft);
}

.sd-docs a:hover {
	color: var(--sd-text);
}

/* ---------- Grid ---------- */
.sd-docs__grid {
	display: grid;
	align-items: start;
	width: 100%;
	max-width: none;
	margin: 0;
	grid-template-columns: var(--sd-sidebar-w) minmax(0, 1fr) var(--sd-toc-w);
	gap: 0;
}

.sd-docs--reference .sd-docs__grid {
	grid-template-columns: var(--sd-sidebar-w) minmax(0, 1fr);
}

/* When a page has no TOC, collapse the grid to two columns so the empty
 * (hidden) aside never wraps under the sidebar as a stray column. */
.sd-docs__grid:has(.sd-docs__toc--empty) {
	grid-template-columns: var(--sd-sidebar-w) minmax(0, 1fr);
}

.sd-docs__toc--empty {
	display: none;
}

/* ---------- Main column ---------- */
.sd-docs__main {
	min-width: 0;
	padding: 44px 44px 96px 32px;
}

.sd-docs__content {
	max-width: none;
}