/* =========================================================================
   MKN Directory + Member Profile — GeoDirectory restyle
   Loads on GD pages (archive/single/search) + the Directorio page (14).
   Depends on tokens.css for the palette + type variables.

   Strategy: restyle GeoDirectory's own output classes (Bootstrap/AUI +
   .geodir-* / .gd-*) into the MKN design system. No plugin files touched.
   Light-glass variant: white cards on the #faf8fd background.
   Spec: business/projects/empresas-cristianas-directory/wow-redesign-plan.md
   ========================================================================= */

/* --- Light-glass surface tokens (directory lives on light bg) ------------- */
:root {
	--mkn-lglass-bg:     #ffffff;
	--mkn-lglass-border: 1px solid rgba(195, 168, 245, 0.25);   /* lavender 25% */
	--mkn-lglass-shadow: 0 2px 8px rgba(24, 15, 48, 0.05),
	                     0 14px 34px rgba(24, 15, 48, 0.08);
	--mkn-lglass-shadow-hover:
	                     0 6px 16px rgba(24, 15, 48, 0.08),
	                     0 26px 60px rgba(24, 15, 48, 0.16);
}

/* Directory + GD pages sit on the light lavender-white background. */
body.geodir-page,
body.page-id-14 {
	background: var(--mkn-bg);
}

/* =========================================================================
   1. DIRECTORY INTRO (kicker + heading) — rendered by Elementor on page 14
   ========================================================================= */
.mkn-dir-intro {
	text-align: center;
	max-width: 760px;
	margin: 0 auto 2.4rem;
	padding: 0 20px;
}
.mkn-dir-intro .mkn-kicker { color: var(--mkn-accent); }
.mkn-dir-intro h1,
.mkn-dir-intro h2 {
	font-family: var(--mkn-font-display);
	font-weight: 700;
	color: var(--mkn-primary);
	font-size: clamp(2rem, 4vw, 3rem);
	line-height: 1.08;
	letter-spacing: -0.01em;
	margin: 0.5rem 0 0;
}

/* =========================================================================
   2. GD SEARCH / FILTER BAR
   ========================================================================= */
.geodir-loop-container,
.wp-block-geodirectory-geodir-widget-search,
.wp-block-geodirectory-geodir-widget-loop-actions,
.wp-block-geodirectory-geodir-widget-loop,
.wp-block-geodirectory-geodir-widget-loop-paging {
	max-width: 1180px;
	margin-inline: auto;
}

.geodir-loop-paging,
.wp-block-geodirectory-geodir-widget-search .geodir-loop-search,
form.geodir-listing-search {
	background: var(--mkn-lglass-bg);
	border: var(--mkn-lglass-border);
	border-radius: var(--mkn-radius);
	box-shadow: var(--mkn-lglass-shadow);
	padding: 14px 16px;
}

/* Search inputs */
.geodir-listing-search .form-control,
.geodir-listing-search .aui-select2,
.geodir-listing-search select,
.geodir-listing-search input[type="text"] {
	border-radius: 12px !important;
	border-color: rgba(195, 168, 245, 0.4) !important;
	font-family: var(--mkn-font-body);
}
.geodir-listing-search .form-control:focus {
	border-color: var(--mkn-accent) !important;
	box-shadow: 0 0 0 3px rgba(157, 123, 234, 0.15) !important;
}

/* Search + view-select buttons → violet, not GD blue */
.geodir-listing-search .btn-primary,
.geodir-loop-actions .btn-primary,
.gd-search-button,
button.geodir-search-button {
	background: var(--mkn-primary) !important;
	border-color: var(--mkn-primary) !important;
	border-radius: 999px !important;
	font-family: var(--mkn-font-body);
	font-weight: 600;
}
.geodir-listing-search .btn-primary:hover,
button.geodir-search-button:hover {
	background: var(--mkn-soft) !important;
	border-color: var(--mkn-soft) !important;
}
.btn-outline-primary {
	color: var(--mkn-primary) !important;
	border-color: rgba(157, 123, 234, 0.5) !important;
}
.btn-outline-primary:hover,
.btn-outline-primary.active {
	background: var(--mkn-primary) !important;
	color: #fff !important;
	border-color: var(--mkn-primary) !important;
}

/* =========================================================================
   3. LISTING CARDS — light glass, hover lift, Playfair titles, verified seal
   ========================================================================= */

/* Grid gutters a touch more generous */
.geodir-category-list-view.row,
.geodir-listing-posts.row {
	row-gap: 1.6rem;
}

/* Each post is a .col wrapping nested .card.card — flatten and restyle */
.geodir-post .card {
	background: var(--mkn-lglass-bg) !important;
	border: var(--mkn-lglass-border) !important;
	border-radius: var(--mkn-radius) !important;
	box-shadow: var(--mkn-lglass-shadow) !important;
	overflow: hidden;
	position: relative;
	transition: transform 320ms var(--mkn-ease), box-shadow 320ms var(--mkn-ease);
}
/* GD nests .card > .card; neutralise the inner one's chrome */
.geodir-post .card .card {
	box-shadow: none !important;
	border: 0 !important;
	background: transparent !important;
	border-radius: 0 !important;
}
.geodir-post .card:hover {
	transform: translateY(-6px);
	box-shadow: var(--mkn-lglass-shadow-hover) !important;
}

