/* Comparison blocks, shared by the front end and the editor. Each is a
   style on a core block (Table: Comparison, List: Pros / Cons, Group: Verdict). */

/* ── comparison table ─────────────────────────────────────────────── */
.wp-block-table.is-style-versus { margin: 0 0 1.6em; overflow-x: auto; }
.wp-block-table.is-style-versus table {
	width: 100%; min-width: 520px;
	border-collapse: separate; border-spacing: 0;
	border: 0; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink);
	font-size: 15.5px; line-height: 1.45;
}
.wp-block-table.is-style-versus thead,
.wp-block-table.is-style-versus tfoot { border: 0; }
.wp-block-table.is-style-versus th,
.wp-block-table.is-style-versus td {
	padding: 13px 16px; border: 0; border-bottom: 1px solid var(--line2);
	text-align: left; vertical-align: top; background: none;
}
.wp-block-table.is-style-versus tr > * + * { border-left: 1px solid var(--line); }
.wp-block-table.is-style-versus thead th {
	padding-top: 16px; padding-bottom: 14px; border-bottom-color: var(--ink);
	font-family: var(--disp); font-weight: 700; font-size: 19px; line-height: 1.2;
	letter-spacing: -0.02em; color: var(--ink);
}
.wp-block-table.is-style-versus tbody tr:last-child > * { border-bottom: 0; }
/* Labels stay in view when a wide table scrolls sideways on a phone. */
.wp-block-table.is-style-versus tr > :first-child {
	position: sticky; left: 0; z-index: 1; width: 30%;
	background: var(--bg); color: var(--faint); font-size: 14.5px;
}
/* A bold cell marks the better option with the mark's focal point. */
.wp-block-table.is-style-versus td:has(> strong) { background: var(--spot-wash); }
.wp-block-table.is-style-versus td > strong { font-weight: 600; color: var(--ink); }
.wp-block-table.is-style-versus td > strong:first-child::before {
	content: ""; display: inline-block; width: 8px; height: 8px; margin-right: 9px;
	border-radius: 50%; background: var(--spot); vertical-align: 1px;
}

/* ── pros and cons ────────────────────────────────────────────────── */
.wp-block-list.is-style-pros,
.wp-block-list.is-style-cons { list-style: none; margin: 0 0 1em; padding-left: 0; }
.wp-block-list.is-style-pros li,
.wp-block-list.is-style-cons li { position: relative; padding-left: 28px; }
.wp-block-list.is-style-pros li + li,
.wp-block-list.is-style-cons li + li { margin-top: .45em; }
.wp-block-list.is-style-pros li::before,
.wp-block-list.is-style-cons li::before {
	content: ""; position: absolute; left: 0; top: .3em; width: 18px; height: 18px;
	-webkit-mask: var(--cl-icon) center / contain no-repeat;
	mask: var(--cl-icon) center / contain no-repeat;
}
.wp-block-list.is-style-pros li::before { --cl-icon: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2018%2018'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M3.8%209.6l3.3%203.1%207.1-7.4'/%3E%3C/svg%3E"); background: var(--spot); }
.wp-block-list.is-style-cons li::before { --cl-icon: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2018%2018'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M4.5%209h9'/%3E%3C/svg%3E"); background: var(--faint); }

/* ── verdict ──────────────────────────────────────────────────────── */
.wp-block-group.is-style-verdict {
	margin: 2.2em 0; padding: 26px 28px 24px;
	border: 1px solid var(--line2); border-top: 3px solid var(--spot);
	background: var(--panel);
}
/* Classic themes wrap group content in an inner container. */
.wp-block-group.is-style-verdict > :first-child,
.wp-block-group.is-style-verdict > .wp-block-group__inner-container > :first-child { margin-top: 0; }
.wp-block-group.is-style-verdict > :last-child,
.wp-block-group.is-style-verdict > .wp-block-group__inner-container > :last-child { margin-bottom: 0; }
.wp-block-group.is-style-verdict h2,
.wp-block-group.is-style-verdict h3 { margin: 0 0 .45em; font-size: 22px; letter-spacing: -0.02em; }