/**
 * Busca Ya Core — estilos propios del sitio público.
 *
 * Módulo 2 (0.2.0): ajustes visuales.
 * Cada bloque indica qué corrige y en qué página. Para revertir un ajuste
 * basta con borrar su bloque; el sitio vuelve a como estaba.
 * Solo cambia la presentación: no se modifica el HTML, los datos ni los
 * enlaces que generan GeoDirectory y BlockStrap.
 */

/* --------------------------------------------------------------------------
 * 2.0 Todo el sitio · Poppins seminegrita (600) (0.24.1, aprobado el
 * 11 nov 2026). El tema registra solo Poppins 400, así que el texto de peso
 * 600 o más (título de la portada, botón «Registra tu negocio») se veía con
 * negrita simulada por el navegador. Aquí se declara solo el peso 600, con
 * el archivo original del tema BlockStrap (poppins-v20-latin-600.woff2,
 * Poppins SemiBold 4.004, sin modificar) copiado en assets/fonts/ con su
 * licencia SIL Open Font License 1.1 (assets/fonts/OFL.txt).
 * - Misma familia y misma forma de carga que el peso 400 del tema
 *   (font-family Poppins, font-display fallback, sin unicode-range).
 * - No cambia la configuración tipográfica del tema ni los textos de peso
 *   400 o 500: el navegador sigue mostrándolos con el archivo 400.
 * - El navegador solo descarga el archivo si la página tiene texto de peso
 *   600 o más.
 * Para revertir: borrar este bloque y la carpeta assets/fonts/.
 * ------------------------------------------------------------------------ */
@font-face {
	font-family: Poppins;
	font-style: normal;
	font-weight: 600;
	font-display: fallback;
	font-stretch: normal;
	src: url("../fonts/poppins-v20-latin-600.woff2") format("woff2");
}

/* --------------------------------------------------------------------------
 * 2.1 Ficha · Subtítulos de grupo («Contacto y atención», «Ubicación del
 * negocio», «Características y servicios»).
 * GeoDirectory los imprime como <h2 class="fieldset-…"> y quedaban más
 * grandes que el título de la pestaña («Información», h3). Se reducen y se
 * separan con una línea fina. Solo cambia el tamaño visual; el nivel del
 * encabezado (h2) no se toca.
 * ------------------------------------------------------------------------ */
.geodir-tabs-content .geodir-post-meta-container > h2[class*="fieldset-"] {
	font-size: 1.125rem;
	font-weight: 600;
	line-height: 1.35;
	margin: 1.5rem 0 0.75rem;
	padding-top: 1.25rem;
	border-top: 1px solid rgba(31, 27, 45, 0.1);
}

/* El primer subtítulo, justo debajo de «Información», va sin línea. */
.geodir-tabs-content .hash-offset + .geodir-post-meta-container > h2[class*="fieldset-"] {
	margin-top: 0.25rem;
	padding-top: 0;
	border-top: 0;
}

/* --------------------------------------------------------------------------
 * 2.2 Ficha · Dirección en una línea: «Cl. 20 # 20-58, La Ceja».
 * Solo dentro de las pestañas (la dirección corta del encabezado no cambia).
 * Departamento y país se ocultan a la vista, pero siguen en el HTML con sus
 * datos estructurados (schema.org/PostalAddress). El mapa y «Cómo llegar»
 * usan las coordenadas del negocio, no este texto.
 * ------------------------------------------------------------------------ */
.geodir-tabs-content .geodir-field-address br {
	display: none;
}

.geodir-tabs-content .geodir-field-address [itemprop="streetAddress"]:has(~ [itemprop="addressLocality"])::after {
	content: ",";
}

.geodir-tabs-content .geodir-field-address [itemprop="addressRegion"],
.geodir-tabs-content .geodir-field-address [itemprop="addressCountry"] {
	display: none;
}

/* --------------------------------------------------------------------------
 * 2.3 Ficha · Opciones como etiquetas compactas (Modalidad, Métodos de pago,
 * Comodidades y campos de servicios).
 * Antes: una viñeta por línea. Ahora: etiquetas discretas en fila.
 * No son enlaces ni botones. Se excluye la descripción (post_content) para no
 * alterar listas escritas por el negocio.
 * ------------------------------------------------------------------------ */
.geodir-tabs-content .geodir_post_meta:not(.geodir-field-post_content) > ul {
	display: flex;
	flex-wrap: wrap;
	gap: 0.375rem;
	list-style: none;
	margin: 0.375rem 0 0.875rem;
	padding: 0;
}

.geodir-tabs-content .geodir_post_meta:not(.geodir-field-post_content) > ul > li {
	margin: 0;
	padding: 0.25rem 0.625rem;
	font-size: 0.875rem;
	line-height: 1.3;
	color: #4a4656;
	background-color: #f3f4f6;
	border: 1px solid #e5e7eb;
	border-radius: 999px;
	cursor: default;
}

/* --------------------------------------------------------------------------
 * 2.4 Todo el sitio · Pie de página en una sola columna en celular.
 * Las columnas tenían anchos fijos (col-4, col-2) y en móvil el texto se
 * partía palabra por palabra. Desde 768 px (tableta y computador) no cambia.
 * ------------------------------------------------------------------------ */
@media (max-width: 767.98px) {
	#footer .row > .col-9.d-md-flex {
		flex: 0 0 100%;
		width: 100%;
		max-width: 100%;
	}

	#footer .row > .col-9.d-md-flex > .col {
		flex: 0 0 100%;
		width: 100%;
		max-width: 100%;
		margin-left: 0 !important;
	}
}

/* --------------------------------------------------------------------------
 * 2.5 Todo el sitio · Menú móvil con fondo blanco sólido.
 * Al abrir el menú, el fondo quedaba translúcido y se veía el contenido de
 * detrás. Solo aplica por debajo de 992 px, donde el menú se despliega.
 * ------------------------------------------------------------------------ */
@media (max-width: 991.98px) {
	.navbar.nav-menu-open,
	.navbar:has(> .container > .navbar-collapse.show),
	.navbar:has(> .container > .navbar-collapse.collapsing) {
		background-color: #fff !important;
		background-image: none !important;
	}
}

/* --------------------------------------------------------------------------
 * 2.6 Portada · Nombres de categoría tal como están guardados.
 * El bloque de categorías forzaba mayúscula inicial en cada palabra
 * («Comida Y Bebidas»). Los nombres ya están bien escritos en GeoDirectory
 * («Comida y bebidas»), así que se muestran sin transformar.
 * ------------------------------------------------------------------------ */
.gd-categories-widget .text-capitalize,
.gd-categories-widget .text-uppercase {
	text-transform: none !important;
}

