/**
 * Mrslia layout fixes — sticky header, single-article mobile,
 * testimonials overflow, breadcrumb contrast, CTA band.
 * Loaded after mrslia-theme.css. Keep RTL; brand: #0066FF / #0B1220 / #E2982E.
 */

:root {
	--mrs-header-offset: 84px;
	--mrs-ink-fix: #0B1220;
	--mrs-primary-fix: #0066FF;
	--mrs-gold-fix: #E2982E;
}

@media (max-width: 767px) {
	:root {
		--mrs-header-offset: 64px;
	}
}

/* ==========================================================================
   2) Sticky / fixed site header on ALL devices
   overflow-x:hidden on body/#page kills position:sticky — use fixed instead.
   When promo bar is visible, sit header below it (--mlseo-promo-h).
   ========================================================================== */
body.mrslia-native .mrs-header {
	position: fixed !important;
	top: 0 !important;
	left: 0 !important;
	right: 0 !important;
	width: 100% !important;
	z-index: 1000 !important;
}

html.mlseo-promo-pending body.mrslia-native .mrs-header,
html.mlseo-promo-visible body.mrslia-native .mrs-header {
	top: var(--mlseo-promo-h, 52px) !important;
}

body.admin-bar.mrslia-native .mrs-header {
	top: 32px !important;
}

html.mlseo-promo-pending body.admin-bar.mrslia-native .mrs-header,
html.mlseo-promo-visible body.admin-bar.mrslia-native .mrs-header {
	top: calc(32px + var(--mlseo-promo-h, 52px)) !important;
}

@media (max-width: 782px) {
	body.admin-bar.mrslia-native .mrs-header {
		top: 46px !important;
	}
	html.mlseo-promo-pending body.admin-bar.mrslia-native .mrs-header,
	html.mlseo-promo-visible body.admin-bar.mrslia-native .mrs-header {
		top: calc(46px + var(--mlseo-promo-h, 52px)) !important;
	}
}

/* Keep promo fixed above the header so neither scrolls away */
body.mrslia-native .mlseo-promo-bar,
body.mrslia-native #mlseo-promo-bar {
	position: fixed !important;
	top: 0 !important;
	left: 0 !important;
	right: 0 !important;
	width: 100% !important;
	z-index: 1001 !important;
}

body.admin-bar.mrslia-native .mlseo-promo-bar,
body.admin-bar.mrslia-native #mlseo-promo-bar {
	top: 32px !important;
}

@media (max-width: 782px) {
	body.admin-bar.mrslia-native .mlseo-promo-bar,
	body.admin-bar.mrslia-native #mlseo-promo-bar {
		top: 46px !important;
	}
}

body.mrslia-native {
	padding-top: var(--mrs-header-offset) !important;
	box-sizing: border-box !important;
}

html.mlseo-promo-pending body.mrslia-native,
html.mlseo-promo-visible body.mrslia-native {
	padding-top: calc(var(--mrs-header-offset) + var(--mlseo-promo-h, 52px)) !important;
}

html.mlseo-promo-dismissed body.mrslia-native {
	padding-top: var(--mrs-header-offset) !important;
}

body.admin-bar.mrslia-native {
	padding-top: calc(var(--mrs-header-offset) + 32px) !important;
}

html.mlseo-promo-pending body.admin-bar.mrslia-native,
html.mlseo-promo-visible body.admin-bar.mrslia-native {
	padding-top: calc(var(--mrs-header-offset) + var(--mlseo-promo-h, 52px) + 32px) !important;
}

@media (max-width: 782px) {
	body.admin-bar.mrslia-native {
		padding-top: calc(var(--mrs-header-offset) + 46px) !important;
	}
	html.mlseo-promo-pending body.admin-bar.mrslia-native,
	html.mlseo-promo-visible body.admin-bar.mrslia-native {
		padding-top: calc(var(--mrs-header-offset) + var(--mlseo-promo-h, 52px) + 46px) !important;
	}
}

