/**
 * GEO Best-Of — Features ("Ausstattung") shortcode.
 *
 * Design tokens are CSS custom properties so themes can override
 * them per-instance via `style="--bof-feat-accent: …;"` without
 * touching the plugin CSS.
 */

.bof-features {
	--bof-feat-bg:        #ffffff;
	--bof-feat-border:    #e6e6e6;
	--bof-feat-radius:    18px;
	--bof-feat-padding:   28px 32px;
	--bof-feat-text:      #111111;
	--bof-feat-muted:     #b9b9b9;
	--bof-feat-note:      #9a9a9a;
	--bof-feat-eyebrow:   #9a9a9a;
	--bof-feat-accent:    #21a36b;
	--bof-feat-row-gap:   16px;
	--bof-feat-col-gap:   28px;
	--bof-feat-icon-size: 18px;
	--bof-feat-font:      inherit;

	display: block;
	background: var(--bof-feat-bg);
	border: 1px solid var(--bof-feat-border);
	border-radius: var(--bof-feat-radius);
	padding: var(--bof-feat-padding);
	color: var(--bof-feat-text);
	font-family: var(--bof-feat-font);
	box-sizing: border-box;
}

.bof-features *,
.bof-features *::before,
.bof-features *::after {
	box-sizing: inherit;
}

/* Eyebrow label ("AUSSTATTUNG"). */
.bof-features__eyebrow {
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--bof-feat-eyebrow);
	margin: 0 0 18px;
}

.bof-features__title {
	margin: 0 0 14px;
	font-size: 1.25rem;
	font-weight: 700;
	color: var(--bof-feat-text);
	line-height: 1.2;
}

/* List grid. */
.bof-features__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: 1fr;
	row-gap: var(--bof-feat-row-gap);
	column-gap: var(--bof-feat-col-gap);
}

@media (min-width: 540px) {
	.bof-features--cols-2 .bof-features__list { grid-template-columns: 1fr 1fr; }
	.bof-features--cols-3 .bof-features__list { grid-template-columns: 1fr 1fr 1fr; }
}

/* Item row. */
.bof-features__item {
	display: grid;
	grid-template-columns: calc(var(--bof-feat-icon-size) + 10px) 1fr;
	align-items: start;
	column-gap: 12px;
	padding: 0;
	margin: 0;
	line-height: 1.4;
	font-size: 1rem;
}

.bof-features__icon {
	display: inline-flex;
	align-items: center;
	justify-content: flex-start;
	width: calc(var(--bof-feat-icon-size) + 4px);
	height: calc(var(--bof-feat-icon-size) + 4px);
	flex: 0 0 auto;
	color: var(--bof-feat-accent);
	margin-top: 1px;
}

.bof-features__item.is-no .bof-features__icon {
	color: var(--bof-feat-muted);
}

.bof-features__icon svg {
	width: var(--bof-feat-icon-size);
	height: var(--bof-feat-icon-size);
	display: block;
}

.bof-features__text {
	display: inline-block;
	min-width: 0;
	word-wrap: break-word;
}

.bof-features__label {
	font-weight: 700;
	color: var(--bof-feat-text);
}

.bof-features__item.is-no .bof-features__label {
	font-weight: 600;
	color: var(--bof-feat-muted);
}

.bof-features__note {
	font-weight: 400;
	color: var(--bof-feat-note);
}

.bof-features__item.is-no .bof-features__note {
	color: var(--bof-feat-muted);
}

/* Variant: flat (no card chrome). */
.bof-features--theme-flat,
.bof-features--theme-minimal {
	background: transparent;
	border: 0;
	padding: 0;
	border-radius: 0;
}

.bof-features--theme-minimal .bof-features__eyebrow {
	margin-bottom: 10px;
}

/* Hide bullets if a theme forces them. */
.bof-features__list,
.bof-features__list li::marker {
	list-style: none;
}

/* Accessibility-only screen-reader text. */
.bof-features .screen-reader-text {
	position: absolute !important;
	clip: rect(1px, 1px, 1px, 1px);
	width: 1px;
	height: 1px;
	overflow: hidden;
	white-space: nowrap;
}