/* --------------------------------------------------------------------------
 * 2.7 Todo el sitio · Menú principal (0.24.0, aprobado el 11 nov 2026).
 * Estructura verificada en producción (11 nov 2026): header >
 * nav.navbar.navbar-expand-lg.bg-custom-color.bg-transparent-until-scroll
 * .fixed-top.shadow con style="background-color:rgba(255,255,255,0.93)".
 * Interiores: .navbar-light. Portada y portales (plantillas front-page y
 * gd-location): .navbar-dark.color-scheme-flip-on-scroll.
 * AyeCode UI ya marca el desplazamiento en <html data-scroll="N"> y cambia
 * navbar-dark por navbar-light al desplazarse; este bloque usa esa misma
 * marca: no añade JavaScript.
 * - Interiores: blanco sólido siempre, con línea inferior fina.
 * - Portada arriba: transparente con un degradado oscuro suave (::before).
 * - Al desplazarse (todas): blanco sólido y sombra muy sutil.
 * - Altura fija (72 px / 64 px): no cambia entre estados.
 * - Transiciones solo de color, sombra y opacidad (sin recalcular diseño).
 * - Logotipo: imagen assets/img/logo-busca-ya.webp (versión a color arriba,
 *   versión clara abajo, para el fondo oscuro). El texto «Busca Ya» sigue en
 *   el HTML para lectores de pantalla.
 * Para revertir: borrar este bloque (2.7) y el archivo del logotipo.
 * ------------------------------------------------------------------------ */
:root {
	--byc-header-h: 72px;
	--byc-header-line: 0 1px 0 rgba(31, 27, 45, 0.08);
	--byc-header-shadow: 0 1px 0 rgba(31, 27, 45, 0.06), 0 4px 12px rgba(31, 27, 45, 0.06);
	--byc-btn: #1f6fb2;
	--byc-btn-hover: #185a91;
	--byc-btn-active: #154f80;
}

@media (max-width: 991.98px) {
	:root {
		--byc-header-h: 64px;
	}
}

/* A. Los saltos a un ancla («Ver en el mapa», «Saltar al contenido») se
 * detienen debajo del menú fijo y no detrás de él. */
html {
	scroll-padding-top: calc(var(--byc-header-h) + 16px);
}

/* B. Altura fija en todos los estados y transición ligera (reemplaza la
 * transición de «all» de AyeCode UI). */
.navbar.fixed-top.bg-transparent-until-scroll {
	--bs-navbar-padding-y: 0;
	min-height: var(--byc-header-h);
	transition: background-color 0.2s ease, box-shadow 0.2s ease;
}

@media (max-width: 991.98px) {
	.navbar.fixed-top.bg-transparent-until-scroll {
		--bs-navbar-padding-y: 0.5rem;
	}
}

/* C. Páginas interiores: blanco sólido desde el inicio (el fondo original
 * era blanco al 93 % y dejaba ver el contenido) y línea inferior fina en
 * lugar de la sombra .shadow. */
html body .navbar.navbar.fixed-top.bg-transparent-until-scroll:not(.color-scheme-flip-on-scroll),
html body .navbar.navbar.fixed-top.bg-transparent-until-scroll.nav-menu-open {
	background-color: #fff !important;
	box-shadow: var(--byc-header-line) !important;
}

/* D. Portada y portales al desplazarse: blanco sólido. */
html[data-scroll]:not([data-scroll="0"]) body .navbar.navbar.fixed-top.color-scheme-flip-on-scroll {
	background-color: #fff !important;
}

/* E. Al desplazarse, en cualquier página: sombra muy sutil. */
html[data-scroll]:not([data-scroll="0"]) body .navbar.navbar.fixed-top.bg-transparent-until-scroll {
	box-shadow: var(--byc-header-shadow) !important;
}

/* F. Portada arriba: degradado oscuro suave que baja desde el borde superior
 * para integrar el menú con la foto. Desaparece (opacidad) al desplazarse o
 * al abrir el menú en celular. */
.navbar.fixed-top.color-scheme-flip-on-scroll::before {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	z-index: -1;
	height: calc(100% + 32px);
	pointer-events: none;
	background: linear-gradient(180deg, rgba(12, 14, 24, 0.55) 0%, rgba(12, 14, 24, 0.28) 60%, rgba(12, 14, 24, 0) 100%);
	opacity: 0;
	transition: opacity 0.2s ease;
}

html[data-scroll="0"] .navbar.fixed-top.color-scheme-flip-on-scroll:not(.nav-menu-open)::before,
html:not([data-scroll]) .navbar.fixed-top.color-scheme-flip-on-scroll:not(.nav-menu-open)::before {
	opacity: 1;
}

/* G. Logotipo: imagen de 150 × 50 px (120 × 40 px en celular). Una sola
 * imagen con las dos versiones; la clara se usa sobre el fondo oscuro.
 * El enlace pierde el margen inferior (mb-1) que lo desalineaba. */
.navbar.fixed-top .navbar-brand {
	margin-bottom: 0 !important;
}

.navbar.fixed-top .navbar-brand > span:first-child {
	display: block;
	width: 150px;
	height: 50px;
	overflow: hidden;
	white-space: nowrap;
	text-indent: 100%;
	background: url("../img/logo-busca-ya.webp") no-repeat 0 0 / 100% 200%;
}

.navbar.fixed-top.navbar-dark .navbar-brand > span:first-child {
	background-position: 0 100%;
}

@media (max-width: 991.98px) {
	.navbar.fixed-top .navbar-brand > span:first-child {
		width: 120px;
		height: 40px;
	}
}

/* H. Enlaces: Poppins 15 px, peso medio. Casi negro sobre blanco y azul al
 * pasar el mouse; blanco sobre la portada oscura. */
.navbar.fixed-top.navbar-light {
	--bs-navbar-color: #1f1b2d;
	--bs-navbar-hover-color: var(--byc-btn);
	--bs-navbar-active-color: var(--byc-btn);
}

.navbar.fixed-top.navbar-dark {
	--bs-navbar-color: #fff;
	--bs-navbar-hover-color: rgba(255, 255, 255, 0.85);
	--bs-navbar-active-color: #fff;
}

.navbar.fixed-top .navbar-nav .nav-link {
	font-size: 0.9375rem;
	font-weight: 500;
	border-radius: 0.5rem;
	transition: color 0.2s ease, background-color 0.2s ease;
}

.navbar.fixed-top .navbar-nav .nav-link[href*="/ingresar/"]:hover {
	background-color: rgba(31, 27, 45, 0.05);
}

.navbar.fixed-top.navbar-dark .navbar-nav .nav-link[href*="/ingresar/"]:hover {
	background-color: rgba(255, 255, 255, 0.12);
}

@media (min-width: 992px) {
	.navbar.fixed-top .navbar-nav .nav-link[href*="/ingresar/"] {
		padding-right: 0.75rem;
		padding-left: 0.75rem;
	}
}

/* I. Botón «Registra tu negocio»: azul profundo #1f6fb2 (contraste 5,3:1
 * con el texto blanco; el azul anterior, #3993d5, daba 3,3:1). Sin sombra. */
.navbar.fixed-top .navbar-nav .btn-primary {
	padding: 0.5rem 1.125rem;
	font-size: 0.9375rem;
	font-weight: 600;
	line-height: 1.5;
	color: #fff;
	background-color: var(--byc-btn);
	border-color: var(--byc-btn);
	box-shadow: none;
	transition: background-color 0.2s ease, border-color 0.2s ease;
}

