/* Template sections: Plan comparison variants (template-sections/plan-comparison.html). Yes / no marks are .ts-yes / .ts-no in library.css. */
.ts-plans p { color: var(--text-medium); }
.ts-plans__center { text-align: center; }
.ts-plans__price { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--space-2); }
.ts-plans__price b { font-family: var(--font-heading); font-weight: var(--fw-heading); font-size: var(--h3-size); line-height: 1.1; color: var(--text-strong); }
.ts-plans__price span { font-size: var(--body-sm-size); color: var(--text-low); }

/* V1 matrix */
.ts-plans__scroll { overflow-x: auto; }
.ts-plans__scroll:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.ts-plans__table { width: 100%; min-width: 560px; border-collapse: separate; border-spacing: 0; font-size: var(--body-md-size); }
.ts-plans__table th, .ts-plans__table td { padding: var(--space-4); border-bottom: 1px solid var(--border-thin); text-align: center; }
.ts-plans__table thead th { vertical-align: top; background: var(--base-high); }
.ts-plans__table thead th > :not(.btn) { display: block; }
.ts-plans__table thead b { font-family: var(--font-heading); font-weight: var(--fw-heading); font-size: var(--h6-size); color: var(--text-strong); }
.ts-plans__table thead em { margin-left: 4px; padding: 1px 8px; border-radius: var(--radius-pill); background: var(--accent); font-style: normal; font-family: var(--font-body); font-size: 11px; color: #fff; vertical-align: 2px; }
.ts-plans__table thead span { margin: 2px 0 var(--space-3); font-weight: var(--fw-regular); font-size: var(--body-sm-size); color: var(--text-low); }
.ts-plans__table tbody th { position: sticky; left: 0; z-index: 1; width: 34%; min-width: 136px; background: var(--base-high); font-weight: var(--fw-regular); text-align: left; color: var(--text-strong); }
.ts-plans__table td { color: var(--text-medium); }
.ts-plans__table .is-pop { background: color-mix(in srgb, var(--accent) 6%, var(--base-high)); }
.ts-plans__group th { padding-top: var(--space-8) !important; font-family: var(--font-heading); font-weight: var(--fw-heading) !important; font-size: var(--h6-size); }

/* V2 two plans */
.ts-plans__two { max-width: 720px; margin-inline: auto; padding: var(--space-6); border: 1px solid var(--border-thin); border-radius: var(--radius-xl); background: var(--base-high); box-shadow: var(--shadow-md); }
.ts-plans__two-head, .ts-plans__two-rows li, .ts-plans__two-foot { display: grid; grid-template-columns: 1.3fr 1fr 1fr; align-items: center; gap: var(--space-3); }
.ts-plans__two-head { margin-top: var(--space-6); padding-bottom: var(--space-3); border-bottom: 1px solid var(--border-strong); font-family: var(--font-heading); font-weight: var(--fw-medium); color: var(--text-strong); text-align: center; }
.ts-plans__two-head small { display: block; font-family: var(--font-body); font-weight: var(--fw-regular); font-size: 12px; color: var(--text-low); }
.ts-plans__two-rows { margin: 0; padding: 0; list-style: none; }
.ts-plans__two-rows li { padding-block: var(--space-3); border-bottom: 1px solid var(--border-thin); font-size: var(--body-sm-size); color: var(--text-medium); }
.ts-plans__two-rows li span:not(:first-child) { text-align: center; color: var(--text-strong); }
.ts-plans__two-foot { margin-top: var(--space-5); }
@media (min-width: 768px) { .ts-plans__two { padding: var(--space-10); } }

/* V3 plan tabs */
.ts-plans__tabwrap { display: grid; justify-items: center; gap: var(--space-6); }
.ts-plans__tabs { display: inline-flex; padding: 4px; border-radius: var(--radius-pill); background: var(--base-medium); }
.ts-plans__tabs [role="tab"] { height: 36px; padding-inline: var(--space-4); border-radius: var(--radius-pill); font-weight: var(--fw-medium); font-size: var(--body-sm-size); color: var(--text-medium); transition: background var(--dur) var(--ease), color var(--dur) var(--ease); }
.ts-plans__tabs [aria-selected="true"] { background: var(--base-high); color: var(--text-strong); box-shadow: var(--shadow-sm); }
.ts-plans__card { width: 100%; max-width: 520px; padding: var(--space-6); border: 1px solid var(--border-thin); border-radius: var(--radius-xl); background: var(--base-high); }
.ts-plans__panel-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-3); padding-bottom: var(--space-5); border-bottom: 1px solid var(--border-thin); }
.ts-plans__rows { margin: 0; padding: 0; list-style: none; }
.ts-plans__rows li { display: flex; justify-content: space-between; gap: var(--space-4); padding-block: var(--space-3); border-bottom: 1px solid var(--border-thin); font-size: var(--body-sm-size); color: var(--text-medium); }
.ts-plans__rows li:last-child { border-bottom: 0; }
.ts-plans__rows li span:last-child { font-weight: var(--fw-medium); text-align: right; color: var(--text-strong); }

/* V4 add-ons */
.ts-plans__addons { display: grid; gap: var(--space-3); margin: 0; padding: 0; list-style: none; }
.ts-plans__addons .card { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: var(--space-3) var(--space-4); }
.ts-plans__addons .card p { font-size: var(--para-sm-size); }
.ts-plans__addon-price { grid-column: 2; font-size: var(--body-sm-size) !important; }
.ts-plans__addon-price b { font-weight: var(--fw-medium); color: var(--text-strong); }
.ts-plans__addons .switch { grid-column: 3; grid-row: 1; }
@media (min-width: 768px) { .ts-plans__addons .card { grid-template-columns: auto 1fr auto auto; } .ts-plans__addon-price { grid-column: auto; } .ts-plans__addons .switch { grid-column: auto; grid-row: auto; } }

/* V5 two paths */
.ts-plans__paths { display: grid; gap: var(--space-4); max-width: 960px; margin: var(--space-10) auto 0; }
.ts-plans__path { display: grid; align-content: start; gap: var(--space-4); padding: var(--space-8) var(--space-6); border: 1px solid var(--border-thin); border-radius: var(--radius-xl); background: var(--base-high); }
.ts-plans__path .ts-checks { margin-block: var(--space-2) var(--space-4); }
.ts-plans__path--ent { border-color: transparent; background: var(--ts-surface); }
.ts-plans__eyebrow { font-weight: var(--fw-medium); font-size: var(--body-sm-size); text-transform: uppercase; letter-spacing: 0.06em; color: var(--accent) !important; }
@media (min-width: 768px) { .ts-plans__paths { grid-template-columns: 1fr 1fr; } .ts-plans__path { padding: var(--space-10); } }