/* Title → Playfair, primary purple */
.geodir-entry-title,
.geodir-entry-title a,
.geodir-post-title h2,
.geodir-post-title h3 {
	font-family: var(--mkn-font-display) !important;
	font-weight: 700 !important;
	color: var(--mkn-primary) !important;
	letter-spacing: -0.01em;
}
.geodir-entry-title a:hover { color: var(--mkn-accent) !important; }

/* Description text */
.geodir-post-content-container .geodir_post_meta,
.geodir-post .geodir-field-post_content {
	font-family: var(--mkn-font-body);
	color: #5b5470;
	font-size: 0.94rem;
	line-height: 1.55;
}

/* --- Verified seal on EVERY card ---------------------------------------
   Injected purely via CSS so it needs no per-listing data. The seal.svg is
   masked to violet; the label rides beside it. Placed in the card footer. */
.geodir-post .card .card-footer {
	background: transparent !important;
	border-top: 1px solid rgba(195, 168, 245, 0.2) !important;
}
.geodir-post .card::after {
	content: "Perfil Verificado \2713";   /* ✓ */
	position: absolute;
	left: 14px;
	bottom: 12px;
	z-index: 3;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding-left: 22px;
	font-family: var(--mkn-font-body);
	font-weight: 600;
	font-size: 0.72rem;
	letter-spacing: 0.02em;
	color: var(--mkn-accent);
	/* mini-seal, violet, via mask */
	background-image: none;
}
/* The masked seal glyph as a ::before-of-::after substitute:
   use a small pseudo layer on the card body wrapper. */
.geodir-post .card .card-footer::before {
	content: "";
	display: inline-block;
	width: 24px;
	height: 15px;
	margin-right: 6px;
	vertical-align: -3px;
	background-color: var(--mkn-accent);
	-webkit-mask: var(--mkn-seal-url) center / contain no-repeat;
	        mask: var(--mkn-seal-url) center / contain no-repeat;
}
.geodir-post .card .card-footer::after {
	content: "Perfil Verificado \2713";
	font-family: var(--mkn-font-body);
	font-weight: 600;
	font-size: 0.74rem;
	letter-spacing: 0.02em;
	color: var(--mkn-accent);
	vertical-align: middle;
}
/* We render the seal in the footer, so kill the absolute ::after label. */
.geodir-post .card::after { content: none; }

/* --- Category chip (GD default_category badge, bottom-left) ------------- */
.gd-badge-meta .gd-badge,
.geodir-post .gd-badge {
	font-family: var(--mkn-font-body) !important;
	font-weight: 600 !important;
	font-size: 0.68rem !important;
	letter-spacing: 0.03em;
	text-transform: none;
	border-radius: 999px !important;
	padding: 5px 12px !important;
	background: rgba(157, 123, 234, 0.12) !important;
	color: var(--mkn-primary) !important;
	border: 1px solid rgba(157, 123, 234, 0.3) !important;
	box-shadow: none !important;
}
/* Featured "new"/date badge → gold accent when it is the featured flag */
.geodir-featured .geodir-post.geodir-post .gd-badge.badge-featured,
.gd-badge[data-badge="featured"] {
	background: var(--mkn-gold-gradient) !important;
	color: var(--mkn-darkest) !important;
	border: 0 !important;
}
/* Hide the noisy default "favorite" heart + rating stars on cards (no reviews yet) */
.geodir-post .card .gd-list-favorite,
.geodir-post .card .geodir-post-rating {
	display: none !important;
}
/* Hide the author gravatar circle — not part of the editorial look */
.geodir-post .card .rounded-circle {
	display: none !important;
}
.geodir-post .card .card-body .row.justify-content-center { min-height: 0; }

/* =========================================================================
   4. EMPTY STATE — elegant, on-brand
   ========================================================================= */
.mkn-empty-state,
.geodir-info .alert-info,
.geodir-loop-container .geodir-no-listings,
.gd-no-listings {
	text-align: center;
	max-width: 560px;
	margin: 3rem auto;
	padding: 3rem 2rem;
	background: var(--mkn-lglass-bg) !important;
	border: var(--mkn-lglass-border) !important;
	border-radius: var(--mkn-radius) !important;
	box-shadow: var(--mkn-lglass-shadow);
	font-family: var(--mkn-font-display);
	font-style: italic;
	font-size: 1.2rem;
	color: var(--mkn-soft) !important;
}
/* GD wraps the alert with an icon; hide the info icon for the clean look */
.geodir-info .alert-info .fa-info-circle { display: none; }

/* =========================================================================
   5. MEMBER PROFILE (single gd_place) — editorial
   ========================================================================= */