.navbar.fixed-top .navbar-nav .btn-primary:hover {
	color: #fff;
	background-color: var(--byc-btn-hover);
	border-color: var(--byc-btn-hover);
}

.navbar.fixed-top .navbar-nav .btn-primary:active {
	color: #fff;
	background-color: var(--byc-btn-active);
	border-color: var(--byc-btn-active);
}

/* J. Foco con teclado visible en todos los elementos del menú (azul sobre
 * blanco, blanco sobre la portada oscura). */
.navbar.fixed-top :is(.navbar-brand, .nav-link, .btn, .navbar-toggler):focus-visible {
	outline: 2px solid var(--byc-btn);
	outline-offset: 2px;
	box-shadow: none;
}

.navbar.fixed-top.navbar-dark :is(.navbar-brand, .nav-link, .btn, .navbar-toggler):focus-visible {
	outline-color: #fff;
}

/* K. Sin transiciones si el visitante pidió reducir el movimiento. */
@media (prefers-reduced-motion: reduce) {
	.navbar.fixed-top.bg-transparent-until-scroll,
	.navbar.fixed-top.color-scheme-flip-on-scroll::before,
	.navbar.fixed-top .navbar-nav .nav-link,
	.navbar.fixed-top .navbar-nav .btn-primary {
		transition: none;
	}
}

/* --------------------------------------------------------------------------
 * 3.1 Ficha · Botón «Contactar por WhatsApp» (Módulo 3, versión 0.3.1).
 * Lo genera includes/module-whatsapp.php dentro del contenedor de
 * GeoDirectory (.geodir-field-whatsapp.byc-wa-field). Verde #15803D con
 * texto blanco: contraste 5,0:1 (WCAG AA). En celular ocupa todo el ancho.
 * ------------------------------------------------------------------------ */
.byc-wa-field {
	margin: 0.25rem 0 0.75rem;
}

.byc-wa-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.625rem;
	padding: 0.625rem 1.125rem;
	font-size: 1rem;
	font-weight: 600;
	line-height: 1.25;
	color: #fff !important;
	text-decoration: none !important;
	background-color: #15803d;
	border: 0;
	border-radius: 0.625rem;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);
	transition: background-color 0.15s ease-in-out;
}

.byc-wa-btn:hover {
	color: #fff !important;
	background-color: #116b33;
}

.byc-wa-btn:focus-visible {
	outline: 3px solid #86efac;
	outline-offset: 2px;
}

.byc-wa-btn .fa-whatsapp {
	font-size: 1.25rem;
	line-height: 1;
}

.byc-wa-btn__num {
	padding-left: 0.625rem;
	font-weight: 400;
	font-size: 0.9375rem;
	border-left: 1px solid rgba(255, 255, 255, 0.45);
	white-space: nowrap;
}

.byc-wa-btn__text {
	white-space: nowrap;
}

/* Botón superior (junto a Favorito y Compartir): sin márgenes extra y algo
 * más compacto, para alinearse con los demás elementos de la fila.
 * Estructura real (verificada en 0.5.2): #title … .col-auto >
 * .geodir-post-meta-container > .geodir_post_meta.byc-wa-field. */
#title .col-auto > .geodir-post-meta-container > .byc-wa-field {
	margin: 0;
}

#title .col-auto > .geodir-post-meta-container > .byc-wa-field > .byc-wa-btn {
	padding: 0.4375rem 0.875rem;
	font-size: 0.9375rem;
}

/* Celular: todo el ancho y en dos líneas (texto arriba, número abajo), para
 * que no se parta en pantallas angostas. */
@media (max-width: 767.98px) {
	.byc-wa-btn,
	#title .col-auto > .geodir-post-meta-container > .byc-wa-field > .byc-wa-btn {
		display: grid;
		grid-template-columns: auto auto;
		justify-content: center;
		align-items: center;
		column-gap: 0.75rem;
		row-gap: 0.125rem;
		width: 100%;
		padding: 0.625rem 1rem;
		font-size: 1rem;
	}

	.byc-wa-btn .fa-whatsapp {
		grid-row: 1 / span 2;
		font-size: 1.625rem;
	}

	.byc-wa-btn__num {
		padding-left: 0;
		border-left: 0;
		font-size: 0.875rem;
		opacity: 0.95;
	}

	/* La columna del botón superior pasa a todo el ancho. */
	#title .col-auto:has(> .geodir-post-meta-container > .byc-wa-field) {
		flex: 0 0 100%;
		width: 100%;
		max-width: 100%;
	}
}

/* Desde 768 px: la fila del título se reparte en dos líneas cuando hay botón
 * de WhatsApp. Línea 1: valoración, dirección y «Ver en el mapa». Línea 2:
 * el botón de WhatsApp a la izquierda y Favorito/Compartir a la derecha
 * (siempre juntos). Se hace con `order` y un salto de línea (::after), así
 * que no depende del orden de las columnas en la plantilla. Si el negocio no
 * tiene WhatsApp, la fila queda como la plantilla la define. (0.5.3) */
@media (min-width: 768px) {
	#title .row:has(> .col-auto > .geodir-post-meta-container > .byc-wa-field)::after {
		content: "";
		order: 1;
		flex-basis: 100%;
		width: 100%;
		height: 0;
	}

	#title .row:has(> .col-auto > .geodir-post-meta-container > .byc-wa-field) > .col-auto:has(> .geodir-post-meta-container > .byc-wa-field) {
		order: 2;
		margin-top: 0.625rem;
	}

	#title .row:has(> .col-auto > .geodir-post-meta-container > .byc-wa-field) > .ms-auto {
		order: 3;
		align-self: center;
		margin-top: 0.625rem;
	}
}

/* Columna vacía en la fila del título: cuando el negocio no tiene WhatsApp,
 * GeoDirectory no imprime nada y la columna de la plantilla queda vacía
 * (<div class="… col-auto … col"></div>), pero conserva su margen interno y
 * deja un hueco doble antes de «Ver en el mapa». Se oculta solo si está
 * completamente vacía. (0.5.4) */
body.geodir-page-single #title .row > .col-auto:empty {
	display: none;
}

/* «Ver en el mapa» sin mapa: en una ficha con dirección privada, GeoDirectory
 * no incluye la sección del mapa (#post_map) para los visitantes, pero el
 * enlace de la plantilla sigue apuntando a ella y no hace nada. Se oculta su
 * columna solo cuando la página no tiene esa sección; el dueño y el
 * administrador, que sí ven el mapa, conservan el enlace. (0.5.6) */
body.geodir-page-single:not(:has([id="post_map"])) #title .row > .col-auto:has(> p > a[href$="#post_map"]) {
	display: none;
}

