/* ---------- WordPress theme detector ---------- */

.hat .hat-wpd-themes {
	display: grid;
	gap: 14px;
}

.hat .hat-wpd-theme {
	display: grid;
	gap: 12px;
	padding: 16px;
	border: 1px solid var(--hat-border);
	border-radius: var(--hat-radius);
	background: var(--hat-surface-2);
	min-width: 0;
}

.hat .hat-wpd-theme .hat-kv > div {
	background: var(--hat-white);
}

.hat .hat-wpd-theme-head {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 8px 12px;
}

.hat .hat-wpd-theme-name {
	margin: 0;
	font-size: 1.1rem;
	font-weight: 800;
	color: var(--hat-heading);
	overflow-wrap: anywhere;
}

.hat .hat-wpd-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}

.hat .hat-wpd-desc,
.hat .hat-wpd-note {
	margin: 0;
	font-size: 0.9rem;
}

.hat .hat-wpd-note {
	margin-top: 12px;
}

.hat .hat-wpd-plugins {
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
}

.hat .hat-wpd-plugins li {
	align-items: center;
	min-width: 0;
}

.hat .hat-wpd-plugin {
	flex: 1;
	min-width: 0;
}

.hat .hat-wpd-link {
	flex: none;
	font-size: 0.9rem;
}

.hat .hat-wpd-link .hat-icon {
	width: 14px;
	height: 14px;
}

.hat .hat-wpd-cta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 16px 20px;
	border-radius: var(--hat-radius-lg);
	background: var(--hat-primary-soft);
}

.hat .hat-wpd-cta p {
	margin: 0;
	font-weight: 700;
	color: var(--hat-heading);
}

@media (max-width: 640px) {
	.hat .hat-wpd-plugins {
		grid-template-columns: 1fr;
	}

	.hat .hat-wpd-plugins li {
		flex-wrap: wrap;
	}

	.hat .hat-wpd-plugin {
		flex-basis: calc(100% - 34px);
	}

	.hat .hat-wpd-link {
		margin-inline-start: 34px;
	}

	.hat .hat-wpd-cta .hat-btn {
		width: 100%;
	}
}