/**
 * Altflex Checkout & Email Experience — checkout reassurance badges.
 *
 * Scope rule for this file: it styles ONLY the plugin's own `.afce-*` elements.
 *
 * There is deliberately not a single selector targeting `.wc-block-*`, the
 * theme header/footer, or `body`. WooCommerce and the active theme keep full
 * control of the checkout layout, so this stylesheet cannot break it. Earlier
 * versions took the page over with `!important` grid overrides; that is what
 * made checkout fragile across themes.
 *
 * Colours are derived from `currentColor` wherever possible so the badges
 * inherit the theme's palette and stay legible on light and dark checkouts.
 * The one accent colour is exposed as a custom property for overriding:
 *
 *   .afce-trust-strip { --afce-accent: #c89832; }
 */

.afce-trust-strip {
	--afce-accent: #0076a6;

	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
	gap: 14px 28px;
	margin: 2em 0 0;
	padding: 1.25em 0 0;
	border-top: 1px solid rgba(128, 128, 128, .25);
	list-style: none;
}

@supports (border-color: color-mix(in srgb, currentColor 15%, transparent)) {
	.afce-trust-strip { border-top-color: color-mix(in srgb, currentColor 15%, transparent); }
}

.afce-trust-strip,
.afce-trust-strip *,
.afce-trust-strip *::before,
.afce-trust-strip *::after { box-sizing: border-box; }

.afce-trust-item {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	min-width: 0;
	margin: 0;
	padding: 0;
}

/* Fixed box so the label text never reflows while the page settles. */
.afce-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: 20px;
	height: 20px;
	margin-top: 1px;
	color: var(--afce-accent);
}
.afce-icon svg {
	display: block;
	width: 18px;
	height: 18px;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.8;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.afce-trust-item > div { min-width: 0; }

.afce-trust-item strong,
.afce-trust-item span {
	display: block;
	overflow-wrap: anywhere;
}
.afce-trust-item strong {
	margin: 0 0 1px;
	font-size: .8125em;
	line-height: 1.4;
	font-weight: 700;
}
.afce-trust-item div > span {
	font-size: .75em;
	line-height: 1.5;
	opacity: .7;
}

/* -------------------------------------------------------------------------
   Order-summary panel, rendered into the Checkout block's ExperimentalOrderMeta
   slot by checkout-blocks.js. Same two items, sized down to sit beside the total.
   ------------------------------------------------------------------------- */

.afce-summary-trust {
	--afce-accent: #0076a6;

	margin: 1.25em 0 0;
	padding: 1em 0 0;
	border-top: 1px solid rgba(128, 128, 128, .25);
}

@supports (border-color: color-mix(in srgb, currentColor 15%, transparent)) {
	.afce-summary-trust { border-top-color: color-mix(in srgb, currentColor 15%, transparent); }
}

.afce-summary-trust__title {
	margin: 0 0 .6em;
	font-size: .625em;
	font-weight: 800;
	letter-spacing: .1em;
	text-transform: uppercase;
	opacity: .6;
}
.afce-summary-trust__list {
	margin: 0;
	padding: 0;
	list-style: none;
}
.afce-summary-trust__item {
	display: flex;
	align-items: center;
	gap: 9px;
	min-width: 0;
	padding: .3em 0;
	font-size: .75em;
	line-height: 1.45;
	font-weight: 600;
}
.afce-summary-trust__item > span { min-width: 0; overflow-wrap: anywhere; }

.afce-summary-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: 18px;
	height: 18px;
	color: var(--afce-accent);
}
.afce-summary-icon svg {
	display: block;
	width: 15px;
	height: 15px;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.8;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.afce-summary-trust__help {
	margin: .75em 0 0;
	font-size: .6875em;
	line-height: 1.55;
	opacity: .65;
}
.afce-summary-trust__help:empty { display: none; }

/* -------------------------------------------------------------------------
   Output
   ------------------------------------------------------------------------- */

@media print {
	.afce-trust-strip,
	.afce-summary-trust { display: none !important; }
}

@media (forced-colors: active) {
	.afce-icon,
	.afce-summary-icon { color: CanvasText; }
	.afce-trust-item div > span,
	.afce-summary-trust__title,
	.afce-summary-trust__help { opacity: 1; }
}