/* --------------------------------------------------------------------------
 * 3.2 Ficha · Dirección de la cabecera con sangría francesa (0.23.1,
 * aprobada el 11 nov 2026). Si la dirección ocupa dos líneas, la segunda
 * empieza alineada con el texto y no bajo el ícono. Estructura verificada en
 * producción (11 nov 2026): #title … .geodir-post-address-container >
 * .geodir_post_meta.geodir-field-address > span.geodir_post_meta_icon +
 * span[itemprop="streetAddress"]. El ícono se fija a la izquierda y el texto
 * queda en una columna; la primera línea no se mueve. Si se muestra la
 * etiqueta «Dirección:» (.geodir_post_meta_title), la regla no se aplica.
 * Para revertir: borrar este bloque.
 * ------------------------------------------------------------------------ */
body.geodir-page-single #title .geodir-post-address-container .geodir-field-address:not(:has(.geodir_post_meta_title)) {
	position: relative;
	padding-left: 1.5em;
}

body.geodir-page-single #title .geodir-post-address-container .geodir-field-address:not(:has(.geodir_post_meta_title)) > .geodir_post_meta_icon {
	position: absolute;
	top: 0;
	left: 0;
}

/* ==========================================================================
 * 4. Ficha · Mejora visual (aprobada en F5-68). Todo limitado a la ficha
 * individual: body.geodir-page-single (clase que GeoDirectory solo añade en
 * la ficha) + contenedores de la plantilla GD Single.
 * ======================================================================== */

/* --------------------------------------------------------------------------
 * 4.1 Etapa 1 · Títulos de pestaña y separación entre secciones
 * (Información, Fotos, Mapa, Opiniones; modo lista de GD Single Tabs).
 * Jerarquía: título de pestaña (h3) > subtítulo de grupo (h2, regla 2.1) >
 * etiqueta del campo. Una línea fina separa cada pestaña de la anterior.
 * ------------------------------------------------------------------------ */
body.geodir-page-single .geodir-tabs-as-list > [role="tabpanel"] {
	margin-bottom: 2.25rem !important; /* sustituye el mb-5 (3 rem) de la plantilla */
}

body.geodir-page-single .geodir-tabs-as-list > [role="tabpanel"] ~ [role="tabpanel"] {
	padding-top: 2.25rem;
	border-top: 1px solid rgba(31, 27, 45, 0.1);
}

body.geodir-page-single .geodir-tabs-as-list .gd-tab-list-title {
	margin: 0 0 1.25rem;
	font-size: 1.5rem;
	font-weight: 600;
	line-height: 1.25;
	letter-spacing: -0.01em;
}

body.geodir-page-single .geodir-tabs-as-list .gd-tab-list-title a {
	text-decoration: none;
}

/* «Deja una valoración»: mismo nivel visual que los subtítulos de grupo. */
body.geodir-page-single #reviews .comment-reply-title {
	margin: 0 0 1rem;
	font-size: 1.125rem;
	font-weight: 600;
	line-height: 1.35;
}

/* --------------------------------------------------------------------------
 * 4.2 Etapa 1 · Fotos y Mapa como secciones diferenciadas.
 * Fotos: esquinas redondeadas uniformes en las miniaturas.
 * Mapa: esquinas redondeadas en el lienzo del mapa (#…_wrapper). Los
 * controles propios del mapa quedan dentro del lienzo; el botón de pantalla
 * completa y el formulario «Cómo llegar» no se tocan.
 * ------------------------------------------------------------------------ */
body.geodir-page-single #post_images .geodir-images .card {
	border: 0;
	border-radius: 0.75rem;
	overflow: hidden;
}

body.geodir-page-single #post_map .main_map_wrapper,
body.geodir-page-single #post_map .geodir-map-canvas {
	border-radius: 0.75rem;
	overflow: hidden;
}

body.geodir-page-single #post_map .geodir-map-directions-wrap {
	margin-top: 1rem !important;
}

@media (max-width: 767.98px) {
	body.geodir-page-single .geodir-tabs-as-list > [role="tabpanel"] {
		margin-bottom: 1.75rem !important;
	}

	body.geodir-page-single .geodir-tabs-as-list > [role="tabpanel"] ~ [role="tabpanel"] {
		padding-top: 1.75rem;
	}

	body.geodir-page-single .geodir-tabs-as-list .gd-tab-list-title {
		margin-bottom: 1rem;
		font-size: 1.375rem;
	}
}

/* --------------------------------------------------------------------------
 * 4.3 Etapa 2 · Contacto y atención: filas compactas.
 * Campos (claves reales): telefono, email, website, facebook, instagram,
 * tiktok y business_hours. WhatsApp (botón, regla 3.1) no se toca.
 * Íconos en gris y con ancho fijo (alineados), etiqueta discreta y valor
 * legible. El horario conserva su desplegable y sus colores abierto/cerrado.
 * ------------------------------------------------------------------------ */
body.geodir-page-single .geodir-tabs-content :is(
	.geodir-field-telefono,
	.geodir-field-email,
	.geodir-field-website,
	.geodir-field-facebook,
	.geodir-field-instagram,
	.geodir-field-tiktok,
	.geodir-field-business_hours
) {
	padding-block: 0.1875rem;
	line-height: 1.5;
	overflow-wrap: anywhere; /* correos y URL largas no desbordan */
}

body.geodir-page-single .geodir-tabs-content :is(
	.geodir-field-telefono,
	.geodir-field-email,
	.geodir-field-website,
	.geodir-field-facebook,
	.geodir-field-instagram,
	.geodir-field-tiktok,
	.geodir-field-address,
	.geodir-field-sector
) .geodir_post_meta_icon > i {
	width: 1.25em;
	margin-right: 0.25rem;
	color: #6b6880;
	text-indent: 0; /* el ícono es inline-block y heredaría la sangría francesa */
}

body.geodir-page-single .geodir-tabs-content :is(
	.geodir-field-telefono,
	.geodir-field-email,
	.geodir-field-address,
	.geodir-field-sector
) .geodir_post_meta_title {
	color: #6b6880;
}

body.geodir-page-single .geodir-tabs-content :is(
	.geodir-field-telefono,
	.geodir-field-email,
	.geodir-field-website,
	.geodir-field-facebook,
	.geodir-field-instagram,
	.geodir-field-tiktok
) > a {
	color: #1f1b2d;
	text-decoration: none;
}