/* Wide header band: darkest purple, white Playfair name */
body.single-gd_place .entry-header.gd_place-title,
body.single-gd_place header.entry-header {
	background: var(--mkn-darkest);
	margin: 0 0 2.4rem;
	padding: 4.5rem 20px 4rem;
	text-align: center;
	position: relative;
}
/* Gold hairline under the band */
body.single-gd_place .entry-header.gd_place-title::after {
	content: "";
	position: absolute;
	left: 0; right: 0; bottom: 0;
	height: 1px;
	background: var(--mkn-gold-gradient);
	opacity: 0.6;
}
body.single-gd_place .entry-title {
	font-family: var(--mkn-font-display) !important;
	font-weight: 700;
	color: #fff !important;
	font-size: clamp(2.2rem, 5vw, 3.4rem);
	line-height: 1.05;
	letter-spacing: -0.01em;
	max-width: 900px;
	margin-inline: auto;
}
/* The founder badge line we inject as the first block on the Details page */
.mkn-profile-badge {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin: 0 auto 0.2rem;
	font-family: var(--mkn-font-body);
	font-weight: 600;
	font-size: 0.8rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--mkn-gold-hi);
}
.mkn-profile-badge .mkn-seal-mini {
	display: inline-block;
	width: 32px; height: 20px;
	background-color: var(--mkn-gold);
	-webkit-mask: var(--mkn-seal-url) center / contain no-repeat;
	        mask: var(--mkn-seal-url) center / contain no-repeat;
}
/* When placed by Elementor/GD inside the details flow, lift it into the band */
.mkn-profile-topbar {
	text-align: center;
	margin-top: -2.2rem;
	margin-bottom: 2rem;
	position: relative;
	z-index: 4;
}

/* Story / content typography inside the profile */
body.single-gd_place .geodir-field-post_content,
body.single-gd_place #post_content .geodir_post_meta {
	font-family: var(--mkn-font-body);
	font-size: 1.05rem;
	line-height: 1.7;
	color: #3f3a52;
	max-width: 720px;
	margin-inline: auto;
}

/* Tabs → cleaner, violet active state */
body.single-gd_place .geodir-tab-head .nav-link {
	font-family: var(--mkn-font-body);
	font-weight: 600;
	color: var(--mkn-soft);
	border: 0;
}
body.single-gd_place .geodir-tab-head .nav-link.active {
	color: var(--mkn-primary);
	border-bottom: 2px solid var(--mkn-accent);
	background: transparent;
}
body.single-gd_place .geodir-tabs .nav-tabs {
	border-bottom-color: rgba(195, 168, 245, 0.3);
}

/* Single taxonomies (category links) as chips */
body.single-gd_place .geodir-field-post_category a,
body.single-gd_place .geodir_post_meta.geodir-field-post_category a {
	display: inline-block;
	padding: 5px 14px;
	margin: 3px 4px 3px 0;
	border-radius: 999px;
	background: rgba(157, 123, 234, 0.12);
	border: 1px solid rgba(157, 123, 234, 0.3);
	color: var(--mkn-primary) !important;
	font-size: 0.85rem;
	font-weight: 600;
	text-decoration: none;
}

/* Contact button (mailto) we inject into the profile */
.mkn-contact-btn,
a.mkn-contact-btn {
	display: inline-block;
	background: var(--mkn-gold-gradient);
	color: var(--mkn-darkest) !important;
	border: 0;
	border-radius: 999px;
	font-family: var(--mkn-font-body);
	font-weight: 600;
	letter-spacing: 0.02em;
	padding: 14px 32px;
	text-decoration: none;
	box-shadow: 0 8px 24px rgba(201, 162, 39, 0.28);
	transition: transform 260ms var(--mkn-ease), box-shadow 260ms var(--mkn-ease), filter 260ms var(--mkn-ease);
}
.mkn-contact-btn:hover {
	transform: translateY(-2px);
	filter: brightness(1.06);
	box-shadow: 0 12px 32px rgba(201, 162, 39, 0.4);
	color: var(--mkn-darkest) !important;
}

/* --- Map: hide cleanly when the listing has no coordinates (no API key,
   OSM cannot render without lat/lng). We do NOT invent coordinates. -------- */
body.single-gd_place .geodir-map-wrap:empty,
body.single-gd_place .geodir_map_container:empty,
body.single-gd_place .gd-map-canvas:empty {
	display: none !important;
}
/* The location tab is empty (no address) — hide any resulting blank map/address rows */
body.single-gd_place .geodir-field-address:empty,
body.single-gd_place .geodir-map-wrap .gd-map-canvas:not([style*="height"]) {
	display: none;
}

/* =========================================================================
   6. Reveal-on-scroll parity (cards fade up with the site IntersectionObserver)
   ========================================================================= */
.geodir-post { }   /* cards animate via GD's own load; keep static for reliability */

/* --- Responsive ---------------------------------------------------------- */
@media (max-width: 600px) {
	body.single-gd_place .entry-header.gd_place-title { padding: 3.2rem 16px 2.8rem; }
	.mkn-dir-intro { margin-bottom: 1.6rem; }
}
