/**
 * ClinicianCore Comparison Widgets — base stylesheet.
 *
 * Structural layout ONLY. Every color, typography, spacing, border and shadow value is
 * a real Elementor Style-tab control, output per-instance by Elementor itself. This file
 * exists only for the things Style-tab controls don't cover: flex/grid layout, icon
 * alignment, and an accessibility fallback.
 */

/* Fallback in case the active theme doesn't already define it (most do). */
.screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* -- 1. Key Takeaways ---------------------------------------------------- */
.cc-kt-heading {
	display: flex;
	align-items: center;
	gap: 10px;
}

.cc-kt-list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.cc-kt-bullet {
	display: flex;
	align-items: flex-start;
	gap: 10px;
}

.cc-kt-check {
	flex: 0 0 auto;
	margin-top: 0.2em;
}

/* -- 2. Comparison Table -------------------------------------------------- */
.cc-ct-wrap {
	overflow-x: auto;
}

.cc-ct-table {
	width: 100%;
	border-collapse: collapse;
}

.cc-ct-table th,
.cc-ct-table td {
	text-align: left;
	vertical-align: top;
}

.cc-ct-row-label-inner {
	display: flex;
	align-items: flex-start;
	gap: 8px;
}

.cc-ct-row-icon {
	flex: 0 0 auto;
	margin-top: 0.15em;
}

/* Driven by the "ClinicianCore Column Bold" switcher (prefix_class, default on). */
.cc-ct-cc-bold-yes .cc-ct-cell-cc {
	font-weight: 600;
}

/* -- 3. Right Fit ---------------------------------------------------------- */
.cc-rf-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 20px;
}

.cc-rf-icon {
	display: flex;
	align-items: center;
	justify-content: center;
}

@media (max-width: 780px) {
	.cc-rf-grid {
		grid-template-columns: 1fr;
	}
}

/* -- 4. Highlight Card ------------------------------------------------------ */
.cc-hc-card {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}

.cc-hc-card.cc-hc-link {
	text-decoration: none;
}

.cc-hc-icon {
	display: flex;
	align-items: center;
	justify-content: center;
}