body.geodir-page-single .geodir-tabs-content :is(
	.geodir-field-telefono,
	.geodir-field-email,
	.geodir-field-website,
	.geodir-field-facebook,
	.geodir-field-instagram,
	.geodir-field-tiktok
) > a:hover,
body.geodir-page-single .geodir-tabs-content :is(
	.geodir-field-telefono,
	.geodir-field-email,
	.geodir-field-website,
	.geodir-field-facebook,
	.geodir-field-instagram,
	.geodir-field-tiktok
) > a:focus-visible {
	color: var(--bs-primary, #3b8fd9);
	text-decoration: underline;
}

/* Sangría francesa: si el valor ocupa dos líneas (dirección o correo
 * largos), la segunda empieza alineada con el texto y no bajo el ícono. */
body.geodir-page-single .geodir-tabs-content :is(
	.geodir-field-telefono,
	.geodir-field-email,
	.geodir-field-website,
	.geodir-field-facebook,
	.geodir-field-instagram,
	.geodir-field-tiktok,
	.geodir-field-address,
	.geodir-field-sector
) {
	padding-left: 1.5rem;
	text-indent: -1.5rem;
}

body.geodir-page-single .geodir-tabs-content .geodir-field-business_hours .geodir-i-biz-hours > i {
	width: 1.25em;
	margin-right: 0.25rem;
}

/* El botón de WhatsApp ya tiene su propio margen inferior; la primera fila
 * de contacto no necesita más. */
body.geodir-page-single .geodir-tabs-content .geodir-post-meta-container:has(.byc-wa-field) + .geodir-post-meta-container .geodir_post_meta {
	padding-top: 0;
}

/* --------------------------------------------------------------------------
 * 4.4 Etapa 2 · Ubicación del negocio.
 * Dirección destacada (valor en seminegrita); barrio o sector con menor
 * énfasis. La dirección corta del encabezado (#title) no se toca.
 * ------------------------------------------------------------------------ */
body.geodir-page-single .geodir-tabs-content .geodir-field-address {
	padding-block: 0.1875rem;
	line-height: 1.5;
	color: #1f1b2d;
}

body.geodir-page-single .geodir-tabs-content .geodir-field-address :is([itemprop="streetAddress"], [itemprop="addressLocality"]) {
	font-weight: 500;
}

body.geodir-page-single .geodir-tabs-content .geodir-field-sector {
	padding-block: 0.125rem;
	font-size: 0.9375rem;
	line-height: 1.5;
	color: #6b6880;
}

/* --------------------------------------------------------------------------
 * 4.5 Etapa 3 · Características y servicios.
 * Afecta a los campos que siguen al subtítulo «Características y
 * servicios» (h2.fieldset-caractersticas-y-servicios) dentro de la misma
 * pestaña, sea cual sea su clave (también los condicionales por categoría).
 * Se excluye la descripción (regla 4.6).
 * Escritorio (≥ 768 px): etiqueta a la izquierda, valores a la derecha y
 * una línea discreta entre filas. Celular: etiqueta arriba, valores debajo.
 * Los campos sin ícono se alinean con los que sí lo tienen.
 * ------------------------------------------------------------------------ */
body.geodir-page-single .geodir-tabs-content .geodir-post-meta-container:has(> h2.fieldset-caractersticas-y-servicios) ~ .geodir-post-meta-container > .geodir_post_meta:not(.geodir-field-post_content) {
	padding-block: 0.625rem;
	line-height: 1.5;
	border-top: 1px solid rgba(31, 27, 45, 0.07);
}

/* La primera fila, pegada al subtítulo, va sin línea. */
body.geodir-page-single .geodir-tabs-content .geodir-post-meta-container:has(> h2.fieldset-caractersticas-y-servicios) + .geodir-post-meta-container > .geodir_post_meta:not(.geodir-field-post_content) {
	padding-top: 0.25rem;
	border-top: 0;
}

/* Etiqueta: ícono gris de ancho fijo + texto discreto. */
body.geodir-page-single .geodir-tabs-content .geodir-post-meta-container:has(> h2.fieldset-caractersticas-y-servicios) ~ .geodir-post-meta-container > .geodir_post_meta:not(.geodir-field-post_content) .geodir_post_meta_icon > i {
	width: 1.25em;
	margin-right: 0.25rem;
	color: #6b6880;
}

body.geodir-page-single .geodir-tabs-content .geodir-post-meta-container:has(> h2.fieldset-caractersticas-y-servicios) ~ .geodir-post-meta-container > .geodir_post_meta:not(.geodir-field-post_content) .geodir_post_meta_title {
	color: #6b6880;
}

/* Campos sin ícono (p. ej. Tipo de cocina): el mismo espacio que ocupa un
 * ícono, para que todas las etiquetas empiecen en la misma línea vertical. */
body.geodir-page-single .geodir-tabs-content .geodir-post-meta-container:has(> h2.fieldset-caractersticas-y-servicios) ~ .geodir-post-meta-container > .geodir_post_meta:not(.geodir-field-post_content) > .geodir_post_meta_icon:not(:has(> i)) {
	padding-left: 1.75rem; /* ícono (1,25 em) + margen + espacio */
}

/* Valores de texto (p. ej. Rango de precios) en oscuro. */
body.geodir-page-single .geodir-tabs-content .geodir-post-meta-container:has(> h2.fieldset-caractersticas-y-servicios) ~ .geodir-post-meta-container > .geodir_post_meta:not(.geodir-field-post_content) {
	color: #1f1b2d;
}

/* Celular: etiquetas (pastillas) debajo, alineadas con el texto de la etiqueta. */
body.geodir-page-single .geodir-tabs-content .geodir-post-meta-container:has(> h2.fieldset-caractersticas-y-servicios) ~ .geodir-post-meta-container > .geodir_post_meta:not(.geodir-field-post_content) > ul {
	margin: 0.5rem 0 0.125rem 1.75rem;
}

@media (min-width: 768px) {
	body.geodir-page-single .geodir-tabs-content .geodir-post-meta-container:has(> h2.fieldset-caractersticas-y-servicios) ~ .geodir-post-meta-container > .geodir_post_meta:not(.geodir-field-post_content) {
		display: grid;
		grid-template-columns: minmax(10rem, 14rem) minmax(0, 1fr);
		column-gap: 1.25rem;
		align-items: start;
	}

	body.geodir-page-single .geodir-tabs-content .geodir-post-meta-container:has(> h2.fieldset-caractersticas-y-servicios) ~ .geodir-post-meta-container > .geodir_post_meta:not(.geodir-field-post_content) > ul {
		margin: 0;
	}
}

/* --------------------------------------------------------------------------
 * 4.6 Etapa 3 · Descripción del negocio.
 * Sin el ícono decorativo de guion; la etiqueta pasa a ser un subtítulo del
 * mismo nivel que «Contacto y atención»; párrafos separados, interlineado
 * cómodo y ancho de lectura limitado (~70 caracteres). No se recorta ni se
 * oculta texto.
 * ------------------------------------------------------------------------ */
body.geodir-page-single .geodir-tabs-content .geodir-field-post_content {
	margin-top: 1.5rem;
	padding-top: 1.25rem;
	border-top: 1px solid rgba(31, 27, 45, 0.1);
	color: #1f1b2d;
}

body.geodir-page-single .geodir-tabs-content .geodir-field-post_content > .geodir_post_meta_icon > i {
	display: none;
}

body.geodir-page-single .geodir-tabs-content .geodir-field-post_content > .geodir_post_meta_icon {
	display: block;
	margin-bottom: 0.75rem;
}

body.geodir-page-single .geodir-tabs-content .geodir-field-post_content .geodir_post_meta_title {
	font-size: 1.125rem;
	font-weight: 600;
	line-height: 1.35;
	color: #1f1b2d;
}

body.geodir-page-single .geodir-tabs-content .geodir-field-post_content p {
	max-width: 70ch;
	margin: 0 0 1rem;
	line-height: 1.7;
}

body.geodir-page-single .geodir-tabs-content .geodir-field-post_content p:last-child {
	margin-bottom: 0;
}

/* --------------------------------------------------------------------------
 * 4.7 Corrección de la Etapa 1 · «Deja una valoración».
 * Un script de GeoDirectory inserta <span class="gd-comment-review-title h4">
 * dentro de h3#reply-title, y la clase .h4 imponía su tamaño. El texto toma
 * el estilo de su título (regla 4.1).
 * ------------------------------------------------------------------------ */
body.geodir-page-single #reviews .comment-reply-title .gd-comment-review-title {
	font-size: inherit;
	font-weight: inherit;
	line-height: inherit;
}

