diff --git a/resources/skins.vector.styles/components/Sidebar.less b/resources/skins.vector.styles/components/Sidebar.less
index b809fc6a4..069cf198e 100644
--- a/resources/skins.vector.styles/components/Sidebar.less
+++ b/resources/skins.vector.styles/components/Sidebar.less
@@ -39,6 +39,15 @@
 	}
 }
 
+.sidebar-toc,
+.sidebar-toc:after {
+	margin-left: -@margin-start-sidebar-content;
+
+	@media ( min-width: @min-width-desktop-wide ) {
+		margin-left: 0;
+	}
+}
+
 .vector-layout-grid {
 	@media ( min-width: @min-width-desktop ) {
 		.mw-sidebar {
@@ -139,10 +148,3 @@
 	visibility: hidden;
 	opacity: 0;
 }
-
-@media ( min-width: ( @max-width-workspace-container + ( 2 * @padding-horizontal-page-container ) ) ) {
-	.mw-sidebar {
-		background: @background-color-page-container;
-		border-right: @border-width-base @border-style-base @border-color-sidebar;
-	}
-}
diff --git a/resources/skins.vector.styles/components/TableOfContents.less b/resources/skins.vector.styles/components/TableOfContents.less
index 1d029e6cf..1bd582b3f 100644
--- a/resources/skins.vector.styles/components/TableOfContents.less
+++ b/resources/skins.vector.styles/components/TableOfContents.less
@@ -3,14 +3,18 @@
 @sidebar-toc-fade-height: 30px;
 @sidebar-toc-vertical-padding: 20px;
 @sidebar-toc-right-padding: 12px;
+// Sidebar TOC uses increased left padding and a negative left margin to achieve
+// a 15px spacing without clipping the chevron icon
+// https://phabricator.wikimedia.org/T312156#8095894
+@sidebar-toc-left-padding: ~'calc( 15px + @{margin-start-sidebar-content} )';
 @toc-subsection-toggle-icon-size: 1.834em;
 
 .sidebar-toc {
 	max-height: 75vh;
-	padding: @sidebar-toc-vertical-padding @sidebar-toc-right-padding @sidebar-toc-vertical-padding 32px;
+	padding: @sidebar-toc-vertical-padding @sidebar-toc-right-padding @sidebar-toc-vertical-padding @sidebar-toc-left-padding;
 	box-sizing: border-box;
 	overflow: auto;
-	background-color: @border-color-sidebar;
+	background-color: @background-color-page-container;
 
 	.sidebar-toc-header {
 		padding-bottom: 12px;
@@ -87,7 +91,7 @@
 	left: 0;
 	right: 0;
 	height: @sidebar-toc-fade-height;
-	background: linear-gradient( rgba( 255, 255, 255, 0 ), @border-color-sidebar );
+	background: linear-gradient( rgba( 255, 255, 255, 0 ), @background-color-page-container );
 	background-repeat: no-repeat;
 	background-position: -@sidebar-toc-right-padding; // T311436 Hacky way to prevent the fade from covering the scrollbar
 	pointer-events: none; // Make the link below the fade clickable
diff --git a/resources/skins.vector.styles/components/TableOfContentsCollapsed.less b/resources/skins.vector.styles/components/TableOfContentsCollapsed.less
index a248f514b..07900cd18 100644
--- a/resources/skins.vector.styles/components/TableOfContentsCollapsed.less
+++ b/resources/skins.vector.styles/components/TableOfContentsCollapsed.less
@@ -44,10 +44,9 @@
 		top: 44px;
 		left: -2px;
 		// !important needed to override rules in Sidebar.less
-		margin-top: 0 !important; /* stylelint-disable-line declaration-no-important */
+		margin: 0 !important; /* stylelint-disable-line declaration-no-important */
 
 		// Dropdown styles
-		background-color: @color-base--inverted;
 		border: @border-width-base @border-style-base @border-color-base;
 
 		// Remove TOC fade