/**
 * BizDirectory Frontend Styles
 *
 * @package BizDirectory
 */

/* ========================================================================
   CSS Custom Properties
   ======================================================================== */

:root {
	--bizdir-accent: #0073aa;
	--bizdir-accent-hover: #005a87;
	--bizdir-text: #1e1e1e;
	--bizdir-text-light: #757575;
	--bizdir-bg: #ffffff;
	--bizdir-bg-alt: #f6f7f7;
	--bizdir-border: #dcdcde;
	--bizdir-radius: 8px;
	--bizdir-radius-sm: 4px;
	--bizdir-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
	--bizdir-shadow-hover: 0 4px 12px rgba(0, 0, 0, 0.15);
	--bizdir-transition: 200ms ease;
	--bizdir-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
}

/* ========================================================================
   Directory Container
   ======================================================================== */

.bizdir-directory {
	font-family: var(--bizdir-font);
	color: var(--bizdir-text);
	line-height: 1.6;
	max-width: 1200px;
	margin: 0 auto;
	padding: 20px;
}

.bizdir-directory *,
.bizdir-directory *::before,
.bizdir-directory *::after {
	box-sizing: border-box;
}

.bizdir-directory__header {
	margin-bottom: 24px;
}

.bizdir-directory__title {
	font-size: 2rem;
	font-weight: 700;
	margin: 0 0 8px;
	color: var(--bizdir-text);
}

.bizdir-directory__description {
	color: var(--bizdir-text-light);
	margin: 0;
}

/* ========================================================================
   Archive Wrapper (for template pages)
   ======================================================================== */

.bizdir-archive-wrapper {
	max-width: 1200px;
	margin: 0 auto;
	padding: 20px;
}

.bizdir-archive-header {
	margin-bottom: 24px;
}

.bizdir-archive-title {
	/* Inherit font styles from theme */
	margin: 0 0 8px;
}

.bizdir-archive-description {
	font-family: var(--bizdir-font);
	color: var(--bizdir-text-light);
	margin: 0;
	line-height: 1.6;
}

.bizdir-archive-description p:last-child {
	margin-bottom: 0;
}

/* ========================================================================
   Filters
   ======================================================================== */

.bizdir-filters {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	align-items: center;
	padding: 16px;
	background: var(--bizdir-bg-alt);
	border-radius: var(--bizdir-radius);
	margin-bottom: 24px;
}

.bizdir-filters__search {
	position: relative;
	flex: 1;
	min-width: 200px;
}

.bizdir-filters__search-icon {
	position: absolute;
	left: 12px;
	top: 50%;
	transform: translateY(-50%);
	color: var(--bizdir-text-light);
	pointer-events: none;
	display: flex;
}

.bizdir-filters__input {
	width: 100%;
	padding: 10px 12px 10px 40px;
	border: 1px solid var(--bizdir-border);
	border-radius: var(--bizdir-radius-sm);
	font-size: 14px;
	background: var(--bizdir-bg);
	transition: border-color var(--bizdir-transition), box-shadow var(--bizdir-transition);
}

.bizdir-filters__input:focus {
	outline: none;
	border-color: var(--bizdir-accent);
	box-shadow: 0 0 0 2px rgba(0, 115, 170, 0.2);
}

.bizdir-filters__select-wrapper {
	min-width: 160px;
}

.bizdir-filters__select {
	width: 100%;
	padding: 10px 32px 10px 12px;
	border: 1px solid var(--bizdir-border);
	border-radius: var(--bizdir-radius-sm);
	font-size: 14px;
	background: var(--bizdir-bg) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23757575' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E") no-repeat right 10px center;
	appearance: none;
	cursor: pointer;
	transition: border-color var(--bizdir-transition);
}

.bizdir-filters__select:focus {
	outline: none;
	border-color: var(--bizdir-accent);
	box-shadow: 0 0 0 2px rgba(0, 115, 170, 0.2);
}

.bizdir-filters__actions {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-left: auto;
}

.bizdir-filters__submit {
	padding: 10px 20px;
	font-size: 14px;
	font-weight: 500;
	color: #fff;
	background: var(--bizdir-accent);
	border: none;
	border-radius: var(--bizdir-radius-sm);
	cursor: pointer;
	transition: background-color var(--bizdir-transition);
}

.bizdir-filters__submit:hover {
	background: var(--bizdir-accent-hover);
}

.bizdir-filters__layout-toggle {
	display: flex;
	border: 1px solid var(--bizdir-border);
	border-radius: var(--bizdir-radius-sm);
	overflow: hidden;
}

.bizdir-filters__layout-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	padding: 0;
	border: none;
	background: var(--bizdir-bg);
	color: var(--bizdir-text-light);
	cursor: pointer;
	transition: background-color var(--bizdir-transition), color var(--bizdir-transition);
}

.bizdir-filters__layout-btn:hover {
	background: var(--bizdir-bg-alt);
	color: var(--bizdir-text);
}