/* --------------------------------------------------------------------------
 * 4.8 Etapa 4 · Ancho de la ficha en escritorio (opción A).
 * La plantilla GD Single divide #main en .col-lg-7 (pestañas) y .col-lg-4
 * (solo «Acciones del autor», que GeoDirectory no imprime para visitantes).
 * Si la columna lateral está vacía (sin acciones del autor ni ningún otro
 * contenido visible), se oculta y la principal ocupa todo el ancho, alineada
 * con el título y la galería. Para el dueño o el administrador la columna
 * sigue visible con su botón de edición y el reparto 7/4 no cambia.
 * ------------------------------------------------------------------------ */
body.geodir-page-single #main > .row > .col-lg-4:not(:has(.gd-author-actions, a, button, img, iframe, form, p, h1, h2, h3, h4, h5, h6, li)) {
	display: none;
}

@media (min-width: 992px) {
	/* :has() no admite anidarse: se expresa como «la fila tiene columna
	 * lateral, pero esa columna no contiene nada visible». */
	body.geodir-page-single #main > .row:has(> .col-lg-4):not(:has(> .col-lg-4 :is(.gd-author-actions, a, button, img, iframe, form, p, h1, h2, h3, h4, h5, h6, li))) > .col-lg-7 {
		flex: 0 0 100%;
		width: 100%;
		max-width: 100%;
	}
}

/* Con más ancho, los formularios no se estiran sin límite. La descripción
 * ya tiene su propio ancho de lectura (regla 4.6). */
body.geodir-page-single #reviews #respond,
body.geodir-page-single #post_map .geodir-map-directions-wrap {
	max-width: 48rem;
}

/* --------------------------------------------------------------------------
 * 4.9 Etapa 4 · Celular.
 * La columna principal ocupa siempre el ancho disponible y puede encogerse
 * (min-width: 0) para que nada la desborde; espaciado más compacto en
 * Características y Descripción.
 * ------------------------------------------------------------------------ */
@media (max-width: 991.98px) {
	body.geodir-page-single #main > .row > .col-lg-7 {
		flex: 0 0 100%;
		width: 100%;
		max-width: 100%;
		min-width: 0;
	}
}

@media (max-width: 767.98px) {
	body.geodir-page-single .geodir-tabs-content .geodir-post-meta-container:has(> h2.fieldset-caractersticas-y-servicios) ~ .geodir-post-meta-container > .geodir_post_meta:not(.geodir-field-post_content) {
		padding-block: 0.5rem;
	}

	body.geodir-page-single .geodir-tabs-content .geodir-post-meta-container:has(> h2.fieldset-caractersticas-y-servicios) ~ .geodir-post-meta-container > .geodir_post_meta:not(.geodir-field-post_content) > ul {
		margin-top: 0.375rem;
	}

	body.geodir-page-single .geodir-tabs-content .geodir-field-post_content {
		margin-top: 1.25rem;
		padding-top: 1rem;
	}

	body.geodir-page-single .geodir-tabs-content .geodir-post-meta-container > h2[class*="fieldset-"] {
		margin-top: 1.25rem;
		padding-top: 1rem;
	}

	body.geodir-page-single .geodir-tabs-content .hash-offset + .geodir-post-meta-container > h2[class*="fieldset-"] {
		margin-top: 0.25rem;
		padding-top: 0;
	}
}

/* --------------------------------------------------------------------------
 * 4.10 Subtítulo de grupo vacío (decisión del usuario, Etapa 3).
 * GeoDirectory imprime el subtítulo («Características y servicios», etc.)
 * aunque el grupo no tenga ningún campo con datos. Se oculta cuando lo que
 * le sigue no es un campo (otro subtítulo, la descripción o nada).
 * ------------------------------------------------------------------------ */
body.geodir-page-single .geodir-tabs-content .geodir-post-meta-container:has(> h2[class*="fieldset-"]):not(:has(+ .geodir-post-meta-container > .geodir_post_meta:not(.geodir-field-post_content))) {
	display: none;
}

/* --------------------------------------------------------------------------
 * 5.1 Ficha · Botón «Cómo llegar» (Módulo 7, versión 0.5.0).
 * Lo genera el campo nativo map_directions de GeoDirectory; el módulo
 * includes/module-directions.php añade la clase .byc-dir-link. Botón
 * secundario con contorno azul (#1e73be, el azul primario del tema:
 * contraste 4,9:1 sobre blanco), alineado con el texto de la dirección.
 * No compite con el botón verde de WhatsApp.
 * ------------------------------------------------------------------------ */
body.geodir-page-single .byc-dir-field {
	margin: 0.375rem 0 0.25rem 1.5rem;
}

body.geodir-page-single .byc-dir-link {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.375rem 0.875rem;
	font-size: 0.9375rem;
	font-weight: 500;
	line-height: 1.4;
	color: #1e73be !important;
	text-decoration: none !important;
	background-color: transparent;
	border: 1px solid #1e73be;
	border-radius: 0.5rem;
	transition: background-color 0.15s ease-in-out;
}

body.geodir-page-single .byc-dir-link:hover {
	background-color: #eaf2fa;
}

body.geodir-page-single .byc-dir-link:focus-visible {
	outline: 3px solid #93c5fd;
	outline-offset: 2px;
}

/* ==========================================================================
 * 6. Bloque de categorías (portada y municipio) · Nombres completos (0.5.5).
 * GeoDirectory fuerza el menú de subcategorías al ancho de la tarjeta (clase
 * w-100) y corta cada nombre con puntos suspensivos (text-truncate):
 * «Materiales de c…», «Belleza y cuidado perso…». Solo cambia el ancho del
 * menú y el corte de los textos; orden, íconos, contadores, enlaces y el
 * funcionamiento del desplegable quedan igual.
 * ======================================================================== */

/* 6.1 Menú de subcategorías: tan ancho como sus nombres, como mínimo el de la
 * tarjeta y sin salirse de la pantalla. */
.gd-categories-widget .gd-cptcat-sub.dropdown-menu.w-100 {
	width: max-content !important;
	min-width: 100%;
	max-width: calc(100vw - 2rem);
}

/* Cada fila: ícono + nombre a la izquierda y contador a su lado. Si la fila no
 * cabe (celular), el nombre pasa a dos líneas junto al ícono y el contador se
 * mantiene en una sola pieza; nada se corta con «…». */