/* ==========================================================================
   4) Breadcrumb contrast — dark ink on light surfaces; light on dark heroes
   ========================================================================== */
.mrslia-site-breadcrumb,
.mrslia-site-breadcrumb a,
.mrslia-site-breadcrumb > span {
	color: var(--mrs-ink-fix) !important;
	-webkit-text-fill-color: var(--mrs-ink-fix) !important;
}

.mrslia-site-breadcrumb a:hover {
	color: var(--mrs-primary-fix) !important;
	-webkit-text-fill-color: var(--mrs-primary-fix) !important;
}

.mrslia-site-breadcrumb__current {
	color: var(--mrs-ink-fix) !important;
	-webkit-text-fill-color: var(--mrs-ink-fix) !important;
	font-weight: 700 !important;
}

.mlseo-blog-archive-nav .mrslia-site-breadcrumb,
.mlseo-blog-archive-nav .mrslia-site-breadcrumb a,
.mlseo-blog-archive-nav .mrslia-site-breadcrumb > span,
.mlseo-blog-archive-nav .mrslia-site-breadcrumb__current {
	color: var(--mrs-ink-fix) !important;
	-webkit-text-fill-color: var(--mrs-ink-fix) !important;
}

/*
 * Dark hero only: light crumbs.
 * Do NOT target bare .mrslia-page-hero__crumb — archives reuse that class
 * inside light .mlseo-blog-archive-nav (white-on-mint contrast bug).
 */
.mrslia-page-hero .mrslia-site-breadcrumb,
.mrslia-page-hero .mrslia-site-breadcrumb a,
.mrslia-page-hero .mrslia-site-breadcrumb > span,
.mrslia-page-hero .mrslia-site-breadcrumb__current,
.mrslia-page-hero .mrslia-page-hero__crumb,
.mrslia-page-hero .mrslia-page-hero__crumb a {
	color: rgba(255, 255, 255, 0.92) !important;
	-webkit-text-fill-color: rgba(255, 255, 255, 0.92) !important;
}

.mrslia-page-hero .mrslia-site-breadcrumb a:hover,
.mrslia-page-hero .mrslia-page-hero__crumb a:hover {
	color: #fff !important;
	-webkit-text-fill-color: #fff !important;
}

.mrslia-page-hero .mrslia-site-breadcrumb__current {
	color: #fff !important;
	-webkit-text-fill-color: #fff !important;
}

/* Archive / category / blog nav: force dark ink on light pill */
.mlseo-blog-archive-nav .mrslia-site-breadcrumb,
.mlseo-blog-archive-nav .mrslia-site-breadcrumb a,
.mlseo-blog-archive-nav .mrslia-site-breadcrumb > span,
.mlseo-blog-archive-nav .mrslia-site-breadcrumb__current,
.mlseo-blog-archive-nav .mrslia-page-hero__crumb,
.mlseo-blog-archive-nav .mrslia-page-hero__crumb a,
.mlseo-cat-archive .mrslia-site-breadcrumb,
.mlseo-cat-archive .mrslia-site-breadcrumb a,
.mlseo-cat-archive .mrslia-site-breadcrumb > span,
.mlseo-cat-archive .mrslia-site-breadcrumb__current {
	color: #0B1220 !important;
	-webkit-text-fill-color: #0B1220 !important;
}

.mlseo-blog-archive-nav .mrslia-site-breadcrumb a:hover,
.mlseo-cat-archive .mrslia-site-breadcrumb a:hover {
	color: #0066FF !important;
	-webkit-text-fill-color: #0066FF !important;
}

.mlseo-blog-archive-nav {
	background: #f1f5f9 !important;
	border: 1px solid #cbd5e1 !important;
}

/* ==========================================================================
   3) Homepage testimonials — show full card content (no internal scroll/clip)
   ========================================================================== */
