html,
body {
	margin: 0;
	padding: 0;
	height: 100%;
	font-family: Arial, sans-serif;
	box-sizing: border-box;
}

.button-image 
{
	width: 35px;
	height: 35px;
	display: inline;
	vertical-align: middle;
}

/* Header bar stays at top */
.header 
{
	background-color: #00aee0;
	padding: 10px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	color: white;
	height: 50px;
	box-sizing: border-box;
	min-width: 460px;
}

.mainform-image 
{
	width: 100%;
	height: auto;
	display: block;
}

/* 1) Reduce the page’s outer left/right gutter (affects whole layout) */
/* Narrow Material's primary (left) sidebar on larger screens */
@media (min-width: 1000px) 
{
	/* give content a little room on the right so it never sits under the logo */
	.md-content 
	{
		padding-right: 10px;
	}
	/* optional: also give the header row a bit of room so search/menu never touch it */
	.md-header__inner 
	{
		padding-right: 10px;
	}
	:root 
	{
		/* If your Material version supports this var, this line is enough: */
		--md-sidebar-width: 8rem; /* default ~17–20rem; make it tighter */
	}

	/* Fallback for older theme builds */
	.md-sidebar--primary {
		/* The 3rd position sets the width of the nav TOC */
		flex: 0 0 8rem !important; /* fallback for older Material builds */
	}
}

:root
{
	--md-sidebar-width: 8rem; /* pick your width */
}

/* Make MkDocs Material footer fixed to bottom of the viewport */
.md-footer 
{
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: 2000; /* keep it above content */
}

/* Push page content down so the footer doesn’t overlap it */
.md-main 
{
	padding-bottom: 3.5rem; /* adjust to footer height */
}

/* Optional: widen the overall content area so the page doesn't feel cramped */
.md-grid 
{
	max-width: 90%;
}

/* or 100% */

/* Hide the title above the LEFT nav items */
.md-sidebar--primary .md-nav--primary > .md-nav__title,
.md-sidebar--primary label.md-nav__title,
.md-sidebar--primary .md-nav__title[for="__drawer"] 
{
	display: none !important;
}

/* Tighten spacing after removing it (optional) */
.md-sidebar--primary .md-nav--primary 
{
	margin-top: 0 !important;
	padding-top: 0 !important;
}

/* Title above the NAV items in the LEFT sidebar (primary nav) */
.md-sidebar--primary .md-nav__title 
{
	font-size: 1.0rem; /* <- change this */
	font-weight: 600; /* optional */
	line-height: 1.25; /* optional */
	padding: .4rem 0; /* optional spacing */
}

/* If the title is ellipsized and you want wrapping */
.md-sidebar--primary .md-nav__title .md-ellipsis 
{
	white-space: normal;
}

/* Top-level page links in the LEFT nav */
.md-sidebar--primary .md-nav__item > .md-nav__link 
{
	font-size: 1rem; /* nav page size */
	font-weight: 400;
}

/* Current page label in the LEFT nav */
.md-sidebar--primary .md-nav__item--active > .md-nav__link 
{
	font-size: 1.05rem;
	font-weight: 700;
}

/* INTEGRATED ToC (page sections) under the active page in the LEFT nav */
.md-sidebar--primary .md-nav__item--active .md-nav__list .md-nav__link 
{
	font-size: 0.95rem; /* H2-ish */
	font-weight: 500;
}

/* Deeper section levels (H3/H4…) a bit smaller/indented */
.md-sidebar--primary .md-nav__item--active .md-nav__item .md-nav__list .md-nav__link 
{
	font-size: 0.9rem;
	padding-left: .5rem;
}

/* Active section highlight */
.md-sidebar--primary .md-nav__link--active 
{
	font-weight: 700;
	text-decoration: none;
}

/* Optional: tighten vertical spacing */
.md-sidebar--primary .md-nav__item 
{
	margin: .1rem 0;
}

/* Optional: tweak hover/focus */
.md-sidebar--primary .md-nav__link:hover,
.md-sidebar--primary .md-nav__link:focus 
{
	text-decoration: underline;
}

/* Hide Material's built-in right-hand ToC */
.md-sidebar--secondary 
{
	display: none !important;
}

