/**
 * Compass Pricing — Fallback Stylesheet
 * Layout-only. Visual styles (buttons, colors, gradients) come from the theme.
 */

/* ── Expand .prose when pricing shortcodes are present ─────── */
.prose:has(.compass-pricing-wrap) {
	max-width: 1200px !important;
}
.compass-pricing-wrap {
	width: 100%;
	box-sizing: border-box;
}

/* ── Plan Cards Grid ─────────────────────────────────────────── */
.plans {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1.5rem;
	margin: 2rem 0;
	align-items: stretch;
}
.plan {
	display: flex;
	flex-direction: column;
}
.plan ul {
	flex: 1;
}
.plan .btn {
	margin-top: auto;
}

/* ── Prose resets — suppress theme's prose list/link styles ── */
.prose .plan ul {
	list-style: none !important;
	padding-left: 0 !important;
	margin-left: 0 !important;
}
.prose .plan li::before,
.prose .plan li::marker {
	display: none !important;
	content: none !important;
}
.prose .compass-pricing-wrap a.btn {
	text-decoration: none !important;
}
.prose .compass-pricing-wrap a.btn-primary {
	color: #fff !important;
}

/* ── Comparison Table ────────────────────────────────────────── */
.compass-compare-tbl thead th {
	font-weight: 700;
}
.compass-compare-featured {
	background: #eef4ff !important;
}
.compass-check {
	display: inline-block;
	vertical-align: middle;
}
.compass-x {
	color: #cbd5e1;
}

.compass-pricing-wrap > .tbl-scroll {
	width: 100%;
}

/* ── Service Tables ──────────────────────────────────────────── */
.compass-svc-text {
	margin-bottom: 1rem;
}
.compass-svc-cta {
	margin: 1rem 0;
}

/* ── Responsive ──────────────────────────────────────────────── */
@media (max-width: 1024px) {
	.plans {
		grid-template-columns: repeat(2, 1fr);
	}
}
@media (max-width: 600px) {
	.plans {
		grid-template-columns: 1fr;
	}
}