feat: implement language selector component with responsive design for improved user experience across devices

resources/views/layouts/site.blade.php

@@ -85,9 +85,44 @@ $favicon_path = setting('site_favicon');
 			max-width: 100%;
 		}
 
-		header .container,
-		.wrapper > .container {
-			max-width: 100%;
+		
+
+		header .header-language-desktop {
+			display: none !important;
+		}
+
+		@media (min-width: 992px) {
+			header .header-language-desktop {
+				display: flex !important;
+			}
+		}
+
+		@media (max-width: 991.98px) {
+			header nav .container > .navbar-other:has(> .navbar-nav > .language-select) {
+				display: none !important;
+			}
+
+			.offcanvas .language-select-offcanvas__toggle {
+				width: 100%;
+				text-align: left;
+			}
+
+			.offcanvas .language-select-offcanvas__panel {
+				position: static !important;
+				inset: auto !important;
+				transform: none !important;
+				background: transparent !important;
+				box-shadow: none !important;
+				border: 0 !important;
+			}
+
+			.offcanvas .language-select-offcanvas__panel .nav-link {
+				padding-left: 0 !important;
+			}
+
+			.offcanvas .language-select-offcanvas__toggle[aria-expanded="true"] .language-select-offcanvas__icon {
+				transform: rotate(180deg);
+			}
 		}
 
 		<?php  echo setting('custom_css') ?>