.searchbar { margin-top:3rem; width:90%; max-width: 100%; position: relative; }

.search-container { position: relative; max-width: 100%; width: 100%; }

.header-search-tbx { box-sizing: border-box; width: 100%; background: #FFFFFF 0% 0% no-repeat padding-box; box-shadow: 0px 3px 8px #0000003b; border-radius: 10px; padding: 20px 25px 20px 55px; /* extra höger-padding för ikonen */ border: none; font-size: 16px; outline: none; }

	.header-search-tbx:focus { border-color: #ababab; /* mörkblå vid fokus */ box-shadow: 0 0 0 1px #515151; }

.search-btn { position: absolute; left: 10px; top: 50%; transform: translateY(-50%); background: none; border: none; padding: 0; margin-left:10px !important; margin: 0; cursor: pointer; color: #888; font-size: 16px; }

	.search-btn:hover { color: #1F3B73; }
.search-results { /*margin-top: 10px;
    padding-top: 10px;*/ position: absolute; top: 100%; /* direkt under sökfältet */ left: 0; width: 100%; max-height: 400px; overflow-y: auto; background: #fff; border-top: none; /* så den smälter ihop med input */ border-radius: 12px; z-index: 9999; /* lägg över header och annat */ box-shadow: 0 6px 12px rgba(0,0,0,0.15); }


.searchIcon { }
/* Sökresultat-lista i dropdown */
.header-search-preloader { height: 50px !important; padding: 10px; }
.search-result-list { list-style: none; margin: 0; padding: 0; max-height: 400px; /* scroll om många resultat */ overflow-y: auto; }

	.search-result-list li { border-bottom: 1px solid #eee; padding: 8px; transition: background 0.2s; }

		.search-result-list li:last-child { border-bottom: none; }

		.search-result-list li:hover { background: #f9f9f9; }

		/* Bild + info layout */
		.search-result-list li .image { float: left; width: 60px; height: 60px; margin-right: 10px; }

			.search-result-list li .image img { max-width: 100%; max-height: 100%; object-fit: cover; border-radius: 3px; }

		.search-result-list li .info { overflow: hidden; /* låt text flyta bredvid bilden */ }

		.search-result-list li .title { font-size: 14px; font-weight: bold; margin: 0 0 4px 0; color: #333; }

		.search-result-list li .sku,
		.search-result-list li .price,
		.search-result-list li .description { font-size: 12px; margin: 2px 0; color: #666; }

		.search-result-list li .price { color: #c00; font-weight: bold; }




@media screen and (max-width: 1100px) {
	#overlay-search { width: 90%; overflow: auto; overflow-x: hidden; padding: 0 5%; }
	.overlay-search-close { font-size: 25px; line-height: 25px; top: 4%; right: 5%; position: absolute; }
	.overlay-search-title { font: bold 24px/24px Arial, Sans-serif; margin: 0 0 1.5% 0; }
	.overlay-search-tbx,
	.overlay-search-tbx:focus { font-size: 18px; line-height: 18px; padding: 1% 2%; margin: 0 0 1.5% 0; border-width: 1px; }
	.overlay-search-result li p.title { font-size: 14px; }
	.overlay-search-result li p.hits { font-size: 10px; padding: 0; }
	.overlay-search-result li a { font-size: 12px; }
	.overlay-search-info,
	.overlay-search-alert { font: normal 14px/14px Arial, Sans-serif; border-width: 1px; padding: 2%; }

	.searchIcon { font-size: 15px; margin: 0 0 0 15px; }
}

@media screen and (max-width: 600px) {
	.overlay-search-preloader { width: 80px; height: 80px; margin-left: -40px; margin-top: -20px; }
}

@media screen and (max-width: 480px) {
	.overlay-search-preloader { width: 50px; height: 50px; margin-left: -25px; margin-top: -25px; }
}