.bizdir-filters__layout-btn.is-active {
	background: var(--bizdir-accent);
	color: #fff;
}

.bizdir-filters__layout-btn + .bizdir-filters__layout-btn {
	border-left: 1px solid var(--bizdir-border);
}

.bizdir-filters__clear {
	font-size: 13px;
	color: var(--bizdir-accent);
	text-decoration: none;
	white-space: nowrap;
}

.bizdir-filters__clear:hover {
	text-decoration: underline;
}

/* ========================================================================
   Grid Layout
   ======================================================================== */

.bizdir-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
	gap: 24px;
}

.bizdir-grid[data-columns="2"] {
	grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
}

.bizdir-grid[data-columns="4"] {
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
}

/* List layout */
.bizdir-layout--list .bizdir-grid {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

/* ========================================================================
   Card - Grid Style
   ======================================================================== */

.bizdir-card {
	background: var(--bizdir-bg);
	border-radius: var(--bizdir-radius);
	box-shadow: var(--bizdir-shadow);
	overflow: hidden;
	transition: box-shadow var(--bizdir-transition), transform var(--bizdir-transition);
}

.bizdir-card:hover {
	box-shadow: var(--bizdir-shadow-hover);
	transform: translateY(-2px);
}

.bizdir-card--grid .bizdir-card__image {
	position: relative;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	background: var(--bizdir-bg-alt);
}

.bizdir-card--grid .bizdir-card__image-link {
	display: block;
	width: 100%;
	height: 100%;
}

.bizdir-card--grid .bizdir-card__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform var(--bizdir-transition);
}

.bizdir-card--grid:hover .bizdir-card__img {
	transform: scale(1.05);
}

.bizdir-card__placeholder {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	background: var(--bizdir-bg-alt);
	color: var(--bizdir-border);
}

.bizdir-card--grid .bizdir-card__body {
	padding: 16px;
}

.bizdir-card__title {
	font-size: 1.125rem;
	font-weight: 600;
	margin: 0 0 8px;
	line-height: 1.3;
}

.bizdir-card__title a {
	color: var(--bizdir-text);
	text-decoration: none;
}

.bizdir-card__title a:hover {
	color: var(--bizdir-accent);
}

.bizdir-card__categories {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin-bottom: 10px;
}

.bizdir-card__excerpt {
	font-size: 14px;
	color: var(--bizdir-text-light);
	margin: 0 0 12px;
	line-height: 1.5;
}

.bizdir-card__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	font-size: 13px;
	color: var(--bizdir-text-light);
}

.bizdir-card__meta span {
	display: flex;
	align-items: center;
	gap: 4px;
}

.bizdir-card__meta svg {
	flex-shrink: 0;
}

.bizdir-card__footer {
	margin-top: 12px;
	padding-top: 12px;
	border-top: 1px solid var(--bizdir-border);
}

.bizdir-card__website {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	font-size: 13px;
	font-weight: 500;
	color: var(--bizdir-accent);
	text-decoration: none;
}

.bizdir-card__website:hover {
	color: var(--bizdir-accent-hover);
	text-decoration: underline;
}

/* ========================================================================
   Card - List Style
   ======================================================================== */

.bizdir-card--list {
	display: grid;
	grid-template-columns: 250px 1fr;
	gap: 0;
	align-items: stretch;
}

.bizdir-card--list:hover {
	transform: none;
}

.bizdir-card--list .bizdir-card__image {
	position: relative;
	overflow: hidden;
	border-radius: var(--bizdir-radius) 0 0 var(--bizdir-radius);
	background: var(--bizdir-bg-alt);
	min-height: 180px;
}

.bizdir-card--list .bizdir-card__image-link {
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}

.bizdir-card--list .bizdir-card__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.bizdir-card--list .bizdir-card__placeholder {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.bizdir-card--list .bizdir-card__body {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	padding: 20px 24px;
	border-radius: 0 var(--bizdir-radius) var(--bizdir-radius) 0;
}

.bizdir-card--list .bizdir-card__main {
	flex: 1;
}

.bizdir-card--list .bizdir-card__title {
	font-size: 1.25rem;
	margin-bottom: 8px;
}

.bizdir-card--list .bizdir-card__excerpt {
	margin-bottom: 12px;
	color: var(--bizdir-text-light);
	line-height: 1.5;
}

.bizdir-card--list .bizdir-card__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 12px 20px;
	margin-top: auto;
	padding-top: 12px;
	border-top: 1px solid var(--bizdir-border);
}

.bizdir-card--list .bizdir-card__category {
	font-weight: 500;
	color: var(--bizdir-accent);
}

.bizdir-card--list .bizdir-card__location,
.bizdir-card--list .bizdir-card__phone {
	display: flex;
	align-items: center;
	gap: 4px;
	color: var(--bizdir-text-light);
	font-size: 14px;
}

