/*
 * Mashin Irani — «تأیید آزمایشگاه ماشین ایرانی» badge.
 * A deliberately tiny corner seal on product cards + an inline chip on the product page.
 * Short --* tokens with hex fallbacks (house convention).
 */

.mi-labbadge {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 3px 8px;
	border-radius: var(--radius-pill, 999px);
	background: rgba(16, 33, 52, .92);
	color: var(--gold-300, #e0c58f);
	border: 1px solid rgba(224, 197, 143, .55);
	font-size: .625rem;
	font-weight: 700;
	line-height: 1.5;
	white-space: nowrap;
	text-decoration: none;
	backdrop-filter: saturate(140%) blur(2px);
}

.mi-labbadge__i {
	flex: none;
	width: 11px;
	height: 11px;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.8;
}

.mi-labbadge__t {
	font-weight: 700;
}

/* ---- Corner seal on the theme's `.prod` cards (home / brand / category / vehicle rails). ---- */
/* `.brandchip` owns top-start, `.disc` top-end and `.wish` bottom-end — bottom-start is free. */
.prod .media .mi-labbadge--card {
	position: absolute;
	bottom: var(--space-3, 12px);
	inset-inline-start: var(--space-3, 12px);
	z-index: 2;
	box-shadow: 0 2px 8px rgba(16, 33, 52, .18);
}

/* ---- Corner seal on the WooCommerce archive tiles (`span.onsale` owns top-start). ---- */
.woocommerce ul.products li.product .mi-labbadge--card,
.woocommerce-page ul.products li.product .mi-labbadge--card {
	position: absolute;
	top: var(--space-6, 24px);
	inset-inline-end: var(--space-6, 24px);
	z-index: 2;
	box-shadow: 0 2px 8px rgba(16, 33, 52, .18);
}

/* ---- Inline chip in the product page brand row. ---- */
.mi-labbadge--inline {
	font-size: .6875rem;
	padding: 4px 10px;
	transition: border-color .2s, color .2s;
}

.mi-labbadge--inline:hover,
.mi-labbadge--inline:focus-visible {
	color: #fff;
	border-color: var(--gold-300, #e0c58f);
}

.mi-labbadge--inline .mi-labbadge__i {
	width: 12px;
	height: 12px;
}

/* The brand row is a flex row — let the chip wrap instead of squeezing the trust text. */
.info .brandrow {
	flex-wrap: wrap;
	row-gap: var(--space-2, 8px);
}

/* ---- Very small screens: the seal collapses to the icon alone. ---- */
@media (max-width: 420px) {
	.mi-labbadge--card {
		gap: 0;
		padding: 4px;
	}

	.mi-labbadge--card .mi-labbadge__t {
		position: absolute;
		width: 1px;
		height: 1px;
		padding: 0;
		margin: -1px;
		overflow: hidden;
		clip: rect(0, 0, 0, 0);
		white-space: nowrap;
		border: 0;
	}

	.prod .media .mi-labbadge--card {
		bottom: var(--space-2, 8px);
		inset-inline-start: var(--space-2, 8px);
	}

	.woocommerce ul.products li.product .mi-labbadge--card {
		top: var(--space-5, 20px);
		inset-inline-end: var(--space-5, 20px);
	}
}

/* ---- Landing-page explainer blocks. ---- */
.mip-labmark {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: var(--space-5, 20px);
	align-items: center;
	padding: var(--space-6, 24px);
	border: 1px solid var(--border, #d9cbc2);
	border-radius: var(--radius-lg, 12px);
	background: linear-gradient(160deg, #fbf8f3, var(--bg-sunken, #ece4da));
}

.mip-labmark__seal {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 72px;
	height: 72px;
	border-radius: 50%;
	background: rgba(16, 33, 52, .95);
	border: 2px solid var(--gold-300, #e0c58f);
	color: var(--gold-300, #e0c58f);
	box-shadow: 0 6px 18px rgba(16, 33, 52, .18);
}

.mip-labmark__seal svg {
	width: 32px;
	height: 32px;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.6;
}

.mip-labmark__b h3 {
	margin: 0 0 var(--space-2, 8px);
	font-size: 1.15rem;
	color: var(--navy-900, #102134);
}

.mip-labmark__b p {
	margin: 0;
	color: var(--text-secondary, #404751);
	line-height: 1.9;
}

.mip-labmark__b .mi-labbadge {
	margin-top: var(--space-3, 12px);
}

.mip-crit {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: var(--space-4, 16px);
	margin-top: var(--space-5, 20px);
}

.mip-crit__c {
	padding: var(--space-5, 20px);
	border: 1px solid var(--border, #d9cbc2);
	border-radius: var(--radius-lg, 12px);
	background: var(--bg-elevated, #fff);
}

.mip-crit__c b {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: var(--space-2, 8px);
	color: var(--navy-900, #102134);
	font-size: 1rem;
}

.mip-crit__c b svg {
	flex: none;
	width: 18px;
	height: 18px;
	fill: none;
	stroke: var(--gold-500, #896f3d);
	stroke-width: 1.8;
}

.mip-crit__c p {
	margin: 0;
	color: var(--text-secondary, #404751);
	line-height: 1.9;
	font-size: .95rem;
}

@media (max-width: 560px) {
	.mip-labmark {
		grid-template-columns: 1fr;
		gap: var(--space-4, 16px);
	}
}

/* ---- Chip inside the lab-page result cards (`.mip-lab` is itself a link — the chip is a span). ---- */
.mip-lab__body .mi-labbadge {
	align-self: flex-start;
	margin-bottom: 2px;
}
