/* Verploy Site 1.2: comparison tables (vs pages), sources list, changelog. Uses the theme's tokens. */

/* ---------- Comparison table: [label] [other tool] [Verploy] ---------- */
.wp-block-table.vp-vs { overflow-x: auto; }
.wp-block-table.vp-vs table { border-collapse: separate; border-spacing: 0; width: 100%; min-width: 560px; border: 0; font-size: var(--wp--preset--font-size--s, .9375rem); }
.wp-block-table.vp-vs :where(th, td) { border: 0; border-bottom: 1px solid var(--wp--preset--color--line, #e3e8ef); padding: .95rem 1rem; text-align: left; vertical-align: top; }
.wp-block-table.vp-vs thead { border: 0; }
.wp-block-table.vp-vs thead th { font-size: var(--wp--preset--font-size--xs, .8125rem); text-transform: uppercase; letter-spacing: .06em; color: var(--wp--preset--color--muted, #5a6478); font-weight: 600; }
.wp-block-table.vp-vs tbody th { width: 22%; font-weight: 650; color: var(--wp--preset--color--contrast, #0b1220); }
.wp-block-table.vp-vs td { width: 39%; color: var(--wp--preset--color--muted, #5a6478); }
.wp-block-table.vp-vs :where(td, th):last-child { background: var(--wp--preset--color--accent-soft, #e6faf1); color: var(--wp--preset--color--contrast, #0b1220); }
.wp-block-table.vp-vs thead th:last-child { color: var(--wp--preset--color--accent-strong, #067a4b); border-radius: 10px 10px 0 0; }
.wp-block-table.vp-vs tbody tr:last-child :where(td, th) { border-bottom: 0; }
.wp-block-table.vp-vs tbody tr:last-child td:last-child { border-radius: 0 0 10px 10px; }
.wp-block-table.vp-vs a { color: var(--wp--preset--color--accent-strong, #067a4b); }
.wp-block-table.vp-vs figcaption { margin-top: 1rem; font-size: var(--wp--preset--font-size--xs, .8125rem); color: var(--wp--preset--color--muted, #5a6478); text-align: left; }
@media (max-width: 600px) { .wp-block-table.vp-vs :where(th, td) { padding: .75rem .65rem; } }

/* ---------- Sources ---------- */
.vp-sources { padding-left: 1.1rem; color: var(--wp--preset--color--muted, #5a6478); }
.vp-sources li { margin: .3rem 0; }
.vp-sources a { color: var(--wp--preset--color--accent-strong, #067a4b); }

/* Card headings that are links (compare hub). */
.is-style-card h3 a { color: inherit; text-decoration: none; }
.is-style-card h3 a:hover { color: var(--wp--preset--color--accent-strong, #067a4b); }
.is-style-card h3 a::after { content: " →"; }

/* ---------- Changelog ---------- */
.vp-changelog .wp-block-post-template { list-style: none; margin: 0; padding: 0; }
.vp-changelog__item { position: relative; padding: 0 0 2.25rem 1.75rem; border-left: 2px solid var(--wp--preset--color--line, #e3e8ef); margin: 0 !important; }
.vp-changelog__item::before { content: ""; position: absolute; left: -7px; top: .35rem; width: 12px; height: 12px; border-radius: 50%; background: var(--wp--preset--color--accent, #22d98a); box-shadow: 0 0 0 4px var(--wp--preset--color--base, #fff); }
.vp-changelog li:last-child .vp-changelog__item { border-left-color: transparent; }
.vp-changelog__date { margin: 0 !important; color: var(--wp--preset--color--muted, #5a6478); font-weight: 600; letter-spacing: .02em; }
.vp-changelog .wp-block-post-title { margin: .25rem 0 .5rem !important; }
.vp-changelog__body > * { margin-block: .5rem 0; }

/* Phones: stack each row into a block, with the column name above each cell. */
@media (max-width: 700px) {
	.wp-block-table.vp-vs { overflow: visible; }
	.wp-block-table.vp-vs table { min-width: 0; }
	.wp-block-table.vp-vs thead { display: none; }
	.wp-block-table.vp-vs :where(tbody, tr, th, td) { display: block; width: auto !important; }
	.wp-block-table.vp-vs tr { padding: 1rem 0; border-bottom: 1px solid var(--wp--preset--color--line, #e3e8ef); }
	.wp-block-table.vp-vs tbody tr:last-child { border-bottom: 0; }
	.wp-block-table.vp-vs :where(th, td) { border: 0 !important; padding: .35rem 0; }
	.wp-block-table.vp-vs tbody th { font-size: var(--wp--preset--font-size--m, 1.0625rem); padding-bottom: .5rem; }
	.wp-block-table.vp-vs td[data-label]::before { content: attr(data-label); display: block; font-size: .72rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--wp--preset--color--muted, #5a6478); margin-bottom: .15rem; }
	.wp-block-table.vp-vs td:last-child { padding: .75rem .9rem; margin-top: .5rem; border-radius: 10px !important; }
	.wp-block-table.vp-vs td:last-child::before { color: var(--wp--preset--color--accent-strong, #067a4b); }
}
