/* Directory item page - layout & spacing polish (float layout untouched, .clearfix already on the wrapper) */

/* --- trust badges (Verified / Top Rated / Award Winner / custom) --- */
.item-detail-badges { margin: 6px 0; display: flex; flex-wrap: wrap; gap: 8px; }
.item-badge {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 3px 10px;
	border-radius: 20px;
	font-size: 12px;
	font-weight: 600;
}
.item-badge.verified { background: #e6f7f0; color: #1a9d6c; }
.item-badge.top-rated { background: #fff6e0; color: #b8860b; }
.item-badge.award { background: #eef1ff; color: #4a4ad0; }
.item-badge.custom { background: #f0f0f0; color: #555; }

/* --- overall vertical rhythm between sections --- */
.item-detail-top { margin-bottom: 30px; }
.customFieldBf { margin-bottom: 0; }
.item-gallery { margin-bottom: 40px; }
.entry-content { margin-bottom: 30px; }
#dir-directions { margin-bottom: 30px; }

/* --- contact info / hours turned into a tidy card ---
   No horizontal padding here: .one-third (183px) + its 50px margin-right +
   .two-third-last (417px) add up to exactly #primary's width with zero
   slack, so ANY side padding on this wrapper pushes hours onto its own
   line instead of sitting beside the contact column (broke parity with
   production). Vertical padding only. */
.item-detail-info {
	padding: 20px 0;
	border: none;
	border-radius: 8px;
	background: #fafafa;
	box-shadow: 0 1px 3px rgba(0,0,0,0.06);
}
/* inset padding applied with border-box so it's absorbed inside each
   column's existing fixed width instead of adding to it */
.item-detail-info .sc-column.one-third,
.item-detail-info .sc-column-last.two-third-last {
	box-sizing: border-box;
	padding: 0 20px;
}
.item-detail-info-term {
	text-transform: uppercase;
	font-size: 11px;
	letter-spacing: 0.05em;
	color: #999;
	margin-bottom: 3px;
}
.item-detail-info-desc { margin-bottom: 14px; }
.item-detail-hours-title {
	text-transform: uppercase;
	font-size: 11px;
	letter-spacing: 0.05em;
	color: #999;
	margin-bottom: 10px;
}
.item-detail-hours .item-detail-info-term { font-weight: 600; color: #555; }

/* --- action buttons (contact owner / claim listing) --- */
.item-detail-info .contact-owner,
.item-detail-info .claim-listing-button {
	display: inline-block;
	margin-top: 6px;
	margin-bottom: 14px;
	margin-right: 10px;
}

/* --- social icons: circular badges instead of raw uploaded images --- */
.item-social-icons { margin-top: 15px; display: flex; gap: 10px; list-style: none; padding: 0; flex-wrap: wrap; }
.item-social-icon { float: none; }
.item-social-icon a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: #e9e9e9;
	color: #666;
	font-size: 15px;
	transition: background-color .15s ease, color .15s ease, transform .15s ease;
}
.item-social-icon a:hover { transform: translateY(-2px); color: #fff; }
.item-social-icon.facebook a:hover  { background: #1877f2; }
.item-social-icon.twitter a:hover   { background: #000; }
.item-social-icon.instagram a:hover { background: #e1306c; }
.item-social-icon.linkedin a:hover  { background: #0a66c2; }
.item-social-icon.youtube a:hover   { background: #ff0000; }
.item-social-icon.yelp a:hover      { background: #d32323; }

/* --- external reviews (Trustpilot / Google) --- */
.item-external-reviews { margin-top: 16px; display: flex; flex-direction: column; gap: 8px; }
.item-external-review-row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px 8px;
	text-decoration: none;
	color: #444;
	font-size: 13px;
}
.item-external-review-row .star-rating {
	display: inline-flex;
	flex-shrink: 0;
	white-space: nowrap;
	gap: 2px;
	color: #ffb400;
	font-size: 13px;
}
.item-external-review-row .review-source { font-weight: 600; color: #333; }
.item-external-review-row .review-score { font-weight: 600; }
.item-external-review-row .review-count { color: #999; }
.item-external-review-row:hover .review-source { text-decoration: underline; }

/* --- gallery thumbnails: subtle hover polish --- */
.item-gallery-thumbnails li { transition: opacity .15s ease; }
.item-gallery-thumbnails li:hover { opacity: 0.8; cursor: pointer; }

/* --- share row spacing --- */
.item-detail-share { margin-top: 10px; margin-bottom: 20px; display: flex; align-items: center; gap: 15px; }

@media (max-width: 767px) {
	.item-detail-info { padding: 20px 0; }
}