.md-sidebar--secondary .md-nav__title 
{
	display: none !important;
}

.md-sidebar--secondary .md-nav 
{
	margin-top: 0;
}

.md-sidebar--primary .md-nav 
{
	margin-top: 0;
}

/* Top-right logo behavior and content clearance */
.nerdsimage {
	position: absolute; /* stays put while scrolling */
	top: 60px; /* sit below the header bar */
	right: 10px;
	width: 70px;
	height: 70px;
	z-index: 2000;
	margin: 0px,0px, 0px, 10px;
	pointer-events: none; /* don’t block clicks */
}

/* Compact left TOC card */
.r2n-toc {
	top: calc(var(--md-header-height, 64px) + 12px); /* sits below the header */
	align-self: flex-start; /* important inside flex/grid wrappers */
	max-height: calc(100vh - 96px); /* keep it within viewport */
	overflow: auto; /* scroll TOC if it’s long */
	position: sticky; /* if you like it to stick while scrolling */
	max-width: 200px; /* << controls overall width of the box */
	padding: 8px 0px 16px 0px; /* << trims inside left/right padding */
	margin-left: -40px !important; /* remove extra left spacing */
	margin-right: 16px; /* still keep a small gap from content */
	max-width: 200px; /* narrower width */
	background: #fff;
	border-radius: 0.0rem;
	box-shadow: 0 2px 12px rgba(0,0,0,.12);
}

.r2n-toc ul 
{
	margin: 0 8px 0 0;
	padding-left: 0;
	list-style: none;
}

.r2n-toc li 
{
	margin: 2px 0;
}

.r2n-toc a 
{
	display: block;
	padding: 2px 4px; /* << trims link padding inside the box */
	text-decoration: none;
}

.r2n-toc a:hover 
{
	text-decoration: underline;
}

p.r2n-sectionheader 
{
	align-items: center;
	display: inline-flex;
	font-size: 1.2em;
	font-weight: 600;
	gap: .35em;
	line-break: normal;
}

p.r2n-sectiontext 
{
	font-size: 1.0em;
	line-break: normal;
	margin-left: 15px;
	margin-right: 15px;
}

p.r2n-text 
{
	font-size: 1.0em;
	line-break: normal;
}

.settingforminitialfile-image 
{
	width: 90%;
	height: auto;
	display: block;
	text-wrap-mode: wrap;
}

.settingformlanguage-image 
{
	width: 90%;
	height: auto;
	display: block;
	text-wrap-mode: wrap;
}

/* Hide elements visually but keep them for anchors/ToC/screen readers */
.sr-only 
{
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	white-space: nowrap !important;
	border: 0 !important;
}

/* Floating TOC box */
.toc-box 
{
	position: sticky;
	top: calc(var(--md-header-height, 64px) + 8px); /* sits below the header */
	align-self: flex-start; /* important inside flex/grid wrappers */
	max-height: calc(100vh - 96px); /* keep it within viewport */
	overflow: auto; /* scroll TOC if it’s long */
	box-shadow: var(--md-shadow-z2);
	border-radius: 0.0rem;
	padding: 0.0rem 0.0rem;
	background: var(--md-default-bg-color);
	border: 1px solid var(--md-default-fg-color--lightest);
	width: 260px; /* set your preferred width */
	margin: .75rem 1rem 1rem 0; /* space from main text */
}

/* Place content to the right of the floating box */
.toc-layout 
{
	display: grid;
	grid-template-columns: auto 1fr; /* TOC box | main content */
	gap: 0;
}

/* Make it stack on small screens */
@media (max-width: 960px) 
{
	.toc-layout 
	{
		display: block;
	}

	.toc-box 
	{
		position: relative;
		width: 100%;
		max-height: none;
		margin: 0 0 1rem 0;
	}
}

/* Optional: style the list */
.toc-box ul 
{
	list-style: none;
	margin: 0;
	padding: 0;
}

.toc-box li + li 
{
	margin-top: .25rem;
}

.toc-box a 
{
	text-decoration: none;
}

.toc-box a:hover .
{
	text-decoration: underline;
}