.gd-categories-widget .gd-cptcat-sub .dropdown-item {
	white-space: normal;
}

.gd-categories-widget .gd-cptcat-sub .gd-cptcat-cat-right.text-truncate {
	display: flex;
	align-items: center;
	overflow: visible;
	text-overflow: clip;
	white-space: normal;
}

.gd-categories-widget .gd-cptcat-sub .gd-cptcat-cat-right > a.d-inline-block {
	display: flex !important;
	align-items: center;
	flex: 0 1 auto;
	min-width: 0;
}

.gd-categories-widget .gd-cptcat-sub .gd-cptcat-cat-right > a > .gd-cptcat-cat-left {
	flex: 0 0 auto;
}

.gd-categories-widget .gd-cptcat-sub .gd-cptcat-cat-right > .gd-cptcat-count {
	flex: 0 0 auto;
	white-space: nowrap;
}

/* 6.2 Nombre de la categoría principal: hasta dos líneas en lugar de cortarse. */
.gd-categories-widget .gd-cptcat-parent > .card > .card-body > .gd-cptcat-cat-right.text-truncate {
	overflow: visible;
	text-overflow: clip;
	white-space: normal;
}

/* =========================================================================
 * 7. Cuenta del propietario (UsersWP) — 0.7.0
 * ====================================================================== */

/* 7.1 Enlace a la política en la casilla del registro: subrayado y con el color de enlace. */
.btn-register-gdpr a,
.uwp-register-gdpr a {
	color: var(--bs-primary, #3b8fd9);
	text-decoration: underline;
	text-underline-offset: 2px;
}

/* 7.2 Pestaña «Mis negocios». */
.byc-owner-list .byc-owner-item {
	padding-top: .75rem;
	padding-bottom: .75rem;
}

.byc-owner-list .byc-owner-main {
	min-width: 0;
	flex: 1 1 16rem;
}

.byc-owner-list .byc-owner-badge {
	font-weight: 500;
	vertical-align: middle;
}

.byc-owner-list .byc-owner-actions {
	flex: 0 0 auto;
	margin-top: .5rem;
}

@media (min-width: 576px) {
	.byc-owner-list .byc-owner-actions {
		margin-top: 0;
	}
}

/* 7.3 Aviso de privacidad debajo del botón de Google (Módulo 11). */
.byc-social-consent {
	max-width: 22rem;
	margin-left: auto;
	margin-right: auto;
	line-height: 1.4;
}

.byc-social-consent a {
	text-decoration: underline;
	text-underline-offset: 2px;
}

/* 7.4 Bloque «O continúa con» (0.7.3): espacio respecto a los enlaces de arriba. */
.uwp_widget_social_login .bsui > hr {
	margin: 1.5rem 0 1rem;
}

.uwp_widget_social_login .bsui > .h5,
.uwp_widget_social_login .bsui > .h5.mt-n2 {
	margin-top: 0 !important;
	margin-bottom: 1rem !important;
	font-size: 1rem;
	text-align: center;
}

/* 7.5 Botón «Continuar con Google» (pautas de marca de Google, tema claro). */
.byc-google-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	min-height: 40px;
	padding: 0 16px 0 12px;
	background: #fff;
	border: 1px solid #747775;
	border-radius: 4px;
	color: #1f1f1f;
	font-family: Roboto, Arial, sans-serif;
	font-size: 14px;
	font-weight: 500;
	line-height: 20px;
	letter-spacing: .25px;
	text-decoration: none;
	transition: background-color .2s, box-shadow .2s;
}

.byc-google-btn:hover,
.byc-google-btn:focus {
	background: #f7f8f8;
	color: #1f1f1f;
	text-decoration: none;
	box-shadow: 0 1px 2px rgba(60, 64, 67, .3), 0 1px 3px 1px rgba(60, 64, 67, .15);
}

.byc-google-btn:focus-visible {
	outline: 2px solid #0b57d0;
	outline-offset: 2px;
}

.byc-google-btn__logo {
	flex: 0 0 20px;
	width: 20px;
	height: 20px;
}

/* --------------------------------------------------------------------------
 * 7.6 Mi cuenta · Fondo, tarjetas y opción activa del menú (F5-368, 0.11.0).
 * Solo en la página de cuenta de UsersWP (body.uwp_account_page).
 * ------------------------------------------------------------------------ */
body.uwp_account_page {
	background-color: #f4f6f9;
}

/* Tarjeta izquierda: avatar y menú (reemplaza el gris de .bg-light). */
body.uwp_account_page .uwp-account .navbar-light > .bg-light,
body.uwp_account_page .col-lg-3 .navbar-light > .bg-light {
	background-color: #fff !important;
	border: 1px solid #e3e7ee;
	border-radius: 12px;
	box-shadow: 0 1px 2px rgba(16, 24, 40, .04);
	padding-bottom: 1rem;
}

/* Tarjeta derecha: contenido de la pestaña. */
body.uwp_account_page .col-lg-9 > div {
	background-color: #fff;
	border: 1px solid #e3e7ee;
	border-radius: 12px;
	box-shadow: 0 1px 2px rgba(16, 24, 40, .04);
	padding: 2rem 1.5rem 1.5rem !important;
}

@media (min-width: 992px) {
	body.uwp_account_page .col-lg-9 > div {
		margin-left: 1.5rem;
		padding: 2.5rem 2rem 2rem !important;
	}
}

@media (max-width: 991.98px) {
	/* Mismo ancho que la tarjeta del menú. */
	body.uwp_account_page .row > .col-lg-9 {
		padding-left: 0;
		padding-right: 0;
	}

	body.uwp_account_page .col-lg-9 > div {
		margin-top: 1rem;
	}
}

/* Menú a lo ancho de la tarjeta (escritorio): cada opción ocupa toda la fila. */
body.uwp_account_page .col-lg-3 ul.nav {
	width: 100%;
	padding: 0 1rem !important;
}

@media (min-width: 992px) {
	body.uwp_account_page .col-lg-3 ul.nav > .nav-item {
		width: 100%;
		margin-left: 0 !important;
		margin-right: 0 !important;
		margin-bottom: .125rem !important;
	}
}

@media (max-width: 991.98px) {
	body.uwp_account_page .col-lg-3 ul.nav {
		justify-content: center;
		gap: .25rem;
	}

	body.uwp_account_page .col-lg-3 ul.nav > .nav-item {
		margin-left: 0 !important;
		margin-right: 0 !important;
	}
}

/* Opciones del menú. */
body.uwp_account_page .col-lg-3 .nav-link {
	border-radius: 8px;
	color: #3b3a4a;
	padding: .5rem .75rem;
	transition: background-color .15s, color .15s;
}

body.uwp_account_page .col-lg-3 .nav-link:hover,
body.uwp_account_page .col-lg-3 .nav-link:focus-visible {
	background-color: #f1f3f6;
	color: #1f1e2c;
}

