/* ===== Layout base ===== */
.ls-shell {
	/* ⛔ was: height:100vh; overflow:hidden;  — this trapped the page */
	/* We let the document set height; shell should not force viewport sizing */
	height: auto;                 /* ← changed */
	overflow: visible;            /* ← changed */
}
.ls-shell .row {
	/* ⛔ was: height:100%; which re-introduced trapping */
	min-height: 0;                /* ← changed */
}

.ls-sidebar,
.ls-content {
	/* ⛔ height:100% ties to a trapped parent and creates the footer overlap */
	/* height: 100%; */           /* ← removed */
	-webkit-overflow-scrolling: touch;
	min-height: 0;
}

/* Keep page scroll as the primary scroll; only the sidebar gets its own scroll if tall */
.ls-content {
	overflow: visible;            /* ← changed: let the page scroll, not the pane */
}

/* ===== Theme tokens (single root) ===== */
:root {
	--ls-bg: #212529;               /* header/footer/nav base (darker) */
	--ls-sidebar-bg: #262b31;       /* sidebar + mobile panel (slightly lighter) */
	--ls-text: #f8f9fa;
	--ls-text-soft: #e9ecef;
	--ls-border: rgba(255,255,255,.12);
	--ls-border-strong: rgba(255,255,255,.15);
	--ls-hover: rgba(255,255,255,.10);
	--ls-active: rgba(255,255,255,.15);
	--ls-primary-tint: rgba(13,110,253,.25);
}

/* ===== Sidebar (desktop) ===== */
.ls-sidebar {
	background: var(--ls-sidebar-bg);
	border-right: 1px solid var(--ls-border-strong);

	/* Sidebar scrolls independently without affecting page/footer */
	position: sticky;              /* ← added */
	top: 0;                        /* adjust if you use a fixed header */
	max-height: 100vh;             /* ← added */
	overflow: auto;                /* ← added */
}
.ls-sidebar .border-bottom { border-bottom-color: var(--ls-border-strong) !important; }

/* List containers + items (desktop + mobile panel) */
.ls-sidebar .list-group,
#toolsCollapse .list-group { background: var(--ls-sidebar-bg); margin: 0; }

.ls-sidebar .list-group-item,
#toolsCollapse .list-group-item {
	background: var(--ls-sidebar-bg) !important;
	color: var(--ls-text) !important;
	border-color: var(--ls-border) !important;
}

/* Parent rows */
.ls-parent { min-height: 44px; }
.ls-parent-link {
	display: flex; align-items: center; width: 100%;
	padding: .5rem .75rem;
	text-decoration: none;
	color: var(--ls-text) !important;
}
.ls-parent-link:hover { background: var(--ls-hover); }
.ls-parent-link.active { background: var(--ls-active); font-weight: 600; }

/* Arrow toggle (Unicode ▸ / ▾) */
.ls-toggle {
	border: 0; background: transparent; cursor: pointer;
	display: inline-flex; align-items: center; justify-content: center;
	min-width: 44px; padding: 0 .75rem;
}
.ls-toggle::after { content: "▸"; font-size: 14px; line-height: 1; color: var(--ls-text); }
.ls-toggle[aria-expanded="true"]::after { content: "▾"; }

/* Sub-lists */
.ls-sub-list { border-top: 1px solid var(--ls-border); }
.ls-sub-link {
	display: block; text-decoration: none;
	padding: .5rem .75rem .5rem 1.75rem;   /* indent */
	font-size: .95rem;
	color: var(--ls-text-soft) !important;
}
.ls-sub-link:hover { background: var(--ls-hover); }
.ls-sub-link.active { background: var(--ls-primary-tint); font-weight: 600; }

/* ===== Mobile Tools bar (top strip is your dark navbar; panel matches sidebar) ===== */
.ls-toolsbar.navbar {
	--bs-navbar-padding-y: .5rem;
	--bs-navbar-toggler-border-color: rgba(255,255,255,.35);
}
.ls-toolsbar-title {
	color: var(--ls-text);
	font-weight: 600;
	line-height: 1.25;
	padding: .25rem 0;
	margin-left: 12px;              /* prevent overlap with burger */
}
/* Mobile panel surface */
#toolsCollapse.navbar-collapse { background: var(--ls-sidebar-bg); }

/* ===== Mobile-only adjustments ===== */
@media (max-width: 767.98px) {
	/* Let page flow so collapse can expand */
	.ls-shell { height: auto; overflow: visible; }  /* unchanged intention */

	/* Make Tools bar and panel flush; flat panel attached to bar */
	.ls-toolsbar .container { padding-left: 0; padding-right: 0; }
	#toolsCollapse.navbar-collapse {
		margin: 0; padding: 0; border-radius: 0;
		border-top: 1px solid var(--ls-border-strong);
		box-shadow: none;
	}

	/* Trim inner borders a touch on mobile */
	#toolsCollapse .list-group-item { border-left: 0; border-right: 0; }
}