body.mrslia-native .mrslia-section--testimonials,
body.mrslia-native .mrslia-testimonials-section,
body.mrslia-native .mrslia-ts-viewport,
.mrslia-section--testimonials .mrslia-ts-container,
.mrslia-section--testimonials .mrslia-testimonials-section,
.mrslia-section--testimonials .mrslia-ts-viewport {
	overflow-x: clip !important;
	overflow-y: visible !important;
	max-height: none !important;
	height: auto !important;
}

.mrslia-section--testimonials .mrslia-ts-track,
body.mrslia-native .mrslia-ts-track {
	align-items: stretch !important;
	max-width: none !important;
	height: auto !important;
	max-height: none !important;
}

.mrslia-section--testimonials .mrslia-ts-card,
.mrslia-testimonials-section .mrslia-ts-card {
	height: auto !important;
	max-height: none !important;
	align-self: stretch !important;
	/* Wider cards so quote + name + country + avatar fit without clipping */
	min-width: min(280px, 85vw) !important;
}

.mrslia-section--testimonials .mrslia-ts-card-inner,
.mrslia-testimonials-section .mrslia-ts-card-inner {
	height: auto !important;
	min-height: 260px !important;
	max-height: none !important;
	overflow: visible !important;
	overflow-x: visible !important;
	overflow-y: visible !important;
	padding-bottom: 18px !important;
}

/* Kill any fade mask that hides the author row */
.mrslia-section--testimonials .mrslia-ts-viewport,
.mrslia-testimonials-section .mrslia-ts-viewport {
	-webkit-mask-image: none !important;
	mask-image: none !important;
	padding-bottom: 20px !important;
}

.mrslia-section--testimonials .mrslia-ts-text,
.mrslia-testimonials-section .mrslia-ts-text {
	max-height: none !important;
	overflow: visible !important;
	overflow-y: visible !important;
	-webkit-line-clamp: unset !important;
	line-clamp: unset !important;
	display: block !important;
	flex: 1 1 auto !important;
}

.mrslia-section--testimonials .mrslia-ts-author,
.mrslia-section--testimonials .mrslia-ts-meta,
.mrslia-section--testimonials .mrslia-ts-name,
.mrslia-section--testimonials .mrslia-ts-country,
.mrslia-section--testimonials .mrslia-ts-avatar {
	overflow: visible !important;
	max-height: none !important;
}

/* ==========================================================================
   5) CTA band mobile stack
   ========================================================================== */
@media (max-width: 900px) {
	.mrslia-cta-band,
	.mrslia-cta-band--pro {
		display: flex !important;
		flex-direction: column !important;
		align-items: stretch !important;
		justify-content: flex-start !important;
		grid-template-columns: 1fr !important;
		text-align: center !important;
		gap: 1.1rem !important;
		padding: 1.35rem 1.1rem !important;
		width: 100% !important;
		max-width: 100% !important;
		box-sizing: border-box !important;
		overflow: hidden !important;
	}

	.mrslia-cta-band__content,
	.mrslia-cta-band__actions {
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
		box-sizing: border-box !important;
	}

	.mrslia-cta-band__actions {
		align-items: stretch !important;
	}

	.mrslia-cta-band__actions .mrs-btn,
	.mrslia-cta-band__actions a {
		width: 100% !important;
		max-width: 100% !important;
		box-sizing: border-box !important;
		justify-content: center !important;
		white-space: normal !important;
	}

	.mrslia-cta-band__badge,
	.mrslia-cta-band--pro h2,
	.mrslia-cta-band--pro p,
	.mrslia-cta-band h2,
	.mrslia-cta-band p {
		overflow-wrap: anywhere !important;
		word-break: break-word !important;
		max-width: 100% !important;
	}

	.mrslia-cta-band__points {
		justify-content: center !important;
	}

	.mrslia-cta-band__points li {
		white-space: normal !important;
		overflow-wrap: anywhere !important;
	}

	.mrslia-cta-band__glow {
		width: 180px !important;
		height: 180px !important;
	}
}

/* ==========================================================================
   1) Single article — no horizontal overflow; TOC + WhatsApp CTA + media
   ========================================================================== */