/* Opción activa: fondo azul claro, texto azul y barra lateral. */
body.uwp_account_page .col-lg-3 .nav-link.active {
	background-color: #e8f1fb;
	color: var(--bs-primary, #3b8fd9);
	font-weight: 600;
	box-shadow: inset 3px 0 0 var(--bs-primary, #3b8fd9);
}

body.uwp_account_page .col-lg-3 .nav-link.active i {
	color: inherit;
}

/* Celular y tableta: el menú va en fila; la opción activa es una pastilla. */
@media (max-width: 991.98px) {
	body.uwp_account_page .col-lg-3 .nav-link {
		border-radius: 999px;
	}

	body.uwp_account_page .col-lg-3 .nav-link.active {
		box-shadow: none;
	}
}

/* Aviso de límite de negocios (Módulo 15). */
.byc-limit-notice a {
	text-decoration: underline;
	text-underline-offset: 2px;
}

/* --------------------------------------------------------------------------
 * 7.7 Mi cuenta · Estadísticas del propietario (Módulo 16, F5-375, 0.12.0).
 * Colores: WhatsApp verde (#1e9e5a, como su botón), Cómo llegar azul de la
 * marca; además del color, la serie de Cómo llegar va rayada.
 * ------------------------------------------------------------------------ */
.byc-stats-summary {
	margin-top: .25rem;
	color: #5f5e70;
}

.byc-stats-summary strong {
	color: #2b2a3a;
}

.byc-stats-link,
.byc-stats-back {
	text-decoration: underline;
	text-underline-offset: 2px;
}

.byc-stats-cards {
	display: grid;
	grid-template-columns: 1fr;
	gap: .75rem;
}

@media (min-width: 576px) {
	.byc-stats-cards {
		grid-template-columns: 1fr 1fr;
	}
}

.byc-stats-card {
	border: 1px solid #e3e7ee;
	border-left: 4px solid #1e9e5a;
	border-radius: 10px;
	padding: .75rem 1rem;
	background: #fff;
}

.byc-stats-card--dir {
	border-left-color: var(--bs-primary, #3b8fd9);
}

.byc-stats-card__title {
	font-size: .875rem;
	color: #5f5e70;
}

.byc-stats-card__value {
	font-size: 1.75rem;
	font-weight: 600;
	line-height: 1.2;
	color: #2b2a3a;
}

.byc-stats-up {
	color: #1a7f4b;
}

.byc-stats-down {
	color: #b42318;
}

.byc-stats-legend {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
	margin-bottom: .5rem;
	color: #5f5e70;
}

.byc-stats-key {
	display: inline-block;
	width: .75rem;
	height: .75rem;
	margin-right: .35rem;
	border-radius: 2px;
	vertical-align: -1px;
}

.byc-stats-key--wa,
.byc-stats-bar--wa {
	background-color: #1e9e5a;
}

.byc-stats-key--dir,
.byc-stats-bar--dir {
	background-color: var(--bs-primary, #3b8fd9);
	background-image: repeating-linear-gradient(135deg, rgba(255, 255, 255, .45) 0 2px, transparent 2px 5px);
}

.byc-stats-chart {
	position: relative;
	padding-left: 1.75rem;
}

.byc-stats-chart__max {
	position: absolute;
	top: -.4rem;
	left: 0;
	width: 1.5rem;
	text-align: right;
	color: #5f5e70;
	line-height: 1;
}

.byc-stats-chart__plot {
	display: flex;
	align-items: flex-end;
	gap: 2px;
	height: 160px;
	border-top: 1px dashed #e3e7ee;
	border-bottom: 1px solid #c9ced8;
}

.byc-stats-day {
	flex: 1 1 0;
	min-width: 0;
	height: 100%;
	display: flex;
	align-items: flex-end;
	justify-content: center;
	gap: 1px;
}

.byc-stats-day:hover {
	background-color: #f1f3f6;
}

.byc-stats-bar {
	display: block;
	width: 45%;
	max-width: 10px;
	border-radius: 2px 2px 0 0;
}

.byc-stats-chart__axis {
	display: flex;
	gap: 2px;
	margin-top: .25rem;
	color: #5f5e70;
}

.byc-stats-chart__axis > span {
	flex: 1 1 0;
	min-width: 0;
	overflow: visible;
	white-space: nowrap;
}

.byc-stats-table summary {
	cursor: pointer;
	color: var(--bs-primary, #3b8fd9);
}

.byc-stats-devices li + li {
	margin-top: .5rem;
}

.byc-stats-meter {
	height: 6px;
	margin-top: .25rem;
	border-radius: 999px;
	background: #eef1f5;
	overflow: hidden;
}

.byc-stats-meter > span {
	display: block;
	height: 100%;
	background: var(--bs-primary, #3b8fd9);
}

.byc-stats-note {
	padding: .75rem 1rem;
	border-radius: 10px;
	background: #f4f6f9;
	color: #5f5e70;
}

/* 7.8 Estadísticas · Visitas a la ficha (F5-376, 0.14.0): serie morada, distinta
 * de WhatsApp (verde) y Cómo llegar (azul rayado); va en su propio gráfico. */
.byc-stats-card--vis {
	border-left-color: #6e56cf;
}

.byc-stats-bar--vis {
	width: 70%;
	max-width: 14px;
	background-color: #6e56cf;
}

.byc-stats-devgroups {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1rem;
}

@media (min-width: 576px) {
	.byc-stats-devgroups {
		grid-template-columns: 1fr 1fr;
	}
}

/* ==========================================================================
 * 8. Página 404 · Botón «Ir al inicio» visible (F5-394, 0.16.1).
 * El tema usa body con display:flex y el bloque del ícono de la plantilla 404
 * lleva la clase h-100 (height:100%). El ícono toma todo el alto del
 * contenedor, el botón queda por fuera y el pie de página lo tapa.
 * ======================================================================== */
body.error404 #main > .blockstrap-iconbox.h-100 {
	height: auto !important;
}

/* ==========================================================================
 * 9. Favoritos · Corazón relleno cuando el negocio ya es favorito (0.16.2).
 * GeoDirectory usa el mismo ícono para los dos estados (fa-regular fa-heart,
 * solo contorno) y cambia el color: gris sin marcar, rojo al marcar. Con peso
 * 900 Font Awesome 6 Free dibuja el corazón sólido, así que al marcarlo queda
 * rojo por dentro. GeoDirectory cambia la clase geodir-removetofav-icon /
 * geodir-addtofav-icon al hacer clic, y el cambio se ve sin recargar.
 * Aplica en la ficha y en las tarjetas del listado.
 * ======================================================================== */
.geodir-act-fav.geodir-removetofav-icon .fa-heart {
	font-weight: 900;
}

/* ==========================================================================
 * 10. Mi cuenta · Favoritos (Módulo 23, 0.20.0).
 * Usa la lista de «Mis negocios» (7.2); el formulario «Quitar» va en línea.
 * ======================================================================== */
.byc-fav-list .byc-fav-remove {
	margin: 0;
}

.byc-fav-list .byc-owner-actions {
	display: flex;
	align-items: center;
}