diff --git a/Themes/default/Search.template.php b/Themes/default/Search.template.php
index a96b203a96..3c6c8bb655 100644
--- a/Themes/default/Search.template.php
+++ b/Themes/default/Search.template.php
@@ -157,14 +157,10 @@ function template_main()
 		echo '
 		<fieldset class="flow_hidden">
 			<div class="roundframe alt">
-				<div class="title_bar">
-					<h4 class="titlebg">
-						<a href="#" id="advanced_panel_link">', Lang::getTxt('choose_board', file: 'Search'), '</a>
-					</h4>
-					<span id="advanced_panel_toggle" class="toggle_down" style="display: none;"></span>
-				</div>
-				<div class="flow_auto boardslist" id="advanced_panel_div"', !empty(Utils::$context['boards_check_all']) ? ' style="display: none;"' : '', '>
-					<ul>';
+				<details id="advanced_panel"', !empty(Utils::$context['boards_check_all']) ? '' : ' open', '>
+					<summary class="title_bar titlebg">', Lang::getTxt('choose_board', file: 'Search'), '</summary>
+					<div class="flow_auto boardslist">
+						<ul>';
 
 		foreach (Utils::$context['categories'] as $category) {
 			echo '
@@ -209,8 +205,9 @@ function template_main()
 		}
 
 		echo '
-					</ul>
-				</div><!-- #advanced_panel_div -->
+						</ul>
+					</div>
+				</details>
 				<br class="clear">
 				<div class="padding">
 					<input type="checkbox" name="all" id="check_all" value=""', !empty(Utils::$context['boards_check_all']) ? ' checked' : '', ' onclick="invertAll(this, this.form, \'brd\');">
@@ -219,31 +216,6 @@ function template_main()
 				</div>
 			</div><!-- .roundframe -->
 		</fieldset>';
-
-		echo '
-		<script>
-			var oAdvancedPanelToggle = new smc_Toggle({
-				bToggleEnabled: true,
-				bCurrentlyCollapsed: ', !empty(Utils::$context['boards_check_all']) ? 'true' : 'false', ',
-				aSwappableContainers: [
-					\'advanced_panel_div\'
-				],
-				aSwapImages: [
-					{
-						sId: \'advanced_panel_toggle\',
-						altExpanded: ', Utils::escapeJavaScript(Lang::getTxt('hide', file: 'General')), ',
-						altCollapsed: ', Utils::escapeJavaScript(Lang::getTxt('show', file: 'General')), '
-					}
-				],
-				aSwapLinks: [
-					{
-						sId: \'advanced_panel_link\',
-						msgExpanded: ', Utils::escapeJavaScript(Lang::getTxt('choose_board', file: 'Search')), ',
-						msgCollapsed: ', Utils::escapeJavaScript(Lang::getTxt('choose_board', file: 'Search')), '
-					}
-				]
-			});
-		</script>';
 	}
 
 	echo '
diff --git a/Themes/default/css/index.css b/Themes/default/css/index.css
index 8799e3f0b1..25f0c0add7 100644
--- a/Themes/default/css/index.css
+++ b/Themes/default/css/index.css
@@ -2679,6 +2679,15 @@ dl {
 	height: 16px;
 }
 
+/* The board picker's title bar is one element now, the summary of a details.
+/* It carries both bar classes, and .titlebg comes later in this file with a
+/* background of its own, so the bar's is named again here. Overflow has to stay
+/* visible as well, or .titlebg clips the disclosure triangle away. */
+#advanced_panel > summary {
+	background: var(--titlebar-bg);
+	cursor: pointer;
+	overflow: visible;
+}
 .boardslist > ul > li {
 	margin: 12px;
 }