@media (max-width: 900px) {
	.mrslia-single--article,
	.mrslia-single--article .mrslia-single__body,
	.mrslia-single--article .mrslia-single__main,
	.mrslia-single--article .mrslia-content,
	.mrslia-single--article .entry-content {
		max-width: 100% !important;
		width: 100% !important;
		box-sizing: border-box !important;
		overflow-x: clip !important;
		min-width: 0 !important;
	}

	.mrslia-single--article .mrslia-single__thumb,
	.mrslia-single--article .mrslia-single__thumb img,
	.mrslia-single--article .mrslia-content img,
	.mrslia-single--article .mrslia-content figure,
	.mrslia-single--article .mrslia-content video,
	.mrslia-single--article .mrslia-content iframe {
		max-width: 100% !important;
		width: 100% !important;
		height: auto !important;
		box-sizing: border-box !important;
	}

	.mrslia-single--article .mrslia-content,
	.mrslia-single--article .mrslia-content p,
	.mrslia-single--article .mrslia-content li,
	.mrslia-single--article .mrslia-content h1,
	.mrslia-single--article .mrslia-content h2,
	.mrslia-single--article .mrslia-content h3,
	.mrslia-single--article .mrslia-single__title {
		overflow-wrap: anywhere !important;
		word-break: break-word !important;
		max-width: 100% !important;
	}

	/* TOC */
	.mrslia-article-toc,
	.mrslia-article-toc-slot,
	.mrslia-toc {
		max-width: 100% !important;
		width: 100% !important;
		box-sizing: border-box !important;
		overflow-x: clip !important;
	}

	.mrslia-article-toc__header {
		flex-wrap: wrap !important;
		gap: 0.5rem !important;
	}

	.mrslia-article-toc__meta {
		white-space: normal !important;
	}

	.mrslia-article-toc__link {
		max-width: 100% !important;
		box-sizing: border-box !important;
		overflow-wrap: anywhere !important;
	}

	/* WhatsApp response CTA */
	.mrslia-single--article .mlseo-contact-cta,
	.mrslia-single--article .mrslia-content .mlseo-contact-cta,
	section.mlseo-contact-cta {
		max-width: 100% !important;
		width: 100% !important;
		box-sizing: border-box !important;
		padding: 1.1rem 0.95rem !important;
		overflow-x: clip !important;
		overflow-y: visible !important;
	}

	.mrslia-single--article .mlseo-contact-cta__grid,
	.mrslia-single--article .mrslia-content .mlseo-contact-cta__grid,
	.mrslia-single--article .mrslia-content > .mlseo-contact-cta .mlseo-contact-cta__grid,
	section.mlseo-contact-cta .mlseo-contact-cta__grid {
		display: grid !important;
		grid-template-columns: minmax(0, 1fr) !important;
		gap: 1rem !important;
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
	}

	.mrslia-single--article .mlseo-contact-cta__card,
	.mrslia-single--article .mlseo-contact-cta__hero,
	.mrslia-single--article .mlseo-contact-cta__number-block,
	.mrslia-single--article .mlseo-contact-cta__stats,
	.mrslia-single--article .mlseo-contact-cta__btn,
	.mrslia-single--article .mlseo-contact-cta__btn--primary {
		max-width: 100% !important;
		width: 100% !important;
		min-width: 0 !important;
		box-sizing: border-box !important;
		overflow-wrap: anywhere !important;
	}

	.mrslia-single--article .mlseo-contact-cta__number-block strong,
	.mrslia-single--article .mlseo-contact-cta__title,
	.mrslia-single--article .mlseo-contact-cta__description {
		overflow-wrap: anywhere !important;
		word-break: break-word !important;
	}

	.mrslia-single--article .mlseo-contact-cta__stats {
		grid-template-columns: 1fr !important;
	}

	.mrslia-single--article .mlseo-contact-cta__btn,
	.mrslia-single--article .mlseo-contact-cta__btn--primary {
		justify-content: center !important;
		white-space: normal !important;
		text-align: center !important;
	}
}