/* ==========================================================================
   Breadcrumbs — Mercury child theme (gamewize.sk)
   Modern 2026 style: pill container, home icon, chevron separators,
   pink accent matching the site's existing category pills.
   ========================================================================== */

.space-single-aces-breadcrumbs {
	margin: 6px 0 16px;
	line-height: 1;
	clear: both;
}

/* On CPT single pages (organization / offer / unit), the breadcrumb sits
   OUTSIDE .space-page-wrapper, so its 1200px container is left-anchored
   at the viewport edge instead of centered. Center it manually and add
   horizontal padding so it lines up with the rest of the page content. */
body.single-organization .space-single-aces-breadcrumbs,
body.single-offer .space-single-aces-breadcrumbs,
body.single-unit .space-single-aces-breadcrumbs {
	max-width: 1200px;
	margin-left: auto;
	margin-right: auto;
	padding-left: 20px;
	padding-right: 20px;
	box-sizing: border-box;
}

/* Outer pill container */
.space-breadcrumbs {
	display: inline-block;
	padding: 6px 12px;
	background: rgba(255, 255, 255, 0.65);
	-webkit-backdrop-filter: blur(8px) saturate(140%);
	backdrop-filter: blur(8px) saturate(140%);
	border: 1px solid rgba(15, 23, 42, 0.08);
	border-radius: 999px;
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 0.01em;
	color: #64748b;
	box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
	max-width: 100%;
}

/* Reset Rank Math's <nav><p> wrappers and turn the <p> into the flex row */
.space-breadcrumbs .rank-math-breadcrumb,
.space-breadcrumbs nav {
	margin: 0;
	padding: 0;
	display: block;
}

.space-breadcrumbs .rank-math-breadcrumb p,
.space-breadcrumbs nav p {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 2px;
	margin: 0;
	padding: 0;
	line-height: 1;
}

/* Yoast renders a flat list of spans directly inside .space-breadcrumbs — keep
   that working too. */
.space-breadcrumbs > span,
.space-breadcrumbs > a {
	display: inline-flex;
	align-items: center;
}

/* Ancestor links — chip-style hover */
.space-breadcrumbs a,
.space-breadcrumbs a:link,
.space-breadcrumbs a:visited {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 4px 10px;
	border-radius: 999px;
	color: #475569;
	text-decoration: none;
	line-height: 1;
	transition: color 0.18s ease, background-color 0.18s ease, transform 0.18s ease;
}

.space-breadcrumbs a:hover,
.space-breadcrumbs a:focus {
	color: #ec4899;
	background: rgba(236, 72, 153, 0.09);
}

.space-breadcrumbs a:active {
	transform: translateY(1px);
}

/* Home icon on the first link */
.space-breadcrumbs a:first-of-type::before {
	content: '';
	width: 14px;
	height: 14px;
	flex: 0 0 auto;
	background-color: currentColor;
	-webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M3 10.5 12 3l9 7.5V21a1 1 0 0 1-1 1h-5v-7h-6v7H4a1 1 0 0 1-1-1V10.5z'/></svg>") no-repeat center / contain;
	mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M3 10.5 12 3l9 7.5V21a1 1 0 0 1-1 1h-5v-7h-6v7H4a1 1 0 0 1-1-1V10.5z'/></svg>") no-repeat center / contain;
}

/* Replace Rank Math's text separator (» / /) with a clean chevron */
.space-breadcrumbs .separator {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	align-self: center;
	width: 16px;
	height: 24px;
	color: #cbd5e1;
	font-size: 0;
	margin: 0 2px;
	line-height: 1;
}

.space-breadcrumbs .separator::after {
	content: '';
	width: 6px;
	height: 6px;
	border-top: 1.5px solid currentColor;
	border-right: 1.5px solid currentColor;
	transform: rotate(45deg);
}

/* Current page */
.space-breadcrumbs .last,
.space-breadcrumbs .breadcrumb_last,
.space-breadcrumbs [aria-current="page"] {
	display: inline-flex;
	align-items: center;
	padding: 4px 10px;
	border-radius: 999px;
	color: #0f172a;
	font-weight: 600;
	background: rgba(15, 23, 42, 0.04);
	line-height: 1;
}

/* Hide the Rank Math "Prefix" label (e.g. "Nájdi"), in case the setting
   isn't cleared in admin. */
.space-breadcrumbs .label {
	display: none;
}

/* Wrap emoji inside the last crumb tightly */
.space-breadcrumbs .last img.emoji,
.space-breadcrumbs .breadcrumb_last img.emoji {
	width: 1em;
	height: 1em;
	margin: 0 0 0 4px;
	vertical-align: -2px;
}

/* ----------------------------------------------------------------------------
   Position breadcrumbs directly under the H1, above ACF / excerpt / toggles,
   without editing single.php / page.php / taxonomy.php / archive templates.

   Covers both wrapper classes used across the theme:
   - .space-title-box-h1          (single.php, page.php, taxonomy.php, ...)
   - .space-archive-title-box-h1  (custom archive templates, e.g. bonus archive)
   ---------------------------------------------------------------------------- */
.space-title-box-h1,
.space-archive-title-box-h1 {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}
.space-title-box-h1 > *,
.space-archive-title-box-h1 > * {
	order: 3;
}
.space-title-box-h1 > h1,
.space-archive-title-box-h1 > h1 {
	order: 1;
}
.space-title-box-h1 > .space-single-aces-breadcrumbs,
.space-archive-title-box-h1 > .space-single-aces-breadcrumbs {
	order: 2;
}

/* ----------------------------------------------------------------------------
   Mobile
   ---------------------------------------------------------------------------- */
@media (max-width: 640px) {
	.space-breadcrumbs {
		padding: 5px 8px;
		font-size: 12px;
	}
	.space-breadcrumbs a,
	.space-breadcrumbs .last,
	.space-breadcrumbs .breadcrumb_last,
	.space-breadcrumbs [aria-current="page"] {
		padding: 3px 8px;
	}
	.space-breadcrumbs .separator {
		width: 12px;
		margin: 0;
	}
}