/* ===== Burger focus/hover cleanup (both navbars) ===== */
.navbar .navbar-toggler {
	-webkit-tap-highlight-color: transparent;
	background: transparent !important;
	border: 1px solid transparent !important;
}
.navbar .navbar-toggler:hover,
.navbar .navbar-toggler:active,
.navbar .navbar-toggler:focus:not(:focus-visible) {
	background: transparent !important;
	border-color: transparent !important;
	box-shadow: none !important;
}
/* Keep accessible focus ring for keyboard only */
.navbar .navbar-toggler:focus-visible {
	outline: 2px solid rgba(255,255,255,.35);
	outline-offset: 2px;
	border-radius: .375rem;
}

/* ===== Carbon + Anodised skin (toggle with .theme-carbon on <body>) ===== */
.theme-carbon {
	--ls-bg: #181a1e;				/* darker global base */
	--ls-sidebar-bg: #20242a;		/* sidebar / tools panel surface */
	--ls-text: #f5f7fb;
	--ls-text-soft: #dbe2ee;
	--ls-border: rgba(255,255,255,.08);
	--ls-border-strong: rgba(255,255,255,.12);
	--ls-hover: rgba(255,255,255,.06);
	--ls-active: rgba(255,255,255,.10);
	--ls-primary-tint: rgba(0,180,255,.22);	/* anodised blue glow */
}

/* Subtle carbon weave behind the sidebar + mobile panel */
.theme-carbon .ls-sidebar,
.theme-carbon #toolsCollapse.navbar-collapse {
	background:
		repeating-linear-gradient(135deg, rgba(255,255,255,.02) 0 2px, transparent 2px 4px),
		repeating-linear-gradient(45deg, rgba(0,0,0,.25) 0 2px, transparent 2px 4px),
		var(--ls-sidebar-bg);
	background-blend-mode: overlay, overlay, normal;
}

/* Navbar (top + tools bar strip) — satin dark, not glossy */
.theme-carbon .navbar.bg-dark,
.theme-carbon .ls-toolsbar.navbar.bg-dark {
	background:
		linear-gradient(180deg, #16191d 0%, #121418 100%);
}

/* Links in lists — slightly brighter on hover, crisp active */
.theme-carbon .ls-parent-link:hover,
.theme-carbon #toolsCollapse .ls-parent-link:hover {
	background: rgba(0,180,255,.10);	/* cool anodised hint */
}
.theme-carbon .ls-parent-link.active,
.theme-carbon #toolsCollapse .ls-parent-link.active {
	background: rgba(0,180,255,.18);
	box-shadow: inset 0 0 0 1px rgba(0,180,255,.35);
}

.theme-carbon .ls-sub-link:hover { background: rgba(0,180,255,.08); }
.theme-carbon .ls-sub-link.active {
	background: rgba(0,180,255,.16);
	box-shadow: inset 0 0 0 1px rgba(0,180,255,.30);
}

/* Burger button — anodised ring on keyboard focus, otherwise clean */
.theme-carbon .navbar .navbar-toggler:focus-visible {
	outline: 2px solid rgba(0,180,255,.55);
	outline-offset: 2px;
	border-radius: .375rem;
}

/* Buttons (optional, if you use .btn-primary anywhere) */
.theme-carbon .btn-primary {
	background: linear-gradient(180deg, #1fb6ff 0%, #0091d5 100%);
	border-color: #0091d5;
}
.theme-carbon .btn-primary:hover {
	background: linear-gradient(180deg, #44c4ff 0%, #00a2ea 100%);
	border-color: #00a2ea;
}
.theme-carbon .btn-primary:active {
	background: linear-gradient(180deg, #18a8ee 0%, #0089c1 100%);
	border-color: #0089c1;
	box-shadow: inset 0 1px 2px rgba(0,0,0,.35);
}

/* Cards / panes (if you have any) — match theme */
.theme-carbon .card {
	background: #1b1f25;
	border-color: var(--ls-border-strong);
}

/* Keep scrollbars subtle (Chromium/Edge) */
.theme-carbon ::-webkit-scrollbar { width: 10px; height: 10px; }
.theme-carbon ::-webkit-scrollbar-thumb {
	background: rgba(255,255,255,.10);
	border-radius: 8px;
}
.theme-carbon ::-webkit-scrollbar-thumb:hover {
	background: rgba(255,255,255,.18);
}

/* Refined mid-density carbon weave: clean, subtle, no fuzz */
.theme-carbon .ls-sidebar,
.theme-carbon #toolsCollapse.navbar-collapse,
.theme-carbon .ls-sidebar .list-group,
.theme-carbon #toolsCollapse .list-group,
.theme-carbon .ls-sidebar .list-group-item,
.theme-carbon #toolsCollapse .list-group-item {
	background:
		repeating-linear-gradient(135deg, rgba(255,255,255,.022) 0 3px, transparent 3px 6px),
		repeating-linear-gradient(45deg, rgba(0,0,0,.19) 0 3px, transparent 3px 6px),
		var(--ls-sidebar-bg) !important;
	background-blend-mode: overlay, overlay, normal;
}