diff --git a/files/static/dist/main.css b/files/static/dist/main.css
index 27e56526eb..e6bbf4e653 100644
--- a/files/static/dist/main.css
+++ b/files/static/dist/main.css
@@ -1209,6 +1209,9 @@ video {
 .w-56 {
 	width: 14rem;
 }
+.w-3\/4 {
+	width: 75%;
+}
 .w-5 {
 	width: 1.25rem;
 }
@@ -1673,6 +1676,10 @@ video {
 	--tw-bg-opacity: 1;
 	background-color: rgba(229, 235, 231, var(--tw-bg-opacity));
 }
+.bg-black {
+	--tw-bg-opacity: 1;
+	background-color: rgba(0, 0, 0, var(--tw-bg-opacity));
+}
 .bg-gray-300\/40 {
 	background-color: rgba(var(--color-300), 0.4);
 }
diff --git a/files/templates/CHRISTMAS/modals/ModalThemePicker.html b/files/templates/CHRISTMAS/modals/ModalThemePicker.html
index c6f84106eb..f449ed4dff 100644
--- a/files/templates/CHRISTMAS/modals/ModalThemePicker.html
+++ b/files/templates/CHRISTMAS/modals/ModalThemePicker.html
@@ -1,9 +1,9 @@
 <div class="modal fade" id="themePickerModal" tabindex="-1" role="dialog" aria-labelledby="themePickerModalTitle" aria-hidden="true">
 	<div class="modal-dialog modal-dialog-scrollable modal-dialog-centered" role="document">
-		<div class="modal-content bg-gray-100 rounded-md shadow-lg">
+		<div class="modal-content bg-gray-100 dark:bg-gray-800 rounded-md shadow-lg">
 			<div class="modal-header">
 				<h5 class="font-bold text-xl text-black font-heading leading-normal">Select theme</h5>
-				<button type="button" class="close text-gray-700 hover:text-gray-900" data-bs-dismiss="modal" aria-label="Close">
+				<button type="button" class="close text-gray-700 hover:text-gray-900 dark:text-gray-500 dark:hover:text-gray-400" data-bs-dismiss="modal" aria-label="Close">
 					<span aria-hidden="true"><i class="far fa-times"></i></span>
 				</button>
 			</div>