/*The search page's own top spacing, on the container inside .content rather than on #top-content
  itself - that element's padding is the fixed header's clearance, and the site banner handler in
  php/includes/page-js.php recalculates it whenever a banner is set.

  ?Used to be an inline <style> block printed above search.php's include of config.php - which sent
  ?output before config.php could send its https redirect header, so that redirect fell back to a
  ?javascript hop instead of a 301*/
.search-page {
	padding-top: 25px;
}

/*Page heading - sits above the result count, at the size the rest of the site's page headings use*/
#search-page-heading {
	font-size: 30px;
	margin-top: 0;
	margin-bottom: 8px;
}

.results-row {
	display: flex;
	flex-wrap: wrap;
}

.result_container {
	margin-bottom: 20px;
	display: flex;
}

.result_container a {
	display: flex;
	width: 100%;
}

.result-panel {
	display: flex;
	flex-direction: column;
	width: 100%;
	overflow: hidden;
	cursor: pointer;
	transition: box-shadow 0.2s ease;
}

.result-panel:hover {
	box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}

.result-panel .panel-body {
	display: flex;
	flex-direction: column;
	flex: 1;
}

.result-picture {
	width: 100%;
	height: 180px;
	background-color: #f5f5f5;
	overflow: hidden;
}

/* The photo used to be this box's background-image, which is invisible to image search.
   It is a real <img> now; object-fit reproduces exactly what background-size: cover was
   doing, so the tile crops and sizes the way it always did. */
.result-picture img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center center;
}

.result-title {
	margin-top: 0;
	margin-bottom: 5px;
	font-size: 16px;
}

.result-meta {
	color: #777;
	font-size: 13px;
	margin-bottom: 5px;
}

.result-price {
	font-size: 18px;
	font-weight: 600;
	margin-top: auto;
}

#result-filter-container a,
.result_container a {
	color: inherit;
	text-decoration: none;
}

/* Sticker price shown beside a sale price - reads as the price that was, see VehicleInventory::displayPrice() */
.result-price .vehicle-price-was {
	color: #999;
	font-size: 15px;
	font-weight: 400;
	margin-right: 4px;
}