.bizdir-card--list .bizdir-card__actions {
	margin-top: 16px;
}

.bizdir-card--list .bizdir-card__website {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 8px 16px;
	font-size: 14px;
	font-weight: 500;
	color: var(--bizdir-accent);
	background: transparent;
	border: 1px solid var(--bizdir-accent);
	border-radius: var(--bizdir-radius-sm);
	text-decoration: none;
	transition: all var(--bizdir-transition);
}

.bizdir-card--list .bizdir-card__website:hover {
	background: var(--bizdir-accent);
	color: #fff;
}

/* ========================================================================
   Badge
   ======================================================================== */

.bizdir-badge {
	display: inline-block;
	padding: 3px 10px;
	font-size: 12px;
	font-weight: 500;
	border-radius: 20px;
	text-decoration: none;
}

.bizdir-badge--category {
	background: rgba(0, 115, 170, 0.1);
	color: var(--bizdir-accent);
}

/* ========================================================================
   Pagination
   ======================================================================== */

.bizdir-pagination {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 16px;
	margin-top: 32px;
	padding-top: 24px;
	border-top: 1px solid var(--bizdir-border);
}

.bizdir-pagination__list {
	display: flex;
	flex-wrap: wrap;
	gap: 4px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.bizdir-pagination__item {
	margin: 0;
}

.bizdir-pagination__link {
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	padding: 0 12px;
	font-size: 14px;
	color: var(--bizdir-text);
	text-decoration: none;
	background: var(--bizdir-bg);
	border: 1px solid var(--bizdir-border);
	border-radius: var(--bizdir-radius-sm);
	transition: all var(--bizdir-transition);
}

.bizdir-pagination__link:hover {
	background: var(--bizdir-bg-alt);
	border-color: var(--bizdir-accent);
	color: var(--bizdir-accent);
}

.bizdir-pagination__link.current {
	background: var(--bizdir-accent);
	border-color: var(--bizdir-accent);
	color: #fff;
}

.bizdir-pagination__link.dots {
	border: none;
	background: transparent;
	cursor: default;
}

/* Prev/Next navigation buttons */
.bizdir-pagination__link.prev,
.bizdir-pagination__link.next {
	background: var(--bizdir-accent);
	border-color: var(--bizdir-accent);
	color: #fff;
}

.bizdir-pagination__link.prev:hover,
.bizdir-pagination__link.next:hover {
	background: var(--bizdir-accent-hover);
	border-color: var(--bizdir-accent-hover);
	color: #fff;
}

.bizdir-pagination__link.prev svg,
.bizdir-pagination__link.next svg {
	display: block;
	stroke: #fff !important;
	color: #fff;
}

.bizdir-pagination__link.prev:hover svg,
.bizdir-pagination__link.next:hover svg {
	stroke: #fff !important;
}

.bizdir-pagination__info {
	font-size: 13px;
	color: var(--bizdir-text-light);
}

/* ========================================================================
   No Results
   ======================================================================== */

.bizdir-no-results {
	text-align: center;
	padding: 48px 24px;
	background: var(--bizdir-bg-alt);
	border-radius: var(--bizdir-radius);
}

.bizdir-no-results p {
	margin: 0;
	color: var(--bizdir-text-light);
}

/* ========================================================================
   Loading State
   ======================================================================== */

.bizdir-loading {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 48px;
	gap: 12px;
}

.bizdir-loading[hidden] {
	display: none;
}

.bizdir-loading__spinner {
	width: 32px;
	height: 32px;
	border: 3px solid var(--bizdir-border);
	border-top-color: var(--bizdir-accent);
	border-radius: 50%;
	animation: bizdir-spin 0.8s linear infinite;
}

@keyframes bizdir-spin {
	to {
		transform: rotate(360deg);
	}
}

.bizdir-loading__text {
	font-size: 14px;
	color: var(--bizdir-text-light);
}

/* ========================================================================
   Single Listing Detail
   ======================================================================== */

.bizdir-detail {
	font-family: var(--bizdir-font);
	color: var(--bizdir-text);
	max-width: 1000px;
	margin: 0 auto;
	padding: 20px;
}

.bizdir-detail__container {
	background: var(--bizdir-bg);
	border-radius: var(--bizdir-radius);
	box-shadow: var(--bizdir-shadow);
	overflow: hidden;
}

/* Two-column grid layout */
.bizdir-detail__grid {
	display: grid;
	grid-template-columns: 1fr 2fr;
	gap: 0;
}

.bizdir-detail__sidebar {
	background: var(--bizdir-bg-alt);
	padding: 32px;
	display: flex;
	align-items: flex-start;
	justify-content: center;
}

.bizdir-detail__image {
	width: 100%;
	max-width: 280px;
	overflow: hidden;
	background: var(--bizdir-bg);
	border-radius: var(--bizdir-radius);
	box-shadow: var(--bizdir-shadow);
}

.bizdir-detail__img {
	display: block;
	width: 100%;
	height: auto;
	object-fit: cover;
}

.bizdir-detail__main {
	padding: 32px;
}

.bizdir-detail__main--full {
	grid-column: 1 / -1;
}

/* Legacy class - keep for backwards compatibility */
.bizdir-detail__content {
	padding: 32px;
}

.bizdir-detail__header {
	margin-bottom: 24px;
}

.bizdir-detail__title {
	font-size: 2rem;
	font-weight: 700;
	margin: 0 0 12px;
	line-height: 1.2;
}

.bizdir-detail__categories {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 8px;
}

.bizdir-detail__locations {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 14px;
	color: var(--bizdir-text-light);
}

.bizdir-detail__locations a {
	color: var(--bizdir-text-light);
	text-decoration: none;
}

.bizdir-detail__locations a:hover {
	color: var(--bizdir-accent);
}

.bizdir-detail__description {
	margin-bottom: 32px;
	line-height: 1.7;
}

.bizdir-detail__description p:last-child {
	margin-bottom: 0;
}

.bizdir-detail__info {
	display: flex;
	flex-direction: column;
	gap: 16px;
	margin-bottom: 32px;
	padding: 24px;
	background: var(--bizdir-bg-alt);
	border-radius: var(--bizdir-radius);
}

.bizdir-detail__info-item {
	display: flex;
	align-items: flex-start;
	gap: 12px;
}

.bizdir-detail__info-icon {
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	background: var(--bizdir-bg);
	border-radius: 50%;
	color: var(--bizdir-accent);
}

.bizdir-detail__info-value {
	color: var(--bizdir-text);
	text-decoration: none;
	font-style: normal;
}

a.bizdir-detail__info-value:hover {
	color: var(--bizdir-accent);
}

.bizdir-detail__address-text {
	line-height: 1.5;
}

.bizdir-detail__map-link {
	display: inline-block;
	margin-top: 8px;
	font-size: 13px;
	color: var(--bizdir-accent);
	text-decoration: none;
}

.bizdir-detail__map-link:hover {
	text-decoration: underline;
}

/* Social Links */
.bizdir-detail__social {
	margin-bottom: 32px;
}

.bizdir-detail__social-title {
	font-size: 1rem;
	font-weight: 600;
	margin: 0 0 12px;
}

.bizdir-social-links {
	display: flex;
	gap: 12px;
}

.bizdir-social-links__item {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	background: var(--bizdir-bg-alt);
	border-radius: 50%;
	color: var(--bizdir-text);
	text-decoration: none;
	transition: all var(--bizdir-transition);
}

.bizdir-social-links__item:hover {
	background: var(--bizdir-accent);
	color: #fff;
}

/* Tags */
.bizdir-detail__tags {
	margin-bottom: 24px;
}

.bizdir-detail__tags-title {
	font-size: 1rem;
	font-weight: 600;
	margin: 0 0 12px;
}

.bizdir-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.bizdir-tag {
	display: inline-block;
	padding: 6px 14px;
	font-size: 13px;
	color: var(--bizdir-text);
	text-decoration: none;
	background: var(--bizdir-bg-alt);
	border-radius: 20px;
	transition: all var(--bizdir-transition);
}

.bizdir-tag:hover {
	background: var(--bizdir-accent);
	color: #fff;
}

/* Footer / Back Link */
.bizdir-detail__footer {
	margin-top: 32px;
	padding-top: 24px;
	border-top: 1px solid var(--bizdir-border);
}

.bizdir-detail__back {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 14px;
	color: var(--bizdir-accent);
	text-decoration: none;
}

.bizdir-detail__back:hover {
	text-decoration: underline;
}

/* ========================================================================
   Responsive Styles
   ======================================================================== */

@media (max-width: 768px) {
	.bizdir-filters {
		flex-direction: column;
		align-items: stretch;
	}

	.bizdir-filters__search {
		min-width: 100%;
	}

	.bizdir-filters__select-wrapper {
		min-width: 100%;
	}

	.bizdir-filters__actions {
		justify-content: space-between;
		margin-left: 0;
	}

	.bizdir-grid {
		grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
		gap: 16px;
	}

	.bizdir-card--list {
		grid-template-columns: 1fr;
	}

	.bizdir-card--list .bizdir-card__image {
		min-height: 160px;
		border-radius: var(--bizdir-radius) var(--bizdir-radius) 0 0;
	}

	.bizdir-card--list .bizdir-card__body {
		padding: 16px;
		border-radius: 0 0 var(--bizdir-radius) var(--bizdir-radius);
	}

	.bizdir-detail__grid {
		grid-template-columns: 1fr;
	}

	.bizdir-detail__sidebar {
		padding: 24px;
		justify-content: center;
	}

	.bizdir-detail__image {
		max-width: 200px;
	}

	.bizdir-detail__main {
		padding: 24px;
	}

	.bizdir-detail__content {
		padding: 20px;
	}

	.bizdir-detail__title {
		font-size: 1.5rem;
	}

	.bizdir-detail__info {
		padding: 16px;
	}
}

@media (max-width: 480px) {
	.bizdir-directory {
		padding: 12px;
	}

	.bizdir-directory__title {
		font-size: 1.5rem;
	}

	.bizdir-filters {
		padding: 12px;
		gap: 10px;
	}

	.bizdir-grid {
		grid-template-columns: 1fr;
	}

	.bizdir-card__meta {
		flex-direction: column;
		gap: 6px;
	}

	.bizdir-pagination {
		flex-direction: column;
	}

	.bizdir-detail {
		padding: 12px;
	}

	.bizdir-detail__sidebar {
		padding: 16px;
	}

	.bizdir-detail__image {
		max-width: 150px;
	}

	.bizdir-detail__main {
		padding: 16px;
	}

	.bizdir-detail__content {
		padding: 16px;
	}

	.bizdir-social-links__item {
		width: 40px;
		height: 40px;
	}
}

/* ========================================================================
   Single Listing Wrapper (Plugin Template Mode)
   ======================================================================== */

.bizdir-single-wrapper {
	display: block;
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
	padding: 40px 20px;
	box-sizing: border-box;
	clear: both;
}

.bizdir-single-wrapper::before,
.bizdir-single-wrapper::after {
	content: "";
	display: table;
	clear: both;
}

.bizdir-single-wrapper .bizdir-single-main {
	display: block;
	width: 100%;
}

/* Ensure detail article displays properly */
.bizdir-single-wrapper .bizdir-detail {
	margin: 0;
	padding: 0;
	max-width: none;
}

@media (max-width: 768px) {
	.bizdir-single-wrapper {
		padding: 20px 15px;
	}
}

/* ========================================================================
   Detail Content (within theme content area)
   ======================================================================== */

.bizdir-detail-content {
	font-family: var(--bizdir-font);
	color: var(--bizdir-text);
	line-height: 1.6;
}

.bizdir-detail-content *,
.bizdir-detail-content *::before,
.bizdir-detail-content *::after {
	box-sizing: border-box;
}

/* Two-column grid layout for detail content */
.bizdir-detail-content .bizdir-detail__grid {
	display: grid;
	grid-template-columns: 1fr 2fr;
	gap: 32px;
	margin-bottom: 24px;
}

.bizdir-detail-content .bizdir-detail__sidebar {
	display: flex;
	align-items: flex-start;
	justify-content: center;
}

.bizdir-detail-content .bizdir-detail__image {
	width: 100%;
	max-width: 280px;
	overflow: hidden;
	background: var(--bizdir-bg-alt);
	border-radius: var(--bizdir-radius);
	box-shadow: var(--bizdir-shadow);
}

.bizdir-detail-content .bizdir-detail__img {
	display: block;
	width: 100%;
	height: auto;
}

.bizdir-detail-content .bizdir-detail__main {
	min-width: 0;
}

.bizdir-detail-content .bizdir-detail__main--full {
	grid-column: 1 / -1;
}

/* Header with title */
.bizdir-detail-content .bizdir-detail__header {
	margin-bottom: 16px;
}

.bizdir-detail-content .bizdir-detail__title {
	font-size: 1.75rem;
	font-weight: 700;
	margin: 0;
	line-height: 1.3;
	color: var(--bizdir-text);
}

.bizdir-detail-content .bizdir-detail__categories {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 16px;
}

.bizdir-detail-content .bizdir-detail__locations {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 14px;
	color: var(--bizdir-text-light);
	margin-bottom: 24px;
}

.bizdir-detail-content .bizdir-detail__locations a {
	color: var(--bizdir-text-light);
	text-decoration: none;
}

.bizdir-detail-content .bizdir-detail__locations a:hover {
	color: var(--bizdir-accent);
}

.bizdir-detail-content .bizdir-detail__description {
	margin-bottom: 32px;
	line-height: 1.7;
}

.bizdir-detail-content .bizdir-detail__info {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: 20px;
	margin-bottom: 32px;
	padding: 24px;
	background: var(--bizdir-bg-alt);
	border-radius: var(--bizdir-radius);
}

.bizdir-detail-content .bizdir-detail__info-item {
	display: flex;
	align-items: flex-start;
	gap: 12px;
}

.bizdir-detail-content .bizdir-detail__info-icon {
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	background: var(--bizdir-bg);
	border-radius: 50%;
	color: var(--bizdir-accent);
}

.bizdir-detail-content .bizdir-detail__info-item strong {
	display: block;
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	color: var(--bizdir-text-light);
	margin-bottom: 2px;
}

.bizdir-detail-content .bizdir-detail__info-item a {
	color: var(--bizdir-text);
	text-decoration: none;
}

.bizdir-detail-content .bizdir-detail__info-item a:hover {
	color: var(--bizdir-accent);
}

.bizdir-detail-content .bizdir-detail__address-text {
	font-style: normal;
	line-height: 1.5;
}

.bizdir-detail-content .bizdir-detail__map-link {
	display: inline-block;
	margin-top: 8px;
	font-size: 13px;
	color: var(--bizdir-accent);
	text-decoration: none;
}

.bizdir-detail-content .bizdir-detail__map-link:hover {
	text-decoration: underline;
}

.bizdir-detail-content .bizdir-detail__social {
	margin-bottom: 32px;
}

.bizdir-detail-content .bizdir-detail__social-title {
	font-size: 1rem;
	font-weight: 600;
	margin: 0 0 12px;
}

.bizdir-detail-content .bizdir-social-links {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.bizdir-detail-content .bizdir-social-links__item {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	background: var(--bizdir-bg-alt);
	border-radius: 50%;
	color: var(--bizdir-text);
	text-decoration: none;
	transition: all var(--bizdir-transition);
}

.bizdir-detail-content .bizdir-social-links__item:hover {
	background: var(--bizdir-accent);
	color: #fff;
}

.bizdir-detail-content .bizdir-detail__tags {
	margin-bottom: 32px;
}

.bizdir-detail-content .bizdir-detail__tags-title {
	font-size: 1rem;
	font-weight: 600;
	margin: 0 0 12px;
}

.bizdir-detail-content .bizdir-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.bizdir-detail-content .bizdir-tag {
	display: inline-block;
	padding: 6px 14px;
	font-size: 13px;
	color: var(--bizdir-text);
	text-decoration: none;
	background: var(--bizdir-bg-alt);
	border-radius: 20px;
	transition: all var(--bizdir-transition);
}

.bizdir-detail-content .bizdir-tag:hover {
	background: var(--bizdir-accent);
	color: #fff;
}

.bizdir-detail-content .bizdir-detail__footer {
	margin-top: 32px;
	padding-top: 24px;
	border-top: 1px solid var(--bizdir-border);
}

.bizdir-detail-content .bizdir-detail__back {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 14px;
	font-weight: 500;
	color: var(--bizdir-accent);
	text-decoration: none;
}

.bizdir-detail-content .bizdir-detail__back:hover {
	text-decoration: underline;
}

@media (max-width: 768px) {
	.bizdir-detail-content .bizdir-detail__grid {
		grid-template-columns: 1fr;
		gap: 24px;
	}

	.bizdir-detail-content .bizdir-detail__sidebar {
		justify-content: center;
	}

	.bizdir-detail-content .bizdir-detail__image {
		max-width: 200px;
	}
}

@media (max-width: 600px) {
	.bizdir-detail-content .bizdir-detail__info {
		grid-template-columns: 1fr;
		padding: 16px;
	}

	.bizdir-detail-content .bizdir-detail__image {
		max-width: 150px;
	}
}

/* ========================================================================
   Pro Features: Featured Listings
   ======================================================================== */

.bizdir-card--featured {
	position: relative;
	border: 2px solid #f0c14b;
	box-shadow: 0 2px 8px rgba(240, 193, 75, 0.3);
}

.bizdir-card--featured::before {
	content: "\2605  Featured";
	position: absolute;
	top: 12px;
	right: 12px;
	z-index: 10;
	padding: 5px 12px;
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	color: #1a1a1a;
	background: linear-gradient(135deg, #ffd700 0%, #f0c14b 100%);
	border-radius: var(--bizdir-radius-sm);
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
	animation: bizdir-featured-pulse 2s ease-in-out infinite;
}

@keyframes bizdir-featured-pulse {
	0%, 100% { box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15); }
	50% { box-shadow: 0 2px 8px rgba(240, 193, 75, 0.5); }
}

.bizdir-card--featured:hover {
	border-color: #d4a843;
	box-shadow: 0 4px 12px rgba(240, 193, 75, 0.4);
}

/* ========================================================================
   Pro Features: Custom Fields
   ======================================================================== */

.bizdir-card__custom-fields {
	margin-top: 12px;
	padding-top: 12px;
	border-top: 1px solid var(--bizdir-border);
	font-size: 13px;
}

.bizdir-card__custom-field {
	display: block;
	margin-bottom: 4px;
	color: var(--bizdir-text-light);
}

.bizdir-card__custom-field strong {
	color: var(--bizdir-text);
	font-weight: 500;
}

.bizdir-card__custom-field a {
	color: var(--bizdir-accent);
}

.bizdir-filters__custom-field {
	display: inline-block;
	margin-right: 10px;
}

.bizdir-filters__checkbox-label {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 8px 12px;
	background: var(--bizdir-bg);
	border: 1px solid var(--bizdir-border);
	border-radius: var(--bizdir-radius-sm);
	cursor: pointer;
	transition: border-color var(--bizdir-transition);
}

.bizdir-filters__checkbox-label:hover {
	border-color: var(--bizdir-accent);
}

/* Custom fields on detail page */
.bizdir-detail__custom-fields {
	margin-top: 30px;
	padding-top: 20px;
	border-top: 1px solid var(--bizdir-border);
}

.bizdir-detail__custom-fields-title {
	font-size: 18px;
	font-weight: 600;
	margin: 0 0 16px;
}

.bizdir-custom-fields-list {
	margin: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
	gap: 16px;
}

.bizdir-custom-field-item {
	background: var(--bizdir-bg-alt);
	padding: 12px 16px;
	border-radius: var(--bizdir-radius-sm);
}

.bizdir-custom-field-item dt {
	font-weight: 600;
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	color: var(--bizdir-text-light);
	margin-bottom: 4px;
}

.bizdir-custom-field-item dd {
	margin: 0;
	font-size: 15px;
	color: var(--bizdir-text);
}

.bizdir-custom-field-item dd a {
	color: var(--bizdir-accent);
	word-break: break-all;
}

/* ========================================================================
   Pro Features: Map View
   ======================================================================== */

.bizdir-map {
	width: 100%;
	min-height: 400px;
	margin-bottom: 24px;
	border-radius: var(--bizdir-radius);
	overflow: hidden;
	border: 1px solid var(--bizdir-border);
}

/* Custom map markers */
.bizdir-marker {
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--bizdir-accent);
}

.bizdir-marker svg {
	width: 30px;
	height: 40px;
	filter: drop-shadow(0 2px 3px rgba(0, 0, 0, 0.3));
}

.bizdir-marker--featured {
	color: #f0c14b;
}

.bizdir-marker--featured svg {
	width: 36px;
	height: 48px;
}

/* Map popup styles */
.bizdir-map-popup {
	font-family: var(--bizdir-font);
	line-height: 1.5;
}

.bizdir-map-popup__image {
	margin: -13px -13px 12px;
	overflow: hidden;
}

.bizdir-map-popup__image img {
	width: 100%;
	height: 120px;
	object-fit: cover;
	display: block;
}

.bizdir-map-popup__content {
	padding: 0;
}

.bizdir-map-popup__title {
	margin: 0 0 6px;
	font-size: 16px;
	font-weight: 600;
}

.bizdir-map-popup__title a {
	color: var(--bizdir-text);
	text-decoration: none;
}

.bizdir-map-popup__title a:hover {
	color: var(--bizdir-accent);
}

.bizdir-map-popup__badge {
	display: inline-block;
	padding: 2px 8px;
	margin-bottom: 8px;
	font-size: 10px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	color: #1a1a1a;
	background: #f0c14b;
	border-radius: 3px;
}

.bizdir-map-popup__category {
	margin: 0 0 4px;
	font-size: 13px;
	color: var(--bizdir-accent);
}

.bizdir-map-popup__address {
	margin: 0 0 10px;
	font-size: 13px;
	color: var(--bizdir-text-light);
}

.bizdir-map-popup__link {
	display: inline-block;
	font-size: 13px;
	font-weight: 500;
	color: var(--bizdir-accent);
	text-decoration: none;
}

.bizdir-map-popup__link:hover {
	text-decoration: underline;
}

/* Leaflet marker cluster overrides */
.marker-cluster {
	background-color: rgba(0, 115, 170, 0.6);
}

.marker-cluster div {
	background-color: rgba(0, 115, 170, 0.8);
	color: #fff;
	font-weight: 600;
	font-family: var(--bizdir-font);
}

.marker-cluster-small {
	background-color: rgba(0, 115, 170, 0.5);
}

.marker-cluster-medium {
	background-color: rgba(0, 115, 170, 0.6);
}

.marker-cluster-large {
	background-color: rgba(0, 115, 170, 0.7);
}

/* ========================================================================
   Pro Features: Proximity Search
   ======================================================================== */

.bizdir-filters__proximity {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	margin-top: 12px;
	padding-top: 12px;
	border-top: 1px solid var(--bizdir-border);
}

.bizdir-filters__proximity-location {
	flex: 1;
	min-width: 200px;
}

.bizdir-filters__proximity-radius {
	width: 120px;
}

.bizdir-filters__near-me {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 10px 16px;
	font-size: 14px;
	font-weight: 500;
	color: var(--bizdir-accent);
	background: transparent;
	border: 1px solid var(--bizdir-accent);
	border-radius: var(--bizdir-radius-sm);
	cursor: pointer;
	transition: all var(--bizdir-transition);
}

.bizdir-filters__near-me:hover {
	color: #fff;
	background: var(--bizdir-accent);
}

.bizdir-filters__near-me:disabled {
	opacity: 0.6;
	cursor: not-allowed;
}

.bizdir-filters__near-me svg {
	width: 16px;
	height: 16px;
}

/* Distance badge on cards */
.bizdir-card__distance {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	margin-top: 8px;
	padding: 4px 10px;
	font-size: 12px;
	font-weight: 500;
	color: var(--bizdir-text-light);
	background: var(--bizdir-bg-alt);
	border-radius: 20px;
}

.bizdir-card__distance svg {
	width: 14px;
	height: 14px;
}

@media (max-width: 600px) {
	.bizdir-filters__proximity {
		flex-direction: column;
		align-items: stretch;
	}

	.bizdir-filters__proximity-location,
	.bizdir-filters__proximity-radius {
		width: 100%;
	}

	.bizdir-filters__near-me {
		width: 100%;
		justify-content: center;
	}
}

/* ========================================================================
   Hide Theme Post Meta on Single Listings
   ======================================================================== */

/* Hide theme featured image on single listing pages (we render our own) */
.single-biz_listing .post-thumbnail,
.single-biz_listing .entry-thumbnail,
.single-biz_listing .featured-image,
.single-biz_listing .wp-post-image:not(.bizdir-detail__img),
.single-biz_listing .wp-block-post-featured-image,
.single-biz_listing .attachment-post-thumbnail:not(.bizdir-detail__img),
.single-biz_listing article > figure.wp-block-post-featured-image,
.single-biz_listing .post-image,
.single-biz_listing .entry-image,
.single-biz_listing .thumbnail,
.single-biz_listing figure.post-thumbnail {
	display: none !important;
}

/* Hide theme title and header on single listing pages (we render our own) */
.single-biz_listing .entry-title,
.single-biz_listing .post-title,
.single-biz_listing .page-title,
.single-biz_listing article > header .wp-block-post-title,
.single-biz_listing .wp-block-post-title,
.single-biz_listing h1.wp-block-post-title,
.single-biz_listing .entry-header,
.single-biz_listing .post-header,
.single-biz_listing article > h1:first-child,
.single-biz_listing .hentry > header {
	display: none !important;
}

/* Hide author, date, and other meta info on single listing pages */
.single-biz_listing .entry-meta,
.single-biz_listing .post-meta,
.single-biz_listing .byline,
.single-biz_listing .posted-on,
.single-biz_listing .author,
.single-biz_listing .post-date,
.single-biz_listing .meta-date,
.single-biz_listing .meta-author,
.single-biz_listing .entry-footer,
.single-biz_listing .post-info,
.single-biz_listing .entry-author,
.single-biz_listing .entry-date,
.single-biz_listing .wp-block-post-date,
.single-biz_listing .wp-block-post-author,
.single-biz_listing .wp-block-post-author-name,
.single-biz_listing .wp-block-post-author-biography,
.single-biz_listing .wp-block-post-terms,
.single-biz_listing .cat-links,
.single-biz_listing .tags-links,
.single-biz_listing .comments-link,
.single-biz_listing .edit-link,
.single-biz_listing .post-categories,
.single-biz_listing .post-tags,
.single-biz_listing .taxonomy-category,
.single-biz_listing .taxonomy-post_tag,
.single-biz_listing time.published,
.single-biz_listing .updated,
.single-biz_listing .author-info,
.single-biz_listing .author-box,
.single-biz_listing .post-navigation,
.single-biz_listing .nav-links {
	display: none !important;
}

/* ========================================================================
   Block Theme (FSE) Compatibility
   ======================================================================== */

/* Archive wrapper for block themes */
.bizdir-archive-wrapper.bizdir-block-theme {
	max-width: 1200px;
	margin: 0 auto;
	padding: 20px;
}

.bizdir-archive-wrapper.bizdir-block-theme .bizdir-archive-header {
	margin-bottom: 32px;
}

.bizdir-archive-wrapper.bizdir-block-theme .bizdir-archive-title {
	/* Inherit font styles from theme */
	margin: 0 0 16px;
}

.bizdir-archive-wrapper.bizdir-block-theme .bizdir-archive-description {
	font-size: 1.1rem;
	color: var(--bizdir-text-light);
	line-height: 1.6;
	max-width: 800px;
}

/* Ensure our directory content works within block theme layouts */
.wp-site-blocks .bizdir-directory,
.is-layout-constrained .bizdir-directory {
	max-width: 100%;
	width: 100%;
}

/* Block theme single listing styles */
.single-biz_listing .wp-site-blocks .bizdir-detail-content,
.single-biz_listing .is-layout-constrained .bizdir-detail-content {
	max-width: 100%;
}

/* Fix for block theme query loop replacement */
.bizdir-block-theme .bizdir-directory {
	padding: 0;
}

/* Ensure filters are full width in block themes */
.bizdir-block-theme .bizdir-filters {
	max-width: 100%;
}

/* Ensure grid fills available space */
.bizdir-block-theme .bizdir-grid {
	width: 100%;
}

/* Block theme responsive adjustments */
@media (max-width: 782px) {
	.bizdir-archive-wrapper.bizdir-block-theme {
		padding: 16px;
	}
}